修复发现的bug

src/pages/report/components/ReportDetails.vue

@@ -1,393 +1,501 @@
 <template>
-    <div class="bigBoxs">
-        <div class="topBox">
-            <div class="cilBox">
-                <p style="font-size: 18px;font-weight: 400;">{{ stationNames }}-{{ relathing }}</p>
-            </div>
-            <div class="createReport">
-                <img v-if="btnType" src="../../../assets/image/board_file.png" alt="">
-                <img v-else src="../../../assets/image/allright.png" alt="">
-                <p style="font-size: 14px;font-weight: 400;">{{ btnType ? '还未生成报告' : "报告已生成" }}</p>
-                <el-button :type="btnType ? 'primary' : 'info'" plain @click="nowGet" :disabled="!btnType">立即生成</el-button>
-                <el-button :type="btnType ? 'info' : 'primary'" plain :disabled="btnType" @click="downReport">下载报告</el-button>
-            </div>
-        </div>
-        <div class="bottomBox" v-loading="loading">
-            <div class="miniBox">
-                <img style="width: 20px;height: 20px;display: block;margin-top: 10px;margin-left: 10px;"
-                    src="../../../assets/icon/file_blue.png" alt="">
-                <span style="
-                font-size: 16px;
-                font-family: Source Han Sans CN, Source Han Sans CN;
-                font-weight: 500;
-                color: #1A2447;
-                display: flex;
-                margin-top: 10px;
-                /* margin-left: 10px; */
-                ">检测结果</span>
-            </div>
-            <div class="messageBox">
-                <!-- 树形结构盒子 -->
-                <!-- <div class="treeBox">
+  <div class="bigBoxs">
+    <div class="topBox">
+      <div class="cilBox">
+        <p style="font-size: 18px; font-weight: 400">
+          {{ stationNames }}-{{ relathing }}
+        </p>
+      </div>
+      <div class="createReport">
+        <img v-if="btnType" src="../../../assets/image/board_file.png" alt="" />
+        <img v-else src="../../../assets/image/allright.png" alt="" />
+        <p style="font-size: 14px; font-weight: 400">
+          {{ btnType ? "还未生成报告" : "报告已生成" }}
+        </p>
+        <el-button
+          :type="btnType ? 'primary' : 'info'"
+          plain
+          @click="nowGet"
+          :disabled="!btnType"
+          >立即生成</el-button
+        >
+        <el-button
+          :type="btnType ? 'info' : 'primary'"
+          plain
+          :disabled="btnType"
+          @click="downReport"
+          >下载报告</el-button
+        >
+      </div>
+    </div>
+    <div class="bottomBox" v-loading="loading">
+      <div class="miniBox">
+        <img
+          style="
+            width: 20px;
+            height: 20px;
+            display: block;
+            margin-top: 10px;
+            margin-left: 10px;
+          "
+          src="../../../assets/icon/file_blue.png"
+          alt=""
+        />
+        <span
+          style="
+            font-size: 16px;
+            font-family: Source Han Sans CN, Source Han Sans CN;
+            font-weight: 500;
+            color: #1a2447;
+            display: flex;
+            margin-top: 10px;
+            margin-left: 10px;
+          "
+          >检测结果</span
+        >
+      </div>
+      <div class="messageBox">
+        <!-- 树形结构盒子 -->
+        <!-- <div class="treeBox">
 
                 </div> -->
-                <!-- 大表格盒子 -->
-                <div class="tableBox">
-                    <!-- 头部按钮和统计数据盒子 -->
-                    <div class="btnBox">
-                        <!-- 按钮盒子 -->
-                        <div class="btn">
-                            <el-button style="font-size: 16px;margin-left: 10px;" type="primary" plain @click="excelPort">
-                                <svg t="1705980404021" class="iconSvg" viewBox="0 0 1024 1024" version="1.1"
-                                    xmlns="http://www.w3.org/2000/svg" p-id="7825" width="48" height="48">
-                                    <path
-                                        d="M486.4 367.616l-89.344 86.016a25.6 25.6 0 1 1-35.584-36.864l131.84-128A25.6 25.6 0 0 1 512 281.6h2.816a25.6 25.6 0 0 1 16.128 7.68l123.392 128a25.6 25.6 0 1 1-36.864 35.584L537.6 370.688V614.4a25.6 25.6 0 0 1-51.2 0zM972.8 230.4v691.2a102.4 102.4 0 0 1-102.4 102.4H153.6a102.4 102.4 0 0 1-102.4-102.4V102.4a102.4 102.4 0 0 1 102.4-102.4h593.92z m-230.4-162.56V204.8a25.6 25.6 0 0 0 25.6 25.6h133.12zM921.6 281.6h-153.6a76.8 76.8 0 0 1-76.8-76.8V51.2H153.6a51.2 51.2 0 0 0-51.2 51.2v819.2a51.2 51.2 0 0 0 51.2 51.2h716.8a51.2 51.2 0 0 0 51.2-51.2zM358.4 768a25.6 25.6 0 0 1 0-51.2h307.2a25.6 25.6 0 0 1 0 51.2z"
-                                        fill="#255be7" p-id="7826"></path>
-                                </svg>
-                                导出所有结果
-                            </el-button>
-                        </div>
-                        <!-- 统计数据盒子 -->
-                        <div class="count">
-                            <span style="margin-right: 5px;font-size: 16px;font-weight: 400;">全部:
-                                <em>{{ Number(warnCount) + Number(dangerCount) + Number(infoCount) }}</em></span>
-                            <span style="margin-right: 5px;font-size: 16px;font-weight: 400;">错误:
-                                <em style="color: red;">{{ dangerCount }}</em></span>
-                            <span style="margin-right: 5px;font-size: 16px;font-weight: 400;">告警:
-                                <em style="color: orange;">{{ warnCount }}</em></span>
-                            <span style="font-size: 16px;font-weight: 400;">提示:
-                                <em style="color: blue;">{{ infoCount }}</em></span>
-                        </div>
-                    </div>
-                    <div class="realBox" style="position: relative;">
-                        <el-table :data="tableData" stripe
-                            style="width: 100%;height: calc(100vh - 420px);margin-top: 10px;">
-                            <el-table-column prop="ied_name" label="装置名称" width="120" />
-                            <el-table-column prop="ied_desc" label="装置描述" width="240" />
-                            <el-table-column prop="alert_level" label="等级" width="100">
-                                <template #default="scope">
-                                    <el-tag class="ml-2" :type="typeLevel(scope.row.alert_level)">{{
-                                        canLevel(scope.row.alert_level) }}</el-tag>
-                                </template>
-                            </el-table-column>
-                            <el-table-column prop="line_no" label="行号" width="100">
-                                <template #default="scope">
-                                    <span style="color: blue;border-bottom: 1px solid blue;cursor: pointer;"
-                                        @click="lineno(scope.row)">{{
-                                            scope.row.line_no }}</span>
-                                </template>
-                            </el-table-column>
-                            <el-table-column prop="parse_result" label="描述" width="auto"  />
-                            <el-table-column label="标准及条款" width="400" show-overflow-tooltip>
-                                <template #default="scope">
-                                    <p>{{ scope.row.apply_standard }}</p>
-                                    <p>{{ scope.row.apply_standard_no }}</p>
-                                </template>
-                            </el-table-column>
-                        </el-table>
-                        <Pagination style="position: absolute;right: 10px;" :totals="totals" @pageBack="pageBack">
-                        </Pagination>
-                    </div>
+        <!-- 大表格盒子 -->
+        <div class="tableBox">
+          <!-- 头部按钮和统计数据盒子 -->
+          <div class="btnBox">
+            <!-- 按钮盒子 -->
+
+            <div class="btn">
+              <div class="btnBoxs">
+                <div @click="excelPort">
+                  <img :src="FileArrowUp" alt="" />
+                  导出所有结果
                 </div>
+              </div>
             </div>
+            <!-- 统计数据盒子 -->
+            <div class="count">
+              <span style="margin-right: 5px; font-size: 16px; font-weight: 400"
+                >全部:
+                <em>{{
+                  Number(warnCount) + Number(dangerCount) + Number(infoCount)
+                }}</em></span
+              >
+              <span style="margin-right: 5px; font-size: 16px; font-weight: 400"
+                >错误: <em style="color: red">{{ dangerCount }}</em></span
+              >
+              <span style="margin-right: 5px; font-size: 16px; font-weight: 400"
+                >告警: <em style="color: orange">{{ warnCount }}</em></span
+              >
+              <span style="font-size: 16px; font-weight: 400"
+                >提示: <em style="color: blue">{{ infoCount }}</em></span
+              >
+            </div>
+          </div>
+          <div class="realBox" style="position: relative">
+            <el-table
+              :data="tableData"
+              stripe
+              style="width: 100%; height: calc(100vh - 420px); margin-top: 10px"
+            >
+              <el-table-column prop="ied_name" label="装置名称" width="120" />
+              <el-table-column prop="ied_desc" label="装置描述" width="240" />
+              <el-table-column prop="alert_level" label="等级" width="100">
+                <template #default="scope">
+                  <el-tag
+                    class="ml-2"
+                    :type="typeLevel(scope.row.alert_level)"
+                    >{{ canLevel(scope.row.alert_level) }}</el-tag
+                  >
+                </template>
+              </el-table-column>
+              <el-table-column prop="line_no" label="行号" width="100">
+                <template #default="scope">
+                  <span
+                    style="
+                      color: blue;
+                      border-bottom: 1px solid blue;
+                      cursor: pointer;
+                    "
+                    @click="lineno(scope.row)"
+                    >{{ scope.row.line_no }}</span
+                  >
+                </template>
+              </el-table-column>
+              <el-table-column prop="parse_result" label="描述" width="auto" />
+              <el-table-column
+                label="标准及条款"
+                width="400"
+                show-overflow-tooltip
+              >
+                <template #default="scope">
+                  <p>{{ scope.row.apply_standard }}</p>
+                  <p>{{ scope.row.apply_standard_no }}</p>
+                </template>
+              </el-table-column>
+            </el-table>
+            <Pagination
+              style="position: absolute; right: 10px"
+              :totals="totals"
+              @pageBack="pageBack"
+            >
+            </Pagination>
+          </div>
         </div>
-        <div>
-            <LooKLine v-if="lineSearch" :lineSearch="lineSearch" :scdIds="scdIds" :lineNum="lineNum" :lineMsg="lineMsg" @lineClose="lineClose">
-            </LooKLine>
-        </div>
+      </div>
     </div>
+    <div>
+      <LooKLine
+        v-if="lineSearch"
+        :lineSearch="lineSearch"
+        :scdIds="scdIds"
+        :lineNum="lineNum"
+        :lineMsg="lineMsg"
+        @lineClose="lineClose"
+      >
+      </LooKLine>
+    </div>
+  </div>
 </template>
 
 <script>
-import { ref, watch, onMounted } from "vue"
-import { useRoute, useRouter } from "vue-router"
-import report from "@/api/report"
-import slc from "@/api/slc/slc"
-import systemRow from "@/api/systemRow"
-import Pagination from "./Pagination.vue"
-import { ElMessage } from "element-plus"
-import system from "@/api/system"
-import LooKLine from "../modal/LookLine.vue"
+import { ref, watch, onMounted } from "vue";
+import { useRoute, useRouter } from "vue-router";
+import report from "@/api/report";
+import slc from "@/api/slc/slc";
+import systemRow from "@/api/systemRow";
+import Pagination from "./Pagination.vue";
+import { ElMessage } from "element-plus";
+import system from "@/api/system";
+import LooKLine from "../modal/LookLine.vue";
 import { scdExpTableData } from "@/api/scdCheck/scdCheck2";
+import FileArrowUp from "@/assets/image/sclFile/FileArrowUp.png";
 export default {
-    setup() {
-        let route = useRoute()
-        let router = useRouter()
-        let reportId = ref('')//报告id
-        let scdIds = ref("")//scdid
-        let tableData = ref([])//表格数据
-        let warnCount = ref(0)//告警总数
-        let dangerCount = ref(0)//错误总数
-        let infoCount = ref(0)//提示总数
-        let stationNames = ref("")//变电站名称
-        let relathing = ref('')//检测名称
-        let loading = ref(false)
-        let reportUrl = ref('')
-        let btnType = ref(true)//生成报告按钮和下载报告按钮状态
-        let fileId = ref("")//需要下载的报告id'
-        let totals = ref(0)
-        let lineSearch = ref(false)
-        let lineMsg = ref('')//行描述
-        let lineNum = ref(0)//行号
-        // 初始化组件
-        function reload() {
-            scdIds.value = route.query.scdId
-            stationNames.value = route.query.stationName
-            relathing.value = route.query.names
-            reportId.value = route.query.reportId
-            // report.genderReport({ task_id: route.query.reportId - 0 }).then(res => {
-            //     console.log(res, 'ressss');
-            // })
-            loading.value = true
-            slc.getScdByIdFromMission({
-                scd_id: route.query.scdId - 0,
-                pageno: 1,
-                pagesize: 20,
-            }).then(res => {//获取总数量
-                if (res.data != null) {
-                    console.log(res.data);
-                    tableData.value = res.data
-                    totals.value = res.count
-                    loading.value = false
-                } else {
-                    loading.value = false
-                }
-            })
-            slc.getErrorByLevel({
-                scd_id: route.query.scdId - 0
-            }).then(res => {//获取各个等级总数
-                if (res.data != null) {
-                    res.data.map(item => {
-                        if (item.alert_level == 'waring') {
-                            warnCount.value = item.cnt
-                        } else if (item.alert_level == 'error') {
-                            dangerCount.value = item.cnt
-                        } else if (item.alert_level == 'info') {
-                            infoCount.value = item.cnt
-                        }
-                    })
-                }
-            })
-            report.allReport({
-                pageno: 1,
-                pagesize: 20,
-                name: relathing.value
-            }).then(res => {
-                console.log(res, 'oisaghuih');
-                if(res.code==0 && res.data.length>0 && res.data[0].doc!=null){
-                    btnType.value = false //报告已生成
-                    reportUrl.value = res.data[0].doc
-                }
-            })
-        }
-        // 筛选等级
-        function canLevel(level) {
-            if (level == 'waring') {
-                return `告警`
-            } else if (level == 'error') {
-                return `错误`
-            } else if (level == 'info') {
-                return `提示`
-            }
-        }
-        // 筛选tag标签状态
-        function typeLevel(level) {
-            if (level == 'waring') {
-                return `warning`
-            } else if (level == 'error') {
-                return `danger`
-            } else if (level == 'info') {
-                return `info`
-            }
-        }
-        // 生成报告
-        function nowGet() {
-            report.genderReport({
-                task_id: reportId.value - 0
-            }).then(res => {
-                if (res.data != null) {
-                    fileId.value = res.data.TaskId
-                    btnType.value = false
-                    reportUrl.value = res.data.Doc
-                    ElMessage({
-                        message: "生成报告成功",
-                        type: "success"
-                    })
-                }
-            })
-        }
-        // 下载报告
-        function downReport() {            
-            location.href = window.ApiServer + reportUrl.value.toString();
-        }
-        // 导出结果至excel
-        function excelPort() {
-            // const nodeName = clickTreeData.value ? clickTreeData.value.datatype : "";
-            // const nodeId = clickTreeData.value ? clickTreeData.value.id : "";
-            systemRow.portExcel({
-                code: "scl-check-result",
-                caption: "检测报告",
-                expcols: "ied_name,ied_desc,alert_level,line_no,parse_result,apply_standard,apply_standard_no",
-                expcolnames: "装置名称,装置描述,等级,行号,描述,应用标准,标准条款",
-                scd_id: route.query.scdId - 0,
-                node_name: "",
-                node_id: "",
-            }).then(res => {
-                if (res.data) {
-                   location.href = window.ApiServer + "/" + res.data;
-                } else {
-                    ElMessage({
-                        message: res.msg,
-                        type: "info",
-                    });
-                }
-            })
-        }
-        //查看行位置
-        function lineno(row) {
-            lineMsg.value = row.parse_result
-            lineNum.value = row.line_no
-            lineSearch.value = true
-        }
-        // 分页组件返回
-        function pageBack(size, index) {
-            loading.value = true
-            slc.getScdByIdFromMission({
-                scd_id: route.query.scdId - 0,
-                pageno: index,
-                pagesize: size,
-            }).then(res => {//获取总数量
-                if (res.data != null) {
-                    console.log(res.data);
-                    tableData.value = res.data
-                    totals.value = res.count
-                    loading.value = false
-                } else {
-                    loading.value = false
-                }
+  setup() {
+    let route = useRoute();
+    let router = useRouter();
+    let reportId = ref(""); //报告id
+    let scdIds = ref(""); //scdid
+    let tableData = ref([]); //表格数据
+    let warnCount = ref(0); //告警总数
+    let dangerCount = ref(0); //错误总数
+    let infoCount = ref(0); //提示总数
+    let stationNames = ref(""); //变电站名称
+    let relathing = ref(""); //检测名称
+    let loading = ref(false);
+    let reportUrl = ref("");
+    let btnType = ref(true); //生成报告按钮和下载报告按钮状态
+    let fileId = ref(""); //需要下载的报告id'
+    let totals = ref(0);
+    let lineSearch = ref(false);
+    let lineMsg = ref(""); //行描述
+    let lineNum = ref(0); //行号
+    // 初始化组件
+    function reload() {
+      scdIds.value = route.query.scdId;
+      stationNames.value = route.query.stationName;
+      relathing.value = route.query.names;
+      reportId.value = route.query.reportId;
+      // report.genderReport({ task_id: route.query.reportId - 0 }).then(res => {
+      //     console.log(res, 'ressss');
+      // })
+      loading.value = true;
+      slc
+        .getScdByIdFromMission({
+          scd_id: route.query.scdId - 0,
+          pageno: 1,
+          pagesize: 20,
+        })
+        .then((res) => {
+          //获取总数量
+          if (res.data != null) {
+            console.log(res.data);
+            tableData.value = res.data;
+            totals.value = res.count;
+            loading.value = false;
+          } else {
+            loading.value = false;
+          }
+        });
+      slc
+        .getErrorByLevel({
+          scd_id: route.query.scdId - 0,
+        })
+        .then((res) => {
+          //获取各个等级总数
+          if (res.data != null) {
+            res.data.map((item) => {
+              if (item.alert_level == "waring") {
+                warnCount.value = item.cnt;
+              } else if (item.alert_level == "error") {
+                dangerCount.value = item.cnt;
+              } else if (item.alert_level == "info") {
+                infoCount.value = item.cnt;
+              }
+            });
+          }
+        });
+      report
+        .allReport({
+          pageno: 1,
+          pagesize: 20,
+          name: relathing.value,
+        })
+        .then((res) => {
+          console.log(res, "oisaghuih");
+          if (res.code == 0 && res.data.length > 0 && res.data[0].doc != null) {
+            btnType.value = false; //报告已生成
+            reportUrl.value = res.data[0].doc;
+          }
+        });
+    }
+    // 筛选等级
+    function canLevel(level) {
+      if (level == "waring") {
+        return `告警`;
+      } else if (level == "error") {
+        return `错误`;
+      } else if (level == "info") {
+        return `提示`;
+      }
+    }
+    // 筛选tag标签状态
+    function typeLevel(level) {
+      if (level == "waring") {
+        return `warning`;
+      } else if (level == "error") {
+        return `danger`;
+      } else if (level == "info") {
+        return `info`;
+      }
+    }
+    // 生成报告
+    function nowGet() {
+      report
+        .genderReport({
+          task_id: reportId.value - 0,
+        })
+        .then((res) => {
+          if (res.data != null) {
+            fileId.value = res.data.TaskId;
+            btnType.value = false;
+            reportUrl.value = res.data.Doc;
+            ElMessage({
+              message: "生成报告成功",
+              type: "success",
+            });
+          }
+        });
+    }
+    // 下载报告
+    function downReport() {
+      location.href = window.ApiServer + reportUrl.value.toString();
+      /*
+            system.downLoad({
+                path: reportUrl.value,
+                save_name:''
             })
-        }
-        function lineClose(data) {
-            lineSearch.value = data
-        }
-        onMounted(() => {
-            reload()
+            */
+    }
+    // 导出结果至excel
+    function excelPort() {
+      // const nodeName = clickTreeData.value ? clickTreeData.value.datatype : "";
+      // const nodeId = clickTreeData.value ? clickTreeData.value.id : "";
+      systemRow
+        .portExcel({
+          code: "scl-check-result",
+          caption: "检测报告",
+          expcols:
+            "ied_name,ied_desc,alert_level,line_no,parse_result,apply_standard,apply_standard_no",
+          expcolnames: "装置名称,装置描述,等级,行号,描述,应用标准,标准条款",
+          scd_id: route.query.scdId - 0,
+          node_name: "",
+          node_id: "",
         })
-        return {
-            reload,//初始化组件
-            reportId,//报告id
-            tableData,//表格数据
-            scdIds,//scdid
-            canLevel,//筛选等级
-            typeLevel,//筛选tag标签状态
-            warnCount,//告警总数
-            dangerCount,//错误总数
-            infoCount,//提示总数
-            loading,//
-            stationNames,
-            relathing,
-            totals,//总条数
-            pageBack,
-            nowGet,//生成报告按钮
-            btnType,//按钮状态
-            reportUrl,
-            fileId,//下载的报告id
-            downReport,//下载报告
-            excelPort,
-            lineSearch,//查看行号
-            lineno,//查看行位置
-            lineNum,//行号
-            lineClose,//lookline.vue返回模态框状态
-            lineMsg,
-        }
-    },
-    components: {
-        Pagination,
-        LooKLine,
+        .then((res) => {
+          if (res.data) {
+            location.href = window.ApiServer + "/" + res.data;
+          } else {
+            ElMessage({
+              message: res.msg,
+              type: "info",
+            });
+          }
+        });
     }
-}
+    //查看行位置
+    function lineno(row) {
+      lineMsg.value = row.parse_result;
+      lineNum.value = row.line_no;
+      lineSearch.value = true;
+    }
+    // 分页组件返回
+    function pageBack(size, index) {
+      loading.value = true;
+      slc
+        .getScdByIdFromMission({
+          scd_id: route.query.scdId - 0,
+          pageno: index,
+          pagesize: size,
+        })
+        .then((res) => {
+          //获取总数量
+          if (res.data != null) {
+            console.log(res.data);
+            tableData.value = res.data;
+            totals.value = res.count;
+            loading.value = false;
+          } else {
+            loading.value = false;
+          }
+        });
+    }
+    function lineClose(data) {
+      lineSearch.value = data;
+    }
+    onMounted(() => {
+      reload();
+    });
+    return {
+      reload, //初始化组件
+      reportId, //报告id
+      tableData, //表格数据
+      scdIds, //scdid
+      canLevel, //筛选等级
+      typeLevel, //筛选tag标签状态
+      warnCount, //告警总数
+      dangerCount, //错误总数
+      infoCount, //提示总数
+      loading, //
+      stationNames,
+      relathing,
+      totals, //总条数
+      pageBack,
+      nowGet, //生成报告按钮
+      btnType, //按钮状态
+      reportUrl,
+      fileId, //下载的报告id
+      downReport, //下载报告
+      excelPort,
+      lineSearch, //查看行号
+      lineno, //查看行位置
+      lineNum, //行号
+      lineClose, //lookline.vue返回模态框状态
+      lineMsg,
+      FileArrowUp,
+    };
+  },
+  components: {
+    Pagination,
+    LooKLine,
+  },
+};
 </script>
 
-<style scoped>
+<style scoped lang="scss">
+.btnBoxs > div {
+    height: 40px;
+    width: 150px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-right: 8px;
+    cursor: pointer;
+    background: url("~@/assets/image/scdcheck/bgscd.png") no-repeat center;
+    background-size: 148px 40px;
+    border-radius: 2px;
+    font-size: 14px;
+    color: #255ce7;
+  
+    img {
+      width: 20px;
+      height: 20px;
+      margin: 0 4px 0 0;
+      vertical-align: middle;
+    }
+  }
 p {
-    margin: 0;
-    padding: 0;
+  margin: 0;
+  padding: 0;
 }
 
 em {
-    list-style: none;
-    font-style: normal;
+  list-style: none;
+  font-style: normal;
 }
 
 .bigBoxs {
-    width: 98%;
-    height: calc(100vh - 90px);
-    margin: 0 auto;
+  width: 98%;
+  height: calc(100vh - 90px);
+  margin: 0 auto;
 }
 
 .createReport {
-    width: 100%;
-    height: calc(100vh - 780px);
-    text-align: center;
-    line-height: 30px;
-    padding-top: 10px;
-    background: #F7F8FB;
+  width: 100%;
+  height: calc(100vh - 770px);
+  text-align: center;
+  line-height: 30px;
+  padding-top: 10px;
+  background: #f7f8fb;
 }
 
 .bottomBox {
-    width: 100%;
-    height: calc(100vh - 320px);
-    background-color: #F7F8FB;
-    margin-top: 20px;
+  width: 100%;
+  height: calc(100vh - 320px);
+  background-color: #f7f8fb;
+  margin-top: 20px;
 }
 
 .miniBox {
-    width: 100%;
-    height: auto;
-    display: flex;
-    justify-content: flex-start;
-    align-items: center;
+  width: 100%;
+  height: auto;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
 }
 
 .messageBox {
-    width: 100%;
-    height: calc(100vh - 380px);
-    /* border: 1px solid saddlebrown; */
-    margin-top: 10px;
-    display: flex;
-    justify-content: space-around;
-    align-items: center;
+  width: 100%;
+  height: calc(100vh - 380px);
+  /* border: 1px solid saddlebrown; */
+  margin-top: 10px;
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
 }
 
 .treeBox {
-    width: 20%;
-    height: calc(100vh - 380px);
-    border: 1px solid #A3ADE0;
+  width: 20%;
+  height: calc(100vh - 380px);
+  border: 1px solid #a3ade0;
 }
 
 .tableBox {
-    width: 100%;
-    height: calc(100vh - 380px);
+  width: 100%;
+  height: calc(100vh - 380px);
 }
 
 .btnBox {
-    width: 100%;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
 }
 
 .btn {
-    width: 30%;
+  width: 30%;
 }
 
 .count {
-    width: 20%;
-    text-align: center;
+  width: 20%;
+  text-align: center;
 }
 
 .iconSvg {
-    width: 20px;
-    height: 20px;
+  width: 20px;
+  height: 20px;
+}
+.btnBoxs {
+  line-height: 40px;
 }
 </style>

src/pages/setting/components/ReportModule.vue

@@ -1,266 +1,363 @@
 <template>
-    <div>
-        <div class="bigBox">
-            <div class="settingBox">
-                <h1 style="font-size: 18px;">报告模板管理</h1>
+  <div>
+    <div class="bigBox">
+      <div class="settingBox">
+        <h1 style="font-size: 18px">报告模板管理</h1>
+      </div>
+      <div>
+        <div class="moduleBox">
+          <div class="litBox">
+            <div class="btnBox">
+              <div @click="openAdd(0)">
+                <img :src="addPng" alt="" />
+                新建报告模板
+              </div>
             </div>
-            <div>
-                <div class="moduleBox">
-                    <div class="litBox">
-                        <el-button type="primary" plain @click="openAdd(0)">
-                            <el-icon>
-                                <Plus />
-                            </el-icon>新建报告模板</el-button>
-                    </div>
-                    <div class="litBox">
-                        <span style="font-size: 14px;margin: 0 10px;">模板名称</span>
-                        <el-input style="width: 260px;" v-model="moduleName" placeholder="请输入模板名称"></el-input>
-                    </div>
-                    <div class="litBox">
-                        <span style="font-size: 14px;margin: 0 10px;">状态</span>
-                        <el-select v-model="stateValue" @change="stateChange" class="m-2" placeholder="选择状态" size="default"
-                            style="width: 240px">
-                            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
-                        </el-select>
-                        <!-- <el-date-picker v-model="getTime" @change="timeChange" type="datetimerange" start-placeholder="开始时间"
+          </div>
+          <div class="litBox">
+            <span style="font-size: 14px; margin: 0 10px">模板名称</span>
+            <el-input
+              style="width: 260px"
+              v-model="moduleName"
+              placeholder="请输入模板名称"
+            ></el-input>
+          </div>
+          <div class="litBox">
+            <span style="font-size: 14px; margin: 0 10px">状态</span>
+            <el-select
+              v-model="stateValue"
+              @change="stateChange"
+              class="m-2"
+              placeholder="选择状态"
+              size="default"
+              style="width: 240px"
+            >
+              <el-option
+                v-for="item in options"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              />
+            </el-select>
+            <!-- <el-date-picker v-model="getTime" @change="timeChange" type="datetimerange" start-placeholder="开始时间"
                             end-placeholder="结束时间" format="YYYY-MM-DD HH:mm:ss" date-format="YYYY/MM/DD ddd"
                             time-format="A hh:mm:ss" /> -->
-                    </div>
-                    <div class="litBox">
-                        <el-button type="primary" plain @click="search"><el-icon>
-                                <Search />
-                            </el-icon>查询</el-button>
-                        <el-button @click="searchReport"><el-icon>
-                                <RefreshLeft />
-                            </el-icon>重置</el-button>
-                    </div>
-                </div>
-                <div class="tableBox">
-                    <el-table ref="multipleTableRef" :data="reportList" style="width: 100%;height: calc(100vh - 260px);"
-                        @selection-change="handleSelectionChange">
-                        <el-table-column type="selection" width="55" />
-                        <!-- <el-table-column label="编号" width="auto">
+          </div>
+          <div class="litBox">
+            <el-button type="primary" plain @click="search"
+              ><el-icon>
+                <Search /> </el-icon
+              >查询</el-button
+            >
+            <el-button @click="searchReport"
+              ><el-icon>
+                <RefreshLeft /> </el-icon
+              >重置</el-button
+            >
+          </div>
+        </div>
+        <div class="tableBox">
+          <el-table
+            ref="multipleTableRef"
+            :data="reportList"
+            style="width: 100%; height: calc(100vh - 260px)"
+            @selection-change="handleSelectionChange"
+          >
+            <el-table-column type="selection" width="55" />
+            <!-- <el-table-column label="编号" width="auto">
                             <template #default="scope">
                                 {{ scope.$index + 1 }}
                             </template>
                         </el-table-column> -->
-                        <el-table-column property="doc_id" label="编号" width="200" show-overflow-tooltip />
-                        <el-table-column property="name" label="模板名称" width="260" show-overflow-tooltip />
-                        <el-table-column property="memo" label="模板描述" width="600" show-overflow-tooltip />
-                        <el-table-column property="ct" label="上传时间" width="200" show-overflow-tooltip />
-                        <el-table-column property="state" label="状态" width="auto" show-overflow-tooltip>
-                            <template #default="scope">
-                                <span>{{ reState(scope.row.state) }}</span>
-                            </template>
-                        </el-table-column>
-                        <el-table-column fixed="right" label="操作" width="auto">
-                            <template #default="scope">
-                                <el-button style="color: #255CE7;" link type="primary" size="small" @click="openAdd(1, scope.row)">
-                                    <el-icon>
-                                        <EditPen />
-                                    </el-icon>编辑</el-button>
-                                <el-button style="color: #255CE7;" link type="primary" size="small" @click="downFile(scope.row)">
-                                    <el-icon>
-                                        <Download />
-                                    </el-icon>下载</el-button>
-                                <el-button style="color: red;" link type="primary" size="small" @click="openDel(scope.row)">
-                                    <el-icon style="color: red;">
-                                        <Delete />
-                                    </el-icon>删除</el-button>
-                            </template>
-                        </el-table-column>
-                    </el-table>
-                </div>
-            </div>
-            <div class="pageBox">
-                <Pagination :tLength="totals"></Pagination>
-            </div>
-            <div class="modalBox">
-                <Addrm v-if="addModal" :addModal="addModal" :addOrEdit="addOrEdit" :editRow="editRow"
-                    :searchReport="searchReport" @armBack="armBack">
-                </Addrm>
-                <Delrm v-if="delModal" :delModal="delModal" :delId="delId" :searchReport="searchReport"
-                    @delrmBack="delrmBack"></Delrm>
-            </div>
+            <el-table-column
+              property="doc_id"
+              label="编号"
+              width="200"
+              show-overflow-tooltip
+            />
+            <el-table-column
+              property="name"
+              label="模板名称"
+              width="260"
+              show-overflow-tooltip
+            />
+            <el-table-column
+              property="memo"
+              label="模板描述"
+              width="600"
+              show-overflow-tooltip
+            />
+            <el-table-column
+              property="ct"
+              label="上传时间"
+              width="200"
+              show-overflow-tooltip
+            />
+            <el-table-column
+              property="state"
+              label="状态"
+              width="auto"
+              show-overflow-tooltip
+            >
+              <template #default="scope">
+                <span>{{ reState(scope.row.state) }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column fixed="right" label="操作" width="auto">
+              <template #default="scope">
+                <el-button
+                  style="color: #255ce7"
+                  link
+                  type="primary"
+                  size="small"
+                  @click="openAdd(1, scope.row)"
+                >
+                  <el-icon>
+                    <EditPen /> </el-icon
+                  >编辑</el-button
+                >
+                <el-button
+                  style="color: #255ce7"
+                  link
+                  type="primary"
+                  size="small"
+                  @click="downFile(scope.row)"
+                >
+                  <el-icon>
+                    <Download /> </el-icon
+                  >下载</el-button
+                >
+                <el-button
+                  style="color: red"
+                  link
+                  type="primary"
+                  size="small"
+                  @click="openDel(scope.row)"
+                >
+                  <el-icon style="color: red">
+                    <Delete /> </el-icon
+                  >删除</el-button
+                >
+              </template>
+            </el-table-column>
+          </el-table>
         </div>
+      </div>
+      <div class="pageBox">
+        <Pagination :tLength="totals"></Pagination>
+      </div>
+      <div class="modalBox">
+        <Addrm
+          v-if="addModal"
+          :addModal="addModal"
+          :addOrEdit="addOrEdit"
+          :editRow="editRow"
+          :searchReport="searchReport"
+          @armBack="armBack"
+        >
+        </Addrm>
+        <Delrm
+          v-if="delModal"
+          :delModal="delModal"
+          :delId="delId"
+          :searchReport="searchReport"
+          @delrmBack="delrmBack"
+        ></Delrm>
+      </div>
     </div>
+  </div>
 </template>
 
 <script>
-import { ref, onMounted, toRefs } from 'vue'
-import report from '@/api/report';
-import system from '@/api/system';
-import moment from 'moment';
-import Addrm from '../modalComp/Addrm.vue'
-import Delrm from '../modalComp/Delrm.vue'
-import Pagination from './Pagination.vue';
-import { ElMessage } from 'element-plus';
+import { ref, onMounted, toRefs } from "vue";
+import report from "@/api/report";
+import system from "@/api/system";
+import moment from "moment";
+import Addrm from "../modalComp/Addrm.vue";
+import Delrm from "../modalComp/Delrm.vue";
+import Pagination from "./Pagination.vue";
+import addPng from "@/assets/image/scdcheck/add.png";
+import { ElMessage } from "element-plus";
 export default {
-    setup() {
-        let reportList = ref([])//报告模板列表
-        let moduleName = ref('')//搜索报告模型
-        let getTime = ref("")//选择的时间范围
-        let addModal = ref(false)//新增，修改的模态框状态
-        let delModal = ref(false)//删除确认模态框状态
-        let pages = ref(0)//页数
-        let sizes = ref(0)//条数
-        let totals = ref(0)//总条数
-        let addOrEdit = ref(0)//0为新增，1为修改
-        let editRow = ref({})//需要回显的对象
-        let delId = ref('')//需要删除的id
-        let options = ref([
-            {
-                label: "全部",
-                value: '',
-            },
-            {
-                label: "启用",
-                value: 1,
-            },
-            {
-                label: "禁用",
-                value: 2
-            }
-        ])
-        let stateValue = ref("")
-        function searchReport() {//查询所有报告模板
-            report.getReport({ pageno: 1, pagesize: 20 }).then(res => {
-                if (res.data != null && res.code == 0) {
-                    reportList.value = res.data
-                    totals.value = res.count
-                    stateValue.value = ''//清空选择器
-                    moduleName.value = ''//清空名称
-                } else {
-                    ElMessage({
-                        message: res.msg,
-                        type: "error"
-                    })
-                }
-            })
-        }
-        function handleSelectionChange(val) {//表格多选事件
-            console.log(val, 'val');
-        }
-        function timeChange(e) {//时间选择器change事件
-            let a = moment(e[0]).format("YYYY-MM-DD HH:mm:ss")//开始时间
-            let b = moment(e[1]).format("YYYY-MM-DD HH:mm:ss")//结束时间
-        }
-        function search() {
-            report.getReport({
-                name: moduleName?.value,
-                state: stateValue?.value - 0,
-            }).then(res => {
-                if (res.code == 0 && res.data != null) {
-                    reportList.value = res.data
-                } else if (res.code == 0 && res.data == null) {
-                    ElMessage({
-                        message: "未查询到数据",
-                        type: "info"
-                    })
-                    reportList.value = []
-                } else if (res.code == 1) {
-                    ElMessage({
-                        message: res.msg,
-                        type: "error"
-                    })
-                }
-            })
-        }
-        // 下载数据
-        function downFile(row) {
-            system.downLoad({
-                ids: row.doc_id - 0
-            }).then(res => {
-                if(res.code == 0){
-                    location.href = window.ApiServer + res.data
-                    ElMessage({
-                        message:"正在下载",
-                        type:"success",
-                    })
-                }
-            })
-        }
-        function stateChange(e) {
-            stateValue.value = e
-        }
-        function reState(num) {
-            if (num == 1) {
-                return '已启用'
-            } else if (num == 2) {
-                return '已禁用'
-            }
-        }
-        function openAdd(num, row) {//打开，新增编辑模态框
-            addOrEdit.value = num
-            editRow.value = row
-            addModal.value = true
-        }
-        function openDel(row) {
-            delModal.value = true
-            delId.value = row.id
+  setup() {
+    let reportList = ref([]); //报告模板列表
+    let moduleName = ref(""); //搜索报告模型
+    let getTime = ref(""); //选择的时间范围
+    let addModal = ref(false); //新增，修改的模态框状态
+    let delModal = ref(false); //删除确认模态框状态
+    let pages = ref(0); //页数
+    let sizes = ref(0); //条数
+    let totals = ref(0); //总条数
+    let addOrEdit = ref(0); //0为新增，1为修改
+    let editRow = ref({}); //需要回显的对象
+    let delId = ref(""); //需要删除的id
+    let options = ref([
+      {
+        label: "全部",
+        value: "",
+      },
+      {
+        label: "启用",
+        value: 1,
+      },
+      {
+        label: "禁用",
+        value: 2,
+      },
+    ]);
+    let stateValue = ref("");
+    function searchReport() {
+      //查询所有报告模板
+      report.getReport({ pageno: 1, pagesize: 20 }).then((res) => {
+        if (res.data != null && res.code == 0) {
+          reportList.value = res.data;
+          totals.value = res.count;
+          stateValue.value = ""; //清空选择器
+          moduleName.value = ""; //清空名称
+        } else {
+          ElMessage({
+            message: res.msg,
+            type: "error",
+          });
         }
-        function armBack(data) {//新增编辑模态框返回数据
-            addModal.value = data
-        }
-        function delrmBack(data) {
-            delModal.value = data
-        }
-        onMounted(() => {
-            searchReport()
+      });
+    }
+    function handleSelectionChange(val) {
+      //表格多选事件
+      console.log(val, "val");
+    }
+    function timeChange(e) {
+      //时间选择器change事件
+      let a = moment(e[0]).format("YYYY-MM-DD HH:mm:ss"); //开始时间
+      let b = moment(e[1]).format("YYYY-MM-DD HH:mm:ss"); //结束时间
+    }
+    function search() {
+      report
+        .getReport({
+          name: moduleName?.value,
+          state: stateValue?.value - 0,
         })
-        return {
-            reportList,//报告模板列表
-            searchReport,//查询所有报告模板
-            moduleName,//搜索报告模板
-            getTime,//时间选择器
-            timeChange,//时间选择器change事件
-            handleSelectionChange,//表格多选事件
-            addModal,//新增，修改的模态框状态
-            delModal,//删除确认模态框状态
-            pages,
-            sizes,
-            totals,
-            armBack,//新增编辑模态框返回数据
-            openAdd,//打开新增编辑模态框
-            addOrEdit,//0新增，1修改
-            editRow,//需要回显的对象
-            openDel,//打开删除模态框
-            delId,//需要删除的id
-            delrmBack,//delrm.vue返回模态框状态
-            search,//查询列表
-            options,//选择
-            stateValue,//选择状态value
-            stateChange,//选择器change事件
-            reState,//表格筛选状态
-            downFile,//下载报告模板
-        }
-    },
-    components: {
-        Addrm,
-        Delrm,
-        Pagination,
+        .then((res) => {
+          if (res.code == 0 && res.data != null) {
+            reportList.value = res.data;
+          } else if (res.code == 0 && res.data == null) {
+            ElMessage({
+              message: "未查询到数据",
+              type: "info",
+            });
+            reportList.value = [];
+          } else if (res.code == 1) {
+            ElMessage({
+              message: res.msg,
+              type: "error",
+            });
+          }
+        });
     }
-}
+    // 下载数据
+    function downFile(row) {
+      system
+        .downLoad({
+          ids: row.doc_id - 0,
+        })
+        .then((res) => {
+          if (res.code == 0) {
+            location.href = window.ApiServer + res.data;
+            ElMessage({
+              message: "正在下载",
+              type: "success",
+            });
+          }
+        });
+    }
+    function stateChange(e) {
+      stateValue.value = e;
+    }
+    function reState(num) {
+      if (num == 1) {
+        return "已启用";
+      } else if (num == 2) {
+        return "已禁用";
+      }
+    }
+    function openAdd(num, row) {
+      //打开，新增编辑模态框
+      addOrEdit.value = num;
+      editRow.value = row;
+      addModal.value = true;
+    }
+    function openDel(row) {
+      delModal.value = true;
+      delId.value = row.id;
+    }
+    function armBack(data) {
+      //新增编辑模态框返回数据
+      addModal.value = data;
+    }
+    function delrmBack(data) {
+      delModal.value = data;
+    }
+    onMounted(() => {
+      searchReport();
+    });
+    return {
+      reportList, //报告模板列表
+      searchReport, //查询所有报告模板
+      moduleName, //搜索报告模板
+      getTime, //时间选择器
+      timeChange, //时间选择器change事件
+      handleSelectionChange, //表格多选事件
+      addModal, //新增，修改的模态框状态
+      delModal, //删除确认模态框状态
+      pages,
+      sizes,
+      totals,
+      armBack, //新增编辑模态框返回数据
+      openAdd, //打开新增编辑模态框
+      addOrEdit, //0新增，1修改
+      editRow, //需要回显的对象
+      openDel, //打开删除模态框
+      delId, //需要删除的id
+      delrmBack, //delrm.vue返回模态框状态
+      search, //查询列表
+      options, //选择
+      stateValue, //选择状态value
+      stateChange, //选择器change事件
+      reState, //表格筛选状态
+      addPng,
+      downFile, //下载报告模板
+    };
+  },
+  components: {
+    Addrm,
+    Delrm,
+    Pagination,
+  },
+};
 </script>
 
-<style scoped>
+<style scoped lang="scss">
+@import "~@/styles/home.scss";
 .bigBox {
-    width: 98%;
-    height: 100%;
-    margin-left: 15px;
+  width: 98%;
+  height: 100%;
+  margin-left: 15px;
 }
 
 .settingBox {
-    text-align: center;
+  text-align: center;
 }
 
 .moduleBox {
-    display: flex;
-    justify-content: flex-start;
-    align-items: center;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
 }
 
 .litBox {
-    margin-right: 5px;
+  margin-right: 5px;
+}
+.btnBox {
+  line-height: 40px;
 }
 </style>

src/pages/setting/components/SystemCode.vue

@@ -1,242 +1,317 @@
 <template>
-    <div>
-        <div class="bigBox" v-loading="loading">
-            <div class="settingBox">
-                <h2>系统代码管理</h2>
-            </div>
-            <div class="tableBox">
-                <div style="width: 30%;">
-                    <el-tree :data="treeFather" accordion node-key="id" :props="defaultProps"
-                        @node-click="handleNodeClick">
-                        <template #default="{ node, data }">
-                            <span class="custom-tree-node">
-                                <svg t="1709689483117" class="icon" viewBox="0 0 1180 1024" version="1.1"
-                                    xmlns="http://www.w3.org/2000/svg" p-id="1524" width="20" height="20">
-                                    <path
-                                        d="M1099.433546 289.842983h-1.08787v-99.462424a128.679511 128.679511 0 0 0-93.246023-126.65918v-3.263611A60.454505 60.454505 0 0 0 944.023508 0.003264H729.246837A60.454505 60.454505 0 0 0 668.326102 59.836128H122.526051A126.65918 126.65918 0 0 0 0.062941 190.380559V890.502778a12.277393 12.277393 0 0 0 2.331151 6.216401v1.243281c0 72.110257 46.623011 126.03754 113.760147 126.03754H969.821575c67.603366 0 105.212595-68.225006 122.463109-130.544431L1174.652004 419.610365c18.182974-75.063048-7.459682-129.767381-75.218458-129.767382z m-897.337556 0a160.072339 160.072339 0 0 0-132.253942 78.637479v-124.32803a73.198128 73.198128 0 0 1 46.623011-54.859743H668.326102a60.609915 60.609915 0 0 1 60.454505-59.988274h215.242901a60.609915 60.609915 0 0 1 60.454505 60.609914v3.108201a126.50377 126.50377 0 0 1 90.604052 97.908324z"
-                                        fill="#FF892A" p-id="1525"></path>
-                                </svg>
-                                <span>{{ node.label }}</span>
-                            </span>
-                        </template>
-                    </el-tree>
-                </div>
-                <div style="width: 70%;">
-                    <el-button type="primary" plain @click="openModal(0)">
-                        <el-icon>
-                            <Plus />
-                        </el-icon>
-                        新增系统字典
-                    </el-button>
-                    <el-table :data="systemList" style="width: 100%;height: calc(100vh - 260px);" :stripe="true" v-loading="tableLoading">
-                        <el-table-column label="序号" #default="scope">
-                            {{ scope.$index + 1 }}
-                        </el-table-column>
-                        <el-table-column prop="code" label="字典代码" width="auto" />
-                        <el-table-column prop="name" label="字典名称" width="auto" />
-                        <el-table-column prop="parentcode" label="上级字典代码" width="auto" />
-                        <el-table-column fixed="right" label="操作" width="120">
-                            <template #default="scope">
-                                <el-button link type="primary" size="small" @click="openModal(1, scope.row)">
-                                    <el-icon>
-                                        <EditPen />
-                                    </el-icon>编辑</el-button>
-                                <el-button style="color: red;" link type="primary" size="small"
-                                    @click="delItem(scope.row)">
-                                    <el-icon style="color: red;">
-                                        <Delete />
-                                    </el-icon>删除</el-button>
-                            </template>
-                        </el-table-column>
-                    </el-table>
-                </div>
-            </div>
-            <div class="pageBox">
-                <!-- <Pagination :key="reloadKey" :tLength="totals" :pages="pages" :sizes="sizes" @getBack="getBack">
-                </Pagination> -->
-            </div>
-            <!-- 模态框盒子 -->
-            <div class="modalBox">
-                <AddSc v-if="setModal" :setModal="setModal" :addOrEdit="addOrEdit" :handleNodeClick="handleNodeClick"
-                    :pageCode="pageCode" :searchSystem="searchSystem" :editRow="editRow" @getModal="getModal">
-                </AddSc>
-                <DelSc v-if="delModal" :delModal="delModal" :delId="delId" :pageCode="pageCode" :handleNodeClick="handleNodeClick" :searchSystem="searchSystem"
-                    @delBack="delBack">
-                </DelSc>
+  <div>
+    <div class="bigBox" v-loading="loading">
+      <div class="settingBox">
+        <h2>系统代码管理</h2>
+      </div>
+      <div class="tableBox">
+        <div style="width: 30%">
+          <el-tree
+            :data="treeFather"
+            accordion
+            node-key="id"
+            :props="defaultProps"
+            @node-click="handleNodeClick"
+          >
+            <template #default="{ node, data }">
+              <span class="custom-tree-node">
+                <svg
+                  t="1709689483117"
+                  class="icon"
+                  viewBox="0 0 1180 1024"
+                  version="1.1"
+                  xmlns="http://www.w3.org/2000/svg"
+                  p-id="1524"
+                  width="20"
+                  height="20"
+                >
+                  <path
+                    d="M1099.433546 289.842983h-1.08787v-99.462424a128.679511 128.679511 0 0 0-93.246023-126.65918v-3.263611A60.454505 60.454505 0 0 0 944.023508 0.003264H729.246837A60.454505 60.454505 0 0 0 668.326102 59.836128H122.526051A126.65918 126.65918 0 0 0 0.062941 190.380559V890.502778a12.277393 12.277393 0 0 0 2.331151 6.216401v1.243281c0 72.110257 46.623011 126.03754 113.760147 126.03754H969.821575c67.603366 0 105.212595-68.225006 122.463109-130.544431L1174.652004 419.610365c18.182974-75.063048-7.459682-129.767381-75.218458-129.767382z m-897.337556 0a160.072339 160.072339 0 0 0-132.253942 78.637479v-124.32803a73.198128 73.198128 0 0 1 46.623011-54.859743H668.326102a60.609915 60.609915 0 0 1 60.454505-59.988274h215.242901a60.609915 60.609915 0 0 1 60.454505 60.609914v3.108201a126.50377 126.50377 0 0 1 90.604052 97.908324z"
+                    fill="#FF892A"
+                    p-id="1525"
+                  ></path>
+                </svg>
+                <span>{{ node.label }}</span>
+              </span>
+            </template>
+          </el-tree>
+        </div>
+        <div style="width: 70%">
+          <div class="btnBox">
+            <div @click="openModal(0)">
+              <img :src="addPng" alt="" />
+              新增系统字典
             </div>
+          </div>
+          <el-table
+            :data="systemList"
+            style="width: 100%; height: calc(100vh - 260px)"
+            :stripe="true"
+            v-loading="tableLoading"
+          >
+            <el-table-column label="序号" #default="scope">
+              {{ scope.$index + 1 }}
+            </el-table-column>
+            <el-table-column prop="code" label="字典代码" width="auto" />
+            <el-table-column prop="name" label="字典名称" width="auto" />
+            <el-table-column
+              prop="parentcode"
+              label="上级字典代码"
+              width="auto"
+            />
+            <el-table-column fixed="right" label="操作" width="120">
+              <template #default="scope">
+                <el-button
+                  link
+                  type="primary"
+                  size="small"
+                  @click="openModal(1, scope.row)"
+                  style="color: #255ce7"
+                >
+                  <el-icon>
+                    <EditPen /> </el-icon
+                  >编辑</el-button
+                >
+                <el-button
+                  style="color: red"
+                  link
+                  type="primary"
+                  size="small"
+                  @click="delItem(scope.row)"
+                >
+                  <el-icon style="color: red">
+                    <Delete /> </el-icon
+                  >删除</el-button
+                >
+              </template>
+            </el-table-column>
+          </el-table>
         </div>
+      </div>
+      <div class="pageBox">
+        <!-- <Pagination :key="reloadKey" :tLength="totals" :pages="pages" :sizes="sizes" @getBack="getBack">
+                </Pagination> -->
+      </div>
+      <!-- 模态框盒子 -->
+      <div class="modalBox">
+        <AddSc
+          v-if="setModal"
+          :setModal="setModal"
+          :addOrEdit="addOrEdit"
+          :handleNodeClick="handleNodeClick"
+          :pageCode="pageCode"
+          :searchSystem="searchSystem"
+          :editRow="editRow"
+          @getModal="getModal"
+        >
+        </AddSc>
+        <DelSc
+          v-if="delModal"
+          :delModal="delModal"
+          :delId="delId"
+          :pageCode="pageCode"
+          :handleNodeClick="handleNodeClick"
+          :searchSystem="searchSystem"
+          @delBack="delBack"
+        >
+        </DelSc>
+      </div>
     </div>
+  </div>
 </template>
 
 <script>
-import { ref, onMounted } from 'vue';
-import systemRow from '@/api/systemRow';
-import Pagination from './Pagination.vue';
-import AddSc from '../modalComp/AddSc.vue';
-import DelSc from '../modalComp/DelSc.vue'
-import { ElMenu, ElMessage } from 'element-plus';
+import { ref, onMounted } from "vue";
+import systemRow from "@/api/systemRow";
+import Pagination from "./Pagination.vue";
+import AddSc from "../modalComp/AddSc.vue";
+import DelSc from "../modalComp/DelSc.vue";
+import { ElMenu, ElMessage } from "element-plus";
+import addPng from "@/assets/image/scdcheck/add.png";
 export default {
-    setup() {
-        let systemList = ref([])//系统字典列表数据
-        let pages = ref(0)//页码
-        let sizes = ref(0)//条数
-        let totals = ref(0)//总条数
-        let setModal = ref(false)//控制打开或关闭新增编辑模态框
-        let delModal = ref(false)//控制删除模态框
-        let delId = ref('')//需要删除的字典id
-        let addOrEdit = ref(0)//控制编辑或新增tips
-        let editRow = ref({})//编辑回显
-        let reloadKey = ref(0)//重载组件
-        let treeFather = ref([])//树形组件父级
-        let defaultProps = ref({
-            label: "name",
-            codes: "code",
-            ids: 'id',
-            children: 'children'
-        })
-        let loading = ref(false)//加载动画
-        let pageCode = ref("")//分页组件需要的code
-        let tableLoading = ref(false)//表格的刷新
-        function searchSystem() {//查询所有字典
-            loading.value = true
-            systemList.value = []
-            systemRow.getChildren({}).then(res => {
-                // 拿到所有父级节点
-                if (res.data) {
-                    //赋值给树形节点
-                    treeFather.value = res.data.map(item => ({ ...item, children: [] }));
-                    //再调用接口拿下级
-                    systemRow.getAllRow({ pageindex: 1, pagesize: 9999999 }).then(oss => {
-                        // 遍历所有父级节点
-                        treeFather.value.forEach(parentNode => {
-                            // 遍历所有系统列表对象
-                            oss.data.forEach(childNode => {
-                                // 如果系统列表对象的 parentcode 等于当前父级节点的 code，则将系统列表对象添加到当前父级节点的 children 数组中
-                                if (childNode.parentcode === parentNode.code) {
-                                    // 确保当前父级节点有 children 数组，如果没有则创建
-                                    if (!parentNode.children) {
-                                        parentNode.children = [];
-                                    }
-                                    // 将系统列表对象添加到当前父级节点的 children 数组中
-                                    parentNode.children.push(childNode);
-                                }
-                            });
-                        });
-                    })
-                    loading.value = false
-                } else {
-                    loading.value = false
-                    messageFun(res.msg)
-                }
-            })
-        }
-        // 公共提示窗
-        function messageFun(msg) {
-            ElMessage({
-                message: msg,
-                type: "error"
-            })
-        }
-        function handleNodeClick(e) {
-            pageCode.value = e.code
-            tableLoading.value = true
-            systemRow.getChildren({ code: pageCode.value }).then(res => {
-                if (res.data) {
-                    systemList.value = res.data
-                    totals.value = res.data.length
-                    tableLoading.value = false
-                } else {
-                    systemList.value = []
-                    totals.value = 0
-                    tableLoading.value = false
-                }
-            })
-        }
-        function openModal(num, row) {//打开新增或编辑模态框
-            editRow.value = row
-            addOrEdit.value = num
-            setModal.value = true
-        }
-        function delItem(row) {//控制删除模态框打开
-            delId.value = row.id
-            delModal.value = true
-        }
-        function getModal(data) {//新增，编辑模态框返回数据
-            setModal.value = data
+  setup() {
+    let systemList = ref([]); //系统字典列表数据
+    let pages = ref(0); //页码
+    let sizes = ref(0); //条数
+    let totals = ref(0); //总条数
+    let setModal = ref(false); //控制打开或关闭新增编辑模态框
+    let delModal = ref(false); //控制删除模态框
+    let delId = ref(""); //需要删除的字典id
+    let addOrEdit = ref(0); //控制编辑或新增tips
+    let editRow = ref({}); //编辑回显
+    let reloadKey = ref(0); //重载组件
+    let treeFather = ref([]); //树形组件父级
+    let defaultProps = ref({
+      label: "name",
+      codes: "code",
+      ids: "id",
+      children: "children",
+    });
+    let loading = ref(false); //加载动画
+    let pageCode = ref(""); //分页组件需要的code
+    let tableLoading = ref(false); //表格的刷新
+    function searchSystem() {
+      //查询所有字典
+      loading.value = true;
+      systemList.value = [];
+      systemRow.getChildren({}).then((res) => {
+        // 拿到所有父级节点
+        if (res.data) {
+          //赋值给树形节点
+          treeFather.value = res.data.map((item) => ({
+            ...item,
+            children: [],
+          }));
+          //再调用接口拿下级
+          systemRow
+            .getAllRow({ pageindex: 1, pagesize: 9999999 })
+            .then((oss) => {
+              // 遍历所有父级节点
+              treeFather.value.forEach((parentNode) => {
+                // 遍历所有系统列表对象
+                oss.data.forEach((childNode) => {
+                  // 如果系统列表对象的 parentcode 等于当前父级节点的 code，则将系统列表对象添加到当前父级节点的 children 数组中
+                  if (childNode.parentcode === parentNode.code) {
+                    // 确保当前父级节点有 children 数组，如果没有则创建
+                    if (!parentNode.children) {
+                      parentNode.children = [];
+                    }
+                    // 将系统列表对象添加到当前父级节点的 children 数组中
+                    parentNode.children.push(childNode);
+                  }
+                });
+              });
+            });
+          loading.value = false;
+        } else {
+          loading.value = false;
+          messageFun(res.msg);
         }
-        function getBack(index, size) {//分页组件返回的数据
-            pages.value = index
-            sizes.value = size
-            systemRow.getAllRow({ pageindex: pages.value, pageSize: sizes.value, code: pageCode.value }).then(res => {
-                systemList.value = res.data
-                totals.value = res.count
-            })
-        }
-        function delBack(data, num) {//确认删除模态框返回的数据
-            delModal.value = data
-            reloadKey.value = num
+      });
+    }
+    // 公共提示窗
+    function messageFun(msg) {
+      ElMessage({
+        message: msg,
+        type: "error",
+      });
+    }
+    function handleNodeClick(e) {
+      pageCode.value = e.code;
+      tableLoading.value = true;
+      systemRow.getChildren({ code: pageCode.value }).then((res) => {
+        if (res.data) {
+          systemList.value = res.data;
+          totals.value = res.data.length;
+          tableLoading.value = false;
+        } else {
+          systemList.value = [];
+          totals.value = 0;
+          tableLoading.value = false;
         }
-        onMounted(() => {
-            searchSystem()
+      });
+    }
+    function openModal(num, row) {
+      //打开新增或编辑模态框
+      editRow.value = row;
+      addOrEdit.value = num;
+      setModal.value = true;
+    }
+    function delItem(row) {
+      //控制删除模态框打开
+      delId.value = row.id;
+      delModal.value = true;
+    }
+    function getModal(data) {
+      //新增，编辑模态框返回数据
+      setModal.value = data;
+    }
+    function getBack(index, size) {
+      //分页组件返回的数据
+      pages.value = index;
+      sizes.value = size;
+      systemRow
+        .getAllRow({
+          pageindex: pages.value,
+          pageSize: sizes.value,
+          code: pageCode.value,
         })
-        return {
-            systemList,//系统字典列表
-            searchSystem,//查询所有字典
-            pages, //页码
-            sizes, //条数
-            totals,//总条数
-            setModal,//控制打开或关闭新增编辑模态框
-            openModal,//打开新增或编辑模态框
-            getModal,//新增，编辑模态框返回数据
-            getBack,//分页组件返回数据
-            addOrEdit,//控制编辑或新增tips
-            delModal,//控制删除模态框
-            delItem,//控制删除模态框打开
-            delId,//需要删除的字典id
-            delBack,//确认删除模态框返回的数据
-            editRow,//编辑回显
-            reloadKey,
-            treeFather,//树形父级
-            messageFun,//公共msg
-            defaultProps,//树形现实的数据key
-            handleNodeClick,//树形组件点击节点方法
-            loading,//加载方法
-            pageCode,//分页组件需要的code 
-            tableLoading,//表格的刷新
-        }
-    },
-    components: {
-        Pagination,
-        AddSc,
-        DelSc,
+        .then((res) => {
+          systemList.value = res.data;
+          totals.value = res.count;
+        });
     }
-}
+    function delBack(data, num) {
+      //确认删除模态框返回的数据
+      delModal.value = data;
+      reloadKey.value = num;
+    }
+    onMounted(() => {
+      searchSystem();
+    });
+    return {
+      addPng,
+      systemList, //系统字典列表
+      searchSystem, //查询所有字典
+      pages, //页码
+      sizes, //条数
+      totals, //总条数
+      setModal, //控制打开或关闭新增编辑模态框
+      openModal, //打开新增或编辑模态框
+      getModal, //新增，编辑模态框返回数据
+      getBack, //分页组件返回数据
+      addOrEdit, //控制编辑或新增tips
+      delModal, //控制删除模态框
+      delItem, //控制删除模态框打开
+      delId, //需要删除的字典id
+      delBack, //确认删除模态框返回的数据
+      editRow, //编辑回显
+      reloadKey,
+      treeFather, //树形父级
+      messageFun, //公共msg
+      defaultProps, //树形现实的数据key
+      handleNodeClick, //树形组件点击节点方法
+      loading, //加载方法
+      pageCode, //分页组件需要的code
+      tableLoading, //表格的刷新
+    };
+  },
+  components: {
+    Pagination,
+    AddSc,
+    DelSc,
+  },
+};
 </script>
 
-<style scoped>
+<style scoped lang="scss">
+@import "~@/styles/home.scss";
 .bigBox {
-    width: 98%;
-    height: 100%;
-    margin-left: 15px;
-    /* margin-top: 10px; */
+  width: 98%;
+  height: 100%;
+  margin-left: 15px;
+  /* margin-top: 10px; */
 }
 
 .settingBox {
-    width: 100%;
-    height: auto;
-    text-align: center;
+  width: 100%;
+  height: auto;
+  text-align: center;
 }
 
 .el-tree {
-    width: calc(90%);
-    height: 72vh;
-    overflow-y: auto;
+  width: calc(90%);
+  height: 72vh;
+  overflow-y: auto;
 }
 
 .tableBox {
-    width: 100%;
-    display: flex;
-    justify-content: space-around;
-    align-items: center;
+  width: 100%;
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+}
+.btnBox {
+  line-height: 40px;
 }
 </style>

src/pages/setting/components/SystemNum.vue

@@ -1,140 +1,182 @@
 <template>
-    <div>
-        <div class="bigBox" v-loading="loading">
-            <div class="pBox">
-                <h1 style="font-size: 18px;">系统参数管理</h1>
-            </div>
-            <div class="tableBox">
-                <el-button type="primary" @click="addNew(0)">+ 新建系统参数</el-button>
-                <el-table :data="systemList" style="width: 100%;height: calc(100vh - 260px);">
-                    <el-table-column label="序号" width="100">
-                        <template #default="{ $index }">{{ $index + 1 }}</template>
-                    </el-table-column>
-                    <el-table-column prop="param_name" label="参数名称" show-overflow-tooltip width="auto" />
-                    <el-table-column prop="param_value" label="参数值" width="auto" />
-                    <el-table-column prop="param_memo" label="参数说明" show-overflow-tooltip width="auto" />
-                    <el-table-column fixed="right" label="操作" width="120">
-                        <template #default="scope">
-                            <el-button text type="primary" size="small" @click="editOld(1, scope.row)">
-                                <el-icon>
-                                    <EditPen />
-                                </el-icon>
-                                编辑
-                            </el-button>
-                        </template>
-                    </el-table-column>
-                </el-table>
-            </div>
-            <!-- 分页组件 -->
-            <div class="pageBox">
-                <!-- <PageNation :tLength="tLength" @getBack="getBack"></PageNation> -->
-            </div>
-            <!-- 模态框 -->
-            <div class="modalBox">
-                <AddSn v-if="addRule" :addRule="addRule" :editForm="editForm" @asBack="asBack" :addEdit="addEdit"
-                    :searchSystemCode="searchSystemCode"></AddSn>
-            </div>
+  <div>
+    <div class="bigBox" v-loading="loading">
+      <div class="pBox">
+        <h1 style="font-size: 18px">系统参数管理</h1>
+      </div>
+      <div class="tableBox">
+        <div class="btnBox">
+          <div @click="addNew(0)">
+            <img :src="addPng" alt="" />
+            新建系统参数
+          </div>
         </div>
+        <el-table
+          :data="systemList"
+          style="width: 100%; height: calc(100vh - 260px)"
+        >
+          <el-table-column label="序号" width="100">
+            <template #default="{ $index }">{{ $index + 1 }}</template>
+          </el-table-column>
+          <el-table-column
+            prop="param_name"
+            label="参数名称"
+            show-overflow-tooltip
+            width="auto"
+          />
+          <el-table-column prop="param_value" label="参数值" width="auto" />
+          <el-table-column
+            prop="param_memo"
+            label="参数说明"
+            show-overflow-tooltip
+            width="auto"
+          />
+          <el-table-column fixed="right" label="操作" width="120">
+            <template #default="scope">
+              <el-button
+                text
+                type="primary"
+                size="small"
+                @click="editOld(1, scope.row)"
+                style="color: #255ce7"
+              >
+                <el-icon>
+                  <EditPen />
+                </el-icon>
+                编辑
+              </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+      <!-- 分页组件 -->
+      <div class="pageBox">
+        <!-- <PageNation :tLength="tLength" @getBack="getBack"></PageNation> -->
+      </div>
+      <!-- 模态框 -->
+      <div class="modalBox">
+        <AddSn
+          v-if="addRule"
+          :addRule="addRule"
+          :editForm="editForm"
+          @asBack="asBack"
+          :addEdit="addEdit"
+          :searchSystemCode="searchSystemCode"
+        ></AddSn>
+      </div>
     </div>
+  </div>
 </template>
 
 <script>
-import { ref, onMounted } from 'vue';
-import { ElMessage } from 'element-plus';
-import system from '@/api/system'
-import PageNation from './Pagination.vue'
-import AddSn from '../modalComp/AddSn.vue'
+import { ref, onMounted } from "vue";
+import { ElMessage } from "element-plus";
+import system from "@/api/system";
+import PageNation from "./Pagination.vue";
+import AddSn from "../modalComp/AddSn.vue";
+import addPng from "@/assets/image/scdcheck/add.png";
 export default {
-    setup() {
-        let systemList = ref([])//系统参数列表
-        let tLength = ref(0)//总条数
-        let addRule = ref(false)//增加，修改模态框
-        let addEdit = ref(0)//0代表新增，1代表修改
-        let editForm = ref({})//编辑需要回显的参数
-        let loading = ref(false)
-        function searchSystemCode() {//获取所有系统参数
-            system.getSystemCode({ pageindex: 1, pageSize: 10 }).then(res => {
-                if (res.data != null) {
-                    systemList.value = res.data
-                    tLength.value = res.count
-                } else {
-                    ElMessage({
-                        message: res.msg,
-                        type: 'error'
-                    })
-                }
-            })
+  setup() {
+    let systemList = ref([]); //系统参数列表
+    let tLength = ref(0); //总条数
+    let addRule = ref(false); //增加，修改模态框
+    let addEdit = ref(0); //0代表新增，1代表修改
+    let editForm = ref({}); //编辑需要回显的参数
+    let loading = ref(false);
+    function searchSystemCode() {
+      //获取所有系统参数
+      system.getSystemCode({ pageindex: 1, pageSize: 10 }).then((res) => {
+        if (res.data != null) {
+          systemList.value = res.data;
+          tLength.value = res.count;
+        } else {
+          ElMessage({
+            message: res.msg,
+            type: "error",
+          });
         }
-        function addNew(num) {//新增打开模态框
-            addEdit.value = num
-            addRule.value = true
-        }
-        function editOld(num, row) {//编辑打开模态框
-            editForm.value = row
-            addEdit.value = num
-            addRule.value = true
-        }
-        function asBack(data) {//子组件返回的模态框状态
-            addRule.value = data
-        }
-        function getBack(index, size) {
-            system.getSystemCode({ pageindex: index - 0, pageSize: size - 0 }).then(res => {
-                if (res.data != null) {
-                    systemList.value = res.data
-                    tLength.value = res.count
-                } else {
-                    ElMessage({
-                        message: res.msg,
-                        type: 'error'
-                    })
-                }
-            })
-        }
-        onMounted(() => {
-            searchSystemCode()
-        })
-        return {
-            searchSystemCode,//获取所有系统参数
-            systemList,//系统参数列表
-            tLength,//总条数
-            addRule,//增加，修改模态框
-            addNew,//新增打开模态框
-            asBack,//子组件返回的模态框状态
-            addEdit,//0代表新增，1代表修改
-            editOld,//编辑打开模态框
-            editForm,//编辑需要回显的参数
-            loading,
-            getBack,
-        }
-    },
-    components: {
-        PageNation,
-        AddSn,
+      });
     }
-}
+    function addNew(num) {
+      //新增打开模态框
+      addEdit.value = num;
+      addRule.value = true;
+    }
+    function editOld(num, row) {
+      //编辑打开模态框
+      editForm.value = row;
+      addEdit.value = num;
+      addRule.value = true;
+    }
+    function asBack(data) {
+      //子组件返回的模态框状态
+      addRule.value = data;
+    }
+    function getBack(index, size) {
+      system
+        .getSystemCode({ pageindex: index - 0, pageSize: size - 0 })
+        .then((res) => {
+          if (res.data != null) {
+            systemList.value = res.data;
+            tLength.value = res.count;
+          } else {
+            ElMessage({
+              message: res.msg,
+              type: "error",
+            });
+          }
+        });
+    }
+    onMounted(() => {
+      searchSystemCode();
+    });
+    return {
+      searchSystemCode, //获取所有系统参数
+      systemList, //系统参数列表
+      tLength, //总条数
+      addRule, //增加，修改模态框
+      addNew, //新增打开模态框
+      asBack, //子组件返回的模态框状态
+      addEdit, //0代表新增，1代表修改
+      editOld, //编辑打开模态框
+      editForm, //编辑需要回显的参数
+      loading,
+      getBack,
+      addPng
+    };
+  },
+  components: {
+    PageNation,
+    AddSn,
+  },
+};
 </script>
 
-<style  scoped>
+<style scoped lang="scss">
+@import "~@/styles/home.scss";
 .bigBox {
-    width: 98%;
-    height: 100%;
-    margin-left: 15px;
+  width: 98%;
+  height: 100%;
+  margin-left: 15px;
 }
 
 .pBox {
-    width: 100%;
-    height: 100%;
-    text-align: center;
+  width: 100%;
+  height: 100%;
+  text-align: center;
 }
 
 .tableBox {
-    width: 100%;
-    height: auto;
-    /* border: 1px solid red; */
-    overflow-y: auto;
+  width: 100%;
+  height: auto;
+  /* border: 1px solid red; */
+  overflow-y: auto;
 }
 
 .pageBox {
-    float: right;
+  float: right;
+}
+.btnBox {
+  line-height: 40px;
 }
 </style>