From 75e02f6b05d0c4da02afd9f010f305f4867e5b40 Mon Sep 17 00:00:00 2001
From: Admin <978517621@qq.com>
Date: 星期二, 13 九月 2022 17:49:49 +0800
Subject: [PATCH] Default Changelist
---
src/views/specialWorkSystem/workPlan/reserveSum/index.vue | 413 +++++++++++++++++++++++++++++++++++++++++++++++++++
src/api/specialWorkSystem/workPlan/workAppoint/index.ts | 9 +
2 files changed, 422 insertions(+), 0 deletions(-)
diff --git a/src/api/specialWorkSystem/workPlan/workAppoint/index.ts b/src/api/specialWorkSystem/workPlan/workAppoint/index.ts
index de6fb5e..9d44e51 100644
--- a/src/api/specialWorkSystem/workPlan/workAppoint/index.ts
+++ b/src/api/specialWorkSystem/workPlan/workAppoint/index.ts
@@ -36,6 +36,15 @@
method: 'post',
data: data
});
+ },
+
+ //获取各部门各作业的数量
+ getAllRecords: (data: object) => {
+ return request({
+ url: import.meta.env.VITE_API_URL + `/specialWork/appointment/statistics`,
+ method: 'post',
+ data: data
+ });
}
};
}
diff --git a/src/views/specialWorkSystem/workPlan/reserveSum/index.vue b/src/views/specialWorkSystem/workPlan/reserveSum/index.vue
new file mode 100644
index 0000000..8002cd6
--- /dev/null
+++ b/src/views/specialWorkSystem/workPlan/reserveSum/index.vue
@@ -0,0 +1,413 @@
+<template>
+ <div class="home-container">
+ <div style="height: 100%">
+ <el-row class="homeCard">
+ <el-col :span="8" style="display:flex;align-items: center">
+ <span style="white-space: nowrap">选择时间段：</span>
+ <div class="grid-content topInfo">
+ <el-date-picker
+ v-model="searchDates"
+ type="daterange"
+ unlink-panels
+ range-separator="至"
+ start-placeholder="开始日期"
+ end-placeholder="结束日期"
+ value-format="YYYY-MM-DD"
+ :shortcuts="shortcuts"
+ />
+ </div>
+ </el-col>
+ <el-button style="margin-left: 20px" type="primary" @click="searchRecord">查询</el-button>
+ <el-button plain @click="clearSearch">重置</el-button>
+ </el-row>
+ <div class="homeCard">
+ <div :id="chartName" style="width: 100%;height: 100%"></div>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script lang="ts">
+ import {toRefs, reactive, ref, onMounted, defineAsyncComponent, nextTick} from 'vue';
+ import { storeToRefs } from 'pinia';
+ import { initBackEndControlRoutes } from '/@/router/backEnd';
+ import { useUserInfo } from '/@/stores/userInfo';
+ import { Session } from '/@/utils/storage';
+ import { Edit, View, Plus, Delete, Refresh, Search, Download } from '@element-plus/icons-vue';
+ import { ElTable, ElMessage, ElMessageBox } from 'element-plus'
+ import { workAppointApi } from '/@/api/specialWorkSystem/workPlan/workAppoint';
+ import { teamManageApi } from '/@/api/systemManage/basicDateManage/personShiftManage/teamManage';
+ import * as echarts from "echarts";
+
+ // 定义接口来定义对象的类型
+ interface stateType {
+ tableData: [],
+ departmentList: [],
+ hotCount: [],
+ confinedSpaceCount: [],
+ liftingCount: [],
+ groundBreakingCount: [],
+ openCircuitCout: [],
+ heightCount: [],
+ temporaryPowerCount: [],
+ blindPlatePluggingCount: [],
+ searchDates: Array<any>,
+ startTime: String,
+ endTime: String
+ }
+
+ export default {
+ name: 'workReservation',
+ components: {},
+ setup() {
+ const userInfo = useUserInfo();
+ const { userInfos } = storeToRefs(userInfo);
+ const state = reactive<stateType>({
+ tableData: [],
+ departmentList: [],
+ hotCount: [],
+ confinedSpaceCount: [],
+ liftingCount: [],
+ groundBreakingCount: [],
+ openCircuitCout: [],
+ heightCount: [],
+ temporaryPowerCount: [],
+ blindPlatePluggingCount: [],
+ searchDates: '',
+ startTime: '',
+ endTime: ''
+ });
+ const chartName = ref("eChart" + Date.now() + Math.random())
+ const shortcuts = [
+ {
+ text: '上周',
+ value: () => {
+ const end = new Date()
+ const start = new Date()
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
+ return [start, end]
+ },
+ },
+ {
+ text: '上个月',
+ value: () => {
+ const end = new Date()
+ const start = new Date()
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
+ return [start, end]
+ },
+ },
+ {
+ text: '上个季度',
+ value: () => {
+ const end = new Date()
+ const start = new Date()
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
+ return [start, end]
+ },
+ },
+ ]
+ // 页面载入时执行方法
+ onMounted(() => {
+ getListByPage()
+ // getAllDepartment()
+ });
+
+ // 获取列表
+ const getListByPage = async () => {
+ console.log(state.searchDates)
+ const data = { startTime: state.searchDates[0], endTime: state.searchDates[1] };
+ let res = await workAppointApi().getAllRecords(data);
+ if (res.data.code === '200') {
+ if(JSON.parse(JSON.stringify(res.data.data)).length>0){
+ state.tableData = JSON.parse(JSON.stringify(res.data.data))
+ state.departmentList = Array.from(state.tableData, ({ applyDepName }) => applyDepName);
+ state.hotCount = Array.from(state.tableData, ({ hotCount }) => hotCount);
+ state.confinedSpaceCount = Array.from(state.tableData, ({ confinedSpaceCount }) => confinedSpaceCount);
+ state.liftingCount = Array.from(state.tableData, ({ liftingCount }) => liftingCount);
+ state.groundBreakingCount = Array.from(state.tableData, ({ groundBreakingCount }) => groundBreakingCount);
+ state.openCircuitCout = Array.from(state.tableData, ({ openCircuitCout }) => openCircuitCout);
+ state.heightCount = Array.from(state.tableData, ({ heightCount }) => heightCount);
+ state.temporaryPowerCount = Array.from(state.tableData, ({ temporaryPowerCount }) => temporaryPowerCount);
+ state.blindPlatePluggingCount = Array.from(state.tableData, ({ blindPlatePluggingCount }) => blindPlatePluggingCount);
+ initCharts()
+ }else{
+ ElMessage({
+ type: 'warning',
+ message: '暂无数据'
+ });
+ }
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ };
+
+ const initCharts =()=>{
+ let dom = document.getElementById(chartName.value);
+ let myChart = echarts.init(dom);
+
+ let option: EChartsOption;
+
+ option = {
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: {
+ type: 'shadow' // 'shadow' as default; can also be 'line' or 'shadow'
+ }
+ },
+ legend: {},
+ grid: {
+ left: '3%',
+ right: '4%',
+ bottom: '3%',
+ containLabel: true
+ },
+ xAxis: {
+ type: 'value'
+ },
+ yAxis: {
+ type: 'category',
+ data: state.departmentList
+ },
+ series: [
+ {
+ name: '动火作业',
+ type: 'bar',
+ stack: 'total',
+ label: {
+ show: true
+ },
+ emphasis: {
+ focus: 'series'
+ },
+ data: state.hotCount
+ },
+ {
+ name: '受限空间作业',
+ type: 'bar',
+ stack: 'total',
+ label: {
+ show: true
+ },
+ emphasis: {
+ focus: 'series'
+ },
+ data: state.confinedSpaceCount
+ },
+ {
+ name: '吊装作业',
+ type: 'bar',
+ stack: 'total',
+ label: {
+ show: true
+ },
+ emphasis: {
+ focus: 'series'
+ },
+ data: state.liftingCount
+ },
+ {
+ name: '动土作业',
+ type: 'bar',
+ stack: 'total',
+ label: {
+ show: true
+ },
+ emphasis: {
+ focus: 'series'
+ },
+ data: state.groundBreakingCount
+ },
+ {
+ name: '断路作业',
+ type: 'bar',
+ stack: 'total',
+ label: {
+ show: true
+ },
+ emphasis: {
+ focus: 'series'
+ },
+ data: state.openCircuitCout
+ },
+ {
+ name: '高处作业',
+ type: 'bar',
+ stack: 'total',
+ label: {
+ show: true
+ },
+ emphasis: {
+ focus: 'series'
+ },
+ data: state.heightCount
+ },
+ {
+ name: '临时用电作业',
+ type: 'bar',
+ stack: 'total',
+ label: {
+ show: true
+ },
+ emphasis: {
+ focus: 'series'
+ },
+ data: state.temporaryPowerCount
+ },
+ {
+ name: '盲板抽堵作业',
+ type: 'bar',
+ stack: 'total',
+ label: {
+ show: true
+ },
+ emphasis: {
+ focus: 'series'
+ },
+ data: state.blindPlatePluggingCount
+ }
+ ]
+ };
+
+ option && myChart.setOption(option);
+
+ window.addEventListener("resize",function (){
+ myChart.resize();
+ });
+ }
+
+ // 关键词查询记录
+ const searchRecord = async () => {
+ if (state.searchDates == []) {
+ ElMessage({
+ type: 'warning',
+ message: '请选择时间段'
+ });
+ } else {
+ getListByPage();
+ }
+ };
+
+ const clearSearch = async () => {
+ state.searchDates = [];
+ getListByPage();
+ };
+
+ // 刷新
+ const reLoadData = async () => {
+ getListByPage();
+ };
+
+ // 折线图
+ const renderMenu = async (value: string) => {
+ Session.set('projectId', value);
+ userInfos.value.projectId = value;
+ await initBackEndControlRoutes();
+ };
+ return {
+ View,
+ Edit,
+ Delete,
+ Refresh,
+ Plus,
+ Search,
+ shortcuts,
+ chartName,
+ searchRecord,
+ clearSearch,
+ getListByPage,
+ reLoadData,
+ ...toRefs(state)
+ };
+ }
+ };
+</script>
+
+<style scoped lang="scss">
+ $homeNavLengh: 8;
+ .red{
+ color: red;
+ }
+ .home-container {
+ height: calc(100vh - 144px);
+ box-sizing: border-box;
+ overflow: hidden;
+ .homeCard {
+ width: 100%;
+ padding: 20px;
+ box-sizing: border-box;
+ background: #fff;
+ border-radius: 4px;
+
+ .main-card {
+ width: 100%;
+ height: 100%;
+ .cardTop {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ .mainCardBtn {
+ margin: 0;
+ }
+ }
+ .pageBtn {
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: right;
+
+ .demo-pagination-block + .demo-pagination-block {
+ margin-top: 10px;
+ }
+ .demo-pagination-block .demonstration {
+ margin-bottom: 16px;
+ }
+ }
+ }
+ &:last-of-type {
+ height: calc(100% - 100px);
+ }
+ }
+ .el-row {
+ display: flex;
+ align-items: center;
+ margin-bottom: 20px;
+ &:last-child {
+ margin-bottom: 0;
+ }
+ .grid-content {
+ align-items: center;
+ min-height: 36px;
+ }
+
+ .topInfo {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ font-size: 16px;
+ font-weight: bold;
+
+ & > div {
+ white-space: nowrap;
+ margin-right: 20px;
+ }
+ }
+ }
+ }
+ .el-input{
+ width: 100% !important;
+ }
+ ::v-deep(.el-date-editor){
+ width: 100%;
+ }
+ .el-select{
+ width: 100%;
+ }
+ :deep(.el-cascader){
+ width: 100% !important;
+ }
+</style>
--
Gitblit v1.9.2