| | |
| | | <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-item index="3">区县季度</el-menu-item> |
| | | <el-menu-item index="4">公安部月度</el-menu-item> |
| | | <el-menu-item index="5">公安部季度</el-menu-item> |
| | | <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 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> |
| | |
| | | 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; |
| | |
| | | shortcuts: [{ |
| | | text: '第一季度', |
| | | onClick(picker) { |
| | | picker.$emit('pick', [new Date(new Date().getFullYear() + "-01"), new Date(new Date().getFullYear() + "-03")]); |
| | | picker.$emit('pick', [new Date(new Date().getFullYear() + "-01"+ "-01"), new Date(new Date().getFullYear() + "-03"+"-31")]); |
| | | } |
| | | }, |
| | | { |
| | | text: '第二季度', |
| | | onClick(picker) { |
| | | picker.$emit('pick', [new Date(new Date().getFullYear() + "-04"), new Date(new Date().getFullYear() + "-06")]); |
| | | picker.$emit('pick', [new Date(new Date().getFullYear() + "-04"+"-01"), new Date(new Date().getFullYear() + "-06"+"-30")]); |
| | | } |
| | | }, |
| | | { |
| | | text: '第三季度', |
| | | onClick(picker) { |
| | | picker.$emit('pick', [new Date(new Date().getFullYear() + "-07"), new Date(new Date().getFullYear() + "-09")]) |
| | | picker.$emit('pick', [new Date(new Date().getFullYear() + "-07"+"-01"), new Date(new Date().getFullYear() + "-09"+"-30")]) |
| | | } |
| | | }, |
| | | { |
| | | text: '第四季度', |
| | | onClick(picker) { |
| | | picker.$emit('pick', [new Date(new Date().getFullYear() + "-10"), new Date(new Date().getFullYear() + "-12")]) |
| | | picker.$emit('pick', [new Date(new Date().getFullYear() + "-10"+"-01"), new Date(new Date().getFullYear() + "-12"+"-31")]) |
| | | } |
| | | }] |
| | | }, |
| | |
| | | checkScoreList: [], |
| | | areaList: [], |
| | | activeIndex: '0', |
| | | date: '', |
| | | date: [], |
| | | company: '', |
| | | // 导出 |
| | | exportForm: { |
| | |
| | | examineTag: null, |
| | | createTime: null |
| | | }, |
| | | // 查询参数 |
| | | barParams: { |
| | | examineTag: null, |
| | | createTime: null |
| | | }, |
| | | } |
| | | }, |
| | | created() { |
| | | }, |
| | | mounted() { |
| | | this.queryParams.examineTag = this.activeIndex |
| | | this.barParams.examineTag = this.activeIndex |
| | | chart = echarts.init(this.$refs.barChart); |
| | | 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); |
| | | }, |
| | |
| | | }) |
| | | }, |
| | | initEchart() { |
| | | |
| | | const option = { |
| | | grid: { |
| | | left: 0, |
| | |
| | | areaSelect().then(res => { |
| | | this.areaList = res.data; |
| | | this.getList(); |
| | | this.getChart(); |
| | | }) |
| | | }, |
| | | translateDeptId(deptId) { |
| | |
| | | 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.getTime() - 24 * 60 * 60 * 1000); |
| | | |
| | | // 获取年、月、日 |
| | | const year = yesterday.getFullYear(); |
| | | let month = (yesterday.getMonth() + 1).toString().padStart(2, '0'); // 月份是从0开始的,所以加1 |
| | | let day = yesterday.getDate().toString().padStart(2, '0'); |
| | | |
| | | // 拼接成 yyyy-MM-dd 格式 |
| | | this.queryParams.createTime = `${year}-${month}-${day}` |
| | | |
| | | console.log(this.queryParams); |
| | | listScore(this.queryParams).then(response => { |
| | | this.checkScoreList = response.data; |
| | | |
| | | this.setChartOption(this.checkScoreList); |
| | | // this.setChartOption(this.checkScoreList); |
| | | this.loading = false; |
| | | }); |
| | | }, |