feat: 客服异常预警 - 预警提示语显示逻辑

project/src/components/customerAlerts/index.vue

 <template>
   <div v-loading="loading" class="customerAlerts-wrap">
-    <div class="self-hint">
+    <div v-if="tips.isShow && tips.msg" class="self-hint" style="margin-bottom:10px;">
       <i class="el-icon-message-solid" />
       <div>
-        <p>客服绑定投放账号近1小时内消耗金额小于300元时不予预警</p>
+        <p>{{ tips.msg }}</p>
       </div>
     </div>
-    <div style="margin-top:10px;" class="screenBox">
+    <div class="screenBox">
       <el-button type="primary" size="mini" @click="onClickCreateWarnBtn">新建预警</el-button>
     </div>
     <el-table :height="height" :data="list" tooltip-effect="dark" style="width: 100%;margin-top:10px">
 
       warnDialogVisible: false, // 控制是否显示“新建预警”、“编辑预警”弹框
       currentWarnConfId: '', // 当前预警规则id
+
+      tips: { // 控制是否显示提示语
+        isShow: false,
+        msg: '',
+      },
     }
   },
   created () {
           this.list = res.rst.data;
           this.pagination.total = res.rst.pageInfo.total;
           this.pagination.pages = res.rst.pageInfo.pages;
+          if (res.rst.extra) {
+            this.tips.isShow = res.rst.extra.notice == 1 ? true : false
+            this.tips.msg = res.rst.extra.message || ''
+          }
         } else if (res.errno != 4002) {
           this.$message.warning(res.err)
           this.list = [];