fix: 重要页面form 加防抖

src/utils/index.js

@@ -270,3 +270,49 @@ export const findAnyComponent = (context, componentName, root = null) => {
 export const deepClone = obj => {
   return JSON.parse(JSON.stringify(obj));
 };
+
+// 防抖
+export const _debounce = (fn, delay) => {
+  var delay = delay || 200;
+  var timer;
+  return function() {
+    var that = this;
+    var args = arguments;
+    if (timer) {
+      clearTimeout(timer);
+    }
+    timer = setTimeout(function() {
+      timer = null;
+      fn.apply(that, args);
+    }, delay);
+  };
+};
+// 节流
+export const _throttle = (fn, delay) => {
+  let timer = null;
+  let remaining = 0; // eslint-disable-line
+  let previous = new Date(); // eslint-disable-line
+
+  return function() {
+    const now = new Date();
+    const remaining = now - previous;
+    const args = arguments;
+    const context = this; // eslint-disable-line
+
+    if (remaining >= delay) {
+      if (timer) {
+        clearTimeout(timer);
+      }
+
+      fn.apply(context, args);
+      previous = now;
+    } else {
+      if (!timer) {
+        timer = setTimeout(function() {
+          fn.apply(context, args);
+          previous = new Date();
+        }, delay - remaining);
+      }
+    }
+  };
+};

src/views/activity/form.vue

@@ -21,6 +21,7 @@
 </template>
 
 <script>
+import { _debounce } from '@/utils/index';
 import { formatDateTimeByType } from '@/utils/index.js';
 import { saveActivity, getActivityInfo } from '@/service/api/activityApi';
 export default {
@@ -70,7 +71,7 @@ export default {
     }
   },
   methods: {
-    submit() {
+    submit: _debounce(function() {
       this.$refs.form.validate(valid => {
         if (!valid) {
           return;
@@ -95,7 +96,7 @@ export default {
             this.loading = false;
           });
       });
-    },
+    }),
     getInfo() {
       this.loading = true;
       getActivityInfo({ marketingActivityId: this.marketingActivityId })

src/views/card/form.js

 /**
  * 卡券新增编辑
  */
+import { _debounce } from '@/utils/index';
 import dmUploadImg from '@/components/upload/img';
 import imgTextDrag from './partials/imgtext-drag';
 import { formatDateTimeByType, deepClone } from '@/utils/index.js';
@@ -460,7 +461,7 @@ export default {
       this.form.erpDemoCode = this.form.erpDemoCode.replace(/[^\w\.\/]/gi, '');
     },
     //提交保存
-    async submitForm(formName) {
+    submitForm: _debounce(async function(formName) {
       // 可以选微盟且渠道含微盟微商城  -- 微盟券号不能为空
       if (this.form.cardApplyChannel.indexOf('WMmicroMall') !== -1 && this.countFlag) {
         if (!this.weimobDemoCodeList.length) {
@@ -538,7 +539,7 @@ export default {
           return false;
         }
       });
-    },
+    }),
     //卡券营销--卡券库--保存卡券
     async saveUpdateCard() {
       if (this.submitLoading) {

src/views/card/partials/destory-dialog.vue

@@ -37,6 +37,7 @@
 </template>
 
 <script>
+import { _debounce } from '@/utils/index';
 import file from '@/components/upload/file';
 import { getCoupDestoryDetail, importDestoryCoupCode, saveCoupDestoryPlan, downloadDestroyCodeTemplate } from '@/service/api/cardApi.js';
 export default {
@@ -112,7 +113,10 @@ export default {
       this.$refs.ruleForm.resetFields();
       this.$emit('update:show', false);
     },
-    submit() {
+    submit: _debounce(function() {
+      if (this.loading) {
+        return;
+      }
       this.$refs.ruleForm.validate(valid => {
         if (!valid) {
           return;
@@ -123,7 +127,7 @@ export default {
         saveCoupDestoryPlan(params)
           .then(res => {
             this.loading = false;
-            this.$message({ message: `${this.type === 'add' ? '新增' : '保存'}成功`, type: 'success' });
+            this.$message({ message: '操作成功', type: 'success' });
             this.close();
             this.$emit('refresh');
           })
@@ -131,7 +135,7 @@ export default {
             this.loading = false;
           });
       });
-    },
+    }),
     cleanCard() {
       this.ruleForm.cardId = '';
       this.ruleForm.cardName = '';

src/views/card/record-get.vue

@@ -2,7 +2,7 @@
   <section class="card-record-get" v-loading="recordLoading">
     <!-- 条件筛选区 -->
     <div class="pb22">
-      <el-input clearable v-model="listParams.search" class="w250" placeholder="请输入会员信息/卡券代码" @change="refresh"><i slot="prefix" class="el-input__icon el-icon-search"></i></el-input>
+      <el-input clearable v-model="listParams.search" style="width:240px" placeholder="请输入会员信息/卡券代码" @change="refresh"><i slot="prefix" class="el-input__icon el-icon-search"></i></el-input>
       <el-checkbox class="vertical-middle" v-if="$store.state.marketing.isShowSelf" v-model="listParams.showSelfFlag" :true-label="1" :false-label="0" label="仅看本人" border @change="refresh" />
       <card-select-filter ref="cdf" :cId.sync="listParams.coupCardId" class="w250" @cIdUpdate="refresh" :disabled="listParams.allCouponFlag" />
       <div class="inline-block ml5">

src/views/ecm/form.js

+import { _debounce } from '@/utils/index';
 import { getEcmInfo, saveEcmInfo } from '@/service/api/ecmApi.js';
 import activitySelect from '@/components/activity-select';
 import { listTemplateVariables } from '@/service/api/msgApi.js';
@@ -429,7 +430,7 @@ export default {
     },
 
     // 保存 校验
-    async submit(formName) {
+    submit: _debounce(async function(formName) {
       // // 这里强制获取人群筛选器的配置项
       // await this.$refs.peopleFilter.confirmSet();
       // 判断时间
@@ -617,16 +618,16 @@ export default {
           return false;
         }
       });
-    },
+    }),
     // 保存
     saveEcmInfo(params) {
+      if (this.loading) {
+        return;
+      }
       if (this.isEdit && this.form.cardNoticeType === 1) {
         this.$tips({ type: 'warning', message: `修改卡券目前不支持微信客服/群发接口` });
         return false;
       }
-      if (this.loading) {
-        return;
-      }
       this.loading = true;
       saveEcmInfo(params)
         .then(res => {

src/views/game/dzp/form.vue

@@ -138,6 +138,7 @@
 </template>
 
 <script>
+import { _debounce } from '@/utils/index';
 import adjustStock from '../common/adjust-stock';
 import activitySelect from '@/components/activity-select';
 import { detailLottery, saveLottery, downloadWheelSkinPsd, updateGamePrize } from '@/service/api/gameApi.js';
@@ -473,7 +474,10 @@ export default {
       this.loading = false;
     },
     //提交保存
-    async saveLottery(formName) {
+    saveLottery: _debounce(async function(formName) {
+      if (this.loading) {
+        return;
+      }
       if (!this.canEdit) {
         return;
       }
@@ -670,7 +674,7 @@ export default {
           return false;
         }
       });
-    },
+    }),
     labelTips(h, { column, $index }) {
       return (
         <el-tooltip class="item" effect="dark" content="中奖几率=奖品总几率*（该奖品数/所有有效的奖品总数）" placement="top-start">

src/views/game/ggk/form.vue

@@ -122,6 +122,7 @@
 </template>
 
 <script>
+import { _debounce } from '@/utils/index';
 import adjustStock from '../common/adjust-stock';
 import activitySelect from '@/components/activity-select';
 import { detailLottery, saveLottery, downloadWheelSkinPsd, updateGamePrize, deleteGamePrize } from '@/service/api/gameApi.js';
@@ -467,7 +468,10 @@ export default {
       this.backupTableList = deepClone(gameDetail.prizeList);
     },
     //提交保存
-    async saveLottery(formName) {
+    saveLottery: _debounce(async function(formName) {
+      if (this.loading) {
+        return;
+      }
       if (!this.canEdit) {
         return;
       }
@@ -641,7 +645,7 @@ export default {
           return false;
         }
       });
-    },
+    }),
     // 表格提示
     labelTips(h, { column, $index }) {
       return (

src/views/game/klfl/form.vue

@@ -185,6 +185,7 @@
 </template>
 
 <script>
+import { _debounce } from '@/utils/index';
 import activitySelect from '@/components/activity-select';
 import { klflDetail, klflSave, klflStrategyList, klflPrizeList, klflStrategySort, klflStrategyDel, klflDownTemp, getCouponStock } from '@/service/api/gameApi.js';
 import { formatDateTimeByType } from '@/utils/index.js';
@@ -602,7 +603,10 @@ export default {
       });
     },
     //提交保存
-    async klflSave(formName) {
+    klflSave: _debounce(async function(formName) {
+      if (this.loading) {
+        return;
+      }
       if (!this.canEdit) {
         return;
       }
@@ -778,7 +782,7 @@ export default {
           return false;
         }
       });
-    },
+    }),
     //策略排序
     sortGame(id, type, flag) {
       if (flag) return;

src/views/game/ptyx/form.vue

@@ -106,6 +106,7 @@
 </template>
 
 <script>
+import { _debounce } from '@/utils/index';
 import activitySelect from '@/components/activity-select';
 import { ptyxDetail, savePtyx, getGameSystemMusic, downloadPtyxSkinPsd } from '@/service/api/gameApi.js';
 import { numberToChinese, formatDateTimeByType } from '@/utils/index.js';
@@ -381,7 +382,10 @@ export default {
       });
     },
     //提交保存
-    async savePtyx(formName) {
+    savePtyx: _debounce(async function(formName) {
+      if (this.loading) {
+        return;
+      }
       if (!this.canEdit) {
         return;
       }
@@ -563,7 +567,7 @@ export default {
           return false;
         }
       });
-    },
+    }),
     //播放音乐
     playMusic(index) {
       let currentMusic = this.gameMusicOptions[index];

src/views/game/znm/form.vue

@@ -73,6 +73,7 @@
 </template>
 
 <script>
+import { _debounce } from '@/utils/index';
 import activitySelect from '@/components/activity-select';
 import { znmDetail, znmSave, znmStrategyList, znmStrategySort, znmStrategyDel } from '@/service/api/gameApi.js';
 import { numberToChinese, formatDateTimeByType } from '@/utils/index.js';
@@ -293,7 +294,10 @@ export default {
       }
     },
     //提交保存
-    async znmSave(formName) {
+    znmSave: _debounce(async function(formName) {
+      if (this.loading) {
+        return;
+      }
       if (!this.canEdit) {
         return;
       }
@@ -410,7 +414,7 @@ export default {
           return false;
         }
       });
-    },
+    }),
     // 显示卡券弹窗
     showCard(type) {
       console.log(type);

src/views/message/addTemp.vue

@@ -72,6 +72,7 @@
   </div>
 </template>
 <script>
+import { _debounce } from '@/utils/index';
 import { saveTempService, LoadTempInfo } from '@/service/api/messageApi.js';
 export default {
   name: 'add-temp',
@@ -110,7 +111,7 @@ export default {
     }
   },
   methods: {
-    submit(formName) {
+    submit: _debounce(function(formName) {
       this.$refs[formName].validate(valid => {
         if (valid) {
           this.saveTempService();
@@ -118,8 +119,11 @@ export default {
           return false;
         }
       });
-    },
+    }),
     async saveTempService() {
+      if (this.loading) {
+        return;
+      }
       try {
         this.loading = true;
         await saveTempService(this.form);

src/views/message/form.vue

@@ -44,6 +44,7 @@
   </el-form>
 </template>
 <script>
+import { _debounce } from '@/utils/index';
 import activitySelect from '@/components/activity-select';
 import { saveSendSmsService, checkMessageSendCount } from '@/service/api/messageApi.js';
 import smsTemp from '@/components/libs/smsTemp';
@@ -206,7 +207,10 @@ export default {
         });
     },
     //提交表单
-    async sendSms() {
+    sendSms: _debounce(async function() {
+      if (this.loading) {
+        return;
+      }
       if (this.info.sendType == 1 && !this.info.sendTime) {
         this.$tips({ type: 'warning', message: '请设置发送时间' });
         return;
@@ -260,7 +264,7 @@ export default {
         return;
       }
       this.checkMessageSendCount();
-    },
+    }),
     checkAccountState() {
       if (localStorage.getItem('accountStatus') == 3) {
         this.$alert(

src/views/message/importSendForm.vue

@@ -35,6 +35,7 @@
 </template>
 
 <script>
+import { _debounce } from '@/utils/index';
 import smsTemp from '@/components/libs/smsTemp';
 import { formatDateTimeByType } from '@/utils/index.js';
 import file from '@/components/upload/file';
@@ -78,7 +79,10 @@ export default {
     onSmsItemInfo(val) {
       this.smsType = val.type;
     },
-    submitForm() {
+    submitForm: _debounce(function() {
+      if (this.loading) {
+        return;
+      }
       if (this.ruleForm.sendType == 1 && !this.ruleForm.sendTime) {
         this.$tips({ type: 'warning', message: '请设置发送时间' });
         return;
@@ -107,7 +111,7 @@ export default {
         .catch(() => {
           this.loading = false;
         });
-    },
+    }),
     async sceneSettingList() {
       let res = await sceneSettingList();
       this.sceneSettingIdOptions = res.result || [];

src/views/recharge/board.vue

@@ -94,7 +94,7 @@
     <div class="dm-wrap" v-loading="loading">
       <div class="pb22">
         <div slot="header" class="clearfix">
-          <el-date-picker v-model="dateTime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" @change="consumeRecord"></el-date-picker>
+          <el-date-picker v-model="dateTime" :picker-options="pickerOptions" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" @change="consumeRecord"></el-date-picker>
         </div>
       </div>
       <el-table tooltipEffect="light" :data="tableList" style="width: 100%">
@@ -136,6 +136,11 @@ export default {
       listParams: {
         beginTime: '',
         endTime: ''
+      },
+      pickerOptions: {
+        disabledDate(val) {
+          return Date.now() >= val.getTime() + 3 * 30 * 24 * 60 * 60 * 1000;
+        }
       }
     };
   },

src/views/recharge/consume.vue

 <template>
   <section class="recharge">
-    <div class="dm-wrap">日期：<el-date-picker v-model="dateTime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" @change="loadAll(false)"></el-date-picker></div>
+    <div class="dm-wrap">日期：<el-date-picker :picker-options="pickerOptions" v-model="dateTime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" @change="loadAll(false)"></el-date-picker></div>
     <div class="dm-form__wrap">
       <h3 class="dm-title__label">趋势分析图</h3>
       <div class="text-center fz16" v-if="$route.params.type === 'record'">{{ formatDateTimeByType(dateTime[0], 'yyyy-MM-dd') }}至{{ formatDateTimeByType(dateTime[1], 'yyyy-MM-dd') }} 成功存储：{{ sumCount || 0 }} 分钟 总计消费：{{ (sumFee / 100).toFixed(2) }} 元</div>
@@ -215,7 +215,12 @@ export default {
       taskTypeOptions: [],
       sumFee: 0,
       sumCount: 0,
-      placeholder: ''
+      placeholder: '',
+      pickerOptions: {
+        disabledDate(val) {
+          return Date.now() >= val.getTime() + 3 * 30 * 24 * 60 * 60 * 1000;
+        }
+      }
     };
   },
   created() {

src/views/wechat/editor.vue

@@ -111,6 +111,7 @@
 </template>
 
 <script>
+import { _debounce } from '@/utils/index';
 import VueUeditorWrap from '@/components/ueditorWrap';
 import dmImgBox from '@/components/libs/imgTemp/index-box.vue';
 import cardTemp from '@/components/libs/cardTemp';
@@ -324,7 +325,7 @@ export default {
       }
       this.loading = false;
     },
-    submit() {
+    submit: _debounce(function() {
       if (this.subLoading) {
         return;
       }
@@ -345,7 +346,7 @@ export default {
       });
       if (flag) return;
       this.saveUpdateWechatImageText();
-    },
+    }),
 
     async saveUpdateWechatImageText() {
       let params = {};

src/views/wechat/form.vue

@@ -82,6 +82,7 @@
   </div>
 </template>
 <script>
+import { _debounce } from '@/utils/index';
 import activitySelect from '@/components/activity-select';
 import dmImgText from '@/components/libs/imgTextTemp';
 import dmImgBox from '@/components/libs/imgTemp/index-box.vue';
@@ -263,7 +264,7 @@ export default {
     //   this.info.imageMediaId = data.imageMediaId;
     // },
     // type: 1预览 2提交群发
-    async submit(type) {
+    submit: _debounce(async function(type) {
       // console.log(this.info);
       // // 这里强制获取人群筛选器的配置项
       // await this.$refs.peopleFilter.confirmSet();
@@ -322,9 +323,12 @@ export default {
       } else if (type === 2) {
         this.checkMessageSendCount();
       }
-    },
+    }),
     // 提交预览
     async handleSendRecordPreview() {
+      if (this.loading) {
+        return;
+      }
       this.$confirm('预览将不会保存群发信息, 且只发送一个会员, 每日调用次数100', '提示', {
         confirmButtonText: '确定',
         cancelBUttonText: '取消',
@@ -392,6 +396,9 @@ export default {
     },
     //提交表单验证人数  只有人员筛选需要
     async checkMessageSendCount() {
+      if (this.loading) {
+        return;
+      }
       if (this.info.memberType === 0 || this.info.memberType === 2) {
         const params = {
           memberSearchDTO: this.info.memberType ? this.info.memberGroupIds : this.info.memberSearchDTO,

src/views/wechat/video/addEdit.vue

 <template>
-  <section class="dm-wrap">
-    <el-form ref="form" :model="form" :rules="rules" label-width="80px" v-loading="loading">
+  <section class="dm-wrap" v-loading="loading">
+    <el-form ref="form" :model="form" :rules="rules" label-width="80px">
       <el-form-item label="标题" prop="titleName" class="w450">
         <dm-input v-model="form.titleName" :maxlength="64"></dm-input>
       </el-form-item>
@@ -102,6 +102,9 @@ export default {
     },
     //保存操作
     async saveVideoService() {
+      if (this.loading) {
+        return;
+      }
       try {
         this.loading = true;
         let params = {