From 5208ae16a508a42be2e4b50ef299389fb556a67e Mon Sep 17 00:00:00 2001
From: fuliqi <fuliqi@qq.com>
Date: 星期日, 28 四月 2024 09:14:18 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'

---
 src/views/system/result/detail/index1.vue |  194 ++++++++++++++++++++++++-----------------------
 1 files changed, 99 insertions(+), 95 deletions(-)

diff --git a/src/views/system/result/detail/index1.vue b/src/views/system/result/detail/index1.vue
index 4a9971c..3e3341f 100644
--- a/src/views/system/result/detail/index1.vue
+++ b/src/views/system/result/detail/index1.vue
@@ -1,9 +1,10 @@
 <template>
   <div style="padding: 0px 10px">
     <div>
-      <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect" style="margin-bottom: 10px">
-        <el-menu-item index="1">鐪佸巺鑰冩牳</el-menu-item>
-        <el-menu-item index="2">鍖哄煙鑰冩牳</el-menu-item>
+      <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect"
+        style="margin-bottom: 10px">
+        <el-menu-item index="0">鐪佸巺鑰冩牳</el-menu-item>
+        <el-menu-item index="1">鍖哄煙鑰冩牳</el-menu-item>
       </el-menu>
     </div>
 
@@ -12,6 +13,11 @@
         <div class="card-content">
           <div class="title-container">
             <h1>鑰冩牳鎴愮哗</h1>
+            <div class="select-container">
+              <el-date-picker v-model="date" format="yyyy-MM" value-format="yyyy-MM" type="month" placeholder="閫夋嫨鏃ユ湡"
+                @change="dateChange">
+              </el-date-picker>
+            </div>
           </div>
           <div class="chart-container">
             <div id="chartContent" ref="chartContent"></div>
@@ -21,49 +27,29 @@
     </div>
 
     <div style="margin-top: 35px">
-      <el-table
-        :data="tableData"
-        style="width: 100%">
-        <el-table-column
-          label="鑰冩牳鏃堕棿"
-          prop="createTime"
-          align="center">
+      <el-table :data="tableData" style="width: 100%" v-loading="loading">
+        <el-table-column label="鑰冩牳鏃堕棿" prop="createTime" align="center">
         </el-table-column>
-        <el-table-column
-          label="鑰冩牳瀵硅薄"
-          prop="deptId"
-          align="center">
+        <el-table-column label="鑰冩牳瀵硅薄" prop="deptId" align="center">
           <template slot-scope="scope">
             {{ translateDeptId(scope.row.deptId) }}
           </template>
         </el-table-column>
-        <el-table-column
-          label="鏍囩"
-          prop="examineTag"
-          align="center">
+        <el-table-column label="鏍囩" prop="examineTag" align="center">
           <template slot-scope="scope">
             {{ scope.row.examineTag == 0 ? '鐪佸巺鑰冩牳' : '甯傚眬鑰冩牳' }}
           </template>
         </el-table-column>
-        <el-table-column
-          label="鑰冩牳绫诲瀷"
-          prop="examineCategory"
-          align="center">
+        <el-table-column label="鑰冩牳绫诲瀷" prop="examineCategory" align="center">
           <template slot-scope="scope">
-          <dict-tag :options="dict.type.platform_examine_category" :value="scope.row.examineCategory"/>
+            <dict-tag :options="dict.type.platform_examine_category" :value="scope.row.examineCategory" />
           </template>
         </el-table-column>
 
 
-        <el-table-column
-          label="鍒嗘暟"
-          prop="score"
-          align="center">
+        <el-table-column label="鍒嗘暟" prop="score" align="center">
         </el-table-column>
-        <el-table-column
-          label="鐘舵��"
-          prop="publish"
-          align="center">
+        <el-table-column label="鐘舵��" prop="publish" align="center">
         </el-table-column>
         <el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width">
           <template slot-scope="scope">
@@ -81,14 +67,9 @@
     </div>
 
     <div style="text-align: right; margin-top: 10px">
-      <el-pagination
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-        :current-page="currentPage4"
-        :page-sizes="[5, 10, 20]"
-        :page-size="5"
-        layout="total, sizes, prev, pager, next, jumper"
-        :total="4">
+      <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
+        :current-page="queryParams.pageNum" :page-sizes="[10, 20, 50]" :page-size="queryParams.pageSize"
+        layout="total, sizes, prev, pager, next, jumper" :total="tableData.length">
       </el-pagination>
     </div>
 
@@ -96,41 +77,29 @@
 </template>
 
 <script>
-import { listScore, getScore, delScore, addScore, updateScore,publishScore} from "@/api/platform/check-score";
-import { areaSelect } from '@/api/system/dept'
+import { listScore, getScore, delScore, addScore, updateScore, publishScore } from "@/api/platform/check-score";
+import { areaSelect } from '@/api/system/dept';
+import { mapState } from 'vuex';
 import * as echarts from 'echarts';
 let lineChart = null;
 let observer = null;
 export default {
   name: 'index',
-  dicts: ['platform_examine_use','platform_examine_category'],
+  dicts: ['platform_examine_use', 'platform_examine_category'],
   data() {
     return {
-      activeIndex: '1',
-      areaList:[],
+      activeIndex: '0',
+      areaList: [],
+      date: '',
       dateRange: '',
-      company: '',
       queryParams: {
         pageNum: 1,
         pageSize: 10,
         deptId: null,
+        examinTag:0
       },
-      dataList: [
-        {
-          name: '鍏ㄩ儴',
-          complete: { '4.5': 95.5, '4.6': 95.3, '4.7': 96.0, '4.8': 97.2, '4.9': 96.5 ,
-            '4.10': 95.5, '4.11': 95.3, '4.12': 96.0, '4.13': 97.2, '4.14': 96.5 ,
-            '4.15': 95.5, '4.16': 95.3, '4.17': 96.0, '4.18': 97.2, '4.19': 96.5 ,
-            '4.20': 95.5, '4.21': 95.3, '4.22': 96.0, '4.23': 97.2, '4.24': 96.5,
-            '4.25': 95.5, '4.26': 95.3, '4.27': 96.0, '4.28': 97.2, '4.29': 96.5
-          },
-          waiting: { '4.5': 94.8, '4.6': 91.3, '4.7': 95.3, '4.8': 92.3, '4.9': 93.3,
-            '4.10': 94.8, '4.11': 91.3, '4.12': 95.3, '4.13': 92.3, '4.14': 93.3 },
-          pending: { '4.5': 91.6, '4.6': 92.6, '4.7': 93.7, '4.8': 94.0, '4.9': 95.9
-            ,'4.10': 91.6, '4.11': 92.6, '4.12': 93.7, '4.13': 94.0, '4.14': 95.9 }
-        }
-      ],
       tableData: [],
+      loading: false,
       searchForm: {
         time: null,
       }
@@ -139,11 +108,18 @@
   created() {
     //鑰冩牳鎴愮哗璇︽儏璺宠浆鍙傛暟鎺ユ敹
     console.log(this.$route.query.index)
-    if(this.$route.query.index){
+    if (this.$route.query.index) {
       this.queryParams.deptId = this.$route.query.index
     }
-    this.getList(this.$route.query.index);
+    const date = new Date();
+    const year = date.getFullYear();
+    const month = (date.getMonth() + 1) >= 10 ? date.getMonth() + 1 : '0' + (date.getMonth() + 1);
+    this.date = year + '-' + month;
+    this.queryParams.date = this.date;
     this.areaSelect();
+  },
+  computed: {
+
   },
   methods: {
     // 鍖哄煙涓嬫媺鏁版嵁
@@ -157,16 +133,19 @@
       return department ? department.value : '鏈煡';
     },
     /** 瀵艰埅鍒囨崲 */
-    handleSelect(key){
-      this.activeIndex = key; // 鏇存柊褰撳墠婵�娲荤殑鑿滃崟椤�
-      this.getList();
+    handleSelect(key) {
+      this.activeIndex = key;
+      this.queryParams.examinTag = key;
+      this.getList(this.queryParams.deptId);
     },
     /** 鏌ヨ鑰冩牳妯℃澘鍒楄〃 */
     getList(deptId) {
       this.loading = true;
+      lineChart.showLoading();
       listScore(this.queryParams).then(response => {
         this.tableData = response.data[deptId];
         this.loading = false;
+        this.initChart(response.data[deptId]);
       });
     },
     handleSizeChange(val) {
@@ -186,33 +165,14 @@
     handleDelete(index, row) {
       console.log(index, row);
     },
-    initChart() {
+    initChart(data) {
+      const dataList = this.groupByData(data);
       const option = {
         legend: {
           right: 'right',
           top: 'top',
           icon: 'rect',
           orient: "vertical",
-          data: [
-            {
-              name: '杞﹁締鑰冩牳',
-              itemStyle: {
-                color: 'rgba(62, 144, 247, 1)'
-              }
-            },
-            {
-              name: '浜鸿劯鑰冩牳',
-              itemStyle: {
-                color: 'rgba(85, 192, 191, 1)'
-              }
-            },
-            {
-              name: '瑙嗛鑰冩牳',
-              itemStyle: {
-                color: 'rgba(255, 165, 0, 1)'
-              }
-            },
-          ],
         },
         grid: {
           left: 0,
@@ -224,7 +184,7 @@
         tooltip: {},
         xAxis: {
           type: 'category',
-          data: Object.keys(this.acitveData.complete),
+          data: dataList.map((item) => item[0]),
         },
         yAxis: {
           min: 90,
@@ -232,7 +192,7 @@
         series: [
           {
             name: '杞﹁締鑰冩牳',
-            data: Object.entries(this.acitveData.complete).map(([key, value]) => value),
+            data: this.filterData(dataList, 0),
             type: 'line',
             itemStyle: {
               color: 'rgba(62, 144, 247, 1)'
@@ -240,7 +200,7 @@
           },
           {
             name: '浜鸿劯鑰冩牳',
-            data: Object.entries(this.acitveData.waiting).map(([key, value]) => value),
+            data: this.filterData(dataList, 1),
             type: 'line',
             itemStyle: {
               color: 'rgba(85, 192, 191, 1)'
@@ -248,7 +208,7 @@
           },
           {
             name: '瑙嗛鑰冩牳',
-            data: Object.entries(this.acitveData.pending).map(([key, value]) => value),
+            data: this.filterData(dataList, 2),
             type: 'line',
             itemStyle: {
               color: 'rgba(255, 165, 0, 1)'
@@ -257,6 +217,47 @@
         ]
       };
       lineChart.setOption(option, true);
+      lineChart.hideLoading();
+    },
+
+    groupByData(data) {
+      if (!data) return this.getAllDay().map((item) => [item, []]);
+      const tempGroup = {};
+      data.forEach((item) => {
+        let { createTime } = item;
+        let tempTime = createTime.split('-');
+        createTime = tempTime[1] + '-' + tempTime[2];
+        if (!tempGroup[createTime]) {
+          tempGroup[createTime] = [];
+        }
+        tempGroup[createTime].push(item);
+      })
+      const tempArray = Object.entries(tempGroup).sort(([keyA], [keyB]) => new Date([keyA]) - new Date([keyB]));
+      return tempArray;
+    },
+    filterData(data, tag) {
+      const scoreList = data.map((item) => {
+        let temp = item[1].find((exam) => exam.examineCategory === tag);
+        if (temp) {
+          return temp.score;
+        } else {
+          return;
+        }
+      });
+      return scoreList;
+    },
+
+    getAllDay() {
+      const currentDate = this.date.split('-');
+      const currentYear = currentDate[0];
+      const currentMonth = currentDate[1];
+      const daysInMonth = new Date(currentYear, currentMonth, 0).getDate();
+      const datesOfMonth = [];
+      for (var day = 1; day <= daysInMonth; day++) {
+        const formattedDate = currentMonth + '-' + (day.toString().padStart(2, '0'));
+        datesOfMonth.push(formattedDate);
+      }
+      return datesOfMonth;
     },
 
     // 鐩戝惉鍙樺寲
@@ -273,14 +274,18 @@
       if (lineChart) {
         lineChart.resize();
       }
+    },
+
+    dateChange() {
+      this.queryParams.date = this.date;
+      console.log(this.queryParams);
+      this.getList(this.queryParams.deptId);
     }
 
   },
   mounted() {
-    this.acitveData = this.dataList[0];
-    this.company = this.acitveData.name;
     lineChart = echarts.init(this.$refs.chartContent);
-    this.initChart();
+    this.getList(this.$route.query.index);
     this.observe();
   },
   beforeDestroy() {
@@ -292,6 +297,7 @@
   handleSelect(key, keyPath) {
     console.log(key, keyPath);
   },
+
 }
 </script>
 
@@ -327,7 +333,6 @@
 }
 
 .chart-container {
-
   width: 100%;
   height: 100%;
 
@@ -341,5 +346,4 @@
   margin: 0 20px;
   width: 180px;
 }
-
 </style>

--
Gitblit v1.8.0