---活动告警,历史告警,故障通用设置

src/api/faultManage/actAlarm.ts

@@ -11,7 +11,7 @@ import { ConsoleSqlOutlined } from '@ant-design/icons-vue';
  * @param query 查询参数
  * @returns object
  */
-export async function listAct(query: Record<string, any>,filterSQl:string) {
+export async function listAct(query: Record<string, any>, filterSQl: string) {
   let totalSQL = `select count(*)  as total from alarm where alarm_status='1' ${filterSQl} `;
   let rowsSQL = `select * from alarm where alarm_status='1' ${filterSQl}`;
   // 查询
@@ -202,3 +202,48 @@ export function listSync() {
     method: 'get',
   });
 }
+
+/**
+ * 活动告警导出
+ * @param query 查询参数
+ * @returns bolb
+ */
+export async function exportAll(query: Record<string, any>) {
+  let rowsSQL = `select * from alarm where alarm_status='1'`;
+  // 查询
+  let querySQL = '';
+  querySQL += query.alarm_code
+    ? ` and alarm_code = '${query.alarm_code}' `
+    : '';
+  querySQL += query.alarm_type
+    ? ` and alarm_type = '${query.alarm_type}' `
+    : '';
+  querySQL += query.pv_flag ? ` and pv_flag = '${query.pv_flag}' ` : '';
+  querySQL += query.orig_severity
+    ? ` and orig_severity in('${query.orig_severity}' )`
+    : '';
+  querySQL += query.ne_id ? ` and ne_id like '%${query.ne_id}%' ` : '';
+  querySQL += query.ne_name ? ` and ne_name like '%${query.ne_name}%' ` : '';
+  querySQL += query.ne_type ? ` and ne_type like '%${query.ne_type}%' ` : '';
+  querySQL +=
+    query.beginTime && query.endTime
+      ? ` and event_time BETWEEN '${query.beginTime}' and ' ${query.endTime}'`
+      : '';
+
+  // 发起请求
+  const result = await request({
+    url: `/databaseManagement/v1/select/omc_db/alarm`,
+    method: 'get',
+    params: {
+      rowsSQL: rowsSQL + querySQL,
+    },
+  });
+
+
+  if (result.code === RESULT_CODE_SUCCESS) {
+    let v = result.data.data[0];
+    const vArr = parseObjLineToHump(v['alarm']);
+    result.data = vArr == null ? [] : vArr;
+  }
+  return result;
+}

src/api/faultManage/faultSetting.ts

@@ -0,0 +1,197 @@
+import {
+  RESULT_CODE_ERROR,
+  RESULT_CODE_SUCCESS,
+  RESULT_MSG_ERROR,
+  RESULT_MSG_SUCCESS,
+} from '@/constants/result-constants';
+import { request } from '@/plugins/http-fetch';
+import { parseObjLineToHump } from '@/utils/parse-utils';
+import { toRaw } from 'vue';
+
+/**
+ * <20><>ѯ<EFBFBD>澯<EFBFBD><E6BEAF><EFBFBD><EFBFBD>
+ * @param tag <20><><EFBFBD><EFBFBD>ID
+ * @returns object
+ */
+export async function getAlarmSet() {
+  let arr = [];
+
+  // <20><>ʷ<EFBFBD>澯<EFBFBD><E6BEAF><EFBFBD><EFBFBD>ʱ<EFBFBD><CAB1>
+  const logDurationResult = await request({
+    url: `/databaseManagement/v1/omc_db/config`,
+    method: 'get',
+    params: {
+      SQL: `SELECT * FROM config WHERE config_tag = 'historyDuration'`,
+    },
+  });
+  arr.push(logDurationResult);
+  // ͬ<><CDAC><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
+  const logCapacityResult = await request({
+    url: `/databaseManagement/v1/omc_db/config`,
+    method: 'get',
+    params: {
+      SQL: `SELECT * FROM config WHERE config_tag = 'syncTaskPeriod'`,
+    },
+  });
+  arr.push(logCapacityResult);
+
+  // <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
+  const result = await Promise.allSettled(arr).then(resArr => {
+    let resultData: any = {};
+    for (const item of resArr) {
+      if (item.status === 'rejected') {
+        continue;
+      }
+      const itemV = item.value;
+      // <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
+      if ( itemV.code === RESULT_CODE_SUCCESS &&Array.isArray(itemV.data.data)) 
+      {
+        let itemData = itemV.data.data[0];
+        const v = parseObjLineToHump(itemData['config'][0]);
+        let vJSON:any ={};
+        if(v.configTag=='syncTaskPeriod'){
+          try{
+            vJSON=JSON.parse(v.valueJson);
+          }
+          catch(error){
+            console.error(error);
+          }
+          resultData={...resultData,...vJSON};
+        }else{
+          resultData[v.configTag] = parseInt(v.value);
+        }
+      }
+    }
+    if (Object.keys(resultData).length === 0) {
+      return { code: RESULT_CODE_ERROR, msg: RESULT_MSG_ERROR, data: {} };
+    }
+    return {
+      code: RESULT_CODE_SUCCESS,
+      msg: RESULT_MSG_SUCCESS,
+      data: resultData,
+    };
+  });
+  return result;
+}
+
+/**
+ * <20>޸ĸ澯<C4B8><E6BEAF><EFBFBD><EFBFBD>
+ * @param data <20><><EFBFBD>ö<EFBFBD><C3B6><EFBFBD>
+ * @returns object
+ */
+export async function updateAlarmSet(data: Record<string, any>) {
+  let { historyDuration, ...syncTaskPeriodJson } = data;
+
+  let historyDurationJson = { historyDuration };
+
+  let arr = [];
+
+  // <20><>ʷ<EFBFBD>澯<EFBFBD><E6BEAF><EFBFBD><EFBFBD>ʱ<EFBFBD><CAB1>
+  const historyDurationResult = await request({
+    url: `/databaseManagement/v1/omc_db/config?WHERE=config_tag='historyDuration'`,
+    method: 'put',
+    data: { data: { value: data.historyDuration.toString() } },
+  });
+  arr.push(historyDurationResult);
+  // ͬ<><CDAC><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
+  const syncTaskPeriodResult = await request({
+    url: `/databaseManagement/v1/omc_db/config?WHERE=config_tag='syncTaskPeriod'`,
+    method: 'put',
+    data: { data: { value_json: JSON.stringify(syncTaskPeriodJson) } },
+  });
+  arr.push(syncTaskPeriodResult);
+
+  // <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
+  const result = await Promise.allSettled(arr).then(resArr => {
+    let resultNum = 0;
+    for (const item of resArr) {
+      if (item.status === 'rejected') {
+        continue;
+      }
+      const itemV = item.value;
+      // <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
+      let itemData = itemV.data.data;
+      if (itemV.code === RESULT_CODE_SUCCESS && itemData) {
+        let rows = itemData.affectedRows;
+        if (rows) {
+          resultNum += rows;
+        }
+      }
+    }
+    // <20>ޱ<EFBFBD><DEB1><EFBFBD>ʱ
+    if (resultNum === 0) {
+      return { code: RESULT_CODE_ERROR, msg: RESULT_MSG_ERROR, data: 0 };
+    }
+    return {
+      code: RESULT_CODE_SUCCESS,
+      msg: RESULT_MSG_SUCCESS,
+      data: resultNum,
+    };
+  });
+  return result;
+}
+
+/**
+ * <20><>ѯ<EFBFBD>澯ǰת<C7B0>ӿ<EFBFBD><D3BF><EFBFBD><EFBFBD><EFBFBD>
+ * @param tag <20><><EFBFBD><EFBFBD>ID
+ * @returns object
+ */
+export async function getForwardSet() {
+  // <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
+  const result = await request({
+    url: `/databaseManagement/v1/omc_db/config`,
+    method: 'get',
+    params: {
+      SQL: `SELECT * FROM config WHERE config_tag = 'forwardAlarm'`,
+    },
+  });
+  // <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
+  if (result.code === RESULT_CODE_SUCCESS && Array.isArray(result.data.data)) {
+    let data = result.data.data[0];
+    const v = parseObjLineToHump(data['config'][0]);
+    let vJSON: any = {};
+    try {
+      vJSON = JSON.parse(v.valueJson);
+    } catch (error) {
+      console.error(error);
+    }
+    return Object.assign(result, {
+      data: vJSON,
+    });
+  }
+  return result;
+}
+
+/**
+ * <20>޸ĸ澯ǰת<C7B0>ӿ<EFBFBD><D3BF><EFBFBD><EFBFBD><EFBFBD>
+ * @param data <20><><EFBFBD>ö<EFBFBD><C3B6><EFBFBD>
+ * @returns object
+ */
+export async function updateForwardSet(data: Record<string, any>) {
+  // return false;
+  const result = await request({
+    url: `/databaseManagement/v1/omc_db/config?WHERE=config_tag='forwardAlarm'`,
+    method: 'put',
+    data: { data: { value_json: JSON.stringify(data) } },
+  });
+  // <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
+  if (result.code === RESULT_CODE_SUCCESS && result.data.data) {
+    let rows = result.data.data.affectedRows;
+    if (rows) {
+      delete result.data;
+      return result;
+    } else {
+      return { code: RESULT_CODE_ERROR, msg: RESULT_MSG_ERROR };
+    }
+  }
+  return result;
+}
+
+
+
+
+
+
+
+
+

src/api/faultManage/historyAlarm.ts

@@ -0,0 +1,169 @@
+import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
+import { request } from '@/plugins/http-fetch';
+import { parseObjLineToHump } from '@/utils/parse-utils';
+import { parseDateToStr } from '@/utils/date-utils';
+import useUserStore from '@/store/modules/user';
+import { ConsoleSqlOutlined } from '@ant-design/icons-vue';
+
+/**
+ * <20><>ѯ<EFBFBD>б<EFBFBD>
+ * @param query <20><>ѯ<EFBFBD><D1AF><EFBFBD><EFBFBD>
+ * @returns object
+ */
+export async function listAct(query: Record<string, any>) {
+  let totalSQL = `select count(*)  as total from alarm where alarm_status='0'`;
+  let rowsSQL = `select * from alarm where alarm_status='0'`;
+  // <20><>ѯ
+  let querySQL = '';
+  querySQL += query.alarm_code
+    ? ` and alarm_code = '${query.alarm_code}' `
+    : '';
+  querySQL += query.alarm_type
+    ? ` and alarm_type = '${query.alarm_type}' `
+    : '';
+  querySQL += query.pv_flag ? ` and pv_flag = '${query.pv_flag}' ` : '';
+  querySQL += query.orig_severity
+    ? ` and orig_severity in('${query.orig_severity}' )`
+    : '';
+  querySQL += query.ne_id ? ` and ne_id like '%${query.ne_id}%' ` : '';
+  querySQL += query.ne_name ? ` and ne_name like '%${query.ne_name}%' ` : '';
+  querySQL += query.ne_type ? ` and ne_type like '%${query.ne_type}%' ` : '';
+  querySQL +=
+    query.beginTime && query.endTime
+      ? ` and event_time BETWEEN '${query.beginTime}' and ' ${query.endTime}'`
+      : '';
+
+  // <20><>ҳ
+  const pageNum = (query.pageNum - 1) * query.pageSize;
+  const limtSql = ` order by clear_time desc limit ${pageNum},${query.pageSize} `;
+
+  // <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
+  const result = await request({
+    url: `/databaseManagement/v1/select/omc_db/alarm`,
+    method: 'get',
+    params: {
+      SQL: totalSQL + querySQL,
+      rowsSQL: rowsSQL + querySQL + limtSql,
+    },
+  });
+
+  // <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
+  if (result.code === RESULT_CODE_SUCCESS) {
+    const data: DataList = {
+      total: 0,
+      rows: [],
+      code: result.code,
+      msg: result.msg,
+    };
+    result.data.data.forEach((item: any) => {
+      const itemData = item['alarm'];
+      if (Array.isArray(itemData)) {
+        if (itemData.length === 1 && itemData[0]['total'] >= 0) {
+          data.total = itemData[0]['total'];
+        } else {
+          data.rows = itemData.map(v => parseObjLineToHump(v));
+        }
+      }
+    });
+    return data;
+  }
+  return result;
+}
+
+/**
+ * ȷ<>ϸ澯<CFB8><E6BEAF>Ϣ
+ * @param data <20><>Ȩ<EFBFBD><C8A8><EFBFBD><EFBFBD>
+ * @returns object
+ */
+export function updateConfirm(data: Record<string, any>) {
+  var time = new Date();
+  const userName = useUserStore().userName;
+  let finalData = {
+    alarm: {
+      ack_time: parseDateToStr(time),
+      ack_user: userName,
+      ack_state: '1',
+    },
+  };
+
+  return request({
+    url: `/databaseManagement/v1/update/omc_db/alarm?WHERE=id='${data.id}'`,
+    method: 'put',
+    data: finalData,
+  });
+}
+
+/**
+ * ȡ<><C8A1>ȷ<EFBFBD>ϸ澯
+ * @param data <20><>Ȩ<EFBFBD><C8A8><EFBFBD><EFBFBD>
+ * @returns object
+ */
+export function cancelConfirm(data: (string | number)[]) {
+  var time = new Date();
+  const userName = useUserStore().userName;
+  let finalData = {
+    alarm: {
+      ack_time: parseDateToStr(time),
+      ack_user: '',
+      ack_state: '0',
+    },
+  };
+
+  return request({
+    url: `/databaseManagement/v1/update/omc_db/alarm?WHERE=id in(${data.join(
+      ','
+    )})`,
+    method: 'put',
+    data: finalData,
+  });
+}
+
+
+
+
+
+/**
+ * <20><>ʷ<EFBFBD>澯<EFBFBD><E6BEAF><EFBFBD><EFBFBD>
+ * @param query <20><>ѯ<EFBFBD><D1AF><EFBFBD><EFBFBD>
+ * @returns bolb
+ */
+export async function exportAll(query: Record<string, any>) {
+  let rowsSQL = `select * from alarm where alarm_status='0'`;
+  // <20><>ѯ
+  let querySQL = '';
+  querySQL += query.alarm_code
+    ? ` and alarm_code = '${query.alarm_code}' `
+    : '';
+  querySQL += query.alarm_type
+    ? ` and alarm_type = '${query.alarm_type}' `
+    : '';
+  querySQL += query.pv_flag ? ` and pv_flag = '${query.pv_flag}' ` : '';
+  querySQL += query.orig_severity
+    ? ` and orig_severity in('${query.orig_severity}' )`
+    : '';
+  querySQL += query.ne_id ? ` and ne_id like '%${query.ne_id}%' ` : '';
+  querySQL += query.ne_name ? ` and ne_name like '%${query.ne_name}%' ` : '';
+  querySQL += query.ne_type ? ` and ne_type like '%${query.ne_type}%' ` : '';
+  querySQL +=
+    query.beginTime && query.endTime
+      ? ` and event_time BETWEEN '${query.beginTime}' and ' ${query.endTime}'`
+      : '';
+
+  // <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
+  const result = await request({
+    url: `/databaseManagement/v1/select/omc_db/alarm`,
+    method: 'get',
+    params: {
+      rowsSQL: rowsSQL + querySQL,
+    },
+  });
+
+
+  if (result.code === RESULT_CODE_SUCCESS) {
+    let v = result.data.data[0];
+    const vArr = parseObjLineToHump(v['alarm']);
+    result.data = vArr == null ? [] : vArr;
+  }
+  return result;
+}
+

src/views/faultManage/active-alarm/index.vue

@@ -16,9 +16,12 @@ import {
   clearAlarm,
   showPass,
   getPass,
+  exportAll
 } from '@/api/faultManage/actAlarm';
 import useNeInfoStore from '@/store/modules/neinfo';
 import useI18n from '@/hooks/useI18n';
+import saveAs from 'file-saver';
+import { writeSheet } from '@/utils/execl-utils';
 import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
 import { readLoalXlsx } from '@/utils/execl-utils';
 const { t } = useI18n();
@@ -145,7 +148,7 @@ let tableColumns: ColumnsType = [
   {
     title: t('views.faultManage.activeAlarm.origLevel'),
     align: 'center',
-    key:'origSeverity',
+    key: 'origSeverity',
   },
   {
     title: t('views.faultManage.activeAlarm.alarmCode'),
@@ -161,6 +164,7 @@ let tableColumns: ColumnsType = [
     title: t('views.faultManage.activeAlarm.eventTime'),
     dataIndex: 'eventTime',
     align: 'center',
+    sorter: true,
   },
   {
     title: t('views.faultManage.activeAlarm.alarmType'),
@@ -194,11 +198,32 @@ let tableColumns: ColumnsType = [
     title: t('views.faultManage.activeAlarm.clearType'),
     dataIndex: 'clearType',
     align: 'center',
+    customRender(opt) {
+      let clearType: any = {
+        0: '未清除',
+        1: '自动清除',
+        2: '手动清除',
+      };
+      if (clearType[opt.value]) {
+        return clearType[opt.value];
+      }
+      return opt.value;
+    },
   },
   {
     title: t('views.faultManage.activeAlarm.ackState'),
     dataIndex: 'ackState',
     align: 'center',
+    customRender(opt) {
+      let ackState: any = {
+        0: '未确认',
+        1: '已确认',
+      };
+      if (ackState[opt.value]) {
+        return ackState[opt.value];
+      }
+      return opt.value;
+    },
   },
   {
     title: t('views.faultManage.activeAlarm.ackUser'),
@@ -212,6 +237,9 @@ let tableColumns: ColumnsType = [
   },
 ];
 
+// //监听点击的是升序还是降序,还是取消排序
+// const change= (pagination, filters, sorter) => {console.log(sorter)}
+
 /**帮助文档表格字段列 */
 let alarmTableColumns: ColumnsType = [
   {
@@ -368,12 +396,16 @@ type ModalStateType = {
   visibleByEdit: boolean;
   /**显示过滤设置是否显示 */
   visibleByShowSet: boolean;
+  /**个性化设置置是否显示 */
+  visibleByMyselfSet: boolean;
   /**标题 */
   title: string;
   /**表单数据 */
   from: Record<string, any>;
   /**表单数据 */
   showSetFrom: Record<string, any>;
+  // /**表单数据 */
+  // myselfSetFrom: Record<string, any>;
   /**确定按钮 loading */
   confirmLoading: boolean;
 };
@@ -383,6 +415,7 @@ let modalState: ModalStateType = reactive({
   visibleByView: false,
   visibleByEdit: false,
   visibleByShowSet: false,
+  visibleByMyselfSet: false,
   title: '全部信息',
   from: {
     alarmId: '',
@@ -417,6 +450,9 @@ let modalState: ModalStateType = reactive({
     alarm_code: '',
     pv_flag: '',
   },
+  // myselfSetFrom:{
+
+  // }
   confirmLoading: false,
 });
 
@@ -541,7 +577,7 @@ const onSelectChange = (
 };
 
 /**
- * 选中行后的取消确认
+ * 选中行后的取消确认告警
  */
 function fnCancelConfirm() {
   Modal.confirm({
@@ -642,6 +678,34 @@ function fnShowSet() {
     }
   });
 }
+
+/**
+ * 导出全部
+ */
+function fnExportAll(){
+  const key = 'exportAlarm';
+  message.loading({ content: '请稍等...', key });
+  exportAll(queryParams)
+      .then(res => {
+        if (res.code === RESULT_CODE_SUCCESS) {
+          message.success({
+            content: `已完成导出`,
+            key,
+            duration: 3,
+          });
+          writeSheet(res.data, 'alarm').then(fileBlob =>
+            saveAs(fileBlob, `alarm_${Date.now()}.xlsx`)
+          );
+        } else {
+          message.error({
+            content: `${res.msg}`,
+            key,
+            duration: 3,
+          });
+        }
+      })
+
+}
 /**
  * 对话框弹出关闭执行函数
  * 进行表达规则校验
@@ -874,6 +938,11 @@ onMounted(() => {
             <template #icon> <SettingOutlined /> </template>
             {{ t('views.faultManage.activeAlarm.disPlayFilfter') }}
           </a-button>
+
+          <a-button type="primary" @click.prevent="fnExportAll()">
+            <template #icon> <export-outlined /> </template>
+            {{ t('views.faultManage.activeAlarm.exportAll') }}
+          </a-button>
         </a-space>
       </template>
 
@@ -960,7 +1029,9 @@ onMounted(() => {
       >
         <template #bodyCell="{ column, record }">
           <template v-if="column.key === 'origSeverity'">
-            <a-tag :color="profile.color[record.origSeverity]">{{record.origSeverity}}</a-tag>
+            <a-tag :color="profile.color[record.origSeverity]">{{
+              record.origSeverity
+            }}</a-tag>
           </template>
           <template v-if="column.key === 'alarm_id'">
             <a-space :size="8" align="center">
@@ -1328,7 +1399,7 @@ onMounted(() => {
       </a-form>
     </a-modal>
 
-    <!-- 显示过滤 -->
+    <!-- 显示过滤框 -->
     <a-modal
       width="800px"
       :keyboard="false"
@@ -1422,6 +1493,101 @@ onMounted(() => {
         </a-row>
       </a-form>
     </a-modal>
+
+    <!-- 个性化设置框 -->
+    <a-modal
+      width="800px"
+      :keyboard="false"
+      :mask-closable="false"
+      :visible="modalState.visibleByMyselfSet"
+      :title="modalState.title"
+      :confirm-loading="modalState.confirmLoading"
+      @ok="fnShowModalOk"
+      ok-text="设置"
+      @cancel="fnModalCancel"
+    >
+      <a-form name="modalStateShowFrom" layout="horizontal">
+        <a-row :gutter="16">
+          <a-col :lg="12" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.faultManage.activeAlarm.neType')"
+              name="neType"
+            >
+              <a-input
+                v-model:value="modalState.showSetFrom.ne_type"
+                allow-clear
+              >
+              </a-input>
+            </a-form-item>
+          </a-col>
+          <a-col :lg="12" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.faultManage.activeAlarm.neId')"
+              name="ackState"
+            >
+              <a-input v-model:value="modalState.showSetFrom.ne_id" allow-clear>
+              </a-input>
+            </a-form-item>
+          </a-col>
+        </a-row>
+
+        <a-row :gutter="16">
+          <a-col :lg="12" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.faultManage.activeAlarm.pvFlag')"
+              name="neType"
+            >
+              <a-select
+                v-model:value="modalState.showSetFrom.pv_flag"
+                style="width: 100%"
+                allow-clear
+                :options="actAlarmOption.pvFlag"
+              />
+            </a-form-item>
+          </a-col>
+          <a-col :lg="12" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.faultManage.activeAlarm.alarmType')"
+              name="ackState"
+            >
+              <a-select
+                v-model:value="modalState.showSetFrom.alarm_type"
+                style="width: 100%"
+                allow-clear
+                :options="actAlarmOption.alarmType"
+              />
+            </a-form-item>
+          </a-col>
+        </a-row>
+        <a-row :gutter="16">
+          <a-col :lg="12" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.faultManage.activeAlarm.origLevel')"
+              name="neType"
+            >
+              <a-select
+                v-model:value="modalState.showSetFrom.orig_severity"
+                style="width: 100%"
+                allow-clear
+                :options="actAlarmOption.origSeverity"
+              />
+            </a-form-item>
+          </a-col>
+          <a-col :lg="12" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.faultManage.activeAlarm.alarmCode')"
+              name="alarmCode"
+            >
+              <a-input
+                v-model:value="modalState.showSetFrom.alarm_code"
+                allow-clear
+              >
+              </a-input>
+            </a-form-item>
+          </a-col>
+        </a-row>
+      </a-form>
+    </a-modal>
   </PageContainer>
 </template>
 

src/views/faultManage/fault-setting/index.vue

@@ -1,11 +1,306 @@
-<script lang="ts" setup>
-import { ref } from 'vue';
+<script setup lang="ts">
+import { useRoute } from 'vue-router';
+import { reactive, ref, onMounted, toRaw } from 'vue';
+import { PageContainer } from '@ant-design-vue/pro-layout';
+import { Form, Modal, message } from 'ant-design-vue/lib';
+import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
+import {
+  getForwardSet,
+  getAlarmSet,
+  updateAlarmSet,
+  updateForwardSet,
+} from '@/api/faultManage/faultSetting';
+import useI18n from '@/hooks/useI18n';
+const { t } = useI18n();
+const route = useRoute();
 
-const msg = ref<string>('愿这世间美好与你环环相扣');
+/**路由标题 */
+let title = ref<string>((route.meta.title as string) ?? '标题');
+
+/**对象信息状态类型 */
+type ModalStateType = {
+  /**标题 */
+  title: string;
+  /**表单数据 */
+  from: Record<string, any>;
+  /**表单数据 loading */
+  fromLoading: boolean;
+  /**确定按钮 loading */
+  confirmLoading: boolean;
+};
+
+/**告警设置信息状态 */
+let alarmState: ModalStateType = reactive({
+  title: '告警设置',
+  from: {
+    historyDuration: '',
+    unit: 'day',
+    syncTaskPeriod: '',
+    alarmStart: '',
+    alarmEnd: '',
+  },
+  fromLoading: true,
+  confirmLoading: true,
+});
+
+/**告警设置信息内表单属性和校验规则 */
+const alarmStateFrom = Form.useForm(
+  alarmState.from,
+  reactive({
+    historyDuration: [
+      {
+        required: true,
+        trigger: 'blur',
+        message: '请输入日志保存时间,最少15天',
+      },
+    ],
+    syncTaskPeriod: [
+      {
+        required: true,
+        trigger: 'blur',
+        message: '请输入告警同步周期',
+      },
+    ],
+    alarmStart: [
+      {
+        required: true,
+        trigger: 'blur',
+        message: '请选择告警同步开始时间',
+      },
+    ],
+    alarmEnd: [
+      {
+        required: true,
+        trigger: 'blur',
+        message: '请选择告警同步结束时间',
+      },
+    ],
+  })
+);
+
+/**告警设置保存 */
+function fnFormLogSetFinish() {
+  alarmStateFrom.validate().then(() => {
+    alarmState.confirmLoading = true;
+    const from = toRaw(alarmState.from);
+    updateAlarmSet(from)
+      .then(res => {
+        if (res.code === RESULT_CODE_SUCCESS && res.data > 0) {
+          message.success(`告警设置保存成功`, 3);
+        } else {
+          message.warning(`告警设置无变更`, 3);
+        }
+      })
+      .finally(() => {
+        alarmState.confirmLoading = false;
+      });
+  });
+}
+
+/**告警前转接口对象信息状态 */
+let forwardState: ModalStateType = reactive({
+  title: '告警前转接口设置',
+  from: {
+    interface: 'email',
+    forObject: '',
+  },
+  fromLoading: true,
+  confirmLoading: true,
+});
+
+/**告警前转接口对象信息内表单属性和校验规则 */
+const forwardStateFrom = Form.useForm(
+  forwardState.from,
+  reactive({
+    forObject: [
+      {
+        required: true,
+        message: '请输入前转对象',
+      },
+    ],
+  })
+);
+
+/**告警前转接口对象保存 */
+function fnFormForwardFinish() {
+  forwardStateFrom.validate().then(() => {
+    forwardState.confirmLoading = true;
+    const from = toRaw(forwardState.from);
+    updateForwardSet(from)
+      .then(res => {
+        if (res.code === RESULT_CODE_SUCCESS) {
+          message.success(`告警前转接口设置保存成功`, 3);
+        } else {
+          message.warning(`告警前转接口设置无变更`, 3);
+        }
+      })
+      .finally(() => {
+        forwardState.confirmLoading = false;
+      });
+  });
+}
+
+onMounted(() => {
+  Promise.allSettled([getAlarmSet(), getForwardSet()]).then(resArr => {
+    // 查询告警设置
+    if (resArr[0].status === 'fulfilled') {
+      const result = resArr[0].value;
+      if (result.code === RESULT_CODE_SUCCESS) {
+        alarmState.from = Object.assign(alarmState.from, result.data);
+        alarmState.fromLoading = false;
+        alarmState.confirmLoading = false;
+      }
+    }
+    // 查询告警前转接口设置
+    if (resArr[1].status === 'fulfilled') {
+      const result = resArr[1].value;
+      if (result.code === RESULT_CODE_SUCCESS) {
+        forwardState.from = Object.assign(forwardState.from, result.data);
+        forwardState.fromLoading = false;
+        forwardState.confirmLoading = false;
+      }
+    }
+  });
+});
 </script>
 
 <template>
-  <h1>{{ msg }}</h1>
+  <PageContainer :title="title">
+    <a-row :gutter="16">
+      <a-col :span="8">
+        <!-- 日志设置 -->
+        <a-card :title="alarmState.title" :loading="alarmState.fromLoading">
+          <template #extra>
+            <a-space :size="8" align="center">
+              <a-button
+                type="primary"
+                :loading="alarmState.confirmLoading"
+                @click.prevent="fnFormLogSetFinish"
+              >
+                <template #icon><SaveOutlined /></template>
+                保存设置
+              </a-button>
+            </a-space>
+          </template>
+          <a-form
+            name="alarmState.from"
+            layout="horizontal"
+            autocomplete="off"
+            :label-col="{ span: 8 }"
+          >
+            <a-form-item
+              label="历史告警保存时间(天)"
+              name="historyDuration"
+              v-bind="alarmStateFrom.validateInfos.historyDuration"
+            >
+              <a-input-number
+                v-model:value="alarmState.from.historyDuration"
+                placeholder="15"
+                :min="15"
+              />
+            </a-form-item>
+            <a-form-item
+              label="告警同步周期单位"
+              name="unit"
+              v-bind="alarmStateFrom.validateInfos.unit"
+            >
+              <a-select v-model:value="alarmState.from.unit">
+                <a-select-option key="hour" value="hour">小时</a-select-option>
+                <a-select-option key="day" value="day">天</a-select-option>
+              </a-select>
+            </a-form-item>
+            <a-form-item
+              label="告警同步周期"
+              name="syncTaskPeriod"
+              v-bind="alarmStateFrom.validateInfos.syncTaskPeriod"
+            >
+              <a-input-number
+                v-model:value="alarmState.from.syncTaskPeriod"
+                placeholder="10"
+                :min="10"
+              />
+            </a-form-item>
+            <a-form-item
+              label="告警同步开始时间"
+              name="alarmStart"
+              v-bind="alarmStateFrom.validateInfos.alarmStart"
+            >
+              <a-date-picker
+                show-time
+                placeholder="Select Time"
+                v-model:value="alarmState.from.alarmStart"
+                value-format="YYYY-MM-DD HH:mm:ss"
+                format="YYYY-MM-DD HH:mm:ss"
+              />
+            </a-form-item>
+            <a-form-item
+              label="告警同步结束时间"
+              name="alarmEnd"
+              v-bind="alarmStateFrom.validateInfos.alarmEnd"
+            >
+              <a-date-picker
+                show-time
+                placeholder="Select Time"
+                v-model:value="alarmState.from.alarmEnd"
+                value-format="YYYY-MM-DD HH:mm:ss"
+                format="YYYY-MM-DD HH:mm:ss"
+              />
+            </a-form-item>
+          </a-form>
+        </a-card>
+      </a-col>
+
+      <a-col :span="8">
+        <!-- 告警前转接口设置-->
+        <a-card :title="forwardState.title" :loading="forwardState.fromLoading">
+          <template #extra>
+            <a-space :size="8" align="center">
+              <a-button
+                type="primary"
+                :loading="forwardState.confirmLoading"
+                @click.prevent="fnFormForwardFinish"
+              >
+                <template #icon><SaveOutlined /></template>
+                保存设置
+              </a-button>
+            </a-space>
+          </template>
+          <a-form
+            name="forwardState"
+            layout="horizontal"
+            autocomplete="off"
+            :label-col="{ span: 8 }"
+          >
+            <a-form-item label="告警前转接口类型" name="interface">
+              <a-select v-model:value="forwardState.from.interface">
+                <a-select-option key="sms" value="sms">SMS</a-select-option>
+                <a-select-option key="email" value="email"
+                  >Email</a-select-option
+                >
+              </a-select>
+            </a-form-item>
+            <a-form-item
+              label="告警前转对象"
+              name="forObject"
+              v-bind="forwardStateFrom.validateInfos.forObject"
+            >
+              <a-input
+                v-model:value="forwardState.from.forObject"
+                allow-clear
+                placeholder="请输入告警前转对象"
+              ></a-input>
+            </a-form-item>
+          </a-form>
+        </a-card>
+      </a-col>
+    </a-row>
+  </PageContainer>
 </template>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.backFile-download {
+  margin-left: 12px;
+  color: #eb2f96;
+  text-decoration: underline;
+}
+</style>