---告警帮助文档中英文

src/i18n/locales/en-US.ts

@@ -735,7 +735,7 @@ export default {
         ackTime:'Ack Time',
         ackError:'Please do not confirm again',
         syncMyself:'Manual Synchronization',
-        realTitle:'Title',
+        realTitle:'English Title',
         objectNf:'Object NE',
         helpFile:'Help Documentation',
         set:'Set',

src/utils/execl-utils.ts

@@ -19,8 +19,8 @@ export const xlsxUrl = `${
  *   console.log(res)
  * });
  */
-export async function readLoalXlsx(id: string): Promise<Record<string, any>[]> {
-  let result = await fetch(`${xlsxUrl}/${id}.xlsx`);
+export async function readLoalXlsx(lang:string,id: string): Promise<Record<string, any>[]> {
+  let result = await fetch(`${xlsxUrl}/${lang}/${id}.xlsx`);
   let fileBuffer = await result.arrayBuffer();
   // 判断是否xlsx文件
   const data = new Uint8Array(fileBuffer);
@@ -30,7 +30,7 @@ export async function readLoalXlsx(id: string): Promise<Record<string, any>[]> {
     data[2] === 0x03 &&
     data[3] === 0x04;
   if (!isXlsxFile) {
-    result = await fetch(`${xlsxUrl}/all.xlsx`);
+    result = await fetch(`${xlsxUrl}/${lang}/all.xlsx`);
     fileBuffer = await result.arrayBuffer();
   }
   return readSheet(fileBuffer, 0);

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

@@ -22,7 +22,7 @@ import { writeSheet } from '@/utils/execl-utils';
 import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
 import { readLoalXlsx } from '@/utils/execl-utils';
 const { getDict } = useDictStore();
-const { t } = useI18n();
+const { t,currentLocale } = useI18n();
 
 /**字典数据 */
 let dict: {
@@ -233,65 +233,68 @@ let tableColumns: ColumnsType = [
   },
 ];
 
+									
+
+
 /**帮助文档表格字段列 */
 let alarmTableColumns: ColumnsType = [
   {
     title: t('views.faultManage.activeAlarm.alarmTitle'),
-    dataIndex: '告警名称',
+    dataIndex: 'alarmName',
     align: 'center',
     width: 3,
   },
   {
     title: t('views.faultManage.activeAlarm.locationInfo'),
-    dataIndex: '告警定位信息',
+    dataIndex:  'alarmInfo',
     align: 'center',
     width: 5,
   },
   {
     title: t('views.faultManage.activeAlarm.addInfo'),
-    dataIndex: '告警帮助信息',
+    dataIndex:'helpInfo',
     align: 'center',
     width: 8,
   },
   {
     title: t('views.faultManage.activeAlarm.alarmType'),
-    dataIndex: '告警类型',
+    dataIndex:  'alarmType',
     align: 'center',
     width: 5,
   },
   {
     title: t('views.faultManage.activeAlarm.origLevel'),
-    dataIndex: '告警级别',
+    dataIndex: 'alarmLevel',
     align: 'center',
     width: 3,
   },
   {
     title: t('views.faultManage.activeAlarm.alarmCode'),
-    dataIndex: '告警编号',
+    dataIndex: 'alarmCode',
     align: 'center',
     width: 3,
   },
   {
     title: t('views.faultManage.activeAlarm.specificProblem'),
-    dataIndex: '告警问题原因',
+    dataIndex: 'cause',
     align: 'center',
     width: 5,
   },
   {
     title: t('views.faultManage.activeAlarm.clearType'),
-    dataIndex: '清除类型',
+    dataIndex: 'clearType',
     align: 'center',
     width: 3,
   },
   {
     title: t('views.faultManage.activeAlarm.realTitle'),
-    dataIndex: '英文标题',
+    dataIndex: 'enTitle',
     align: 'center',
     width: 5,
   },
   {
     title: t('views.faultManage.activeAlarm.objectNf'),
-    dataIndex: '适用网元',
+    dataIndex:'objNf',
     align: 'center',
     width: 2,
   },
@@ -338,6 +341,8 @@ type ModalStateType = {
   visibleByEdit: boolean;
   /**显示过滤设置是否显示 */
   visibleByShowSet: boolean;
+  /**告警帮助文档是否显示 */
+  helpShowView: boolean;
   /**个性化设置置是否显示 */
   visibleByMyselfSet: boolean;
   /**标题 */
@@ -355,6 +360,7 @@ let modalState: ModalStateType = reactive({
   visibleByView: false,
   visibleByEdit: false,
   visibleByShowSet: false,
+  helpShowView: false,
   visibleByMyselfSet: false,
   title: '全部信息',
   from: {
@@ -410,22 +416,17 @@ function fnModalVisibleByVive(row: Record<string, any>) {
   modalState.visibleByView = true;
 }
 
-/**告警帮助文档抽屉 初始设置 */
-const visible = ref(false);
-const closeDrawer = () => {
-  visible.value = false;
-};
 
-/**抽屉 告警帮助文档详细信息 */
+
+/** 告警帮助文档详细信息 */
 function fnModalVisibleBy(code: string) {
-  readLoalXlsx(code)
+  modalState.helpShowView = false;
+  const lang=currentLocale.value.split('_')[0];
+  modalState.title=t('views.faultManage.activeAlarm.helpFile');
+  readLoalXlsx(lang,code)
     .then(res => {
-      if (!res.length) {
-        visible.value = false;
-      }
       alarmTableState.data = res;
-      visible.value = true;
-
+      modalState.helpShowView = true;
       tableState.loading = false;
     })
     .catch(error => console.error(error));
@@ -660,6 +661,7 @@ function fnModalCancel() {
   modalState.visibleByEdit = false;
   modalState.visibleByView = false;
   modalState.visibleByShowSet = false;
+  modalState.helpShowView=false;
 }
 
 /**查询列表, pageNum初始页数 */
@@ -1004,12 +1006,18 @@ onMounted(() => {
       </a-table>
     </a-card>
 
+    
     <!-- 帮助文档 -->
-    <a-drawer
-      :visible="visible"
-      @close="closeDrawer"
-      :height="700"
-      placement="bottom"
+    <a-modal
+      width="100%"
+      wrap-class-name="full-modal"
+      :keyboard="false"
+      :mask-closable="false"
+      :visible="modalState.helpShowView"
+      :title="modalState.title"
+      :confirm-loading="modalState.confirmLoading"
+      :footer="null"
+      @cancel="fnModalCancel"
     >
       <a-table
         class="table"
@@ -1019,10 +1027,10 @@ onMounted(() => {
         :data-source="alarmTableState.data"
         :size="alarmTableState.size"
         :pagination="false"
-        :scroll="{ x: 2000, y: 560 }"
+          :scroll="{ x: 1700, y: 560 }"
       >
       </a-table>
-    </a-drawer>
+    </a-modal>
 
     <!-- 详情框 -->
     <a-modal
@@ -1565,4 +1573,20 @@ onMounted(() => {
 .table :deep(.ant-pagination) {
   padding: 0 24px;
 }
+.full-modal {
+  .ant-modal {
+    max-width: 100%;
+    top: 0;
+    padding-bottom: 0;
+    margin: 0;
+  }
+  .ant-modal-content {
+    display: flex;
+    flex-direction: column;
+    height: calc(100vh);
+  }
+  .ant-modal-body {
+    flex: 1;
+  }
+}
 </style>