1

src/pages/shop/IncreaseWelcomeEdit.vue

@@ -2,116 +2,92 @@
   <div class>
     <Row>
       <i-col :span="12">
-        <Form ref="welcomeForm"
+        <Form ref="welcomeForm" :model="welcome" :rules="welcomeRules">
-              :model="welcome"
+          <FormItem label="欢迎语内容" prop="content">
-              :rules="welcomeRules">
+            <i-input
-          <FormItem label="欢迎语内容"
+              v-model="welcome.content"
-                    prop="content">
-            <i-input v-model="welcome.content"
               type="textarea"
               style="height: 220px"
               :autosize="{ minRows: 10, maxRows: 10 }"
-                     placeholder="请输入欢迎语内容,最多100个字"></i-input>
+              placeholder="请输入欢迎语内容,最多100个字"
+            ></i-input>
           </FormItem>
-          <Row style="margin-bottom: 10px"
+          <Row
+            style="margin-bottom: 10px"
             :gutter="10"
             class="inputItem"
             v-for="(item, index) in welcome.params"
-               :key="index">
+            :key="index"
+          >
             <div v-if="item.type == 3">
-              <i-col style="line-height: 32px"
+              <i-col style="line-height: 32px" :span="2">标题 {{ index + 1 }}</i-col>
-                     :span="2">标题 {{ index + 1 }}</i-col>
               <i-col :span="3">
-                <i-input class="inputClass"
+                <i-input class="inputClass" type="text" disabled v-model="item.key"></i-input>
-                         type="text"
-                         disabled
-                         v-model="item.key"></i-input>
               </i-col>
-              <i-col style="line-height: 32px"
+              <i-col style="line-height: 32px" :span="2">APPID {{ index + 1 }}</i-col>
-                     :span="2">APPID {{ index + 1 }}</i-col>
               <i-col :span="3">
-                <i-input class="inputClass"
+                <i-input class="inputClass" type="text" disabled v-model="item.defaultVal"></i-input>
-                         type="text"
-                         disabled
-                         v-model="item.defaultVal"></i-input>
               </i-col>
-              <i-col style="line-height: 32px"
+              <i-col style="line-height: 32px" :span="2">URI {{ index + 1 }}</i-col>
-                     :span="2">URI {{ index + 1 }}</i-col>
               <i-col :span="3">
-                <i-input class="inputClass"
+                <i-input class="inputClass" type="text" disabled v-model="item.description"></i-input>
-                         type="text"
-                         disabled
-                         v-model="item.description"></i-input>
               </i-col>
-              <i-col style="line-height: 32px"
+              <i-col style="line-height: 32px" :span="2">MediaId{{ index + 1 }}</i-col>
-                     :span="2">MediaId{{ index + 1 }}</i-col>
               <i-col :span="3">
-                <i-input class="inputClass"
+                <i-input class="inputClass" type="text" disabled v-model="item.limitLower"></i-input>
-                         type="text"
-                         disabled
-                         v-model="item.limitLower"></i-input>
               </i-col>
             </div>
             <div v-else-if="item.type == 2">
-              <i-col style="line-height: 32px"
+              <i-col style="line-height: 32px" :span="4">标题 {{ index + 1 }}</i-col>
-                     :span="4">标题 {{ index + 1 }}</i-col>
               <i-col :span="6">
-                <i-input class="inputClass"
+                <i-input class="inputClass" type="text" disabled v-model="item.description"></i-input>
-                         type="text"
-                         disabled
-                         v-model="item.description"></i-input>
               </i-col>
-              <i-col style="line-height: 32px"
+              <i-col style="line-height: 32px" :span="4">URL {{ index + 1 }}</i-col>
-                     :span="4">URL {{ index + 1 }}</i-col>
               <i-col :span="6">
-                <i-input class="inputClass"
+                <i-input class="inputClass" type="text" disabled v-model="item.defaultVal"></i-input>
-                         type="text"
-                         disabled
-                         v-model="item.defaultVal"></i-input>
               </i-col>
             </div>
             <div v-else>
-              <i-col style="line-height: 32px"
+              <i-col style="line-height: 32px" :span="4">{{ item.name }}{{ index + 1 }}</i-col>
-                     :span="4">{{ item.name }}{{ index + 1 }}</i-col>
               <i-col :span="16">
-                <i-input class="inputClass"
+                <i-input class="inputClass" type="text" disabled v-model="item.defaultVal"></i-input>
-                         type="text"
-                         disabled
-                         v-model="item.defaultVal"></i-input>
               </i-col>
             </div>
             <i-col :span="4">
-              <Button type="error"
+              <Button type="error" @click="delActivityInput(index)">删除</Button>
-                      @click="delActivityInput(index)">删除</Button>
             </i-col>
           </Row>
           <FormItem>
-            <Button type="text"
+            <Button type="text" @click="() => (showMessageTypes = true)" icon="md-add">添加图片/网页/小程序消息</Button>
-                    @click="() => (showMessageTypes = true)"
-                    icon="md-add">添加图片/网页/小程序消息</Button>
           </FormItem>
           <FormItem label="配置范围: ">
-            <span @click="showStores"
+            <span
-                  v-if="welcome.stores.length > 0">{{ welcome.stores[0].name }}等{{ welcome.stores.length }}家店铺</span>
+              @click="showStores"
-            <Button type="text"
+              v-if="welcome.stores.length > 0"
+            >{{ welcome.stores[0].name }}等{{ welcome.stores.length }}家店铺</span>
+            <Button
+              type="text"
               v-if="welcome.stores.length <= 0"
               @click="showStores"
-                    icon="md-add">全部店铺</Button>
+              icon="md-add"
+            >全部店铺</Button>
           </FormItem>
           <FormItem>
-            <Button type="primary"
+            <Button
+              type="primary"
+              :loading="loading"
               long
-                    @click="submit">确定</Button>
+              @click="submit"
+            >{{loading ? "保存中" : "确定"}}</Button>
           </FormItem>
         </Form>
       </i-col>
     </Row>
-    <Modal v-model="showMessageTypes"
+    <Modal v-model="showMessageTypes" title="添加图片/网页/小程序消息" :footer-hide="true">
-           title="添加图片/网页/小程序消息"
-           :footer-hide="true">
       <Row :gutter="24">
         <i-col :span="8">
-          <Upload ref="upload"
+          <Upload
+            ref="upload"
             :show-upload-list="false"
             :on-success="uploadImgSuccess"
             :format="['jpg', 'jpeg', 'png']"
@@ -121,77 +97,49 @@
             multiple
             type="drag"
             action
-                  style="width: 100%;">
+            style="width: 100%;"
+          >
             <div style="width: 100%;">
-              <Button long
+              <Button long type="primary">{{imageUploading ? "上传中..." : "图片"}}</Button>
-                      type="primary">{{imageUploading ? "上传中..." : "图片"}}</Button>
             </div>
           </Upload>
         </i-col>
         <i-col :span="8">
-          <Button long
+          <Button long @click="doShowWeb" type="primary">网页</Button>
-                  @click="doShowWeb"
-                  type="primary">网页</Button>
         </i-col>
         <i-col :span="8">
-          <Button long
+          <Button long @click="doShowMini" type="primary">小程序</Button>
-                  @click="doShowMini"
-                  type="primary">小程序</Button>
         </i-col>
       </Row>
     </Modal>
-    <Modal v-model="showWeb"
+    <Modal v-model="showWeb" title="添加网页消息" :loading="true">
-           title="添加网页消息"
+      <Form ref="webForm" :model="webForm" :rules="webFormRules">
-           :loading="true">
+        <FormItem label="标题" prop="title">
-      <Form ref="webForm"
+          <i-input v-model="webForm.title" type="text" placeholder="请输入网页标题"></i-input>
-            :model="webForm"
-            :rules="webFormRules">
-        <FormItem label="标题"
-                  prop="title">
-          <i-input v-model="webForm.title"
-                   type="text"
-                   placeholder="请输入网页标题"></i-input>
         </FormItem>
-        <FormItem label="添加网页消息"
+        <FormItem label="添加网页消息" prop="url">
-                  prop="url">
+          <i-input v-model="webForm.url" type="text" placeholder="以http或https开头"></i-input>
-          <i-input v-model="webForm.url"
-                   type="text"
-                   placeholder="以http或https开头"></i-input>
         </FormItem>
       </Form>
       <div slot="footer">
-        <Button type="primary"
+        <Button type="primary" @click="cancelWeb">取消</Button>
-                @click="cancelWeb">取消</Button>
+        <Button type="primary" @click="okWeb">确定</Button>
-        <Button type="primary"
-                @click="okWeb">确定</Button>
       </div>
     </Modal>
-    <Modal v-model="showMini"
+    <Modal v-model="showMini" title="添加小程序消息" :loading="true">
-           title="添加小程序消息"
+      <Form ref="miniForm" :model="miniForm" :rules="miniFormRules">
-           :loading="true">
+        <FormItem label="标题" prop="key">
-      <Form ref="miniForm"
+          <i-input v-model="miniForm.key" type="text" placeholder="请输入标题"></i-input>
-            :model="miniForm"
-            :rules="miniFormRules">
-        <FormItem label="标题"
-                  prop="key">
-          <i-input v-model="miniForm.key"
-                   type="text"
-                   placeholder="请输入标题"></i-input>
         </FormItem>
-        <FormItem label="APPID"
+        <FormItem label="APPID" prop="appid">
-                  prop="appid">
+          <i-input v-model="miniForm.appid" type="text" placeholder="请输入appid"></i-input>
-          <i-input v-model="miniForm.appid"
-                   type="text"
-                   placeholder="请输入appid"></i-input>
         </FormItem>
-        <FormItem label="URI"
+        <FormItem label="URI" prop="uri">
-                  prop="uri">
+          <i-input v-model="miniForm.uri" type="text" placeholder="请输入URl"></i-input>
-          <i-input v-model="miniForm.uri"
-                   type="text"
-                   placeholder="请输入URl"></i-input>
         </FormItem>
         <FormItem label="封面图">
-          <Upload ref="upload"
+          <Upload
+            ref="upload"
             :show-upload-list="false"
             :on-success="miniUploadImgSuccess"
             :format="['jpg', 'jpeg', 'png']"
@@ -200,29 +148,32 @@
             multiple
             type="drag"
             action
-                  style="display: inline-block;">
+            style="display: inline-block;"
+          >
             <div style="width: 200px;height:200px;line-height: 200px;border:1px dashed #dedede">
               <span v-if="!miniForm.limitUpper">请上传图片</span>
-              <img v-if="miniForm.limitUpper"
+              <img
+                v-if="miniForm.limitUpper"
                 :src="`/kiisoo-ic` + miniForm.limitUpper"
                 alt
-                   style="width: 100%; height: auto" />
+                style="width: 100%; height: auto"
+              />
             </div>
           </Upload>
         </FormItem>
       </Form>
       <div slot="footer">
-        <Button type="primary"
+        <Button type="primary" @click="cancelMini">取消</Button>
-                @click="cancelMini">取消</Button>
+        <Button type="primary" @click="okMini">确定</Button>
-        <Button type="primary"
-                @click="okMini">确定</Button>
       </div>
     </Modal>
-    <selectStoreStep :title="'配置范围'"
+    <selectStoreStep
+      :title="'配置范围'"
       :isModify="id>0"
       @doShow="doShow"
       :schedule="welcome"
-                     :show="showStoreCheck"></selectStoreStep>
+      :show="showStoreCheck"
+    ></selectStoreStep>
   </div>
 </template>
 
@@ -241,7 +192,7 @@ const validateUrl = (rule, value, callback) => {
   }
 };
 export default {
-  data () {
+  data() {
     return {
       showStoreCheck: false,
       showWeb: false,
@@ -249,6 +200,7 @@ export default {
       id: 0,
       showMessageTypes: false,
       imageUploading: false,
+      loading: false,
       welcome: {
         content: "",
         params: [],
@@ -286,7 +238,7 @@ export default {
   },
   watch: {
     welcome: {
-      handler () {
+      handler() {
         store.commit("SET_useData", {
           ...store.getters.useData,
           ...this.welcome
@@ -296,7 +248,7 @@ export default {
       deep: true
     }
   },
-  created () {
+  created() {
     this.id = this.$route.query.id;
     // store.commit("SET_useData", { ...store.getters.useData, ...this.welcome });
     console.log(this.$route);
@@ -308,14 +260,14 @@ export default {
     selectStoreStep
   },
   methods: {
-    doShow () {
+    doShow() {
       this.showStoreCheck = false;
       this.welcome = store.getters.useData;
     },
-    onExceededSize () {
+    onExceededSize() {
       console.log("失败");
     },
-    getDetail (instanceId) {
+    getDetail(instanceId) {
       let _this = this;
       ActivityManager.instanceDetail(
         {
@@ -330,7 +282,7 @@ export default {
         }
       );
     },
-    showStores () {
+    showStores() {
       console.log({ ...store.getters.useData, ...this.welcome });
       store.commit("SET_useData", {
         ...this.welcome,
@@ -338,16 +290,16 @@ export default {
       });
       this.showStoreCheck = true;
     },
-    uploadImgSuccess (res, file) { },
+    uploadImgSuccess(res, file) {},
-    miniUploadImgSuccess (res, file) { },
+    miniUploadImgSuccess(res, file) {},
-    cancelWeb () {
+    cancelWeb() {
       this.showWeb = false;
     },
-    doShowWeb () {
+    doShowWeb() {
       this.showWeb = true;
       this.webForm = { url: "", title: "" };
     },
-    doShowMini () {
+    doShowMini() {
       this.showMini = true;
       this.miniForm = {
         appid: "",
@@ -357,10 +309,10 @@ export default {
         key: ""
       };
     },
-    cancelMini () {
+    cancelMini() {
       this.showMini = false;
     },
-    okWeb () {
+    okWeb() {
       let _this = this;
       this.$refs["webForm"].validate(valid => {
         if (valid) {
@@ -380,7 +332,7 @@ export default {
         }
       });
     },
-    okMini () {
+    okMini() {
       let _this = this;
       this.$refs["miniForm"].validate(valid => {
         if (valid) {
@@ -400,11 +352,11 @@ export default {
         }
       });
     },
-    delActivityInput (index) {
+    delActivityInput(index) {
       this.welcome.params.splice(index, 1);
       this.$forceUpdate();
     },
-    handleBeforeUploadMini (res) {
+    handleBeforeUploadMini(res) {
       const me = this;
       let data = new FormData();
       data.append("file", res);
@@ -418,7 +370,7 @@ export default {
         headers: {
           "Content-Type": "multipart/form-data"
         }
-      }).then(function (res) {
+      }).then(function(res) {
         me.imageUploading = false;
         if (res.data.success) {
           // me.formValidate.logo = res.data.results;
@@ -429,7 +381,7 @@ export default {
       });
       return false;
     },
-    handleBeforeUpload (res) {
+    handleBeforeUpload(res) {
       const me = this;
       let data = new FormData();
       data.append("file", res);
@@ -443,7 +395,7 @@ export default {
         headers: {
           "Content-Type": "multipart/form-data"
         }
-      }).then(function (res) {
+      }).then(function(res) {
         me.imageUploading = false;
         if (res.data.success) {
           // me.formValidate.logo = res.data.results;
@@ -463,10 +415,12 @@ export default {
       });
       return false;
     },
-    submit () {
+    submit() {
       let _this = this;
+      _this.loading = true;
       if (this.welcome.stores.length <= 0) {
         _this.$Message.error("请至少选择一个店铺");
+        _this.loading = false;
         return false;
       }
       this.$refs["welcomeForm"].validate(valid => {
@@ -481,6 +435,7 @@ export default {
               "Content-Type": "applications/json"
             }
           }).then(res => {
+            _this.loading = false;
             _this.$router.push("/shop/increase/welcome/list");
           });
         }