推，添加静态页面

portal-manager-ui/admin/src/router/routes.js

@@ -414,6 +414,15 @@ const routes = [
                   ),
                 meta: { title: "12345拨打记录报表" },
               },
+              {
+                path: "letterRecordForm",
+                name: "letterRecordForm",
+                component: () =>
+                  import(
+                    /* webpackChunkName: "letterRecordForm" */ "@/views/dataAdmin/components/networkGovernance/letterRecordForm.vue"
+                  ),
+                meta: { title: "12345写信记录报表" },
+              },
             ],
           },
         ],

portal-manager-ui/admin/src/views/dataAdmin/components/IOT/alerting.vue

@@ -18,7 +18,7 @@
         >
           <a-icon slot="prefix" type="search" />
         </a-input>
-        <a-select v-model="alarmType">
+        <a-select v-model="alarmType" style="margin: 0 10px">
           <!-- <a-select-option
             v-for="(item, index) of selectOptions"
             :key="index"
@@ -49,6 +49,7 @@
           format="YYYY-MM-DD"
           class="range_picker_style"
           @change="rangePickerChange"
+          style="margin: 0 10px"
         >
         </a-range-picker>
 

portal-manager-ui/admin/src/views/dataAdmin/components/IOT/components/Details.vue

@@ -44,12 +44,12 @@
           disabled
         />
       </a-form-model-item>
-      <a-form-model-item label="清楚时间" prop="清楚时间">
+      <!-- <a-form-model-item label="清楚时间" prop="清楚时间">
         <a-input v-model="msg.updateTime" placeholder="请输入" disabled />
       </a-form-model-item>
       <a-form-model-item label="清楚人员" prop="清楚人员">
         <a-input v-model="msg.updateUserId" placeholder="请输入" disabled />
-      </a-form-model-item>
+      </a-form-model-item> -->
     </a-form-model>
   </a-drawer>
 </template>

portal-manager-ui/admin/src/views/dataAdmin/components/networkGovernance/letterRecordForm.vue

+<template>
+  <div class="callRecord-Container">
+    <div class="header_box">
+      <div>
+        <a-button
+          :loading="btnLoading"
+          type="primary"
+          class="addclass"
+          @click="handleExportTable"
+        >
+          <span>{{ tableSelectedRows.length ? "导出" : "导出全部" }}</span>
+        </a-button>
+        <b
+          >写信次数：<i>{{ total }}次</i></b
+        >
+      </div>
+      <span>
+        <a-select v-model="status" style="margin: 0 10px">
+          <a-select-option value=""> 全部类型 </a-select-option>
+          <a-select-option value="0"> 离线 </a-select-option>
+        </a-select>
+        <a-select v-model="source">
+          <a-select-option value=""> 全部来源 </a-select-option>
+          <a-select-option value="0"> 离线 </a-select-option>
+        </a-select>
+        <a-range-picker
+          format="YYYY-MM-DD"
+          class="range_picker_style"
+          @change="rangePickerChange"
+          style="margin: 0 10px"
+        >
+        </a-range-picker>
+
+        <a-input
+          style="width: 250px"
+          v-model="searchName"
+          placeholder="请输入标题或姓名关键字搜索"
+        >
+          <a-icon slot="prefix" type="search" />
+        </a-input>
+        <a-button
+          type="primary"
+          class="addclass"
+          style="margin: 0 0 0 10px"
+          @click="getList"
+          >搜索</a-button
+        >
+      </span>
+    </div>
+    <div class="main">
+      <a-table
+        size="small"
+        bordered
+        :row-key="(record) => record.id"
+        :row-selection="{
+          selectedRowKeys: tableSelectedKeys,
+          onChange: onSelectChange,
+        }"
+        :scroll="{ y: 590 }"
+        :pagination="tablePagination"
+        @change="pagTableChange"
+        :loading="tableLoading"
+        :columns="tableHeaders"
+        :dataSource="tableSourceData"
+      >
+        <template slot="operation" slot-scope="text, record, index">
+          <a-button type="link" @click="showDrawer(record)">详情</a-button>
+        </template>
+      </a-table>
+    </div>
+    <FormDetails
+      ref="FormDetails"
+      @onClose="onClose"
+      @showDrawer="showDrawer"
+      :visible="visible"
+    />
+  </div>
+</template>
+
+<script>
+import table from "@/mixins/table";
+import { getSys12345 } from "@/api/dataAdmin";
+import { export2Excel } from "@/utils/js/exportExcel";
+export default {
+  mixins: [table],
+  name: "callRecordForm",
+  data() {
+    return {
+      status: "",
+      source: "",
+      tableHeaders: [
+        {
+          title: "序号",
+          dataIndex: "index",
+          width: "60px",
+          key: "index",
+          align: "center",
+          customRender: (text, record, index) => `${index + 1}`,
+        },
+        {
+          title: "工单编号",
+          align: "center",
+          dataIndex: "nickname",
+          customRender: (text, record, index) => `${record.nickname || "--"}`,
+        },
+        {
+          title: "信件标题",
+          align: "center",
+          dataIndex: "phone",
+          customRender: (text, record, index) => `${record.phone || "--"}`,
+        },
+        {
+          title: "信件类别",
+          align: "center",
+          dataIndex: "address",
+          customRender: (text, record, index) => `${record.address || "--"}`,
+        },
+        {
+          title: "姓名",
+          align: "center",
+          dataIndex: "create_time",
+          customRender: (text, record, index) =>
+            `${record.create_time || "--"}`,
+        },
+        {
+          title: "性别",
+          align: "center",
+          dataIndex: "create_time",
+          customRender: (text, record, index) =>
+            `${record.create_time || "--"}`,
+        },
+        {
+          title: "联系电话",
+          align: "center",
+          dataIndex: "create_time",
+          customRender: (text, record, index) =>
+            `${record.create_time || "--"}`,
+        },
+        {
+          title: "信件来源",
+          align: "center",
+          dataIndex: "create_time",
+          customRender: (text, record, index) =>
+            `${record.create_time || "--"}`,
+        },
+        {
+          title: "提交时间",
+          align: "center",
+          dataIndex: "create_time",
+          customRender: (text, record, index) =>
+            `${record.create_time || "--"}`,
+        },
+        {
+          title: "办理状态",
+          align: "center",
+          dataIndex: "create_time",
+          customRender: (text, record, index) =>
+            `${record.create_time || "--"}`,
+        },
+        {
+          title: "办理时间",
+          align: "center",
+          dataIndex: "create_time",
+          customRender: (text, record, index) =>
+            `${record.create_time || "--"}`,
+        },
+        {
+          title: "办理部门",
+          align: "center",
+          dataIndex: "create_time",
+          customRender: (text, record, index) =>
+            `${record.create_time || "--"}`,
+        },
+        {
+          title: "操作",
+          align: "center",
+          width: "110px",
+          scopedSlots: {
+            customRender: "operation",
+          },
+        },
+      ],
+      btnLoading: false,
+      tableSelectedKeys: [],
+      tableSelectedRows: [],
+      BegindAndEndTime: [],
+      searchName: undefined,
+      visible: false,
+      total: 0,
+    };
+  },
+  components: {},
+  mounted() {
+    this.getList();
+  },
+  methods: {
+    getList() {
+      getSys12345({
+        phone: this.searchName,
+      }).then((res) => {
+        this.tableSourceData = res.data.data;
+        this.total = res.data.total;
+      });
+    },
+    rangePickerChange(val) {
+      console.log(val);
+    },
+    QueueState(type) {
+      switch (type) {
+        case 0:
+          return "type1";
+        case 1:
+          return "type2";
+        default:
+          return "type0";
+      }
+    },
+    // 选中
+    onSelectChange(keys, rows) {
+      this.tableSelectedKeys = keys;
+      const res = new Map();
+      this.tableSelectedRows = [...this.tableSelectedRows, ...rows]
+        .filter((v) => {
+          return !res.has(v.id) && res.set(v.id, 1);
+        })
+        .filter((v) => {
+          return this.tableSelectedKeys.some((val) => v.id == val);
+        });
+    },
+    // 导出
+    async handleExportTable() {
+      this.btnLoading = true;
+      let obj = {
+        1: "本地打印",
+        2: "在线提交",
+      };
+      let data = [];
+      if (this.tableSelectedKeys.length && this.tableSelectedRows.length) {
+        // 深度克隆避免影响页面表格展示
+        data = this.$_.cloneDeep(this.tableSelectedRows);
+        data.forEach((item) => {
+          Object.keys(obj).forEach((keys) => {
+            if (item.type == keys) {
+              item.type = obj[keys];
+            }
+          });
+        });
+      } else {
+        let datas = this.$_.cloneDeep(
+          await getSys12345({
+            page: 1,
+            size: -1,
+          })
+        );
+        data = datas.data.data;
+        if (!data.length) return;
+        for (let item of data) {
+          Object.keys(obj).forEach((key) => {
+            if (item.type == key) {
+              item.type = obj[key];
+            }
+          });
+        }
+      }
+      export2Excel(
+        this.tHeader,
+        this.filterVal,
+        data,
+        "填单记录报表" + this.$moment().format("YYYYMMDDHHmmss")
+      );
+      this.btnLoading = false;
+    },
+    showDrawer(val) {
+      this.visible = true;
+    },
+    onClose() {
+      this.visible = false;
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+/deep/.ant-spin-container {
+  display: block;
+}
+
+.header_box {
+  padding-bottom: 1rem;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  & > div {
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+
+    b {
+      font-style: normal;
+      font-weight: unset;
+      font-size: 16px;
+      margin-left: 20px;
+
+      i {
+        color: #0595fd;
+        font-style: normal;
+      }
+    }
+
+    sub {
+      font-size: 14px;
+      font-style: normal;
+      bottom: unset;
+      margin-left: 20px;
+    }
+  }
+}
+
+.tabFont {
+  font-size: 12px;
+  font-weight: 300;
+}
+
+/deep/.ant-drawer-content {
+  background-color: #f3f4f5;
+}
+</style>