fix: 积分通用和抵现校验定位

src/components/memberShip/point-form.vue

@@ -7,7 +7,7 @@
         <div>
           <el-radio v-model="ruleForm.integralGetStatus" label="0" @change="radioEvent">不获取积分</el-radio>
         </div>
-        <div class="margin-20">
+        <div class="margin-20 integralGet">
           <el-radio v-model="ruleForm.integralGetStatus" label="1">每消费</el-radio>
           <!-- <el-input v-model="ruleForm.integralGet.fee"  @blur="formatInputFee($event)"></el-input> -->
           <el-input-number v-model="ruleForm.integralGet.fee" placeholder="请输入" :precision="1" :controls="false" :max="10000.0" :min="0.1"></el-input-number>
@@ -22,7 +22,7 @@
         <div class="form-child margin-20" v-if="ruleForm.integralGetStatus == 1">
           <el-form-item label="折扣控制:" prop="" label-width="100px">
             <div class="radio-cell">
-              <el-radio v-model="ruleForm.integralGetDiscountControl" label="1" @change="radioEvent3">所有折扣商品都适用</el-radio>
+              <el-radio class="integralGetDiscountControlLower1" v-model="ruleForm.integralGetDiscountControl" label="1" @change="radioEvent3">所有折扣商品都适用</el-radio>
             </div>
             <div class="radio-cell margin-20">
               <el-radio v-model="ruleForm.integralGetDiscountControl" label="2">折扣</el-radio>
@@ -35,7 +35,7 @@
                <span style="font-size: 12px;color: #828282;line-height: 1;padding-left: 10px;">折扣范围1-10，填写8.8，则表示“打8.8折”，也即商品原价*8.8/10=商品折后价</span>
             </div>
           </el-form-item>
-          <el-form-item label="积分冻结期:" prop="name" label-width="100px" class="padding-bottom-20 margin-20">
+          <el-form-item label="积分冻结期:" prop="integralGetFreezeDays" label-width="100px" class="padding-bottom-20 margin-20 integralGetFreezeDays">
             <label>自获取之日起</label>
             <el-input v-model="ruleForm.integralGetFreezeDays" placeholder="请输入" @keyup.native="formatInput($event)"></el-input>
             <label>天</label>
@@ -48,7 +48,7 @@
           <el-radio v-model="ruleForm.integralUseStatus" label="0" @change="radioEvent1">不支持抵现</el-radio>
         </div>
         <div class="margin-20">
-          <el-radio v-model="ruleForm.integralUseStatus" label="1">每使用</el-radio>
+          <el-radio class="integralUse" v-model="ruleForm.integralUseStatus" label="1">每使用</el-radio>
           <!-- <el-input v-model="ruleForm.integralUse.integral"  @keyup.native="formatInput($event)"></el-input> -->
           <el-input-number v-model="ruleForm.integralUse.integral" placeholder="请输入" step-strictly :controls="false"></el-input-number>
           <label>积分，抵 </label>
@@ -62,7 +62,7 @@
             <el-radio v-model="ruleForm.integralUseDiscountControl" label="1" @change="radioEvent4">所有折扣商品都适用</el-radio>
           </div>
           <div class="radio-cell margin-20">
-            <el-radio v-model="ruleForm.integralUseDiscountControl" label="2">折扣</el-radio>
+            <el-radio class="integralUseDiscountControlLower1" v-model="ruleForm.integralUseDiscountControl" label="2">折扣</el-radio>
             <!-- <el-input v-model="ruleForm.integralUseDiscountControlLower" @change="formatInputChange($event)"></el-input> -->
             <el-input-number v-model="ruleForm.integralUseDiscountControlLower" placeholder="请输入" :precision="2" :controls="false" :max="10.0" ></el-input-number>
             <label>至</label>
@@ -72,13 +72,13 @@
             <span style="font-size: 12px;color: #828282;line-height: 1;padding-left: 10px;">折扣范围1-10，填写8.8，则表示“打8.8折”，也即商品原价*8.8/10=商品折后价</span>
           </div>
         </el-form-item>
-        <el-form-item label="比例限制:" prop="name" class="padding-bottom-20 margin-20">
+        <el-form-item label="比例限制:" prop="name" class="padding-bottom-20 margin-20 useProportionalRestriction">
           <label>最多可抵用商品金额的 </label>
           <el-input placeholder="请输入" v-model="ruleForm.useProportionalRestriction" @keyup.native="formatInput($event)"></el-input>%
         </el-form-item>
       </div>
       </el-form-item>
-      <el-form-item label="积分成本:" required>
+      <el-form-item label="积分成本:" required class="integralCost">
         <label>每使用</label>
         <el-input-number v-model="ruleForm.integralCost.integral" placeholder="请输入" step-strictly :controls="false"></el-input-number>
         <!-- <el-input v-model="ruleForm.integralCost.integral"  @keyup.native="formatInput($event)"></el-input> -->
@@ -88,7 +88,7 @@
         <label>元</label>
       </el-form-item>
       <dm-sub-title type="fill" text="积分有效期" style="margin-bottom: 20px; margin-top:40px;"/>
-       <el-form-item label="有效期:" prop="integralExpireType" class="padding-0" >
+       <el-form-item label="有效期:" prop="integralExpireType" class="padding-0 yearY" >
         <el-tooltip placement="right" effect="light">
             <div slot="content" style="line-height:20px">
               <p style="color:#595959 font-size:14px;font-weight:600">规则说明：</p>
@@ -178,6 +178,7 @@ import 'tinymce/plugins/contextmenu';
 import 'tinymce/plugins/wordcount';
 import 'tinymce/plugins/colorpicker';
 import 'tinymce/plugins/textcolor';
+import { scrollToError } from '@/utils/validate';
 export default {
   name: 'pointSystem',
   props: {
@@ -212,6 +213,7 @@ export default {
       return arr;
     }
     return {
+      scrollToError,
       dayList: dayList(),
       mouthList: mouthList(),
       mouthM: '', //按月失效 月
@@ -365,16 +367,19 @@ export default {
           // 非空验证
           let flag = !data.integralGet.fee || !data.integralGet.integral;
           if (data.integralGetStatus == 1 && flag) {
+            this.scrollToError(this, 'integralGet');
             that.$message.error('请填写积分获取规则');
             return;
           }
 
           if (data.integralGetStatus == 1) {
             if (!Number(data.integralGet.fee)) {
+              this.scrollToError(this, 'integralGet');
               that.$message.error('积分获取规则中的消费金额不能为0');
               return;
             }
             if (!Number(data.integralGet.integral)) {
+              this.scrollToError(this, 'integralGet');
               that.$message.error('积分获取规则中的获取积分不能为0');
               return;
             }
@@ -382,6 +387,7 @@ export default {
           // log(String(data.integralGetFreezeDays));
 
           if (data.integralGetStatus == 1 && String(data.integralGetFreezeDays) == '') {
+            this.scrollToError(this, 'integralGetFreezeDays');
             // 积分冻结期
             that.$message.error({
               duration: 1000,
@@ -391,6 +397,7 @@ export default {
           }
 
           if(data.integralExpireType == ''){ // 积分有效期类型
+            this.scrollToError(this, 'yearY');
             that.$message.error({
               duration: 1000,
               message: "请选择积分有效期类型"
@@ -399,44 +406,39 @@ export default {
           }
 
           if(data.integralExpireType ==3 && (this.mouthM == '' || this.mouthD == -1)) {
+            this.scrollToError(this, 'yearY');
             that.$message.error({
               duration: 1000,
               message: "请选择按月失效规则"
             })
             return;
           }else if(data.integralExpireType ==2 && (this.yearY == '' || this.yearM == '' || this.yearD == -1 )) {
+            this.scrollToError(this, 'yearY');
             that.$message.error({
               duration: 1000,
               message: "请选择按年失效规则"
             })
             return;
           } else if (data.integralExpireType ==0  && data.effectiveTime=='') {
+            this.scrollToError(this, 'yearY');
             that.$message.error({
               duration: 1000,
               message: "请填写积分有效期"
             })
             return;
-          }
-
-          if (String(data.integralExpireType)== 0 &&data.effectiveTime == '') {
-            // 积分有效期
+          }else if ( String(data.integralExpireType)== 0 && data.effectiveTime=='' && parseInt(data.effectiveTime) < 1) {
+            this.scrollToError(this, 'yearY');
             that.$message.error({
               duration: 1000,
-              message: '请填写积分有效期'
+              message: '积分有效期不能低于最低限制'
             });
             return;
-          } else {
-            if ( String(data.integralExpireType)== 0 &&parseInt(data.effectiveTime) < 1) {
-              that.$message.error({
-                duration: 1000,
-                message: '积分有效期不能低于最低限制'
-              });
-              return;
-            }
           }
 
+
           let tag = !data.integralUse.fee || !data.integralUse.integral || !data.integralCost.integral || !data.integralCost.fee || !parseInt(data.useProportionalRestriction);
           if (data.integralUseStatus == 1 && tag) {
+            this.scrollToError(this, 'integralUse');
             that.$message.error({
               duration: 1000,
               message: '请填写积分抵现规则'
@@ -445,20 +447,24 @@ export default {
           }
           if (data.integralUseStatus == 1) {
             if (!Number(data.integralUse.fee)) {
+              this.scrollToError(this, 'integralUse');
               that.$message.error('积分抵现规则中的抵现金额不能为0');
               return;
             }
             if (!Number(data.integralUse.integral)) {
+              this.scrollToError(this, 'integralUse');
               that.$message.error('积分抵现规则中的使用积分不能为0');
               return;
             }
           }
           // 积分成本
           if (!Number(data.integralCost.fee)) {
+            this.scrollToError(this, 'integralCost');
             that.$message.error('积分成本中的承担金额不能为0');
             return;
           }
           if (!Number(data.integralCost.integral)) {
+            this.scrollToError(this, 'integralCost');
             that.$message.error('积分成本中的使用积分不能为0');
             return;
           }
@@ -467,10 +473,12 @@ export default {
           if (data.integralGetStatus == 1 && data.integralGetDiscountControl == 2) {
             let flagA = Number(data.integralGetDiscountControlUpper) <= Number(data.integralGetDiscountControlLower);
             if (!data.integralGetDiscountControlLower || !data.integralGetDiscountControlUpper) {
+              this.scrollToError(this, 'integralGetDiscountControlLower1');
               that.$message.error('请输入商品折扣值');
               return;
             }
             if (flagA) {
+              this.scrollToError(this, 'integralGetDiscountControlLower1');
               that.$message.error('积分获取规则中的折扣格式有误');
               return;
             }
@@ -478,16 +486,19 @@ export default {
           if (data.integralUseStatus == 1 && data.integralUseDiscountControl == 2) {
             let flagB = Number(data.integralUseDiscountControlUpper) <= Number(data.integralUseDiscountControlLower);
             if (!data.integralUseDiscountControlLower || !data.integralUseDiscountControlUpper) {
+              this.scrollToError(this, 'integralUseDiscountControlLower1');
               that.$message.error('请输入商品折扣值');
               return;
             }
             if (flagB) {
+              this.scrollToError(this, 'integralUseDiscountControlLower1');
               that.$message.error('积分抵现规则中的折扣格式有误');
               return;
             }
           }
 
           if (data.useProportionalRestriction > 100) {
+            this.scrollToError(this, 'useProportionalRestriction');
             that.$message.error('比例限制文本格式有误');
             return;
           }

src/utils/validate.js

@@ -40,3 +40,20 @@ export function validateEmail(email) {
   const re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
   return re.test(email);
 }
+
+/** 表单校验滚动到第一个错误项
+ * @param {Object} that vue实例
+ * this.scrollToError(this);
+ */
+export const scrollToError = (that, className = 'is-error') => {
+  that.$nextTick(_ => {
+    const isError = document.getElementsByClassName(className);
+    isError[0].scrollIntoView({
+      // 滚动到指定节点
+      // 值有start,center,end，nearest，当前显示在视图区域中间
+      block: 'center',
+      // 值有auto、instant,smooth，缓动动画（当前是慢速的）
+      behavior: 'smooth'
+    });
+  });
+};

src/view/companyGroup/membershipSystem/addIntegralSytem.vue

@@ -32,7 +32,7 @@
                   ></el-option>
                 </el-select>
               </el-form-item>
-              <el-form-item label="人群定向：" v-if="ruleForm.useCrowd == 2" prop class="padding-0">
+              <el-form-item label="人群定向：" v-if="ruleForm.useCrowd == 2" prop class="padding-0 selectCount">
                 <el-button @click="showPeople">已设置{{ selectCount }}项筛选</el-button>
               </el-form-item>
               <el-form-item label="适用条件：" class="padding-0">
@@ -80,7 +80,7 @@
                       <!-- 商品品牌 -->
                       <el-select
                         size="small"
-                        class="fl w240"
+                        class="fl w240 valueWx"
                         @change="selectGoodsStoreWx"
                         v-if="item.channelRelationProType == 2"
                         v-model="valueWx"
@@ -95,7 +95,7 @@
                         ></el-option>
                       </el-select>
                       <!-- 商品品类 -->
-                      <div v-if="item.channelRelationProType == 3" class="fl goods-cate">
+                      <div v-if="item.channelRelationProType == 3" class="fl goods-cate cateDataWx">
                         <goodsCate
                           ref="selectGoodsCate"
                           :selectCateType="selectCateTypeWx"
@@ -105,16 +105,16 @@
                       </div>
                       <el-button
                         style="width:202px"
-                        class="fl"
+                        class="fl goodsListWx"
                         v-if="item.channelRelationProType == 4"
                         @click="showGoodsDialog('wx')"
                       >已选{{ goodsListWx.length }}件商品</el-button>
                     </el-form-item>
                     <el-form-item label="折扣控制：" prop="region" class="margin-20">
                       <div class="radio-cell">
-                        <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEvent2">所有折扣商品都适用</el-radio>
+                        <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEventn(2)">所有折扣商品都适用</el-radio>
                       </div>
-                      <div class="radio-cell margin-20 padding-bottom-20">
+                      <div class="radio-cell margin-20 padding-bottom-20 zk0">
                         <el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
                         <el-input-number
                           placeholder="请输入"
@@ -164,9 +164,9 @@
                     </el-form-item>
                     <el-form-item label="折扣控制：" prop="region" class="input-margin-b margin-20 padding-bottom-20">
                       <div class="radio-cell">
-                        <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEvent1">所有折扣商品都适用</el-radio>
+                        <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEventn(1)">所有折扣商品都适用</el-radio>
                       </div>
-                      <div class="radio-cell margin-20">
+                      <div class="radio-cell margin-20 zk1">
                         <el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
                         <el-input-number placeholder="请输入" v-model="item.integralUseDiscountControlLower" :precision="2" :controls="false" :max="10.0" :min="1"></el-input-number>
                         <label>至</label>
@@ -184,7 +184,7 @@
                 <div>
                   <el-radio v-model="ruleForm.integralUseStatus" label="0" @change="radioEvent()">不支持抵现</el-radio>
                 </div>
-                <div class="margin-20">
+                <div class="margin-20 integralUse">
                   <el-radio v-model="ruleForm.integralUseStatus" label="1">每使用</el-radio>
                   <el-input-number
                     placeholder="请输入"
@@ -292,7 +292,7 @@ import strLength from '@/common/js/strlen';
 import { getRequest, postRequest, postJson } from '@/api/api';
 import { log } from '@/utils/index.js';
 import wmMixins from './strategy.js';
-
+import { scrollToError } from '@/utils/validate';
 const timeStramp = {
   year: new Date().getFullYear(),
   month: new Date().getMonth(),
@@ -304,6 +304,7 @@ export default {
   mixins: [wmMixins],
   data() {
     return {
+      scrollToError,
       repProjectName: 'gic-clique',
       navpath: [
         {
@@ -484,15 +485,9 @@ export default {
     // this.selectReplayStyle()
   },
   methods: {
-    radioEvent2() {
-      // console.log(this.ruleForm.channelType, 78787);
-      this.ruleForm.channelList[0].integralUseDiscountControlLower = undefined;
-      this.ruleForm.channelList[0].integralUseDiscountControlUpper = undefined;
-    },
-    radioEvent1() {
-      // console.log(this.ruleForm.channelType, 78787);
-      this.ruleForm.channelList[1].integralUseDiscountControlLower = undefined;
-      this.ruleForm.channelList[1].integralUseDiscountControlUpper = undefined;
+    radioEventn(n) {
+      this.ruleForm.channelList[n].integralUseDiscountControlLower = undefined;
+      this.ruleForm.channelList[n].integralUseDiscountControlUpper = undefined;
     },
     radioEvent() {
       this.ruleForm.integralUse.fee = undefined;
@@ -513,19 +508,23 @@ export default {
             if (!!data.channelList[i].openStatus && data.channelList[i].integralUseDiscountControl == 2) {
               if (!data.channelList[i].integralUseDiscountControlUpper || !data.channelList[i].integralUseDiscountControlLower) {
                 obj.flag = false;
+                this.scrollToError(this, `zk${i}`);
                 obj.text = '请填写折扣';
               }
               if (parseInt(data.channelList[i].integralUseDiscountControlUpper) > 10 || parseInt(data.channelList[i].integralUseDiscountControlLower) > 10 || Number(data.channelList[i].integralUseDiscountControlUpper) <= Number(data.channelList[i].integralUseDiscountControlLower)) {
                 obj.flag = false;
+                this.scrollToError(this, `zk${i}`);
                 obj.text = '折扣格式有误';
               }
             }
             if (data.channelList[i].channelType == 1 && !data.channelList[i].enterpriseRelationIdArr.length) {
               obj.flag = false;
+              this.scrollToError(this, `zk${i}`);
               obj.text = '请选择商户';
             }
             if (data.channelList[i].channelType == 9 && !data.channelList[i].enterpriseRelationIdArr.length) {
               obj.flag = false;
+              this.scrollToError(this, `zk${i}`);
               obj.text = '请选择商户';
             }
             if (data.channelList[i].channelType == 3) {
@@ -589,15 +588,18 @@ export default {
             // }
             let flag = !data.integralUse.fee || String(data.integralUse.integral) == '';
             if (data.integralUseStatus == 1 && flag) {
+              this.scrollToError(this, 'integralUse');
               that.$message.error('请填写抵现规则');
               return;
             }
             if (data.integralUseStatus == 1) {
               if (!Number(data.integralUse.fee)) {
+                this.scrollToError(this, 'integralUse');
                 showMsg.showmsg('抵现规则中的抵现金额不能为0', 'error');
                 return;
               }
               if (!Number(data.integralUse.integral)) {
+                this.scrollToError(this, 'integralUse');
                 showMsg.showmsg('抵现规则中的使用积分不能为0', 'error');
                 return;
               }
@@ -649,16 +651,19 @@ export default {
                     // 微信商城
                     // 适用商品
                     if (item.channelRelationProType == 2 && this.valueWx.length < 1) {
+                      this.scrollToError(this, 'valueWx');
                       // 商品品牌
                       showMsg.showmsg('请选择商品品牌', 'error');
                       return (saveBool = false);
                     }
                     if (item.channelRelationProType == 3 && this.cateDataWx.length < 1) {
+                      this.scrollToError(this, 'cateDataWx');
                       // 商品品类
                       showMsg.showmsg('请选择商品品类', 'error');
                       return (saveBool = false);
                     }
                     if (item.channelRelationProType == 4 && this.goodsListWx.length < 1) {
+                      this.scrollToError(this, 'goodsListWx');
                       // 单件商品
                       showMsg.showmsg('请选择单件商品', 'error');
                       return (saveBool = false);
@@ -667,6 +672,7 @@ export default {
                 });
                 // 自定义人群
                 if (data.useCrowd == 2 && this.selectCount < 1) {
+                  this.scrollToError(this, 'selectCount');
                   showMsg.showmsg('请选择人群定向', 'error');
                   return;
                 }
@@ -699,15 +705,8 @@ export default {
               }
             })
           } else {
-            log('error submit!!');
-            setTimeout(() => {
-              var isError = document.getElementsByClassName("is-error");
-              if (isError[0].querySelector('input')) {
-                isError[0].querySelector('input').focus();
-              } else if (isError[0].querySelector('textarea')) {
-                isError[0].querySelector('textarea').focus();
-              }
-            }, 1)
+            this.scrollToError(this);
+            showMsg.showmsg('表单信息未填写完整','error')
             return false;
           }
         });

src/view/companyGroup/membershipSystem/addPointSystem.vue

@@ -37,7 +37,7 @@
                         <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEventN(0)">所有折扣商品都适用</el-radio>
                       </div>
                       <div class="radio-cell margin-20">
-                        <el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
+                        <el-radio class="zk0" v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
                         <el-input-number v-model="item.integralUseDiscountControlLower" :precision="2" :controls="false" :max="10.0" :min="1" :step="0.01" placeholder="请输入" style="width: 115px"></el-input-number>
                         <label>至</label>
                         <el-input-number v-model="item.integralUseDiscountControlUpper" :precision="2" :controls="false" :max="10.0" :min="1" placeholder="请输入" style="width: 115px"></el-input-number>
@@ -76,7 +76,7 @@
                         <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEventN(1)">所有折扣商品都适用</el-radio>
                       </div>
                       <div class="radio-cell margin-20">
-                        <el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
+                        <el-radio class="zk1" v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
                         <el-input-number v-model="item.integralUseDiscountControlLower" placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1" style="width: 115px"></el-input-number>
                         <label>至</label>
                         <el-input-number v-model="item.integralUseDiscountControlUpper" placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1" style="width: 115px"></el-input-number>
@@ -114,7 +114,7 @@
                         <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEventN(2)">所有折扣商品都适用</el-radio>
                       </div>
                       <div class="radio-cell margin-20">
-                        <el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
+                        <el-radio class="zk2" v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
                         <el-input-number v-model="item.integralUseDiscountControlLower" placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1" style="width: 115px"></el-input-number>
                         <label>至</label>
                         <el-input-number v-model="item.integralUseDiscountControlUpper" placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1" style="width: 115px"></el-input-number>
@@ -141,7 +141,7 @@
                         <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEventN(3)">所有折扣商品都适用</el-radio>
                       </div>
                       <div class="radio-cell margin-20">
-                        <el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
+                        <el-radio class="zk3" v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
                         <el-input-number v-model="item.integralUseDiscountControlLower" placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1" style="width: 115px"></el-input-number>
                         <label>至</label>
                         <el-input-number v-model="item.integralUseDiscountControlUpper" placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1" style="width: 115px"></el-input-number>
@@ -168,7 +168,7 @@
                         <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEventN(4)">所有折扣商品都适用</el-radio>
                       </div>
                       <div class="radio-cell margin-20">
-                        <el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
+                        <el-radio class="zk4" v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
                         <el-input-number v-model="item.integralUseDiscountControlLower"  placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1" style="width: 115px"></el-input-number>
                         <label>至</label>
                         <el-input-number v-model="item.integralUseDiscountControlUpper" placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1" style="width: 115px"></el-input-number>
@@ -195,7 +195,7 @@
                         <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEventN(5)">所有折扣商品都适用</el-radio>
                       </div>
                       <div class="radio-cell margin-20">
-                        <el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
+                        <el-radio class="zk5" v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
                         <el-input-number v-model="item.integralUseDiscountControlLower" placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1" style="width: 115px"></el-input-number>
                         <label>至</label>
                         <el-input-number v-model="item.integralUseDiscountControlUpper" placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1" style="width: 115px"></el-input-number>
@@ -225,7 +225,7 @@
                   <el-radio v-model="ruleForm.integralGetStatus" label="0" @change="radioEvent">不获取积分</el-radio>
                 </div>
                 <div class="margin-20">
-                  <el-radio v-model="ruleForm.integralGetStatus" label="1">每消费</el-radio>
+                  <el-radio class="integralGet" v-model="ruleForm.integralGetStatus" label="1">每消费</el-radio>
                   <el-input-number v-model="ruleForm.integralGet.fee" placeholder="请输入" :precision="1" :controls="false" :max="10000.0" :min="0.1" style="width: 115px"></el-input-number>
                   <label>元，获取 </label>
                   <!-- <el-input v-model="ruleForm.integralGet.integral" @blur="formatInputNumBlur($event)"></el-input> -->
@@ -311,7 +311,7 @@
                 <!-- 自定义有效期 -->
                 <div class="form-child p20" v-if="ruleForm.userGeneralIntegralExpireRule == 0">
                   <div class="radio-cell mb20">
-                    <el-radio  v-model="ruleForm.integralExpireType" :label="2" @change="radioExpireType1">按年失效：</el-radio>
+                    <el-radio class="yearY"  v-model="ruleForm.integralExpireType" :label="2" @change="radioExpireType1">按年失效：</el-radio>
                     <label>每年获取的所有积分，在</label>
                     <el-select v-model="yearY" placeholder="请选择" class="selectwm">
                       <el-option v-for="n in yearList" :key="n.key" :label="n.value" :value="n.key"></el-option>
@@ -327,7 +327,7 @@
                     <label>日失效</label>
                   </div>
                   <div class="radio-cell mb20">
-                    <el-radio  v-model="ruleForm.integralExpireType" :label="3" @change="radioExpireType1">按月失效：</el-radio>
+                    <el-radio class="mouthM"  v-model="ruleForm.integralExpireType" :label="3" @change="radioExpireType1">按月失效：</el-radio>
                     <label>每月获取的所有积分，在</label>
                     <el-select v-model="mouthM" placeholder="请选择" class="selectwm">
                       <el-option  v-for="n in mouthList" :key="n.key" :label="n.value" :value="n.key"></el-option>
@@ -339,7 +339,7 @@
                     <label>日失效</label>
                   </div>
                   <div class="radio-cell">
-                    <el-radio  v-model="ruleForm.integralExpireType" :label="0" @change="radioExpireType1">按天失效：</el-radio>
+                    <el-radio class="integralGetEffectiveDays"  v-model="ruleForm.integralExpireType" :label="0" @change="radioExpireType1">按天失效：</el-radio>
                     <label>每天获取的所有积分，在获取之日起</label>
                     <el-input placeholder="请输入" style="width:115px" v-model="ruleForm.integralGetEffectiveDays" @keyup.native="formatInput($event)"></el-input>
                     <label>天后失效</label>
@@ -413,6 +413,7 @@ import { postRequest, postJson } from '@/api/api';
 import strLength from '@/common/js/strlen';
 import { log } from '@/utils/index.js';
 import wmMixins from './strategy.js';
+import { scrollToError } from '@/utils/validate';
 
 const timeStramp = {
   year: new Date().getFullYear(),
@@ -450,6 +451,7 @@ export default {
       return arr;
     }
     return {
+      scrollToError,
       yearYT: '', //按年失效 年
       yearMT: '', //按年失效 月
       yearDT: '', //按年失效 日
@@ -890,10 +892,12 @@ export default {
             if (!!data.channelList[i].openStatus && data.channelList[i].integralUseDiscountControl == 2) {
               if (!data.channelList[i].integralUseDiscountControlUpper || !data.channelList[i].integralUseDiscountControlLower) {
                 obj.flag = false;
+                this.scrollToError(this, `zk${i}`);
                 obj.text = '请填写折扣';
               }
               if (parseInt(data.channelList[i].integralUseDiscountControlUpper) > 10 || parseInt(data.channelList[i].integralUseDiscountControlLower) > 10 || Number(data.channelList[i].integralUseDiscountControlUpper) <= Number(data.channelList[i].integralUseDiscountControlLower)) {
                 obj.flag = false;
+                this.scrollToError(this, `zk${i}`);
                 obj.text = '折扣格式有误';
               }
             }
@@ -973,10 +977,12 @@ export default {
             }
             if (data.integralGetStatus == 1) {
               if (!Number(data.integralGet.fee)) {
+                this.scrollToError(this, 'integralGet');
                 showMsg.showmsg('获取规则中的消费金额不能为0', 'error');
                 return;
               }
               if (!Number(data.integralGet.integral)) {
+                this.scrollToError(this, 'integralGet');
                 showMsg.showmsg('获取规则中的获取积分不能为0', 'error');
                 return;
               }
@@ -986,13 +992,21 @@ export default {
               return;
             }
             if (data.userGeneralIntegralExpireRule == 0) {
+              if(data.integralExpireType == null) {
+                this.scrollToError(this, 'mouthM');
+                showMsg.showmsg('请选择积分失效规则','error')
+                return;
+              }
               if(data.integralExpireType ==3 && (this.mouthM == '' || this.mouthD == -1)) {
+                this.scrollToError(this, 'mouthM');
                 showMsg.showmsg('请选择按月失效规则','error')
                 return;
               }else if(data.integralExpireType ==2 && (this.yearY == '' || this.yearM == '' || this.yearD == -1 )) {
+                this.scrollToError(this, 'yearY');
                 showMsg.showmsg('请选择按年失效规则','error')
                 return;
               } else if (data.integralExpireType ==0  && !Number(data.integralGetEffectiveDays)) {
+                this.scrollToError(this, 'integralGetEffectiveDays');
                 showMsg.showmsg('请填写积分有效期','error')
                 return;
               }
@@ -1081,15 +1095,8 @@ export default {
               }
             });
           } else {
-            log('error submit!!');
-            setTimeout(() => {
-              var isError = document.getElementsByClassName("is-error");
-              if (isError[0].querySelector('input')) {
-                isError[0].querySelector('input').focus();
-              } else if (isError[0].querySelector('textarea')) {
-                isError[0].querySelector('textarea').focus();
-              }
-            }, 1)
+            this.scrollToError(this);
+            showMsg.showmsg('表单信息未填写完整','error')
             return false;
           }
         });

src/view/companyGroup/membershipSystem/editIntegralSytem.vue

@@ -85,7 +85,7 @@
                       <el-select
                       :disabled="opendisabled1"
                         size="small"
-                        class="fl w240"
+                        class="fl w240 valueWx"
                         @change="selectGoodsStoreWx"
                         v-if="item.channelRelationProType == 2"
                         v-model="valueWx"
@@ -101,7 +101,7 @@
                       </el-select>
 
                       <!-- 商品品类 -->
-                      <div v-if="item.channelRelationProType == 3" class="fl goods-cate">
+                      <div v-if="item.channelRelationProType == 3" class="fl goods-cate cateDataWx">
                         <goodsCate
                         :disabled="opendisabled1"
                           ref="selectGoodsCate"
@@ -114,7 +114,7 @@
                       <el-button
                       :disabled="opendisabled1"
                         style="width:202px"
-                        class="fl"
+                        class="fl goodsListWx"
                         v-if="item.channelRelationProType == 4"
                         @click="showGoodsDialog('wx')"
                       >已选{{ goodsListWx.length }}件商品</el-button>
@@ -122,10 +122,10 @@
 
                     <el-form-item label="折扣控制:" prop="region" class="margin-20">
                       <div class="radio-cell">
-                        <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEvent2()">所有折扣商品都适用</el-radio>
+                        <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEventn(2)">所有折扣商品都适用</el-radio>
                       </div>
                       <div class="radio-cell margin-20 padding-bottom-20">
-                        <el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
+                        <el-radio class="zk0" v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
                         <!-- <el-input @focus="inputFocus(item,'integralUseDiscountControlLower')"  @change="formatInputChange($event)" v-model="item.integralUseDiscountControlLower"></el-input> -->
                         <el-input-number
                           v-model="item.integralUseDiscountControlLower"
@@ -177,10 +177,10 @@
                     </el-form-item>
                     <el-form-item label="折扣控制:" prop="region" class="input-margin-b margin-20 padding-bottom-20">
                       <div class="radio-cell">
-                        <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEvent1()">所有折扣商品都适用</el-radio>
+                        <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEventn(1)">所有折扣商品都适用</el-radio>
                       </div>
                       <div class="radio-cell margin-20">
-                        <el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
+                        <el-radio class="zk1" v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
                         <el-input-number v-model="item.integralUseDiscountControlLower" placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1"></el-input-number>
                         <label>至</label>
                         <el-input-number v-model="item.integralUseDiscountControlUpper" placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1"></el-input-number>
@@ -197,7 +197,7 @@
                 <div>
                   <el-radio v-model="ruleForm.integralUseStatus" label="0" @change="radioEvent()">不支持抵现</el-radio>
                 </div>
-                <div class="margin-20">
+                <div class="margin-20 integralUse">
                   <el-radio v-model="ruleForm.integralUseStatus" label="1">每使用</el-radio>
                   <!-- <el-input @keyup.native="formatInputNum($event)" v-model="ruleForm.integralUse.integral"></el-input> -->
                   <el-input-number v-model="ruleForm.integralUse.integral" placeholder="请输入" :controls="false" step-strictly></el-input-number>
@@ -276,7 +276,7 @@ import strLength from '@/common/js/strlen';
 import { getRequest, postRequest, postJson } from '@/api/api';
 import { log } from '@/utils/index.js';
 import wmMixins from './strategy.js';
-
+import { scrollToError } from '@/utils/validate';
 const timeStramp = {
   year: new Date().getFullYear(),
   month: new Date().getMonth(),
@@ -288,6 +288,7 @@ export default {
   mixins: [wmMixins],
   data() {
     return {
+      scrollToError,
       opendisabled3: false,
       opendisabled1: false,
       opendisabled9: false,
@@ -483,15 +484,9 @@ export default {
     that.getLoginInfo();
   },
   methods: {
-    radioEvent2() {
-      // console.log(this.ruleForm.channelType, 78787);
-      this.ruleForm.channelList[0].integralUseDiscountControlLower = undefined;
-      this.ruleForm.channelList[0].integralUseDiscountControlUpper = undefined;
-    },
-    radioEvent1() {
-      // console.log(this.ruleForm.channelType, 78787);
-      this.ruleForm.channelList[1].integralUseDiscountControlLower = undefined;
-      this.ruleForm.channelList[1].integralUseDiscountControlUpper = undefined;
+    radioEventn(n) {
+      this.ruleForm.channelList[n].integralUseDiscountControlLower = undefined;
+      this.ruleForm.channelList[n].integralUseDiscountControlUpper = undefined;
     },
     radioEvent() {
       this.ruleForm.integralUse.fee = undefined;
@@ -512,19 +507,23 @@ export default {
             if (data.channelList[i].integralUseDiscountControl == 2) {
               if (!data.channelList[i].integralUseDiscountControlUpper || !data.channelList[i].integralUseDiscountControlLower) {
                 obj.flag = false;
+                this.scrollToError(this, `zk${i}`);
                 obj.text = '请填写折扣';
               }
               if (parseInt(data.channelList[i].integralUseDiscountControlUpper) > 10 || parseInt(data.channelList[i].integralUseDiscountControlLower) > 10 || Number(data.channelList[i].integralUseDiscountControlUpper) <= Number(data.channelList[i].integralUseDiscountControlLower)) {
                 obj.flag = false;
+                this.scrollToError(this, `zk${i}`);
                 obj.text = '折扣格式有误';
               }
             }
             if (data.channelList[i].channelType == 1 && !data.channelList[i].enterpriseRelationIdArr.length) {
               obj.flag = false;
+              this.scrollToError(this, `zk${i}`);
               obj.text = '请选择商户';
             }
             if (data.channelList[i].channelType == 9 && !data.channelList[i].enterpriseRelationIdArr.length) {
               obj.flag = false;
+              this.scrollToError(this, `zk${i}`);
               obj.text = '请选择商户';
             }
             if (data.channelList[i].channelType == 9 && this.isJinHua) {
@@ -575,15 +574,18 @@ export default {
             // }
             let flag = !data.integralUse.fee || String(data.integralUse.integral) == '';
             if (data.integralUseStatus == 1 && flag) {
+              this.scrollToError(this, 'integralUse');
               that.$message.error('请填写抵现规则');
               return;
             }
             if (data.integralUseStatus == 1) {
               if (!Number(data.integralUse.fee)) {
+                this.scrollToError(this, 'integralUse');
                 showMsg.showmsg('抵现规则中的抵现金额不能为0', 'error');
                 return;
               }
               if (!Number(data.integralUse.integral)) {
+                this.scrollToError(this, 'integralUse');
                 showMsg.showmsg('抵现规则中的使用积分不能为0', 'error');
                 return;
               }
@@ -635,16 +637,19 @@ export default {
                     // 微信商城
                     // 适用商品
                     if (item.channelRelationProType == 2 && this.valueWx.length < 1) {
+                      this.scrollToError(this, 'valueWx');
                       // 商品品牌
                       showMsg.showmsg('请选择商品品牌', 'error');
                       return (saveBool = false);
                     }
                     if (item.channelRelationProType == 3 && this.cateDataWx.length < 1) {
+                      this.scrollToError(this, 'cateDataWx');
                       // 商品品类
                       showMsg.showmsg('请选择商品品类', 'error');
                       return (saveBool = false);
                     }
                     if (item.channelRelationProType == 4 && this.goodsListWx.length < 1) {
+                      this.scrollToError(this, 'goodsListWx');
                       // 单件商品
                       showMsg.showmsg('请选择单件商品', 'error');
                       return (saveBool = false);
@@ -653,6 +658,7 @@ export default {
                 });
                 // 自定义人群
                 if (data.useCrowd == 2 && this.selectCount < 1) {
+                  this.scrollToError(this, 'selectCount');
                   showMsg.showmsg('请选择人群定向', 'error');
                   return;
                 }
@@ -687,15 +693,8 @@ export default {
               }
             })
           } else {
-            log('error submit!!');
-            setTimeout(() => {
-              var isError = document.getElementsByClassName("is-error");
-              if (isError[0].querySelector('input')) {
-                isError[0].querySelector('input').focus();
-              } else if (isError[0].querySelector('textarea')) {
-                isError[0].querySelector('textarea').focus();
-              }
-            }, 1)
+            this.scrollToError(this);
+            showMsg.showmsg('表单信息未填写完整','error')
             return false;
           }
         });

src/view/companyGroup/membershipSystem/editPointSystem.vue

@@ -94,7 +94,7 @@
                         <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEventN(0)">所有折扣商品都适用</el-radio>
                       </div>
                       <div class="radio-cell margin-20">
-                        <el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
+                        <el-radio class="zk0" v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
                         <!-- <el-input v-model="item.integralUseDiscountControlLower" @focus="inputFocus(item)"  @keyup.native="formatInput($event)"></el-input> -->
                         <el-input-number
                           v-model="item.integralUseDiscountControlLower"
@@ -204,7 +204,7 @@
                         <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEventN(1)">所有折扣商品都适用</el-radio>
                       </div>
                       <div class="radio-cell margin-20">
-                        <el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
+                        <el-radio class="zk1" v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
                         <!-- <el-input v-model="item.integralUseDiscountControlLower" @focus="inputFocus(item)"  @keyup.native="formatInput($event)"></el-input> -->
                         <el-input-number
                           v-model="item.integralUseDiscountControlLower"
@@ -307,7 +307,7 @@
                         <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEventN(2)">所有折扣商品都适用</el-radio>
                       </div>
                       <div class="radio-cell margin-20">
-                        <el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
+                        <el-radio class="zk2" v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
                         <el-input-number v-model="item.integralUseDiscountControlLower" placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1"></el-input-number>
                         <label>至</label>
                         <el-input-number v-model="item.integralUseDiscountControlUpper" placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1"></el-input-number>
@@ -334,7 +334,7 @@
                         <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEventN(3)">所有折扣商品都适用</el-radio>
                       </div>
                       <div class="radio-cell margin-20">
-                        <el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
+                        <el-radio class="zk3" v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
                         <el-input-number v-model="item.integralUseDiscountControlLower" placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1"></el-input-number>
                         <label>至</label>
                         <el-input-number v-model="item.integralUseDiscountControlUpper" placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1"></el-input-number>
@@ -361,7 +361,7 @@
                         <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEventN(4)">所有折扣商品都适用</el-radio>
                       </div>
                       <div class="radio-cell margin-20">
-                        <el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
+                        <el-radio class="zk4" v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
                         <el-input-number v-model="item.integralUseDiscountControlLower" placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1"></el-input-number>
                         <label>至</label>
                         <el-input-number v-model="item.integralUseDiscountControlUpper" placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1"></el-input-number>
@@ -388,7 +388,7 @@
                         <el-radio v-model="item.integralUseDiscountControl" label="1" @change="radioEventN(5)">所有折扣商品都适用</el-radio>
                       </div>
                       <div class="radio-cell margin-20">
-                        <el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
+                        <el-radio class="zk5" v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
                         <el-input-number v-model="item.integralUseDiscountControlLower" placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1"></el-input-number>
                         <label>至</label>
                         <el-input-number v-model="item.integralUseDiscountControlUpper" placeholder="请输入" :precision="2" :controls="false" :max="10.0" :min="1"></el-input-number>
@@ -611,6 +611,7 @@ import { postRequest, postJson } from '@/api/api';
 import strLength from '@/common/js/strlen';
 import { log } from '@/utils/index.js';
 import wmMixins from './strategy.js';
+import { scrollToError } from '@/utils/validate';
 
 const timeStramp = {
   year: new Date().getFullYear(),
@@ -648,6 +649,7 @@ export default {
       return arr;
     }
     return {
+      scrollToError,
       opendisabled3: false,
       opendisabled1: false,
       opendisabled9: false,
@@ -987,10 +989,12 @@ export default {
             if (data.channelList[i].integralUseDiscountControl == 2) {
               if (!data.channelList[i].integralUseDiscountControlUpper || !data.channelList[i].integralUseDiscountControlLower) {
                 obj.flag = false;
+                this.scrollToError(this, `zk${i}`);
                 obj.text = '请填写折扣';
               }
               if (parseInt(data.channelList[i].integralUseDiscountControlUpper) > 10 || parseInt(data.channelList[i].integralUseDiscountControlLower) > 10 || Number(data.channelList[i].integralUseDiscountControlUpper) <= Number(data.channelList[i].integralUseDiscountControlLower)) {
                 obj.flag = false;
+                this.scrollToError(this, `zk${i}`);
                 obj.text = '折扣格式有误';
               }
             }
@@ -1049,15 +1053,18 @@ export default {
             }
             let flag = !data.integralGet.fee || String(data.integralGet.integral) == '';
             if (data.integralGetStatus == 1 && flag) {
+              this.scrollToError(this, 'integralGet');
               showMsg.showmsg('请填写获取规则', 'error');
               return;
             }
             if (data.integralGetStatus == 1) {
               if (!Number(data.integralGet.fee)) {
+                this.scrollToError(this, 'integralGet');
                 showMsg.showmsg('获取规则中的消费金额不能为0', 'error');
                 return;
               }
               if (!Number(data.integralGet.integral)) {
+                this.scrollToError(this, 'integralGet');
                 showMsg.showmsg('获取规则中的获取积分不能为0', 'error');
                 return;
               }
@@ -1068,12 +1075,15 @@ export default {
             }
             if (data.userGeneralIntegralExpireRule == 0) {
               if(data.integralExpireType ==3 && (this.mouthM == '' || this.mouthD == -1)) {
+                this.scrollToError(this, 'mouthM');
                 showMsg.showmsg('请选择按月失效规则','error')
                 return;
               }else if(data.integralExpireType ==2 && (this.yearY == '' || this.yearM == '' || this.yearD == -1 )) {
+                this.scrollToError(this, 'yearY');
                 showMsg.showmsg('请选择按年失效规则','error')
                 return;
               } else if (data.integralExpireType ==0  && !Number(data.integralGetEffectiveDays)) {
+                this.scrollToError(this, 'integralGetEffectiveDays');
                 showMsg.showmsg('请填写积分有效期','error')
                 return;
               }
@@ -1158,15 +1168,8 @@ export default {
               }
             });
           } else {
-            log('error submit!!');
-            setTimeout(() => {
-              var isError = document.getElementsByClassName("is-error");
-              if (isError[0].querySelector('input')) {
-                isError[0].querySelector('input').focus();
-              } else if (isError[0].querySelector('textarea')) {
-                isError[0].querySelector('textarea').focus();
-              }
-            }, 1)
+            this.scrollToError(this);
+            showMsg.showmsg('表单信息未填写完整','error')
             return false;
           }
         });