update: 自动关闭更改样式

src/views/pop/form.vue

@@ -99,13 +99,11 @@
               <el-form-item :prop="`autoCloseFlag_${elIndex}`">
                 <template slot="label">
                   <el-tooltip class="item" effect="dark" content="自动关闭开启后，弹窗会在倒计时后自动关闭" placement="top">
-                    <span>停留时间：</span>
+                    <span class="tooltip-icon cursor">自动关闭：</span>
                   </el-tooltip>
                 </template>
-                <el-radio-group v-model="pop.autoCloseFlag" class="block_radio" :disabled="pop.activeStatus == 2">
-                  <el-radio :label="0">需要由用户手动关闭，不支持自动关闭</el-radio>
-                  <el-radio :label="1">设置<el-input-number v-model="pop.autoCloseDelay" controls-position="right" :min="1" :max="10" :disabled="pop.activeStatus == 2" style="width:90px;margin:0 10px 0 9px;"></el-input-number>秒 后自动关闭</el-radio>
-                </el-radio-group>
+                <el-switch v-model="pop.autoCloseFlag" :active-value="1" :inactive-value="0"></el-switch>
+                <el-form-item v-if="pop.autoCloseFlag"> 设置<el-input-number v-model="pop.autoCloseDelay" @change="resetField(`autoCloseFlag_${elIndex}`)" controls-position="right" :min="1" :max="10" :disabled="pop.activeStatus == 2" style="width:90px;margin:0 10px 0 9px;"></el-input-number>秒 后自动关闭 </el-form-item>
               </el-form-item>
             </div>
             <div class="preview">
@@ -499,14 +497,18 @@ export default {
           validator: (rule, value, callback) => {
             const index = Number(rule.field.split('_')[1]);
             const item = this.group.popupList[index];
-            const startTime = this.group.dateTime[0].getTime();
-            const endTime = this.group.dateTime[1].getTime();
-            const popStartTime = item.dateTime[0].getTime();
-            const popEndTime = item.dateTime[1].getTime();
-            if (!item.dateTime) {
-              callback(new Error('请选择投放时间'));
-            } else if (popStartTime < startTime || popEndTime > endTime) {
-              callback(new Error('弹窗投放时间需在计划时间内'));
+            if (this.group.dateTime[0] && this.group.dateTime[1]) {
+              const startTime = this.group.dateTime[0].getTime();
+              const endTime = this.group.dateTime[1].getTime();
+              const popStartTime = item.dateTime[0].getTime();
+              const popEndTime = item.dateTime[1].getTime();
+              if (!item.dateTime) {
+                callback(new Error('请选择投放时间'));
+              } else if (popStartTime < startTime || popEndTime > endTime) {
+                callback(new Error('弹窗投放时间需在计划时间内'));
+              }
+            } else {
+              callback(new Error('请先选择计划时间'));
             }
             callback();
           },
@@ -528,19 +530,19 @@ export default {
           trigger: 'change'
         }
       ];
-      // 停留时间
+      // 自动关闭
       this.rules[`autoCloseFlag_${index}`] = [
         {
           required: true,
           validator: (rule, value, callback) => {
             const index = Number(rule.field.split('_')[1]);
             const item = this.group.popupList[index];
-            if (item.autoCloseFlag === '1' && !item.autoCloseDelay) {
-              callback(new Error('请输入停留时间'));
+            if (item.autoCloseFlag === 1 && !item.autoCloseDelay) {
+              callback(new Error('请输入自动关闭时间'));
             }
             callback();
           },
-          trigger: 'change'
+          trigger: 'blur'
         }
       ];
       // let sortNum = 0;