新增导出插件的可排序功能

src/utils/execl-utils.ts

@@ -1,4 +1,4 @@
-import { read, utils, write } from 'xlsx';
+import { JSON2SheetOpts, read, utils, write } from 'xlsx';
 
 // 静态资源路径
 const baseUrl = import.meta.env.VITE_HISTORY_BASE_URL;
@@ -19,7 +19,10 @@ export const xlsxUrl = `${
  *   console.log(res)
  * });
  */
-export async function readLoalXlsx(lang:string,id: string): Promise<Record<string, any>[]> {
+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文件
@@ -62,11 +65,18 @@ export async function readSheet(
  * );
  *
  */
-export async function writeSheet(data: any[], sheetName: string) {
+export async function writeSheet(
+  data: any[],
+  sheetName: string,
+  opts?: JSON2SheetOpts
+  ) {
   if (data.length === 0) {
     return new Blob([], { type: 'application/octet-stream' });
   }
-  const workSheet = utils.json_to_sheet(data);
+
+  const workSheet = utils.json_to_sheet(data, opts);
+  console.log(workSheet);
+
   // 设置列宽度，单位厘米
   workSheet['!cols'] = Object.keys(data[0]).map(() => {
     return { wch: 20 };

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

@@ -630,6 +630,42 @@ function fnExportAll() {
     onOk() {
       const key = 'exportAlarm';
       message.loading({ content: t('common.loading'), key });
+      // 排序字段
+      const sortData = {
+        header: [
+          'id',
+          'neId',
+          'neName',
+          'neType',
+          'ackState',
+          'ackTime',
+          'ackUser',
+          'addInfo',
+          'alarmCode',
+          'alarmId',
+          'alarmSeq',
+          'alarmStatus',
+          'alarmTitle',
+          'alarmType',
+          'clearTime',
+          'clearType',
+          'clearUser',
+          'counter',
+          'eventTime',
+          'latestEventTime',
+          'locationInfo',
+          'objectName',
+          'objectType',
+          'objectUid',
+          'origSeverity',
+          'perceivedSeverity',
+          'province',
+          'pvFlag',
+          'specificProblem',
+          'specificProblemId',
+          'timestamp',
+        ],
+      };
       exportAll(queryParams).then(res => {
         if (res.code === RESULT_CODE_SUCCESS) {
           message.success({
@@ -637,7 +673,7 @@ function fnExportAll() {
             key,
             duration: 3,
           });
-          writeSheet(res.data, 'alarm').then(fileBlob =>
+          writeSheet(res.data, 'alarm', sortData).then(fileBlob =>
             saveAs(fileBlob, `alarm_${Date.now()}.xlsx`)
           );
         } else {

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

@@ -39,6 +39,9 @@ let dict: {
 /**记录开始结束时间 */
 let queryRangePicker = ref<[string, string]>(['', '']);
 
+/**表格字段列排序 */
+let tableColumnsDnd = ref<ColumnsType>([]);
+
 /**查询参数 */
 let queryParams = reactive({
   /**告警设备类型 */
@@ -431,6 +434,42 @@ function fnExportAll() {
     onOk() {
       const key = 'exportAlarmHis';
       message.loading({ content: t('common.loading'), key });
+       // 排序字段
+       const sortData = {
+        header: [
+          'id',
+          'neId',
+          'neName',
+          'neType',
+          'ackState',
+          'ackTime',
+          'ackUser',
+          'addInfo',
+          'alarmCode',
+          'alarmId',
+          'alarmSeq',
+          'alarmStatus',
+          'alarmTitle',
+          'alarmType',
+          'clearTime',
+          'clearType',
+          'clearUser',
+          'counter',
+          'eventTime',
+          'latestEventTime',
+          'locationInfo',
+          'objectName',
+          'objectType',
+          'objectUid',
+          'origSeverity',
+          'perceivedSeverity',
+          'province',
+          'pvFlag',
+          'specificProblem',
+          'specificProblemId',
+          'timestamp',
+        ],
+      };
       exportAll(queryParams).then(res => {
         if (res.code === RESULT_CODE_SUCCESS) {
           message.success({
@@ -438,7 +477,7 @@ function fnExportAll() {
             key,
             duration: 3,
           });
-          writeSheet(res.data, 'alarm').then(fileBlob =>
+          writeSheet(res.data, 'alarm',sortData).then(fileBlob =>
             saveAs(fileBlob, `history-alarm_${Date.now()}.xlsx`)
           );
         } else {
@@ -707,6 +746,10 @@ onMounted(() => {
               </template>
             </a-dropdown>
           </a-tooltip>
+          <TableColumnsDnd
+            :columns="tableColumns"
+            v-model:columns-dnd="tableColumnsDnd"
+          ></TableColumnsDnd>
         </a-space>
       </template>
 
@@ -714,7 +757,7 @@ onMounted(() => {
       <a-table
         class="table"
         row-key="id"
-        :columns="tableColumns"
+        :columns="tableColumnsDnd"
         :loading="tableState.loading"
         :data-source="tableState.data"
         :size="tableState.size"

src/views/index.vue

@@ -70,6 +70,11 @@ let tableColumns: ColumnsType = [
     dataIndex: 'version',
     align: 'center',
   },
+  {
+    title: t('views.index.serialNum'),
+    dataIndex: 'serialNum',
+    align: 'center',
+  },
   {
     title: t('views.index.ipAddress'),
     dataIndex: 'ipAddress',
@@ -400,9 +405,7 @@ onBeforeUnmount(() => {
               nfInfo.obj
             }}</a-descriptions-item>
             <template v-if="nfInfo.obj === 'OMC'">
-              <a-descriptions-item :label="t('views.index.serialNum')">{{
-                nfInfo.serialNum
-              }}</a-descriptions-item>
+
               <a-descriptions-item :label="t('views.index.versionNum')">{{
                 nfInfo.version
               }}</a-descriptions-item>