From 4a29f490dfbbb10b70c32d3944a33961040f5910 Mon Sep 17 00:00:00 2001 From: fuliqi <fuliqi@qq.com> Date: 星期一, 06 一月 2025 18:10:59 +0800 Subject: [PATCH] 核算重构 --- src/views/system/check/result/index.vue | 234 +++++++++++++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 197 insertions(+), 37 deletions(-) diff --git a/src/views/system/check/result/index.vue b/src/views/system/check/result/index.vue index e261e84..a6be274 100644 --- a/src/views/system/check/result/index.vue +++ b/src/views/system/check/result/index.vue @@ -1,13 +1,67 @@ <template> <div id="warp"> - <div> - <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="2">鐪佸巺瀛e害</el-menu-item> - <el-menu-item index="1">甯傚眬鏈堝害</el-menu-item> - <el-menu-item index="3">甯傚眬瀛e害</el-menu-item> - </el-menu> + <div style="display: flex;position: relative"> + <div style="width: 100%"> + <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-item index="2">鍏畨閮ㄨ�冩牳</el-menu-item> + </el-menu> + </div> + <!-- 瀵煎嚭鎸夐挳 --> + <div style="position: absolute;top:10px; right: 5px;z-index: 2" v-hasPermi="['check:result:export']"> + <el-popover + placement="left" + width="300px" + trigger="click"> + <span style="font-weight: bold;font-size: 16px">瀵煎嚭</span> + + <el-form ref="exportForm" :model="exportForm" :rules="exportRules" label-width="100px"> + <el-form-item label="鑰冩牳鏃堕棿" prop="quarter" required> + <el-date-picker + :clearable="false" + v-model="exportForm.quarter" + type="monthrange" + format="yyyy-MM" + value-format="yyyy-MM" + unlink-panels + range-separator="鑷�" + start-placeholder="寮�濮嬫湀浠�" + end-placeholder="缁撴潫鏈堜唤" + :picker-options="pickerOptions"> + </el-date-picker> + </el-form-item> + <el-form-item label="鍖哄幙" prop="deptIds"> + <el-select v-model="exportForm.deptIds" multiple clearable> + <el-option v-for="dept in areaList" + :value="dept.id" + :key="dept.value" + :label="dept.value"/> + </el-select> + </el-form-item> + <el-form-item label="鑰冩牳鏍囩" prop="examineTags"> + <el-checkbox-group v-model="exportForm.examineTags"> + <el-checkbox + v-for="item in tagOptions" + :key="item.value" + :label="item.value" + >{{ item.label }} + </el-checkbox> + </el-checkbox-group> + </el-form-item> + <el-form-item label="璁$畻骞冲潎鍊�" prop="average"> + <el-switch + v-model="exportForm.average" + > + </el-switch> + </el-form-item> + <el-button type="primary" size="small" style="width: 400px" @click="handleExport">瀵煎嚭</el-button> + </el-form> + <el-button slot="reference" type="primary" size="mini" plain>瀵煎嚭</el-button> + </el-popover> + </div> + </div> <div class="data-chart-container"> @@ -15,6 +69,19 @@ <div class="card-content"> <div class="title-container"> <h1>鑰冩牳鎴愮哗</h1> + <div class="select-container"> + <el-date-picker v-model="date" + format="yyyy-MM-dd" + value-format="yyyy-MM-dd" + type="daterange" + placeholder="閫夋嫨鏃ユ湡" + start-placeholder="寮�濮嬫棩鏈�" + end-placeholder="缁撴潫鏃ユ湡" + @change="dateChange" + @clear="handleClear" + :picker-options="pickerOptions"> + </el-date-picker> + </div> </div> <div class="echart-container"> <div id="barChart" ref="barChart"></div> @@ -45,7 +112,8 @@ </div> </div> <div class="bottom-publish"> - <el-button v-hasPermi="['check:score:publish']" size="medium" :type="isAnyUnpublished(city) ? 'success' : 'danger'" @click="publish(city)"> + <el-button v-hasPermi="['check:score:publish']" size="medium" + :type="isAnyUnpublished(city) ? 'success' : 'danger'" @click="publish(city)"> {{ isAnyUnpublished(city) ? '鍙戝竷' : '鍙栨秷' }} </el-button> <el-button size="medium" @click="jumpDetail(index)" type="primary">璇︽儏</el-button> @@ -60,26 +128,78 @@ </template> <script> -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 {listScore, publishScore} from "@/api/platform/check-score"; import * as echarts from 'echarts'; +import {barScore} from "../../../../api/platform/check-score"; + let observer = null; let chart = null; export default { name: 'index', data() { return { + tagOptions: [ + {value: 0, label: '鐪佸巺'}, + {value: 1, label: '鍖哄幙'}, + {value: 2, label: '鍏畨閮�'} + ], + pickerOptions: { + shortcuts: [{ + text: '绗竴瀛e害', + onClick(picker) { + picker.$emit('pick', [new Date(new Date().getFullYear() + "-01"+ "-01"), new Date(new Date().getFullYear() + "-03"+"-31")]); + } + }, + { + text: '绗簩瀛e害', + onClick(picker) { + picker.$emit('pick', [new Date(new Date().getFullYear() + "-04"+"-01"), new Date(new Date().getFullYear() + "-06"+"-30")]); + } + }, + { + text: '绗笁瀛e害', + onClick(picker) { + picker.$emit('pick', [new Date(new Date().getFullYear() + "-07"+"-01"), new Date(new Date().getFullYear() + "-09"+"-30")]) + } + }, + { + text: '绗洓瀛e害', + onClick(picker) { + picker.$emit('pick', [new Date(new Date().getFullYear() + "-10"+"-01"), new Date(new Date().getFullYear() + "-12"+"-31")]) + } + }] + }, province: { id: [], publish: null, }, + // 瀵煎嚭琛ㄥ崟楠岃瘉 + exportRules: { + quarter: [ + { type: 'array', required: true, message: '璇烽�夋嫨鏃堕棿', trigger: 'change' } + ], + }, checkScoreList: [], areaList: [], activeIndex: '0', - date: '', + date: [], company: '', + // 瀵煎嚭 + exportForm: { + quarter: [], + deptIds: [], + examineTags: [], + examineCategories: [], + average: null, + }, // 鏌ヨ鍙傛暟 queryParams: { + examineTag: null, + createTime: null + }, + // 鏌ヨ鍙傛暟 + barParams: { examineTag: null, createTime: null }, @@ -89,10 +209,15 @@ }, mounted() { this.queryParams.examineTag = this.activeIndex - this.getList(); - this.areaSelect(); + this.barParams.examineTag = this.activeIndex chart = echarts.init(this.$refs.barChart); - this.setChartOption(this.checkScoreList); + const currentDate = new Date(); + const year = currentDate.getFullYear(); + const month = String(currentDate.getMonth() + 1).padStart(2, '0'); // 鏈堜唤浠�0寮�濮嬶紝闇�瑕佸姞1锛屽苟涓斾繚璇佷袱浣嶆暟 + const day = String(currentDate.getDate()).padStart(2, '0'); // 淇濊瘉涓や綅鏁� + this.date = [`${year}-${month}-${day}`,`${year}-${month}-${day}`]; + this.areaSelect() + // this.setChartOption(this.checkScoreList); }, methods: { jumpDetail(index) { @@ -122,8 +247,7 @@ tooltip: {}, xAxis: { type: 'category', - axisLabel: { - }, + axisLabel: {}, data: this.dataList.name }, yAxis: { @@ -192,8 +316,7 @@ tooltip: {}, xAxis: { type: 'category', - axisLabel: { - }, + axisLabel: {}, data: nameArray }, @@ -234,18 +357,18 @@ }, filterData(mapData, tag) { if (!mapData) return; - if(!Array.isArray(mapData)) return; + if (!Array.isArray(mapData)) return; const tempArray = []; mapData.forEach((item) => { - if(item.data.length) { + if (item.data.length) { let flag = false; item.data.forEach((examine) => { - if(examine.examineCategory === tag) { + if (examine.examineCategory === tag) { flag = true tempArray.push(examine.score); } }) - if(!flag){ + if (!flag) { tempArray.push(0); } } @@ -256,10 +379,13 @@ areaSelect() { areaSelect().then(res => { this.areaList = res.data; + this.getList(); + this.getChart(); }) }, translateDeptId(deptId) { const department = this.areaList.find(dept => dept.id === deptId); + console.log(deptId,this.areaList) return department ? department.value : '鏈煡'; }, @@ -294,26 +420,43 @@ handleSelect(key) { this.activeIndex = key; // 鏇存柊褰撳墠婵�娲荤殑鑿滃崟椤� this.queryParams.examineTag = key; + this.barParams.examineTag = key; this.getList(); + this.getChart(); }, - /** 鏌ヨ鑰冩牳鎴愮哗鍒楄〃 */ + dateChange() { + this.getChart(); + }, + handleClear() { + const currentDate = new Date(); + const year = currentDate.getFullYear(); + const month = String(currentDate.getMonth() + 1).padStart(2, '0'); // 鏈堜唤浠�0寮�濮嬶紝闇�瑕佸姞1锛屽苟涓斾繚璇佷袱浣嶆暟 + const day = String(currentDate.getDate()).padStart(2, '0'); // 淇濊瘉涓や綅鏁� + this.barParams.startDate = `${year}-${month}-${day}`; + this.barParams.endDate = `${year}-${month}-${day}`; + this.getChart(); + }, + /** 鑾峰彇鏌辩姸鍥炬暟鎹� */ + getChart() { + this.loading = true; + if(this.date) { + this.barParams.startDate = this.date[0] + this.barParams.endDate = this.date[1] + } + barScore(this.barParams).then(response => { + this.setChartOption(response.data); + this.loading = false; + }); + }, + /** + * 鏌ヨ鑰冩牳鎴愮哗鍒楄〃 + * 鍗$墖鍒楄〃榛樿鏄剧ず褰撳ぉ + * */ getList() { this.loading = true; - // 鑾峰彇褰撳墠鏃ユ湡 - const today = new Date(); - - // 璁$畻鏄ㄥぉ鐨勬棩鏈� - const yesterday = new Date(today); - yesterday.setDate(today.getDate() - 1); - - // 灏嗘槰澶╃殑鏃ユ湡鏍煎紡鍖栦负瀛楃涓诧紝杩欓噷鍋囪鍚庣鏈熸湜鐨勬槸ISO 8601鏍煎紡 - this.queryParams.createTime = yesterday.toISOString().split('T')[0]; - - console.log(this.queryParams); listScore(this.queryParams).then(response => { this.checkScoreList = response.data; - console.log(this.checkScoreList); - this.setChartOption(this.checkScoreList); + // this.setChartOption(this.checkScoreList); this.loading = false; }); }, @@ -334,6 +477,23 @@ // 閿欒澶勭悊閫昏緫 }); }, + // clickItem(value) { + // value === this.exportForm.examineTag ? this.exportForm.examineTag = null : this.exportForm.examineTag = value + // }, + /** 瀵煎嚭鎸夐挳鎿嶄綔 */ + handleExport() { + this.$refs['exportForm'].validate((valid) => { + if (valid) { + this.download( + "/check/score/export", + { + ...this.exportForm, + }, + `鑰冩牳鎸囨爣_${new Date().getTime()}.xlsx` + ); + } + }) + }, }, } </script> -- Gitblit v1.8.0