feat: 客服异常预警 - 预警间隔

project/src/components/customerAlerts/dialog/warnDialog.vue

@@ -74,6 +74,22 @@
           </div>
         </div>
       </div>
+      <!-- 预警间隔 -->
+      <div class="form-item">
+        <span class="lable required">预警间隔:</span>
+        <!--  -->
+        <div class="interval-wrap">
+          <el-input
+            v-model.trim="form.time_interval"
+            size="mini"
+            placeholder="请输入"
+            clearable
+            @input="onInputTimeInterval"
+            @change="onChangeTimeInterval"
+          />
+          <span class="text">分钟</span>
+        </div>
+      </div>
     </div>
     <div slot="footer" class="dialog-footer">
       <el-button size="mini" @click="handleCancel" :disabled="loading">取 消</el-button>
@@ -124,7 +140,8 @@ export default {
             check_type: 1,
             num: '',
           }
-        ]
+        ],
+        time_interval: '', // 预警间隔
       }
     }
   },
@@ -220,7 +237,7 @@ export default {
     // 执行表单校验
     handleFormValidate() {
       return new Promise((resolve, reject) => {
-        const { monitor_user_list, notice_type, warnUserList, warnGroup, rules } = this.form
+        const { monitor_user_list, notice_type, warnUserList, warnGroup, rules, time_interval } = this.form
         const isHasNullRules = rules.some(rule => !rule.minute || rule.num === '')
 
         if (!monitor_user_list || !monitor_user_list.length) {
@@ -235,6 +252,12 @@ export default {
         } else if (isHasNullRules) {
           this.$message.warning('请完善"预警规则"')
           reject('表单校验未通过')
+        } else if (time_interval !== '' && Number(time_interval) === 0) {
+          this.$message.warning('预警间隔时间不能为0')
+          reject('表单校验未通过')
+        } else if (!time_interval) {
+          this.$message.warning('请输入预警间隔时间')
+          reject('表单校验未通过')
         } else {
           resolve('表单校验通过')
         }
@@ -247,6 +270,7 @@ export default {
         notice_type: this.form.notice_type,
         sys_group_id: this.sys_group_id,
         content: JSON.stringify(this.form.rules),
+        time_interval: Number(this.form.time_interval),
         conf_id: this.isEdit ? this.confId : '',
       }
 
@@ -291,6 +315,7 @@ export default {
           }
 
           this.form.rules = [...detailInfo.content]
+          this.form.time_interval = detailInfo.time_interval
         } else if (res.errno != 4002) {
           this.$message.warning(res.err || '操作失败')
         }
@@ -314,6 +339,7 @@ export default {
           num: '',
         }
       ]
+      this.form.time_interval = ''
     },
     // 监听输入"规则 - 分钟"
     onInputMinute(inputVal, idx) {
@@ -354,6 +380,16 @@ export default {
         corpid: item.corpid,
       }))
     },
+    // 监听输入“预警间隔”
+    onInputTimeInterval(inputVal) {
+      this.form.time_interval = getIntegerNumber(inputVal)
+    },
+    onChangeTimeInterval(inputVal) {
+      if (inputVal !== '' && Number(inputVal) === 0) {
+        this.form.time_interval = ''
+        this.$message.warning('预警间隔时间不能为0')
+      }
+    },
   },
 };
 </script>
@@ -439,6 +475,20 @@ export default {
           }
         }
       }
+      .interval-wrap {
+        display: flex;
+        align-items: center;
+        .el-input {
+          width: 90px;
+          /deep/ .el-input__inner {
+            padding: 0 24px 0 8px;
+          }
+        }
+        .text {
+          margin-left: 6px;
+          font-size: 13px;
+        }
+      }
     }
   }
   .dialog-footer {

project/src/components/customerAlerts/index.vue

@@ -41,6 +41,12 @@
           <span v-else> - </span>
         </template>
       </el-table-column>
+      <el-table-column label="预警间隔" prop="time_interval" min-width="120" align="center">
+        <template slot-scope="{ row }">
+          <span v-if="row.time_interval || row.time_interval == 0">{{ row.time_interval }}分钟</span>
+          <span v-else> - </span>
+        </template>
+      </el-table-column>
       <el-table-column label="添加时间" prop="create_time" min-width="170" align="center" />
       <el-table-column label="操作" min-width="160" align="center" fixed="right">
         <template slot-scope="{ row }">