From 34d3ff741986410fda5af31fb806bec217f0a8ff Mon Sep 17 00:00:00 2001
From: leiqiaochu <leiqiaochu@aossci.com>
Date: Mon, 13 Mar 2023 18:13:28 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E5=91=8A=E8=AD=A6=E4=B8=AD=E5=BF=83?=
 =?UTF-8?q?=E8=87=AA=E6=B5=8B=E4=B8=8E=E7=BB=84=E4=BB=B6=E6=9B=BF=E6=8D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Alarm/Config/Io/Save/input.vue            | 63 ++++++-------
 .../Alarm/Config/Io/Save/output.vue           | 63 ++++++-------
 .../rule-engine/Alarm/Config/Io/index.vue     | 88 +++++++++----------
 src/views/rule-engine/Alarm/Config/index.vue  | 24 ++---
 .../Alarm/Configuration/Save/index.vue        | 34 ++++---
 .../rule-engine/Alarm/Configuration/index.vue |  6 +-
 .../rule-engine/Alarm/Log/Detail/index.vue    |  2 +-
 .../DashBoard/components/NewAlarm.vue         |  2 +-
 .../DashBoard/components/TimeSelect.vue       | 12 +--
 .../DashBoard/components/TopCard.vue          |  6 +-
 10 files changed, 158 insertions(+), 142 deletions(-)

diff --git a/src/views/rule-engine/Alarm/Config/Io/Save/input.vue b/src/views/rule-engine/Alarm/Config/Io/Save/input.vue
index 491904ae..3aa86f01 100644
--- a/src/views/rule-engine/Alarm/Config/Io/Save/input.vue
+++ b/src/views/rule-engine/Alarm/Config/Io/Save/input.vue
@@ -1,5 +1,5 @@
 <template>
-    <a-modal
+    <j-modal
         :maskClosable="false"
         width="45vw"
         title="编辑"
@@ -9,8 +9,8 @@
         cancelText="取消"
         okText="确定"
     >
-        <a-form layout="vertical" :model="inputData">
-            <a-form-item
+        <j-form layout="vertical" :model="inputData" ref="formRef">
+            <j-form-item
                 label="kafka地址"
                 name="address"
                 :rules="[
@@ -20,12 +20,12 @@
                     },
                 ]"
             >
-                <a-input
+                <j-input
                     v-model:value="inputData.address"
                     placeholder="请输入kafka地址"
-                ></a-input>
-            </a-form-item>
-            <a-form-item
+                ></j-input>
+            </j-form-item>
+            <j-form-item
                 label="topic"
                 name="topic"
                 :rules="[
@@ -35,17 +35,17 @@
                     },
                 ]"
             >
-                <a-input v-model:value="inputData.topic"></a-input>
-            </a-form-item>
-            <a-form-item label="状态">
-                <a-switch
+                <j-input v-model:value="inputData.topic"></j-input>
+            </j-form-item>
+            <j-form-item label="状态">
+                <j-switch
                     checked-children="启用"
                     un-checked-children="启用"
                     v-model:checked="inputData.status"
-                ></a-switch>
-            </a-form-item>
-        </a-form>
-    </a-modal>
+                ></j-switch>
+            </j-form-item>
+        </j-form>
+    </j-modal>
 </template>
 
 <script lang="ts" setup>
@@ -53,6 +53,7 @@ import { Form } from 'ant-design-vue';
 import { saveOutputData } from '@/api/rule-engine/config';
 import { message } from 'ant-design-vue/es';
 const useForm = Form.useForm;
+const formRef = ref();
 const Myprops = defineProps({
     data: {
         default: '',
@@ -74,23 +75,25 @@ const close = () => {
     emit('closeModel');
 };
 const save = () => {
-    saveOutputData({
-        config: {
-            sourceType: 'kafka',
+    formRef.value.validateFields().then(() => {
+        saveOutputData({
             config: {
-                ...inputData,
-                state: inputData?.status ? 'enabled' : 'disable',
+                sourceType: 'kafka',
+                config: {
+                    ...inputData,
+                    state: inputData?.status ? 'enabled' : 'disable',
+                },
             },
-        },
-        state: inputData?.status ? 'enabled' : 'disable',
-        id: Myprops?.data?.data?.id,
-        sourceType: 'kafka',
-        exchangeType: 'consume',
-    }).then((res) => {
-        if (res.status === 200) {
-            message.success('操作成功');
-            emit('saveSuc');
-        }
+            state: inputData?.status ? 'enabled' : 'disable',
+            id: Myprops?.data?.data?.id,
+            sourceType: 'kafka',
+            exchangeType: 'consume',
+        }).then((res) => {
+            if (res.status === 200) {
+                message.success('操作成功');
+                emit('saveSuc');
+            }
+        });
     });
 };
 const emit = defineEmits(['closeModel', 'saveSuc']);
diff --git a/src/views/rule-engine/Alarm/Config/Io/Save/output.vue b/src/views/rule-engine/Alarm/Config/Io/Save/output.vue
index a9eff425..082851e8 100644
--- a/src/views/rule-engine/Alarm/Config/Io/Save/output.vue
+++ b/src/views/rule-engine/Alarm/Config/Io/Save/output.vue
@@ -1,5 +1,5 @@
 <template>
-    <a-modal
+    <j-modal
         :maskClosable="false"
         width="45vw"
         title="编辑"
@@ -9,15 +9,15 @@
         cancelText="取消"
         okText="确定"
     >
-        <a-form layout="vertical" :model="outputData">
-            <a-form-item label="状态">
-                <a-switch
+        <j-form layout="vertical" :model="outputData" ref="formRef">
+            <j-form-item label="状态">
+                <j-switch
                     checked-children="启用"
                     un-checked-children="启用"
                     v-model:checked="outputData.status"
-                ></a-switch>
-            </a-form-item>
-            <a-form-item
+                ></j-switch>
+            </j-form-item>
+            <j-form-item
                 v-if="outputData.status"
                 label="kafka地址"
                 name="address"
@@ -32,12 +32,12 @@
                     },
                 ]"
             >
-                <a-input
+                <j-input
                     v-model:value="outputData.address"
                     placeholder="请输入kafka地址"
-                ></a-input>
-            </a-form-item>
-            <a-form-item
+                ></j-input>
+            </j-form-item>
+            <j-form-item
                 v-if="outputData.status"
                 label="topic"
                 name="topic"
@@ -52,16 +52,17 @@
                     },
                 ]"
             >
-                <a-input v-model:value="outputData.topic"></a-input>
-            </a-form-item>
-        </a-form>
-    </a-modal>
+                <j-input v-model:value="outputData.topic"></j-input>
+            </j-form-item>
+        </j-form>
+    </j-modal>
 </template>
 
 <script lang="ts" setup>
 import { Form } from 'ant-design-vue';
 import { saveOutputData } from '@/api/rule-engine/config';
 import { message } from 'ant-design-vue/es';
+const formRef = ref();
 const useForm = Form.useForm;
 const Myprops = defineProps({
     data: {
@@ -84,23 +85,25 @@ const close = () => {
     emit('closeModel');
 };
 const save = () => {
-    saveOutputData({
-        config: {
-            sourceType: 'kafka',
+    formRef.value.validateFields().then(() => {
+        saveOutputData({
             config: {
-                ...outputData,
-                state: outputData?.status ? 'enabled' : 'disable',
+                sourceType: 'kafka',
+                config: {
+                    ...outputData,
+                    state: outputData?.status ? 'enabled' : 'disable',
+                },
             },
-        },
-        state: outputData?.status ? 'enabled' : 'disable',
-        id: Myprops?.data?.data?.id,
-        sourceType: 'kafka',
-        exchangeType: 'producer',
-    }).then((res) => {
-        if (res.status === 200) {
-            message.success('操作成功');
-            emit('saveSuc');
-        }
+            state: outputData?.status ? 'enabled' : 'disable',
+            id: Myprops?.data?.data?.id,
+            sourceType: 'kafka',
+            exchangeType: 'producer',
+        }).then((res) => {
+            if (res.status === 200) {
+                message.success('操作成功');
+                emit('saveSuc');
+            }
+        });
     });
 };
 const emit = defineEmits(['closeModel', 'saveSuc']);
diff --git a/src/views/rule-engine/Alarm/Config/Io/index.vue b/src/views/rule-engine/Alarm/Config/Io/index.vue
index efbab3b2..64a24f03 100644
--- a/src/views/rule-engine/Alarm/Config/Io/index.vue
+++ b/src/views/rule-engine/Alarm/Config/Io/index.vue
@@ -1,16 +1,16 @@
 <template>
     <div>
-        <a-row :gutter="24">
-            <a-col :span="14">
+        <j-row :gutter="24">
+            <j-col :span="14">
                 <div class="alarmFlow-left">
-                    <a-card
+                    <j-card
                         :head-style="{ borderBottom: 'none', height: '30px' }"
                         :bordered="false"
                     >
                         <template #title>
                             <div class="alarmTitle">
                                 <span>告警数据输出</span>
-                                <a-tooltip
+                                <j-tooltip
                                     title="将告警数据输出到其他第三方系统"
                                 >
                                     <AIcon
@@ -20,7 +20,7 @@
                                             line-height: 35px;
                                         "
                                     />
-                                </a-tooltip>
+                                </j-tooltip>
 
                                 <PermissionButton
                                     type="link"
@@ -33,16 +33,16 @@
                                 </PermissionButton>
                             </div>
                         </template>
-                        <a-descriptions
+                        <j-descriptions
                             bordered
                             :labelStyle="{ width: 112 + 'px' }"
                             :contentStyle="{ minWidth: 100 + 'px' }"
                             :column="2"
                         >
-                            <a-descriptions-item
+                            <j-descriptions-item
                                 label="kafka地址"
                                 :content-style="{ minWidth: '200px' }"
-                                ><a-badge
+                                ><j-badge
                                     :status="
                                         output?.running ? 'success' : 'error'
                                     "
@@ -50,31 +50,31 @@
                                         output?.data?.config?.config?.address ||
                                         ''
                                     "
-                                ></a-badge
-                            ></a-descriptions-item>
-                            <a-descriptions-item label="topic">{{
+                                ></j-badge
+                            ></j-descriptions-item>
+                            <j-descriptions-item label="topic">{{
                                 output?.data?.config?.config?.topic || ''
-                            }}</a-descriptions-item>
-                            <a-descriptions-item label="状态" :span="2"
-                                ><a-badge
+                            }}</j-descriptions-item>
+                            <j-descriptions-item label="状态" :span="2"
+                                ><j-badge
                                     :status="
                                         output?.data?.state?.value === 'enabled'
                                             ? 'success'
                                             : 'error'
                                     "
                                     :text="output?.data?.state?.text || ''"
-                                ></a-badge
-                            ></a-descriptions-item>
-                        </a-descriptions>
-                    </a-card>
-                    <a-card
+                                ></j-badge
+                            ></j-descriptions-item>
+                        </j-descriptions>
+                    </j-card>
+                    <j-card
                         :head-style="{ borderBottom: 'none', height: '30px' }"
                         :bordered="false"
                     >
                         <template #title>
                             <div class="alarmTitle">
                                 <span>告警处理结果输入</span>
-                                <a-tooltip title="接收第三方系统处理的告警结果">
+                                <j-tooltip title="接收第三方系统处理的告警结果">
                                     <AIcon
                                         type="QuestionCircleOutlined"
                                         style="
@@ -82,7 +82,7 @@
                                             line-height: 35px;
                                         "
                                     />
-                                </a-tooltip>
+                                </j-tooltip>
                                 <PermissionButton
                                     type="link"
                                     @click="showInput"
@@ -93,14 +93,14 @@
                                 ></PermissionButton>
                             </div>
                         </template>
-                        <a-descriptions
+                        <j-descriptions
                             bordered
                             :labelStyle="{ width: 112 + 'px' }"
                             :contentStyle="{ minWidth: 150 + 'px' }"
                             :column="2"
                         >
-                            <a-descriptions-item label="kafka地址"
-                                ><a-badge
+                            <j-descriptions-item label="kafka地址"
+                                ><j-badge
                                     :status="
                                         input?.running ? 'success' : 'error'
                                     "
@@ -108,34 +108,34 @@
                                         input?.data?.config?.config?.address ||
                                         ''
                                     "
-                                ></a-badge
-                            ></a-descriptions-item>
-                            <a-descriptions-item label="topic">{{
+                                ></j-badge
+                            ></j-descriptions-item>
+                            <j-descriptions-item label="topic">{{
                                 input?.data?.config?.config?.topic || ''
-                            }}</a-descriptions-item>
-                            <a-descriptions-item label="状态" :span="2"
-                                ><a-badge
+                            }}</j-descriptions-item>
+                            <j-descriptions-item label="状态" :span="2"
+                                ><j-badge
                                     :status="
                                         input?.data?.state?.value === 'enabled'
                                             ? 'success'
                                             : 'error'
                                     "
                                     :text="input?.data?.state?.text || ''"
-                                ></a-badge
-                            ></a-descriptions-item>
-                        </a-descriptions>
-                    </a-card>
+                                ></j-badge
+                            ></j-descriptions-item>
+                        </j-descriptions>
+                    </j-card>
                 </div>
-            </a-col>
-            <a-col :span="10">
+            </j-col>
+            <j-col :span="10">
                 <div class="alarmFlow-right">
                     <div class="doc">
                         <h1>功能图示</h1>
                         <div class="image">
-                            <a-image
+                            <j-image
                                 width="100%"
                                 :src="getImage('/alarm/io.png')"
-                            ></a-image>
+                            ></j-image>
                         </div>
                         <h1>功能说明</h1>
                         <div>
@@ -143,11 +143,11 @@
                         </div>
                         <h2>输出参数</h2>
                         <div>
-                            <a-table
+                            <j-table
                                 :dataSource="outputData"
                                 :pagination="false"
                                 :columns="outputColumns"
-                            ></a-table>
+                            ></j-table>
                         </div>
                         <h2>示例</h2>
                         <div v-html="markdownOutputText" class="code"></div>
@@ -156,18 +156,18 @@
                         </div>
                         <h2>订阅参数</h2>
                         <div>
-                            <a-table
+                            <j-table
                                 :dataSource="subData"
                                 :pagination="false"
                                 :columns="subColumns"
-                            ></a-table>
+                            ></j-table>
                         </div>
                         <h2>示例</h2>
                         <div class="code" v-html="markdownSubText"></div>
                     </div>
                 </div>
-            </a-col>
-        </a-row>
+            </j-col>
+        </j-row>
         <InputSave
             :data="input"
             v-if="inputVisible"
diff --git a/src/views/rule-engine/Alarm/Config/index.vue b/src/views/rule-engine/Alarm/Config/index.vue
index 93bbf5bc..1e5003b6 100644
--- a/src/views/rule-engine/Alarm/Config/index.vue
+++ b/src/views/rule-engine/Alarm/Config/index.vue
@@ -1,10 +1,10 @@
 <template>
     <page-container :tabList="list" @tabChange="onTabChange" :tabActiveKey="tab">
         <div v-if="tab=='config'">
-            <a-row :gutter="24">
-                <a-col :span="14">
+            <j-row :gutter="24">
+                <j-col :span="14">
                     <div class="alarm-level">
-                        <a-card
+                        <j-card
                             :headStyle="{ borderBottom: 'none', padding: 0 }"
                             :bodyStyle="{ padding: 0 }"
                             :bordered="false"
@@ -27,24 +27,24 @@
                                     <span>{{ `级别${i + 1}` }}</span>
                                 </div>
                                 <div>
-                                    <a-input
+                                    <j-input
                                         type="text"
                                         v-model:value="item.title"
                                         :maxlength="64"
-                                    ></a-input>
+                                    ></j-input>
                                 </div>
                             </div>
-                        </a-card>
-                        <!-- <a-button
+                        </j-card>
+                        <!-- <j-button
                             type="primary"
                             size="middle"
                             @click="handleSaveLevel"
-                            >保存</a-button
+                            >保存</j-button
                         > -->
                         <PermissionButton type="primary" size="middle" @click="handleSaveLevel" hasPermission="rule-engine/Alarm/Config:update">保存</PermissionButton>
                     </div>
-                </a-col>
-                <a-col :span="10">
+                </j-col>
+                <j-col :span="10">
                     <div class="description">
                         <h1>功能说明</h1>
                         <div>
@@ -53,8 +53,8 @@
                         <div>2、告警级别将会在告警配置中被引用。</div>
                         <div>3、最多可配置5个级别。</div>
                     </div>
-                </a-col>
-            </a-row>
+                </j-col>
+            </j-row>
         </div>
         <Io v-else></Io>
     </page-container>
diff --git a/src/views/rule-engine/Alarm/Configuration/Save/index.vue b/src/views/rule-engine/Alarm/Configuration/Save/index.vue
index 3de8d357..427a133c 100644
--- a/src/views/rule-engine/Alarm/Configuration/Save/index.vue
+++ b/src/views/rule-engine/Alarm/Configuration/Save/index.vue
@@ -1,25 +1,35 @@
 <template>
         <page-container>
-            <a-card>
-                <a-tabs v-model:activeKey="activeKey">
-                    <a-tab-pane key="1" tab="基础配置">
+            <j-card>
+                <j-tabs :activeKey="activeKey" @change="changeTabs">
+                    <j-tab-pane key="1" tab="基础配置">
                         <Base/>
-                    </a-tab-pane>
-                    <a-tab-pane key="2" tab="关联场景联动">
+                    </j-tab-pane>
+                    <j-tab-pane key="2" tab="关联场景联动">
                         <Scene></Scene>
-                    </a-tab-pane>
-                    <a-tab-pane key="3" tab="告警记录">
+                    </j-tab-pane>
+                    <j-tab-pane key="3" tab="告警记录">
                         <Log/>
-                    </a-tab-pane>
-                </a-tabs>
-            </a-card>
+                    </j-tab-pane>
+                </j-tabs>
+            </j-card>
         </page-container>
 </template>
 
 <script lang="ts" setup>
 import Base from './Base/index.vue';
-import Scene from './Scene/index.vue'
-import Log from './Log/indev.vue'
+import Scene from './Scene/index.vue';
+import Log from './Log/indev.vue';
+import { useRoute } from 'vue-router';
+import { message } from 'ant-design-vue';
+const route = useRoute();
+const changeTabs = (e:any) =>{
+    if(route.query?.id){
+        activeKey.value = e;
+    }else{
+        message.error('请先保存基础配置');
+    }
+}
 const activeKey = ref('1');
 </script>
 <style lang="less" scoped>
diff --git a/src/views/rule-engine/Alarm/Configuration/index.vue b/src/views/rule-engine/Alarm/Configuration/index.vue
index 7286bbfe..c7fe2682 100644
--- a/src/views/rule-engine/Alarm/Configuration/index.vue
+++ b/src/views/rule-engine/Alarm/Configuration/index.vue
@@ -1,11 +1,11 @@
 <template>
     <page-container>
         <div>
-            <Search
+            <pro-search
                 :columns="columns"
                 target="device-instance"
                 @search="handleSearch"
-            ></Search>
+            />
             <JProTable
                 :columns="columns"
                 :request="queryList"
@@ -160,7 +160,7 @@
                                 style="padding: 0px"
                                 :hasPermission="
                                     'rule-engine/Alarm/Configuration:' +
-                                    item.key
+                                    i.key
                                 "
                             >
                                 <template #icon
diff --git a/src/views/rule-engine/Alarm/Log/Detail/index.vue b/src/views/rule-engine/Alarm/Log/Detail/index.vue
index d7a6bed6..d090ba79 100644
--- a/src/views/rule-engine/Alarm/Log/Detail/index.vue
+++ b/src/views/rule-engine/Alarm/Log/Detail/index.vue
@@ -181,7 +181,7 @@ const close = () => {
 
 watchEffect(()=>{
     current.value = details.value;
-    if(route.query.detail && details.value){
+    if(history.state?.params.detail && details.value){
         visiable.value = true;
     }
 })
diff --git a/src/views/rule-engine/DashBoard/components/NewAlarm.vue b/src/views/rule-engine/DashBoard/components/NewAlarm.vue
index 1b3a8dbb..fb367b4f 100644
--- a/src/views/rule-engine/DashBoard/components/NewAlarm.vue
+++ b/src/views/rule-engine/DashBoard/components/NewAlarm.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="new-alarm">
-        <div class="title">最新警告</div>
+        <div class="title">最新告警</div>
         <div v-if="alarmList.length" class="new-alarm-items">
             <ul>
                 <li v-for="item in alarmList.slice(0, 3)" :key="item">
diff --git a/src/views/rule-engine/DashBoard/components/TimeSelect.vue b/src/views/rule-engine/DashBoard/components/TimeSelect.vue
index eaa86387..7cfd8595 100644
--- a/src/views/rule-engine/DashBoard/components/TimeSelect.vue
+++ b/src/views/rule-engine/DashBoard/components/TimeSelect.vue
@@ -1,21 +1,21 @@
 <template>
     <div>
-        <a-radio-group
+        <j-radio-group
             v-if="quickBtn"
             default-value="today"
             button-style="solid"
             v-model:value="radioValue"
             @change="(e) => handleBtnChange(e.target.value)"
         >
-            <a-radio-button
+            <j-radio-button
                 v-for="item in quickBtnList"
                 :key="item.value"
                 :value="item.value"
             >
                 {{ item.label }}
-            </a-radio-button>
-        </a-radio-group>
-        <a-range-picker
+            </j-radio-button>
+        </j-radio-group>
+        <j-range-picker
             format="YYYY-MM-DD HH:mm:ss"
             valueFormat="YYYY-MM-DD HH:mm:ss"
             style="margin-left: 12px"
@@ -23,7 +23,7 @@
             v-model:value="rangeVal"
             :allowClear="false"
         >
-        </a-range-picker>
+        </j-range-picker>
     </div>
 </template>
 
diff --git a/src/views/rule-engine/DashBoard/components/TopCard.vue b/src/views/rule-engine/DashBoard/components/TopCard.vue
index 13c5fcac..a8d07992 100644
--- a/src/views/rule-engine/DashBoard/components/TopCard.vue
+++ b/src/views/rule-engine/DashBoard/components/TopCard.vue
@@ -4,12 +4,12 @@
             <div class="content-left">
                 <div class="content-left-title">
                     <span>{{ title }}</span>
-                    <a-tooltip placement="top" v-if="tooltip">
+                    <j-tooltip placement="top" v-if="tooltip">
                         <template #title>
                             <span>{{ tooltip }}</span>
                         </template>
                         <AIcon type="QuestionCircleOutlined" />
-                    </a-tooltip>
+                    </j-tooltip>
                 </div>
                 <div class="content-left-value">{{ value }}</div>
             </div>
@@ -23,7 +23,7 @@
         <div class="top-card-footer">
             <template v-for="(item, index) in footer" :key="index">
                 <span v-if="!item.status">{{ item.title }}</span>
-                <a-badge v-else :text="item.title" :status="item.status" />
+                <j-badge v-else :text="item.title" :status="item.status" />
                 <div class="footer-item-value">{{ item.value }}</div>
             </template>
         </div>