From 41e67f13d87396e8d5b60db1eabeadb2178fbcd0 Mon Sep 17 00:00:00 2001
From: ljlong_2630 <ljlong_2630@yeah.net>
Date: Mon, 18 Sep 2023 13:41:45 +0800
Subject: [PATCH] =?UTF-8?q?=E5=91=8A=E8=AD=A6=E7=AD=96=E7=95=A5=E9=85=8D?=
 =?UTF-8?q?=E7=BD=AE=E4=BF=AE=E6=94=B9=E6=B7=BB=E5=8A=A0=E7=BA=A7=E5=88=AB?=
 =?UTF-8?q?=E5=90=8D=E7=A7=B0=E9=BB=98=E8=AE=A4=E5=80=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/model/alertmodel.js                |  10 +
 src/assets/styles/self-defined.scss        |   5 +-
 src/views/model/alert/deviceparamalert.vue |  79 ++++++--
 src/views/model/alert/model.vue            | 222 ++++++++++++++++++---
 src/views/model/alert/policy.vue           | 183 +++++++++--------
 5 files changed, 373 insertions(+), 126 deletions(-)

diff --git a/src/api/model/alertmodel.js b/src/api/model/alertmodel.js
index f3a0872..121e040 100644
--- a/src/api/model/alertmodel.js
+++ b/src/api/model/alertmodel.js
@@ -50,4 +50,14 @@ export function exportModel(query) {
     method: 'get',
     params: query
   })
+}
+
+
+// 查询告警模版列表
+export function listModelEnabledNoPage(query) {
+  return request({
+    url: '/model/dcBusiAlertModel/listEnabledNoPage',
+    method: 'get',
+    params: query
+  })
 }
\ No newline at end of file
diff --git a/src/assets/styles/self-defined.scss b/src/assets/styles/self-defined.scss
index ad1eea6..ad26f99 100644
--- a/src/assets/styles/self-defined.scss
+++ b/src/assets/styles/self-defined.scss
@@ -34,7 +34,7 @@
 }
 
 .textaligncenter{
-    text-align:center;
+    text-align: center!important;
 }
 .textalignleft{
     text-align:left;
@@ -195,4 +195,5 @@
     .el-input__wrapper {
         box-shadow: 0 0 0 1px var(--el-color-danger) inset;
     }
-}
\ No newline at end of file
+}
+
diff --git a/src/views/model/alert/deviceparamalert.vue b/src/views/model/alert/deviceparamalert.vue
index 6456d04..524c5c5 100644
--- a/src/views/model/alert/deviceparamalert.vue
+++ b/src/views/model/alert/deviceparamalert.vue
@@ -185,7 +185,7 @@
           </el-col>
           <el-col :span="12" v-show="methodIdsVisiable">
             <el-form-item label="告警方式" prop="methodIds">
-              <el-select v-model="formPolicy.methodIds" placeholder="请选择告警方式">
+              <el-select v-model="formPolicy.methodIds" multiple placeholder="请选择告警方式">
                 <el-option
                   v-for="item in methodList"
                   :key="item.id"
@@ -195,6 +195,23 @@
               </el-select>
             </el-form-item>
           </el-col>
+          <el-col :span="12" v-show="levelVisiable">
+            <el-form-item label="级别" prop="level">
+              <el-select v-model="formPolicy.level" placeholder="请选择告警级别" @change="levelChange">
+                <el-option
+                  v-for="dict in dc_alert_level"
+                  :key="parseInt(dict.value)"
+                  :label="dict.label"
+                  :value="parseInt(dict.value)"
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12" v-show="nameVisiable">
+            <el-form-item label="名称" prop="name">
+                <el-input disabled v-model="formPolicy.name" placeholder="请选择告警级别"/>
+            </el-form-item>
+          </el-col>
           <el-col :span="12" v-show="sortIdVisiable">
             <el-form-item label="排序"  prop="sortId">
               <el-input-number v-model="formPolicy.sortId" :min="1" :max="1000" />
@@ -224,6 +241,7 @@
               </el-select>
             </el-form-item>
           </el-col>
+          
         </el-row>
         <el-row style="margin-bottom: 10px;" v-show="tableVisiable">
           <el-col>
@@ -252,7 +270,7 @@
                 <el-table-column label="排序" align="center" prop="sort"/>
                 <el-table-column label="告警方式" align="center" prop="methodIds" >
                   <template #default="scope">
-                    <el-form-item :class="{'is-error': isInvalid(scope.row.methodIds,scope.row)}" label-width="0px" >
+                    <el-form-item label-width="0px" >
                       <el-select v-model="scope.row.methodIds" multiple @change="methodIdsChange" placeholder="请选择告警方式">
                         <el-option
                           v-for="item in methodList"
@@ -309,12 +327,12 @@
 import { getDeviceParamsAlertInfo,delAlert, addAlert, updateAlert } from "@/api/model/alert";
 import { listDeviceNoPage } from "@/api/model/device";
 import { listMethod } from "@/api/model/method";
-import { listModel } from "@/api/model/alertmodel";
+import { listModelEnabledNoPage } from "@/api/model/alertmodel";
 import { ElMessageBox } from 'element-plus';
 import {listPolicyInfo,updatePolicy,updatePolicyBatch,addPolicy,addPolicyBatch,listAlertParamSelect } from "@/api/model/policy";
 const { proxy } = getCurrentInstance();
 const router = useRouter();
-const { operator_sign,dc_param_value_type } = proxy.useDict('operator_sign','dc_param_value_type');
+const { operator_sign,dc_param_value_type,dc_alert_level } = proxy.useDict('operator_sign','dc_param_value_type','dc_alert_level');
 const alertList = ref([]);
 const open = ref(false);
 const openPolicy = ref(false);
@@ -347,6 +365,9 @@ const rowPolicySelected = ref([]);
 const colorValue = ref({});
 const tableVisiable = ref(false);
 const dialogWidth = ref('1600px');
+const queryModel = ref({});
+const levelVisiable = ref(false);
+const nameVisiable = ref(false);
 const alert_value = ref([
   {label: '1', value: true, elTagType: 'default', elTagClass: null}, 
   {label: '0', value: false, elTagType: 'default', elTagClass: null}
@@ -519,7 +540,6 @@ function handlePolicy(row) {
   selectedRows.value=[];
   deletePolicyRows.value=[];
   addPolicyRows.value=[];
-  deletePolicyRows.value=[];
   logicCode.value = row.logicCode;
   formPolicy.value.enabled = row.enabled;
   if(row.logicCode=='A'){
@@ -532,6 +552,8 @@ function handlePolicy(row) {
     sortIdVisiable.value=false;
     methodIdsVisiable.value=true;
     tableVisiable.value=false;
+    levelVisiable.value = true;
+    nameVisiable.value = true;
   }else if(row.logicCode == 'B'){
     dialogWidth.value = '1600px';
     getModelList(row);
@@ -542,6 +564,8 @@ function handlePolicy(row) {
     sortIdVisiable.value=false;
     methodIdsVisiable.value=false;
     tableVisiable.value=true;
+    levelVisiable.value = false;
+    nameVisiable.value = false;
   }else if(row.logicCode == 'C'){
     ElMessageBox.alert('目前该告警逻辑没有实现', '提示', {
       confirmButtonText: '确定',
@@ -671,6 +695,7 @@ function submitFormPolicy() {
             getList();
           });
         }else if(logicCode.value == 'A'){
+          formPolicy.value.methodIds = formPolicy.value.methodIds?.join(',');
           updatePolicy(formPolicy.value).then(response => {
             proxy.$modal.msgSuccess("新增成功");
             openPolicy.value = false;
@@ -694,6 +719,7 @@ function submitFormPolicy() {
             getList();
           });
         }else if(logicCode.value == 'A'){
+          formPolicy.value.methodIds = formPolicy.value.methodIds?.join(',');
           addPolicy(formPolicy.value).then(response => {
             proxy.$modal.msgSuccess("新增成功");
             openPolicy.value = false;
@@ -713,20 +739,32 @@ function cancelPolicy() {
 //开关量初始化策略表单
 function getModelListSwitch(row){
   queryPolicy.value.alertId = row.id;
+  queryModel.value.logicCode = row.logicCode;
+  queryModel.value.paramType = row.paramType;
   listPolicyInfo(queryPolicy.value).then(response=>{
     //修改界面初始化
     if(response.data && response.data.length>0){
       formPolicy.value.statusValue = response.data[0].statusValue;
       formPolicy.value.statusType = response.data[0].statusType;
-      formPolicy.value.methodIds = response.data[0].methodIds?.split(',').map(Number);
+      formPolicy.value.methodIds = response.data[0].methodIds==null||response.data[0].methodIds==''?null:response.data[0].methodIds.split(',').map(Number);
       formPolicy.value.boolValue = response.data[0].boolValue;
+      formPolicy.value.level = response.data[0].level;
+      formPolicy.value.name = response.data[0].name;
       formPolicy.value.alertId = row.id;
       formPolicy.value.deviceId = row.deviceUuid;
+      formPolicy.value.alertModelId = response.data[0].alertModelId;
       formPolicy.value.id = response.data[0].id;
     //新增界面初始化
     }else{
       formPolicy.value.alertId = row.id;
       formPolicy.value.deviceId = row.deviceUuid;
+      listModelEnabledNoPage(queryModel.value).then(response => {
+        if(response.data && response.data.length>0){
+          formPolicy.value.level = response.data[0].level;
+          formPolicy.value.name = response.data[0].name;
+          formPolicy.value.alertModelId = response.data[0].id;
+        }
+      });
     }
   });
 }
@@ -736,8 +774,10 @@ function getModelListSwitch(row){
 function getModelList(row){
   queryPolicy.value.alertId = row.id;
   queryPolicy.value.flagEnabled = true;
-  listModel().then(response => {
-    modelList.value = response.rows;
+  queryModel.value.logicCode = row.logicCode;
+  queryModel.value.paramType = row.paramType;
+  listModelEnabledNoPage(queryModel.value).then(response => {
+    modelList.value = response.data;
     formPolicy.value.alertId = row.id;
     formPolicy.value.deviceId = row.deviceUuid;
     proxy.$refs.policyTable.clearSelection();
@@ -765,7 +805,7 @@ function getModelList(row){
               element.policyId = item.id;
               element.statusValue = item.statusValue;
               element.statusType = item.statusType;
-              element.methodIds = item.methodIds?.split(',').map(Number);
+              element.methodIds = item.methodIds==null||item.methodIds==''?null:item.methodIds.split(',').map(Number);
               element.operator = item.operator;
               element.sort = item.sortId;
               element.id = item.alertModelId;
@@ -942,9 +982,9 @@ function judgeIfRightValue(){
       if(!handleValueChangeSub(item)){
         flag = false;
       };
-      if(item.value === '' || item.methodIds.length === 0){
-        flag = false;
-      }
+      // if(item.value === '' || item.methodIds == null || item.methodIds.length === 0){
+      //   flag = false;
+      // }
     })
   }
   return flag;
@@ -984,9 +1024,9 @@ const validateCell = (data) => {
     } else if (typeof data.value === 'boolean') {
       return data.value !== undefined && data.value !== null;
     } else if (Array.isArray(data.value)) {
-      return data.value !== [];
+      return data.value.lenght == 0;
     } else if (typeof data.value === 'object') {
-      return data.value !== {};
+      return data.value.lenght == 0;
     } else {
       return data.value !== undefined && data.value !== null;
     }
@@ -1030,6 +1070,17 @@ function changeEnabled(row){
   updateAlert(param);
 }
 
+function levelChange(value){
+  if(logicCode.value == 'A'){
+    dc_alert_level.value.forEach(item=>{
+      if(item.value == String(value)){
+        formPolicy.value.name = item.label
+      }
+    })
+  }
+  
+}
+
 
 getList();
 
diff --git a/src/views/model/alert/model.vue b/src/views/model/alert/model.vue
index bd39ada..880d5b6 100644
--- a/src/views/model/alert/model.vue
+++ b/src/views/model/alert/model.vue
@@ -1,8 +1,8 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="120px">
-      <el-form-item label="参数据类型" prop="paramType">
-        <el-select v-model="queryParams.paramType" placeholder="请选择参数据类型" clearable>
+      <el-form-item label="参数数据类型" prop="paramType">
+        <el-select v-model="queryParams.paramType" placeholder="请选择参数数据类型" clearable>
           <el-option
             v-for="dict in dc_param_value_type"
             :key="dict.value"
@@ -30,12 +30,14 @@
         </el-select>
       </el-form-item>
       <el-form-item label="级别" prop="level">
-        <el-input
-          v-model="queryParams.level"
-          placeholder="请输入级别"
-          clearable
-          @keyup.enter="handleQuery"
-        />
+        <el-select v-model="form.level" placeholder="请选择告警级别">
+          <el-option
+            v-for="dict in dc_alert_level"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
       </el-form-item>
       <el-form-item label="运算符" prop="operator">
         <el-select v-model="queryParams.operator" placeholder="请选择运算符" clearable>
@@ -104,7 +106,7 @@
     <el-table ref="modelTable" v-loading="loading" :data="modelList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column label="主键" align="center" prop="id" />
-      <el-table-column label="参数据类型" align="center" prop="paramType" >
+      <el-table-column label="参数数据类型" align="center" prop="paramType" >
         <template #default="scope">
           <dict-tag :options="dc_param_value_type" :value="scope.row.paramType"/>
         </template>
@@ -115,7 +117,11 @@
           <dict-tag :options="flagEnabledTable" :value="scope.row.flagEnabled"/>
         </template>
       </el-table-column>
-      <el-table-column label="级别" align="center" prop="level" />
+      <el-table-column label="级别" align="center" prop="level" >
+        <template #default="scope">
+          <dict-tag :options="dc_alert_level" :value="scope.row.level"/>
+        </template>
+      </el-table-column>
       <el-table-column label="排序" align="center" prop="sort" />
       <el-table-column label="运算符" align="center" prop="operator" >
         <template #default="scope">
@@ -150,11 +156,11 @@
 
     <!-- 添加或修改告警模版对话框 -->
     <el-dialog :title="title" v-model="open" width="500px" append-to-body>
-      <el-form ref="modelRef" :model="form" :rules="rules" label-width="120px">
+      <el-form ref="modelRef" :model="form" :rules="getRule" label-width="120px">
         <el-row>  
           <el-col :span="12">
-            <el-form-item label="参数据类型" prop="paramType">
-              <el-select v-model="form.paramType" placeholder="请选择参数据类型">
+            <el-form-item label="参数数据类型" prop="paramType">
+              <el-select v-model="form.paramType" placeholder="请选择参数数据类型" @change="paramTypeChange">
                 <el-option
                   v-for="dict in dc_param_value_type"
                   :key="dict.value"
@@ -164,24 +170,31 @@
               </el-select>
             </el-form-item>
           </el-col>
-          <el-col :span="12">
+          <el-col :span="12" v-show="codeVisiable">
             <el-form-item label="代码" prop="code">
               <el-input v-model="form.code" placeholder="请输入代码" />
             </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="级别" prop="level">
-              <el-input v-model="form.level" placeholder="请输入级别" />
+              <el-select v-model="form.level" placeholder="请选择告警级别" ref="selectBlurLevel" @change="levelChange"  @blur="handleBlurLevel">
+                <el-option
+                  v-for="dict in dc_alert_level"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="parseInt(dict.value)"
+                />
+              </el-select>
             </el-form-item>
           </el-col>
-          <el-col :span="12">
-            <el-form-item label="排序" prop="sort">
-              <el-input v-model="form.sort" placeholder="请输入级别" />
+          <el-col :span="12" v-show="sortVisiable">
+            <el-form-item label="排序" prop="sort" >
+              <el-input v-model="form.sort" placeholder="请输入排序" />
             </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="是否有效" prop="flagEnabled">
-              <el-select v-model="form.flagEnabled" placeholder="请选择是否有效">
+              <el-select v-model="form.flagEnabled" placeholder="请选择是否有效" ref="selectFlagEnabled" @blur="handleBlurFlagEnabled">
                 <el-option
                   v-for="dict in flagEnabled"
                   :key="dict.value"
@@ -193,7 +206,7 @@
           </el-col>
           <el-col :span="12">
             <el-form-item label="运算符" prop="operator">
-              <el-select v-model="form.operator" placeholder="请选择运算符">
+              <el-select v-model="form.operator" :disabled="operatorDisabled" placeholder="请选择运算符">
                 <el-option
                   v-for="dict in operator_sign"
                   :key="dict.value"
@@ -208,11 +221,23 @@
               <el-input v-model="form.name" placeholder="请输入名称" />
             </el-form-item>
           </el-col>
-          <el-col :span="12">
+          <el-col :span="12" v-show="valueFloatVisiable">
             <el-form-item label="值" prop="value">
               <el-input v-model="form.value" placeholder="请输入值"/>
             </el-form-item>
           </el-col>
+          <el-col :span="12" v-show="valueBoolVisiable">
+            <el-form-item label="值" prop="value">
+              <el-select v-model="form.value" placeholder="请选择值">
+                <el-option
+                  v-for="dict in alert_value"
+                  :key="dict.label"
+                  :label="dict.label"
+                  :value="parseFloat(dict.label)"
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
         </el-row>
       </el-form>
       <template #footer>
@@ -228,10 +253,10 @@
   @import "@/assets/styles/self-defined.scss";
 </style>
 <script setup name="Model">
-import { listModel, getModel, delModel, addModel, updateModel } from "@/api/model/alertmodel";
+import { listModel,listModelEnabledNoPage, getModel, delModel, addModel, updateModel } from "@/api/model/alertmodel";
 import { ElMessageBox } from 'element-plus';
 const { proxy } = getCurrentInstance();
-const { dc_param_value_type,operator_sign } = proxy.useDict('dc_param_value_type','operator_sign');
+const { dc_param_value_type,operator_sign,dc_alert_level } = proxy.useDict('dc_param_value_type','operator_sign','dc_alert_level');
 const modelList = ref([]);
 const open = ref(false);
 const loading = ref(true);
@@ -241,6 +266,13 @@ const single = ref(true);
 const multiple = ref(true);
 const total = ref(0);
 const title = ref("");
+const rules = ref({});
+const valueBoolVisiable = ref(false);
+const valueFloatVisiable = ref(true);
+const codeVisiable = ref(true);
+const sortVisiable = ref(true);
+const operatorVisiable = ref(true);
+const operatorDisabled = ref(false);
 const flagEnabled = ref([
   {label: '有效', value: 1, elTagType: 'default', elTagClass: null}, 
   {label: '无效', value: 0, elTagType: 'default', elTagClass: null}
@@ -249,6 +281,10 @@ const flagEnabledTable = ref([
   {label: '有效', value: '1', elTagType: 'default', elTagClass: null}, 
   {label: '无效', value: '0', elTagType: 'default', elTagClass: null}
 ]);
+const alert_value = ref([
+  {label: '1', value: true, elTagType: 'default', elTagClass: null}, 
+  {label: '0', value: false, elTagType: 'default', elTagClass: null}
+]);
 const data = reactive({
   form: {},
   queryParams: {
@@ -260,14 +296,64 @@ const data = reactive({
     level: null,
     operator: null,
     name: null,
-    value: null
+    value: null,
+    sort: null,
+  },
+  rulesA: {
+    paramType: [
+      { required: true, message: "参数数据类型不能为空", trigger: "blur" }
+    ],
+    code: [
+      { required: false, message: "代码不能为空", trigger: "blur" }
+    ],
+    flagEnabled: [
+      { required: true, message: "是否有效标志不能为空", trigger: "blur" }
+    ],
+    level: [
+      { required: true, message: "告警等级不能为空", trigger: "blur" }
+    ],
+    operator: [
+      { required: false, message: "运算符不能为空", trigger: "blur" }
+    ],
+    name: [
+      { required: true, message: "名称", trigger: "blur" }
+    ],
+    value: [
+      { required: true, message: "预设值不能为空", trigger: "blur" }
+    ],
+    sort: [
+      { required: false, message: "排序不能为空", trigger: "blur" }
+    ],
+  },
+  rulesB: {
+    paramType: [
+      { required: true, message: "参数数据类型不能为空", trigger: "blur" }
+    ],
+    code: [
+      { required: true, message: "代码不能为空", trigger: "blur" }
+    ],
+    flagEnabled: [
+      { required: true, message: "是否有效标志不能为空", trigger: "blur" }
+    ],
+    level: [
+      { required: true, message: "告警等级不能为空", trigger: "blur" }
+    ],
+    operator: [
+      { required: true, message: "运算符不能为空", trigger: "blur" }
+    ],
+    name: [
+      { required: true, message: "名称", trigger: "blur" }
+    ],
+    value: [
+      { required: true, message: "预设值不能为空", trigger: "blur" }
+    ],
+    sort: [
+      { required: true, message: "排序不能为空", trigger: "blur" }
+    ],
   },
-  rules: {
-  }
 });
 
-const { queryParams, form, rules } = toRefs(data);
-
+const { queryParams, form, rulesA, rulesB } = toRefs(data);
 /** 查询告警模版列表 */
 function getList() {
   loading.value = true;
@@ -306,6 +392,7 @@ function reset() {
     name: null,
     value: null
   };
+  
   proxy.resetForm("modelRef");
 }
 
@@ -313,11 +400,18 @@ function reset() {
 function handleQuery() {
   queryParams.value.pageNum = 1;
   getList();
+
 }
 
 /** 重置按钮操作 */
 function resetQuery() {
   proxy.resetForm("queryRef");
+  codeVisiable.value = true;
+  sortVisiable.value = true;
+  operatorVisiable.value = true; 
+  valueBoolVisiable.value = false;
+  valueFloatVisiable.value = true;
+  operatorDisabled.value = false;
   handleQuery();
 }
 
@@ -333,6 +427,7 @@ function handleAdd() {
   reset();
   open.value = true;
   title.value = "添加告警模版";
+  form.value.operator= "==";
 }
 
 /** 修改按钮操作 */
@@ -343,6 +438,10 @@ function handleUpdate(row) {
     form.value = response.data;
     open.value = true;
     title.value = "修改告警模版";
+    if(row.paramType == '4'){
+      form.value.operator = "==";
+    }
+    paramTypeChange(row.paramType);
   });
 }
 
@@ -422,5 +521,72 @@ function judgeIfRightValue(){
   return handleValueChange(form.value);
 }
 
+function levelChange(value){
+  if(form.value.paramType == '4'){
+    dc_alert_level.value.forEach(item=>{
+      if(item.value == value){
+        form.value.name = item.label
+      }
+    })
+  }else{
+    dc_alert_level.value.forEach(item=>{
+      if(item.value == value){
+        form.value.name = item.label
+      }
+    })
+  }
+  
+}
+
+function paramTypeChange(value){
+  if(value == '4'){
+    // rules.value = rulesA
+    codeVisiable.value = false;
+    sortVisiable.value = false;
+    operatorVisiable.value = false;
+    valueBoolVisiable.value = true;
+    valueFloatVisiable.value = false;
+    operatorDisabled.value = true;
+  }else if(value == '3'){
+    // rules.value = rulesB
+    codeVisiable.value = true;
+    sortVisiable.value = true;
+    operatorVisiable.value = true;
+    valueBoolVisiable.value = false;
+    valueFloatVisiable.value = true;
+    operatorDisabled.value = false;
+  }else{
+    // rules.value = rulesB
+    codeVisiable.value = true;
+    sortVisiable.value = true;
+    operatorVisiable.value = true; 
+    valueBoolVisiable.value = false;
+    valueFloatVisiable.value = true;
+    operatorDisabled.value = false;
+  }
+}
+
+const getRule = computed(() => {
+  if(form.value.paramType == 4){
+    return rulesA.value;
+  }else{
+    return rulesB.value;
+  }
+});
+
+function handleBlurLevel(value){
+  if(form.value.level != null){
+    proxy.$refs.selectBlurLevel.hideMenu();
+  }
+}
+
+function handleBlurFlagEnabled(value){
+  if(form.value.flagEnabled != null){
+    proxy.$refs.selectFlagEnabled.clearValidate();
+  }
+}
+
+
+
 getList();
 </script>
diff --git a/src/views/model/alert/policy.vue b/src/views/model/alert/policy.vue
index 8b61cfd..a45a946 100644
--- a/src/views/model/alert/policy.vue
+++ b/src/views/model/alert/policy.vue
@@ -1,88 +1,104 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="100px">
-      <el-form-item label="数据类型" prop="paramType">
-        <el-select v-model="queryParams.paramType" placeholder="请选择数据类型" clearable>
-          <el-option
-            v-for="dict in dc_param_value_type"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="开始值" prop="beginValue">
-        <el-input
-          v-model="queryParams.beginValue"
-          placeholder="请输入开始值"
-          clearable
-          @keyup.enter="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="结束值" prop="endValue">
-        <el-input
-          v-model="queryParams.endValue"
-          placeholder="请输入结束值"
-          clearable
-          @keyup.enter="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="是否告警" prop="alertFlag">
-        <el-select v-model="queryParams.alertFlag" placeholder="请选择是否告警" clearable>
-          <el-option
-            v-for="item in alertFlag"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="策略ID" prop="alertId">
-        <el-input
-          v-model="queryParams.alertId"
-          placeholder="请输入策略ID"
-          clearable
-          @keyup.enter="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="状态值" prop="statusValue">
-        <el-input
-          v-model="queryParams.statusValue"
-          placeholder="请输入状态值"
-          clearable
-          @keyup.enter="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="状态类型" prop="statusType">
-        <el-select v-model="queryParams.statusType" placeholder="请选择状态类型" clearable>
-          <el-option label="请选择字典生成" value="" />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="中台设备ID" prop="deviceId">
-        <el-input
-          v-model="queryParams.deviceId"
-          placeholder="请输入中台设备ID"
-          clearable
-          @keyup.enter="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="排序" prop="sortId">
-        <el-input-number v-model="queryParams.sortId" :min="1" :max="1000" />
-      </el-form-item>
-      <el-form-item label="告警方式" prop="methodId">
-        <el-select v-model="queryParams.methodId" placeholder="请选择告警方式ID" clearable>
-          <el-option
-            v-for="item in methodList"
-            :key="item.id"
-            :label="item.methodName"
-            :value="item.id"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="info" plain icon="Refresh" @click="resetQuery">重置</el-button>
-      </el-form-item>
+      <el-row>
+        <el-col :span="4">
+          <el-form-item label="数据类型" prop="paramType">
+            <el-select v-model="queryParams.paramType" placeholder="请选择数据类型" clearable>
+              <el-option
+                v-for="dict in dc_param_value_type"
+                :key="dict.value"
+                :label="dict.label"
+                :value="dict.value"
+              />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="4">
+          <el-form-item label="开始值" prop="beginValue">
+            <el-input
+              v-model="queryParams.beginValue"
+              placeholder="请输入开始值"
+              clearable
+              @keyup.enter="handleQuery"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="4">
+          <el-form-item label="是否告警" prop="alertFlag">
+            <el-select v-model="queryParams.alertFlag" placeholder="请选择是否告警" clearable>
+              <el-option
+                v-for="item in alertFlag"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="4">
+          <el-form-item label="策略ID" prop="alertId">
+            <el-input
+              v-model="queryParams.alertId"
+              placeholder="请输入策略ID"
+              clearable
+              @keyup.enter="handleQuery"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="4">
+          <el-form-item label="状态值" prop="statusValue">
+            <el-input
+              v-model="queryParams.statusValue"
+              placeholder="请输入状态值"
+              clearable
+              @keyup.enter="handleQuery"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="4">
+          <el-form-item label="状态类型" prop="statusType">
+            <el-select v-model="queryParams.statusType" placeholder="请选择状态类型" clearable>
+              <el-option label="请选择字典生成" value="" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="4">
+          <el-form-item label="中台设备ID" prop="deviceId">
+            <el-input
+              v-model="queryParams.deviceId"
+              placeholder="请输入中台设备ID"
+              clearable
+              @keyup.enter="handleQuery"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="4">
+          <el-form-item label="排序" prop="sortId">
+            <el-input-number v-model="queryParams.sortId" :min="1" :max="1000" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="4">
+          <el-form-item label="告警方式" prop="methodId">
+            <el-select v-model="queryParams.methodId" placeholder="请选择告警方式ID" clearable>
+              <el-option
+                v-for="item in methodList"
+                :key="item.id"
+                :label="item.methodName"
+                :value="item.id"
+              />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="4" class="textaligncenter">
+          <el-form-item>
+            <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+            <el-button type="info" plain icon="Refresh" @click="resetQuery">重置</el-button>
+          </el-form-item>
+        </el-col>
+      </el-row>
     </el-form>
 
     <el-row :gutter="10" class="mb8">
@@ -219,6 +235,9 @@
   </div>
 </template>
 
+<style lang="scss" > 
+  @import "@/assets/styles/self-defined.scss";
+</style>
 <script setup name="Policy">
 import { selectDeviceParamPolicy, listPolicy, getPolicy, delPolicy, addPolicy, updatePolicy } from "@/api/model/policy";
 import { listMethod } from "@/api/model/method";