diff --git a/src/api/faultManage/actAlarm.ts b/src/api/faultManage/actAlarm.ts
index 7e4cd61e..f27636be 100644
--- a/src/api/faultManage/actAlarm.ts
+++ b/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;
+}
diff --git a/src/api/faultManage/faultSetting.ts b/src/api/faultManage/faultSetting.ts
new file mode 100644
index 00000000..4cf983ee
--- /dev/null
+++ b/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';
+
+/**
+ * ��ѯ�澯����
+ * @param tag ����ID
+ * @returns object
+ */
+export async function getAlarmSet() {
+  let arr = [];
+
+  // ��ʷ�澯����ʱ��
+  const logDurationResult = await request({
+    url: `/databaseManagement/v1/omc_db/config`,
+    method: 'get',
+    params: {
+      SQL: `SELECT * FROM config WHERE config_tag = 'historyDuration'`,
+    },
+  });
+  arr.push(logDurationResult);
+  // ͬ������
+  const logCapacityResult = await request({
+    url: `/databaseManagement/v1/omc_db/config`,
+    method: 'get',
+    params: {
+      SQL: `SELECT * FROM config WHERE config_tag = 'syncTaskPeriod'`,
+    },
+  });
+  arr.push(logCapacityResult);
+
+  // ��������
+  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;
+      // ��������
+      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;
+}
+
+/**
+ * �޸ĸ澯����
+ * @param data ���ö���
+ * @returns object
+ */
+export async function updateAlarmSet(data: Record<string, any>) {
+  let { historyDuration, ...syncTaskPeriodJson } = data;
+
+  let historyDurationJson = { historyDuration };
+
+  let arr = [];
+
+  // ��ʷ�澯����ʱ��
+  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);
+  // ͬ������
+  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);
+
+  // ��������
+  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;
+      // ��������
+      let itemData = itemV.data.data;
+      if (itemV.code === RESULT_CODE_SUCCESS && itemData) {
+        let rows = itemData.affectedRows;
+        if (rows) {
+          resultNum += rows;
+        }
+      }
+    }
+    // �ޱ��ʱ
+    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;
+}
+
+/**
+ * ��ѯ�澯ǰת�ӿ�����
+ * @param tag ����ID
+ * @returns object
+ */
+export async function getForwardSet() {
+  // ��������
+  const result = await request({
+    url: `/databaseManagement/v1/omc_db/config`,
+    method: 'get',
+    params: {
+      SQL: `SELECT * FROM config WHERE config_tag = 'forwardAlarm'`,
+    },
+  });
+  // ��������
+  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;
+}
+
+/**
+ * �޸ĸ澯ǰת�ӿ�����
+ * @param data ���ö���
+ * @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) } },
+  });
+  // ��������
+  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;
+}
+
+
+
+
+
+
+
+
+
diff --git a/src/api/faultManage/historyAlarm.ts b/src/api/faultManage/historyAlarm.ts
new file mode 100644
index 00000000..540602a5
--- /dev/null
+++ b/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';
+
+/**
+ * ��ѯ�б�
+ * @param query ��ѯ����
+ * @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'`;
+  // ��ѯ
+  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 pageNum = (query.pageNum - 1) * query.pageSize;
+  const limtSql = ` order by clear_time desc limit ${pageNum},${query.pageSize} `;
+
+  // ��������
+  const result = await request({
+    url: `/databaseManagement/v1/select/omc_db/alarm`,
+    method: 'get',
+    params: {
+      SQL: totalSQL + querySQL,
+      rowsSQL: rowsSQL + querySQL + limtSql,
+    },
+  });
+
+  // ��������
+  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;
+}
+
+/**
+ * ȷ�ϸ澯��Ϣ
+ * @param data ��Ȩ����
+ * @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,
+  });
+}
+
+/**
+ * ȡ��ȷ�ϸ澯
+ * @param data ��Ȩ����
+ * @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,
+  });
+}
+
+
+
+
+
+/**
+ * ��ʷ�澯����
+ * @param query ��ѯ����
+ * @returns bolb
+ */
+export async function exportAll(query: Record<string, any>) {
+  let rowsSQL = `select * from alarm where alarm_status='0'`;
+  // ��ѯ
+  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;
+}
+
diff --git a/src/views/faultManage/active-alarm/index.vue b/src/views/faultManage/active-alarm/index.vue
index c913460e..36133a99 100644
--- a/src/views/faultManage/active-alarm/index.vue
+++ b/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>
 
diff --git a/src/views/faultManage/fault-setting/index.vue b/src/views/faultManage/fault-setting/index.vue
index a66e68de..f8295586 100644
--- a/src/views/faultManage/fault-setting/index.vue
+++ b/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>
diff --git a/src/views/faultManage/history-alarm/index.vue b/src/views/faultManage/history-alarm/index.vue
index a66e68de..4ca17aae 100644
--- a/src/views/faultManage/history-alarm/index.vue
+++ b/src/views/faultManage/history-alarm/index.vue
@@ -1,11 +1,1135 @@
-<script lang="ts" setup>
-import { ref } from 'vue';
+<script setup lang="ts">
+import { useRoute } from 'vue-router';
+import dayjs, { Dayjs } from 'dayjs';
+import { reactive, ref, onMounted, toRaw } from 'vue';
+import { PageContainer } from '@ant-design-vue/pro-layout';
+import { message, Modal } from 'ant-design-vue/lib';
+import { SizeType } from 'ant-design-vue/lib/config-provider';
+import { MenuInfo } from 'ant-design-vue/lib/menu/src/interface';
+import { ColumnsType } from 'ant-design-vue/lib/table';
+import useUserStore from '@/store/modules/user';
+import {
+  listAct,
+  updateConfirm,
+  cancelConfirm,
+  exportAll
+} from '@/api/faultManage/historyAlarm';
+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();
+const route = useRoute();
+type RangeValue = [Dayjs, Dayjs];
+/**路由标题 */
+let title = ref<string>((route.meta.title as string) ?? '标题');
 
-const msg = ref<string>('愿这世间美好与你环环相扣');
+/**记录开始结束时间 */
+let queryRangePicker = ref<[string, string]>(['', '']);
+
+/**查询参数 */
+let queryParams = reactive({
+  /**告警设备类型 */
+  ne_type: '',
+  /**告警网元名称 */
+  ne_name: '',
+  /**告警网元标识 */
+  ne_id: '',
+  /**告警编号 */
+  alarm_code: '',
+  /**告警级别 */
+  orig_severity: '',
+  beginTime: '',
+  endTime: '',
+  /**告警产生时间 */
+  eventTime: (queryRangePicker.value = ['', '']),
+  /**虚拟化标识 */
+  pv_flag: '',
+  /**告警类型 */
+  alarm_type: '',
+  /**当前页数 */
+  pageNum: 1,
+  /**每页条数 */
+  pageSize: 20,
+});
+
+/**查询参数重置 */
+function fnQueryReset() {
+  queryParams = Object.assign(queryParams, {
+    /**告警设备类型 */
+    ne_type: '',
+    /**告警网元名称 */
+    ne_name: '',
+    /**告警网元标识 */
+    ne_id: '',
+    /**告警编号 */
+    alarm_code: '',
+    /**告警级别 */
+    orig_severity: '',
+    /**告警产生时间 */
+    eventTime: (queryRangePicker.value = ['', '']),
+    /**虚拟化标识 */
+    pv_flag: '',
+    /**告警类型 */
+    alarm_type: '',
+    /**当前页数 */
+  });
+  tablePagination.current = 1;
+  tablePagination.pageSize = 20;
+  fnGetList();
+}
+
+/**表格状态类型 */
+type TabeStateType = {
+  /**加载等待 */
+  loading: boolean;
+  /**紧凑型 */
+  size: SizeType;
+  /**搜索栏 */
+  seached: boolean;
+  /**记录数据 */
+  data: object[];
+  /**勾选记录 */
+  selectedRowKeys: (string | number)[];
+};
+
+/**表格状态 */
+let tableState: TabeStateType = reactive({
+  loading: false,
+  size: 'middle',
+  seached: true,
+  data: [],
+  selectedRowKeys: [],
+});
+
+/**帮助文档表格状态 */
+let alarmTableState: TabeStateType = reactive({
+  loading: false,
+  size: 'middle',
+  seached: true,
+  data: [],
+  selectedRowKeys: [],
+});
+
+/**表格字段列 */
+let tableColumns: ColumnsType = [
+  {
+    title: t('views.faultManage.activeAlarm.alarmId'),
+    dataIndex: 'alarmId',
+    align: 'center',
+  },
+  {
+    title: t('views.faultManage.activeAlarm.neId'),
+    dataIndex: 'neId',
+    align: 'center',
+  },
+  {
+    title: t('views.faultManage.activeAlarm.neName'),
+    dataIndex: 'neName',
+    align: 'center',
+  },
+  {
+    title: t('views.faultManage.activeAlarm.neType'),
+    dataIndex: 'neType',
+    align: 'center',
+  },
+  {
+    title: t('views.faultManage.activeAlarm.origLevel'),
+    align: 'center',
+    key: 'origSeverity',
+  },
+  {
+    title: t('views.faultManage.activeAlarm.alarmCode'),
+    dataIndex: 'alarmCode',
+    align: 'center',
+  },
+  {
+    title: t('views.faultManage.activeAlarm.alarmTitle'),
+    dataIndex: 'alarmTitle',
+    align: 'center',
+  },
+  {
+    title: t('views.faultManage.activeAlarm.eventTime'),
+    dataIndex: 'eventTime',
+    align: 'center',
+  },
+  {
+    title: t('views.faultManage.activeAlarm.alarmType'),
+    dataIndex: 'alarmType',
+    align: 'center',
+    customRender(opt) {
+      let levelName: any = {
+        CommunicationAlarm: '通信告警',
+        EquipmentAlarm: '设备告警',
+        ProcessingFailure: '处理错误告警',
+        EnvironmentalAlarm: '环境告警',
+        QualityOfServiceAlarm: '服务质量告警',
+      };
+      if (levelName[opt.value]) {
+        return levelName[opt.value];
+      }
+      return opt.value;
+    },
+  },
+  {
+    title: t('views.faultManage.activeAlarm.pvFlag'),
+    dataIndex: 'pvFlag',
+    align: 'center',
+  },
+  {
+    title: t('views.faultManage.activeAlarm.clearUser'),
+    dataIndex: 'clearUser',
+    align: 'center',
+  },
+  {
+    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'),
+    dataIndex: 'ackUser',
+    align: 'center',
+  },
+  {
+    title: t('common.operate'),
+    key: 'alarm_id',
+    align: 'center',
+  },
+];
+
+/**表格分页器参数 */
+let tablePagination = reactive({
+  /**当前页数 */
+  current: 1,
+  /**每页条数 */
+  pageSize: 20,
+  /**默认的每页条数 */
+  defaultPageSize: 20,
+  /**指定每页可以显示多少条 */
+  pageSizeOptions: ['10', '20', '50', '100'],
+  /**只有一页时是否隐藏分页器 */
+  hideOnSinglePage: false,
+  /**是否可以快速跳转至某页 */
+  showQuickJumper: true,
+  /**是否可以改变 pageSize */
+  showSizeChanger: true,
+  /**数据总数 */
+  total: 0,
+  showTotal: (total: number) => t('common.tablePaginationTotal', { total }),
+  onChange: (page: number, pageSize: number) => {
+    tablePagination.current = page;
+    tablePagination.pageSize = pageSize;
+    queryParams.pageNum = page;
+    queryParams.pageSize = pageSize;
+    fnGetList();
+  },
+});
+
+/**表格紧凑型变更操作 */
+function fnTableSize({ key }: MenuInfo) {
+  tableState.size = key as SizeType;
+}
+
+/**表格所需option */
+const actAlarmOption = reactive({
+  pvFlag: [
+    { label: 'PNF', value: 'PNF' },
+    { label: 'VNF', value: 'VNF' },
+  ],
+  alarmType: [
+    {
+      label: t('views.faultManage.activeAlarm.communicationAlarm'),
+      value: 'CommunicationAlarm',
+    },
+    {
+      label: t('views.faultManage.activeAlarm.equipmentAlarm'),
+      value: 'EquipmentAlarm',
+    },
+    {
+      label: t('views.faultManage.activeAlarm.processingFailure'),
+      value: 'ProcessingFailure',
+    },
+    {
+      label: t('views.faultManage.activeAlarm.environmentalAlarm'),
+      value: 'EnvironmentalAlarm',
+    },
+    {
+      label: t('views.faultManage.activeAlarm.qualityOfServiceAlarm'),
+      value: 'QualityOfServiceAlarm',
+    },
+  ],
+  origSeverity: [
+    { label: t('views.faultManage.activeAlarm.critical'), value: 'Critical' },
+    { label: t('views.faultManage.activeAlarm.major'), value: 'Major' },
+    { label: t('views.faultManage.activeAlarm.minor'), value: 'Minor' },
+    { label: t('views.faultManage.activeAlarm.warning'), value: 'Warning' },
+    { label: t('views.faultManage.activeAlarm.eventAlarm'), value: 'Event' },
+  ],
+  clearType: [
+    { label: '告警未清除', value: 0 },
+    { label: '自动清除', value: 1 },
+    { label: '手动清除', value: 2 },
+  ],
+  ackState: [
+    { label: '未确认', value: 0 },
+    { label: '已确认', value: 1 },
+  ],
+});
+
+/**对话框对象信息状态类型 */
+type ModalStateType = {
+  /**详情框是否显示 */
+  visibleByView: boolean;
+  /**新增框或修改框是否显示 */
+  visibleByEdit: boolean;
+  /**显示过滤设置是否显示 */
+  visibleByShowSet: boolean;
+  /**个性化设置置是否显示 */
+  visibleByMyselfSet: boolean;
+  /**标题 */
+  title: string;
+  /**表单数据 */
+  from: Record<string, any>;
+  /**表单数据 */
+  showSetFrom: Record<string, any>;
+  // /**表单数据 */
+  // myselfSetFrom: Record<string, any>;
+  /**确定按钮 loading */
+  confirmLoading: boolean;
+};
+
+/**对话框对象信息状态 */
+let modalState: ModalStateType = reactive({
+  visibleByView: false,
+  visibleByEdit: false,
+  visibleByShowSet: false,
+  visibleByMyselfSet: false,
+  title: '全部信息',
+  from: {
+    alarmId: '',
+    alarmSeq: '',
+    neId: '',
+    neName: '',
+    neType: '',
+    alarmCode: '',
+    alarmTitle: '',
+    eventTime: '',
+    alarmType: '',
+    pvFlag: '',
+    objectName: '',
+    locationInfo: '',
+    province: '',
+    alarmStatus: '',
+    specificProblemId: '',
+    specificProblem: '',
+    addInfo: '',
+    clearType: '',
+    clearTime: '',
+    ackState: '',
+    ackUser: '',
+    ackTime: '',
+    origSeverity: '',
+  },
+  showSetFrom: {
+    ne_type: '',
+    ne_id: '',
+    alarm_type: '',
+    orig_severity: '',
+    alarm_code: '',
+    pv_flag: '',
+  },
+  // myselfSetFrom:{
+
+  // }
+  confirmLoading: false,
+});
+
+/**
+ * 对话框弹出显示为 查看
+ * @param row 单行记录信息
+ */
+function fnModalVisibleByVive(row: Record<string, any>) {
+  modalState.from = Object.assign(modalState.from, row);
+  modalState.title = `查看${row.alarmId} 记录信息`;
+  modalState.visibleByView = true;
+}
+
+/**
+ * 对话框弹出确认执行  确认查阅函数
+ */
+function fnModalOk() {
+  modalState.confirmLoading = true;
+  const from = toRaw(modalState.from);
+  if (from.ackState) {
+    message.error({
+      content: t('views.faultManage.activeAlarm.ackError'),
+      duration: 3,
+    });
+    modalState.visibleByView = false;
+    return false;
+  }
+  const result = updateConfirm(from);
+  const hide = message.loading({ content: t('common.loading') });
+  result
+    .then(res => {
+      if (res.code === RESULT_CODE_SUCCESS) {
+        message.success({
+          content: t('common.msgSuccess', { msg: modalState.title }),
+          duration: 3,
+        });
+        modalState.visibleByView = false;
+        fnGetList();
+      } else {
+        message.error({
+          content: `${res.msg}`,
+          duration: 3,
+        });
+      }
+    })
+    .finally(() => {
+      hide();
+      modalState.confirmLoading = false;
+    });
+}
+
+/**表格状态 */
+const state = reactive<{
+  selectedRowKeys: (string | number)[];
+  selectedRow: Record<string, any>;
+  loading: boolean;
+}>({
+  selectedRowKeys: [], // Check here to configure the default column
+  selectedRow: {},
+  loading: false,
+});
+
+/**监听多选 */
+const onSelectChange = (
+  keys: (string | number)[],
+  record: Record<string, any>
+) => {
+  state.selectedRowKeys = keys;
+  state.selectedRow = record;
+};
+
+/**
+ * 选中行后的取消确认告警
+ */
+function fnCancelConfirm() {
+  Modal.confirm({
+    title: 'Tip',
+    content: `确认是否取消确认告警?`,
+    onOk() {
+      const hide = message.loading('请稍等...', 0);
+      cancelConfirm(state.selectedRowKeys).then(res => {
+        hide();
+        if (res.code === RESULT_CODE_SUCCESS) {
+          message.success({
+            content: `取消确认告警成功`,
+            duration: 2,
+          });
+          fnGetList();
+        } else {
+          message.error({
+            content: `${res.msg}`,
+            duration: 2,
+          });
+        }
+      });
+    },
+  });
+}
+
+
+/**
+ * 导出全部
+ */
+ function fnExportAll(){
+  const key = 'exportAlarmHis';
+  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, `history-alarm_${Date.now()}.xlsx`)
+          );
+        } else {
+          message.error({
+            content: `${res.msg}`,
+            key,
+            duration: 3,
+          });
+        }
+      })
+
+}
+
+/**
+ * 对话框弹出关闭执行函数
+ * 进行表达规则校验
+ */
+function fnModalCancel() {
+  modalState.visibleByEdit = false;
+  modalState.visibleByView = false;
+  modalState.visibleByShowSet = false;
+}
+
+/**查询列表 */
+function fnGetList() {
+  if (tableState.loading) return;
+  tableState.loading = true;
+  if (!queryRangePicker.value) {
+    queryRangePicker.value = ['', ''];
+  }
+  queryParams.beginTime = queryRangePicker.value[0];
+  queryParams.endTime = queryRangePicker.value[1];
+  listAct(toRaw(queryParams)).then(res => {
+    if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.rows)) {
+      // 取消勾选
+      if (state.selectedRowKeys.length > 0) {
+        state.selectedRowKeys = [];
+      }
+      tablePagination.total = res.total;
+      tableState.data = res.rows;
+    } else {
+      tablePagination.total = 0;
+      tableState.data = [];
+    }
+    tableState.loading = false;
+  });
+}
+
+const profile = useUserStore().profile;
+onMounted(() => {
+  fnGetList();
+});
 </script>
 
 <template>
-  <h1>{{ msg }}</h1>
+  <PageContainer :title="title">
+    <a-card
+      v-show="tableState.seached"
+      :bordered="false"
+      :body-style="{ marginBottom: '24px', paddingBottom: 0 }"
+    >
+      <!-- 表格搜索栏 -->
+      <a-form :model="queryParams" name="queryParams" layout="horizontal">
+        <a-row :gutter="16">
+          <a-col :lg="6" :md="12" :xs="24">
+            <!-- <a-form-item :label="t('views.neUser.ue.neType')" name="neId ">
+              <a-select
+                v-model:value="queryParams.neId"
+                :options="neOtions"
+                :placeholder="t('views.neUser.ue.neTypePlease')"
+              />
+            </a-form-item> -->
+            <a-form-item
+              :label="t('views.faultManage.activeAlarm.neType')"
+              name="ne_type"
+            >
+              <a-input
+                v-model:value="queryParams.ne_type"
+                allow-clear
+                placeholder="查询告警设备类型"
+              ></a-input>
+            </a-form-item>
+          </a-col>
+          <a-col :lg="6" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.faultManage.activeAlarm.neName')"
+              name="ne_name"
+            >
+              <a-input
+                v-model:value="queryParams.ne_name"
+                allow-clear
+                placeholder="查询告警网元名称"
+              ></a-input>
+            </a-form-item>
+          </a-col>
+          <a-col :lg="6" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.faultManage.activeAlarm.neId')"
+              name="ne_id"
+            >
+              <a-input
+                v-model:value="queryParams.ne_id"
+                allow-clear
+                placeholder="查询告警网元标识"
+              ></a-input>
+            </a-form-item>
+          </a-col>
+
+          <a-col :lg="6" :md="12" :xs="24">
+            <a-form-item>
+              <a-space :size="8">
+                <a-button type="primary" @click.prevent="fnGetList">
+                  <template #icon><SearchOutlined /></template>
+                  {{ t('common.search') }}
+                </a-button>
+                <a-button type="default" @click.prevent="fnQueryReset">
+                  <template #icon><ClearOutlined /></template>
+                  {{ t('common.reset') }}
+                </a-button>
+              </a-space>
+            </a-form-item>
+          </a-col>
+        </a-row>
+        <a-row :gutter="16">
+          <a-col :lg="6" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.faultManage.activeAlarm.alarmCode')"
+              name="alarm_code"
+            >
+              <a-input
+                v-model:value="queryParams.alarm_code"
+                allow-clear
+                placeholder="查询告警编号"
+              ></a-input>
+            </a-form-item>
+          </a-col>
+          <a-col :lg="6" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.faultManage.activeAlarm.origLevel')"
+              name="orig_severity"
+            >
+              <a-select
+                v-model:value="queryParams.orig_severity"
+                placeholder="Select alarm Type"
+                show-search
+                allow-clear
+                :options="actAlarmOption.origSeverity"
+              />
+            </a-form-item>
+          </a-col>
+          <a-col :lg="6" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.faultManage.activeAlarm.eventTime')"
+              name="eventTime"
+            >
+              <a-range-picker
+                v-model:value="queryRangePicker"
+                value-format="YYYY-MM-DD HH:mm:ss"
+                format="YYYY-MM-DD HH:mm:ss"
+                show-time
+                style="width: 400px"
+              />
+            </a-form-item>
+          </a-col>
+        </a-row>
+        <a-row :gutter="16">
+          <a-col :lg="6" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.faultManage.activeAlarm.pvFlag')"
+              name="pv_flag"
+            >
+              <a-select
+                v-model:value="queryParams.pv_flag"
+                placeholder="Select a person"
+                show-search
+                :options="actAlarmOption.pvFlag"
+              />
+              <!-- <a-select-option value="'PNF'">PNF</a-select-option>
+                <a-select-option value="'VNF'">VNF</a-select-option>
+              </a-select> -->
+            </a-form-item>
+          </a-col>
+          <a-col :lg="6" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.faultManage.activeAlarm.alarmType')"
+              name="alarm_type"
+            >
+              <a-select
+                v-model:value="queryParams.alarm_type"
+                placeholder="Select alarm Type"
+                show-search
+                :options="actAlarmOption.alarmType"
+              />
+            </a-form-item>
+          </a-col>
+        </a-row>
+      </a-form>
+    </a-card>
+
+    <a-card :bordered="false" :body-style="{ padding: '0px' }">
+      <!-- 插槽-卡片左侧侧 -->
+      <template #title>
+        <a-space :size="8" align="center">
+          <a-button
+            type="primary"
+            @click.prevent="fnCancelConfirm()"
+            :disabled="state.selectedRowKeys.length <= 0"
+          >
+            <template #icon>
+              <CloseOutlined />
+            </template>
+            {{ t('views.faultManage.activeAlarm.updateConfirm') }}
+          </a-button>
+          <a-button type="primary" @click.prevent="fnExportAll()">
+            <template #icon> <export-outlined /> </template>
+            {{ t('views.faultManage.activeAlarm.exportAll') }}
+          </a-button>
+        </a-space>
+      </template>
+
+      <!-- 插槽-卡片右侧 -->
+      <template #extra>
+        <a-space :size="8" align="center">
+          <a-tooltip>
+            <template #title>{{ t('common.searchBarText') }}</template>
+            <a-switch
+              v-model:checked="tableState.seached"
+              :checked-children="t('common.switch.show')"
+              :un-checked-children="t('common.switch.hide')"
+              size="small"
+            />
+          </a-tooltip>
+          <a-tooltip>
+            <template #title>{{ t('common.reloadText') }}</template>
+            <a-button type="text" @click.prevent="fnGetList">
+              <template #icon><ReloadOutlined /></template>
+            </a-button>
+          </a-tooltip>
+          <a-tooltip>
+            <template #title>{{ t('common.sizeText') }}</template>
+            <a-dropdown trigger="click">
+              <a-button type="text">
+                <template #icon><ColumnHeightOutlined /></template>
+              </a-button>
+              <template #overlay>
+                <a-menu
+                  :selected-keys="[tableState.size as string]"
+                  @click="fnTableSize"
+                >
+                  <a-menu-item key="default">{{
+                    t('common.size.default')
+                  }}</a-menu-item>
+                  <a-menu-item key="middle">{{
+                    t('common.size.middle')
+                  }}</a-menu-item>
+                  <a-menu-item key="small">{{
+                    t('common.size.small')
+                  }}</a-menu-item>
+                </a-menu>
+              </template>
+            </a-dropdown>
+          </a-tooltip>
+        </a-space>
+      </template>
+
+      <!-- 表格列表 -->
+      <a-table
+        class="table"
+        row-key="id"
+        :columns="tableColumns"
+        :loading="tableState.loading"
+        :data-source="tableState.data"
+        :size="tableState.size"
+        :row-selection="{
+          selectedRowKeys: state.selectedRowKeys,
+          onChange: onSelectChange,
+        }"
+        :pagination="tablePagination"
+        :scroll="{ x: true }"
+      >
+        <template #bodyCell="{ column, record }">
+          <template v-if="column.key === 'origSeverity'">
+            <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">
+              <a-tooltip>
+                <template #title>查看详情</template>
+                <a-button
+                  type="link"
+                  @click.prevent="fnModalVisibleByVive(record)"
+                >
+                  <template #icon><InfoCircleOutlined /></template>
+                </a-button>
+              </a-tooltip>
+            </a-space>
+          </template>
+        </template>
+      </a-table>
+    </a-card>
+
+    <!-- 详情框 -->
+    <a-modal
+      width="800px"
+      :keyboard="false"
+      :mask-closable="false"
+      :visible="modalState.visibleByView"
+      :title="modalState.title"
+      :confirm-loading="modalState.confirmLoading"
+      @ok="fnModalOk"
+      ok-text="查阅"
+      @cancel="fnModalCancel"
+    >
+      <a-form name="modalStateFrom" layout="horizontal">
+        <a-row :gutter="16">
+          <a-col :lg="12" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.faultManage.activeAlarm.alarmId')"
+              name="alarmId"
+            >
+              <a-input
+                v-model:value="modalState.from.alarmId"
+                disabled
+                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.alarmSeq')"
+              name="alarmSeq"
+            >
+              <a-input
+                v-model:value="modalState.from.alarmSeq"
+                disabled
+                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.neId')"
+              name="neId"
+            >
+              <a-input
+                v-model:value="modalState.from.neId"
+                disabled
+                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.neName')"
+              name="neName"
+            >
+              <a-input
+                v-model:value="modalState.from.neName"
+                disabled
+                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.neType')"
+              name="neType"
+            >
+              <a-input
+                v-model:value="modalState.from.neType"
+                disabled
+                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.alarmCode')"
+              name="alarmCode"
+            >
+              <a-input
+                v-model:value="modalState.from.alarmCode"
+                disabled
+                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.alarmTitle')"
+              name="alarmTitle"
+            >
+              <a-input
+                v-model:value="modalState.from.alarmTitle"
+                disabled
+                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.eventTime')"
+              name="eventTime"
+            >
+              <a-input
+                v-model:value="modalState.from.eventTime"
+                disabled
+                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.alarmTitle')"
+              name="alarmTitle"
+            >
+              <a-input
+                v-model:value="modalState.from.alarmTitle"
+                disabled
+                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.alarmType')"
+              name="alarmType"
+            >
+              <a-select
+                v-model:value="modalState.from.alarmType"
+                style="width: 100%"
+                :options="actAlarmOption.alarmType"
+                disabled
+              >
+              </a-select>
+            </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="pvFlag"
+            >
+              <a-input
+                v-model:value="modalState.from.pvFlag"
+                disabled
+                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.objectName')"
+              name="objectName"
+            >
+              <a-input
+                v-model:value="modalState.from.objectName"
+                disabled
+                allow-clear
+              >
+              </a-input>
+            </a-form-item>
+          </a-col>
+        </a-row>
+
+        <a-form-item
+          :label="t('views.faultManage.activeAlarm.locationInfo')"
+          name="locationInfo"
+        >
+          <a-textarea
+            v-model:value="modalState.from.locationInfo"
+            placeholder="Autosize height with minimum and maximum number of lines"
+            :auto-size="{ minRows: 1, maxRows: 5 }"
+            disabled
+          />
+        </a-form-item>
+        <a-row :gutter="16">
+          <a-col :lg="12" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.faultManage.activeAlarm.province')"
+              name="province"
+            >
+              <a-input
+                v-model:value="modalState.from.province"
+                disabled
+                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.origLevel')"
+              name="origSeverity"
+            >
+              <a-select
+                v-model:value="modalState.from.origSeverity"
+                style="width: 100%"
+                :options="actAlarmOption.origSeverity"
+                disabled
+              >
+              </a-select>
+            </a-form-item>
+          </a-col>
+        </a-row>
+
+        <a-form-item
+          :label="t('views.faultManage.activeAlarm.addInfo')"
+          name="addInfo"
+        >
+          <a-textarea
+            v-model:value="modalState.from.addInfo"
+            :auto-size="{ minRows: 1, maxRows: 5 }"
+            disabled
+          />
+        </a-form-item>
+        <a-form-item
+          :label="t('views.faultManage.activeAlarm.specificProblemId')"
+          name="specificProblemId"
+        >
+          <a-input
+            v-model:value="modalState.from.specificProblemId"
+            disabled
+            allow-clear
+          >
+          </a-input>
+        </a-form-item>
+
+        <a-form-item
+          :label="t('views.faultManage.activeAlarm.specificProblem')"
+          name="specificProblem"
+        >
+          <a-textarea
+            v-model:value="modalState.from.specificProblem"
+            :auto-size="{ minRows: 1, maxRows: 5 }"
+            disabled
+          />
+        </a-form-item>
+        <a-row :gutter="16">
+          <a-col :lg="12" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.faultManage.activeAlarm.clearType')"
+              name="clearType"
+            >
+              <a-select
+                v-model:value="modalState.from.clearType"
+                style="width: 100%"
+                :options="actAlarmOption.clearType"
+                disabled
+              >
+              </a-select>
+            </a-form-item>
+          </a-col>
+          <a-col :lg="12" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.faultManage.activeAlarm.clearTime')"
+              name="clearTime"
+            >
+              <a-input
+                v-model:value="modalState.from.clearTime"
+                disabled
+                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.ackUser')"
+              name="ackUser"
+            >
+              <a-input
+                v-model:value="modalState.from.ackUser"
+                disabled
+                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.ackState')"
+              name="ackState"
+            >
+              <a-select
+                v-model:value="modalState.from.ackState"
+                style="width: 100%"
+                :options="actAlarmOption.ackState"
+                disabled
+              />
+            </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.ackTime')"
+              name="ackTime"
+            >
+              <a-input
+                v-model:value="modalState.from.ackTime"
+                disabled
+                allow-clear
+              >
+              </a-input>
+            </a-form-item>
+          </a-col>
+        </a-row>
+      </a-form>
+    </a-modal>
+  </PageContainer>
 </template>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.table :deep(.ant-pagination) {
+  padding: 0 24px;
+}
+</style>