添加保存皮肤

src/views/Editor/dialogs/ProjectxOptions.vue

 <template>
   <div class="config">
-    <el-select
-      size="small"
-      v-model="env"
-      placeholder="请选择环境"
-      @change="changeenv"
-    >
-      <el-option
-        v-for="(item, key) in pxEnvs"
-        :key="key"
-        :label="item"
-        :value="key"
-      ></el-option>
+    <el-select size="small" v-model="env" placeholder="请选择环境" @change="changeenv">
+      <el-option v-for="(item, key) in pxEnvs" :key="key" :label="item" :value="key"></el-option>
     </el-select>
-    <el-select size="small" v-model="operate" placeholder="是否新增">
-      <el-option
-        v-for="(item, key) in tplOperates"
-        :key="key"
-        :label="item"
-        :value="key"
-      ></el-option>
+    <el-select @change="$parent.getTpl('')" size="small" v-model="operate" placeholder="是否新增">
+      <el-option v-for="(item, key) in tplOperates" :key="key" :label="item" :value="key"></el-option>
     </el-select>
     <el-select
+      @change="getTpl"
       v-if="operate !== 0"
       size="small"
       v-model="skinId"
@@ -37,25 +23,12 @@
     </el-select>
     <div v-if="operate === 0">
       <el-select size="small" v-model="tplType" placeholder>
-        <el-option
-          v-for="(item, key) in tplTypes"
-          :key="key"
-          :label="item"
-          :value="key"
-        ></el-option>
+        <el-option v-for="(item, key) in tplTypes" :key="key" :label="item" :value="key"></el-option>
       </el-select>
-      <el-input
-        v-model="name"
-        size="small"
-        class="name"
-        placeholder="请输入皮肤名称"
-      ></el-input>
-    </div>
-    &nbsp;
+      <el-input v-model="name" size="small" class="name" placeholder="请输入皮肤名称"></el-input>
+    </div>&nbsp;
     <el-button type="primary" size="small" @click="saveSkins">保存</el-button>
-    <el-button v-if="skinId" type="primary" size="small" @click="getUrl"
-      >获取链接</el-button
-    >
+    <el-button v-if="skinId" type="primary" size="small" @click="getUrl">获取链接</el-button>
   </div>
 </template>
 
@@ -100,6 +73,7 @@ export default {
       return this.projectId;
     },
     async changeenv(e) {
+      this.$parent.getTpl("");
       if (e === "test") {
         await this.getTicket(getTestEnvTicket);
       } else if (e === "prod") {
@@ -129,16 +103,13 @@ export default {
             await this.getTicket(getTestEnvTicket);
             this.getSkinsList(this.projectId);
           } else if (env === "prod" && data.notLogin) {
-            // 如果是线上环境，则发送钉钉消息
-            sendDingTalk();
             localStorage.setItem("prod_ticket", "");
             this.$message({
-              message: "线上tickct失效，已给相关人员发送消息",
+              message: "线上tickct失效，请联系呼呼修改",
               type: "info"
             });
             this.skinList = [];
             return;
-            // sendDingTalk();
           } else {
             this.$message({
               message: data.message,
@@ -196,6 +167,7 @@ export default {
           message: `操作成功`,
           type: "success"
         });
+        if (this.$parent.getTpl) this.getSkinsList(projectId);
       } else {
         this.$message({ message: ret.message, type: "error" });
       }
@@ -236,13 +208,26 @@ export default {
         ticket = await fn();
         localStorage.setItem(name, ticket);
       }
+    },
+    getTpl(id) {
+      const { skinList } = this;
+      let tpl = "";
+      skinList.forEach(skin => {
+        if (skin.id === id) {
+          tpl = skin.html;
+        }
+      });
+      this.$parent.getTpl(tpl);
     }
   },
   async mounted() {
     const { projectxConfig } = this.project.data.options;
-    const projectId = projectxConfig[this.env];
-    this.projectId = projectId;
-    this.getSkinsList(projectId);
+    const { env } = this;
+    if (projectxConfig) {
+      const projectId = projectxConfig[env];
+      this.projectId = projectId;
+      this.getSkinsList(projectId);
+    }
   },
   async created() {}
 };

src/views/Editor/dialogs/editors/ProjectxConfig.vue

@@ -11,16 +11,30 @@
         ></el-input>
       </div>
     </div>
+    <el-checkbox
+      v-model="isSaveProjecx"
+      style="margin: 20px 0; display: block"
+    >{{$t('Save template to projectx')}}</el-checkbox>
+    <div v-if="isSaveProjecx">
+      <el-input class="tpl" type="textarea" rows="6" v-model="tpl" placeholder></el-input>
+      <projectx-options :tpl="tpl" :getTpl="getTpl"></projectx-options>
+    </div>
   </div>
 </template>
 <script>
 import { mapState, mapGetters, mapMutations } from "vuex";
+import ProjectxOptions from "../ProjectxOptions";
 import { clonePureObj } from "../../../../utils";
 export default {
   name: "ProjectxConfig",
+  components: {
+    "projectx-options": ProjectxOptions
+  },
   data() {
     return {
-      pxEnvs: this.$t('pxEnvs'),
+      pxEnvs: this.$t("pxEnvs"),
+      isSaveProjecx: false,
+      tpl: "",
       editData: {
         dev: "",
         test: "",
@@ -30,8 +44,8 @@ export default {
   },
   computed: {
     ...mapState({
-      pxEnv: state => state.project.data.options.pxEnv,
-    }),
+      pxEnv: state => state.project.data.options.pxEnv
+    })
   },
   methods: {
     ...mapMutations(["modifyProjectx"]),
@@ -40,12 +54,19 @@ export default {
     },
     save() {
       this.modifyProjectx(this.editData);
+    },
+    getTpl(tpl) {
+      this.tpl = tpl;
     }
   }
 };
 </script>
 
 <style lang="scss" scoped>
+.tpl {
+  margin-bottom: 20px;
+  width: 60%;
+}
 .list {
   display: flex;
   align-items: center;