mirror of
https://gitee.com/elegant_wings/dbd-meeting-html.git
synced 2025-06-21 13:49:37 +08:00
1
This commit is contained in:
SelfRidicule
parent
fa918ad9c0
commit
eace68280b
@ -1,163 +1,175 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<div class='container'>
|
||||
|
||||
<div class="topHeadView">
|
||||
<div class="itemView">
|
||||
<div class="imgView"></div>
|
||||
<div class="label">待派单</div>
|
||||
<div class="num">{{ adminStatsCount.wait }}</div>
|
||||
<div class='topHeadView'>
|
||||
<div class='itemView'>
|
||||
<div class='imgView'></div>
|
||||
<div class='label'>待派单</div>
|
||||
<div class='num'>{{ adminStatsCount.wait }}</div>
|
||||
</div>
|
||||
<div class="itemView">
|
||||
<div class="imgView"></div>
|
||||
<div class="label">重派单</div>
|
||||
<div class="num">{{ adminStatsCount.anew }}</div>
|
||||
<div class='itemView'>
|
||||
<div class='imgView'></div>
|
||||
<div class='label'>重派单</div>
|
||||
<div class='num'>{{ adminStatsCount.anew }}</div>
|
||||
</div>
|
||||
<div class="itemView">
|
||||
<div class="imgView"></div>
|
||||
<div class="label">未查看通知</div>
|
||||
<div class="num">{{ adminStatsCount.newnotice }}</div>
|
||||
<div class='itemView'>
|
||||
<div class='imgView'></div>
|
||||
<div class='label'>未查看通知</div>
|
||||
<div class='num'>{{ adminStatsCount.newnotice }}</div>
|
||||
</div>
|
||||
<div class="itemView">
|
||||
<div class="imgView"></div>
|
||||
<div class="label">已查看通知</div>
|
||||
<div class="num">{{ adminStatsCount.oldnotice }}</div>
|
||||
<div class='itemView'>
|
||||
<div class='imgView'></div>
|
||||
<div class='label'>已查看通知</div>
|
||||
<div class='num'>{{ adminStatsCount.oldnotice }}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="caseStatisticsView">
|
||||
<div class="headView">
|
||||
<div class="titleView">工单统计</div>
|
||||
<div class="typeView">
|
||||
<div :class="type=='month' ? 'activity' : ''" class="type " @click="repairCount">本月</div>
|
||||
<div :class="type=='year' ? 'activity' : ''" class="type" @click="getYearCount">本年</div>
|
||||
<div class='caseStatisticsView'>
|
||||
<div class='headView'>
|
||||
<div class='titleView'>工单统计</div>
|
||||
<div class='typeView'>
|
||||
<div :class="type=='month' ? 'activity' : ''" class='type ' @click='repairCount'>本月</div>
|
||||
<div :class="type=='year' ? 'activity' : ''" class='type' @click='getYearCount'>本年</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="contentView">
|
||||
<div class="itemView">
|
||||
<div class="label">维修工单</div>
|
||||
<div class="value">{{ repairStatsCount.zs }}</div>
|
||||
<div class='contentView'>
|
||||
<div class='itemView'>
|
||||
<div class='label'>维修工单</div>
|
||||
<div class='value'>{{ repairStatsCount.zs }}</div>
|
||||
</div>
|
||||
<div class="itemView">
|
||||
<div class="label">待维修工单</div>
|
||||
<div class="value">{{ repairStatsCount.wait }}</div>
|
||||
<div class='itemView'>
|
||||
<div class='label'>待维修工单</div>
|
||||
<div class='value'>{{ repairStatsCount.wait }}</div>
|
||||
</div>
|
||||
<div class="itemView">
|
||||
<div class="label">超时量</div>
|
||||
<div class="value">{{ repairStatsCount.timeout }}</div>
|
||||
<div class='itemView'>
|
||||
<div class='label'>超时量</div>
|
||||
<div class='value'>{{ repairStatsCount.timeout }}</div>
|
||||
</div>
|
||||
<div class="itemView">
|
||||
<div class="label">差评量</div>
|
||||
<div class="value">{{ repairStatsCount.l }}</div>
|
||||
<div class='itemView'>
|
||||
<div class='label'>差评量</div>
|
||||
<div class='value'>{{ repairStatsCount.l }}</div>
|
||||
</div>
|
||||
<div class="itemView">
|
||||
<div class="label">中评量</div>
|
||||
<div class="value">{{ repairStatsCount.m }}</div>
|
||||
<div class='itemView'>
|
||||
<div class='label'>中评量</div>
|
||||
<div class='value'>{{ repairStatsCount.m }}</div>
|
||||
</div>
|
||||
<div class="itemView">
|
||||
<div class="label">好评量</div>
|
||||
<div class="value">{{ repairStatsCount.h }}</div>
|
||||
<div class='itemView'>
|
||||
<div class='label'>好评量</div>
|
||||
<div class='value'>{{ repairStatsCount.h }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="statusView">
|
||||
<div class="caseStatusView">
|
||||
<div class="headView">
|
||||
<div class="titleView">工单完成情况</div>
|
||||
<div class='statusView'>
|
||||
<div class='caseStatusView'>
|
||||
<div class='headView'>
|
||||
<div class='titleView'>工单完成情况</div>
|
||||
<!-- <div class="typeView">-->
|
||||
<!-- <div class="type activity">本周</div>-->
|
||||
<!-- <div class="type">本年</div>-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
<div class="contentView">
|
||||
<div class="circularView">
|
||||
<div id="echart1" style="width: 400px; height: 300px"></div>
|
||||
<div class='contentView'>
|
||||
<div class='circularView'>
|
||||
<div id='echart1' style='width: 400px; height: 300px'></div>
|
||||
</div>
|
||||
<div class="centerLine"></div>
|
||||
<div class="circularView">
|
||||
<div id="echart2" style="width: 400px; height: 300px"></div>
|
||||
<div class='centerLine'></div>
|
||||
<div class='circularView'>
|
||||
<div id='echart2' style='width: 400px; height: 300px'></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="evaluateView">
|
||||
<div class="headView">
|
||||
<div class="titleView">评价情况</div>
|
||||
<div class='evaluateView'>
|
||||
<div class='headView'>
|
||||
<div class='titleView'>评价情况</div>
|
||||
</div>
|
||||
<div class="contentView">
|
||||
<div id="echart3" style="width: 400px; height: 300px"></div>
|
||||
<div class='contentView'>
|
||||
<div id='echart3' style='width: 400px; height: 300px'></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="faultView">
|
||||
<div class="floorView">
|
||||
<div class="headView">
|
||||
<div class="titleView">楼层负责人情况</div>
|
||||
<div class="conditionView">
|
||||
<a-select default-value="week" style="width: 120px;margin-right: 10px">
|
||||
<a-select-option value="month" >按月</a-select-option>
|
||||
<a-select-option value="year">按年</a-select-option>
|
||||
<div class='faultView'>
|
||||
<div class='floorView'>
|
||||
<div class='headView'>
|
||||
<div class='titleView'>楼层负责人情况</div>
|
||||
<div class='conditionView'>
|
||||
<a-select :value='floor.type' @select='selectFloor' style='width: 120px;margin-right: 10px'>
|
||||
<a-select-option value='year'>按年</a-select-option>
|
||||
<a-select-option value='month'>按月</a-select-option>
|
||||
</a-select>
|
||||
<a-month-picker placeholder="请选择时间" />
|
||||
<a-year-picker placeholder="请选择时间" />
|
||||
<a-date-picker
|
||||
format='YYYY'
|
||||
mode='year'
|
||||
:value='floor.time'
|
||||
placeholder='选择年份'
|
||||
:open='floor.open'
|
||||
@change='onChange'
|
||||
@openChange='openChange'
|
||||
@panelChange='panelChange'
|
||||
>
|
||||
</a-date-picker>
|
||||
<!-- <a-date-picker mode='year' format='YYYY' @change='clickFloor' :value='floor.time'/>-->
|
||||
<a-month-picker v-if='floor.type =="month"' @change='clickFloor' :value='floor.time'
|
||||
placeholder='请选择月' />
|
||||
</div>
|
||||
</div>
|
||||
<div class="contentView">
|
||||
<div id="echart4" style="width: 550px; height: 600px"></div>
|
||||
<div class='contentView'>
|
||||
<div id='echart4' style='width: 550px; height: 600px'></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rightView">
|
||||
<div class="blockView">
|
||||
<div class="headView">
|
||||
<div class="titleView">故障统计</div>
|
||||
<div class="conditionView">
|
||||
<a-select default-value="week" style="width: 120px;margin-right: 10px">
|
||||
<a-select-option value="month">按月</a-select-option>
|
||||
<a-select-option value="year">按年</a-select-option>
|
||||
<div class='rightView'>
|
||||
<div class='blockView'>
|
||||
<div class='headView'>
|
||||
<div class='titleView'>故障统计</div>
|
||||
<div class='conditionView'>
|
||||
<a-select default-value='week' style='width: 120px;margin-right: 10px'>
|
||||
<a-select-option value='month'>按月</a-select-option>
|
||||
<a-select-option value='year'>按年</a-select-option>
|
||||
</a-select>
|
||||
<a-date-picker placeholder="请选择时间" />
|
||||
<a-date-picker placeholder='请选择时间' />
|
||||
</div>
|
||||
</div>
|
||||
<div class="contentView">
|
||||
<div id="echart5" style="width: 700px; height: 327px"></div>
|
||||
<div class='contentView'>
|
||||
<div id='echart5' style='width: 700px; height: 327px'></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="blockView">
|
||||
<div class="headView">
|
||||
<div class="titleView">故障类型</div>
|
||||
<div class="conditionView">
|
||||
<a-select default-value="week" style="width: 120px;margin-right: 10px">
|
||||
<a-select-option value="month">按月</a-select-option>
|
||||
<a-select-option value="year">按年</a-select-option>
|
||||
<div class='blockView'>
|
||||
<div class='headView'>
|
||||
<div class='titleView'>故障类型</div>
|
||||
<div class='conditionView'>
|
||||
<a-select default-value='week' style='width: 120px;margin-right: 10px'>
|
||||
<a-select-option value='month'>按月</a-select-option>
|
||||
<a-select-option value='year'>按年</a-select-option>
|
||||
</a-select>
|
||||
<a-date-picker placeholder="请选择时间" />
|
||||
<a-date-picker placeholder='请选择时间' />
|
||||
</div>
|
||||
</div>
|
||||
<div class="contentView">
|
||||
<div id="echart6" style="width: 700px; height: 327px"></div>
|
||||
<div class='contentView'>
|
||||
<div id='echart6' style='width: 700px; height: 327px'></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tableView">
|
||||
<div class="headView">
|
||||
<div class="titleView">故障统计</div>
|
||||
<div class="conditionView">
|
||||
<a-select default-value="week" style="width: 120px;margin-right: 10px">
|
||||
<a-select-option value="week">按周</a-select-option>
|
||||
<a-select-option value="month">按月</a-select-option>
|
||||
<a-select-option value="year">按年</a-select-option>
|
||||
<div class='tableView'>
|
||||
<div class='headView'>
|
||||
<div class='titleView'>故障统计</div>
|
||||
<div class='conditionView'>
|
||||
<a-select default-value='week' style='width: 120px;margin-right: 10px'>
|
||||
<a-select-option value='week'>按周</a-select-option>
|
||||
<a-select-option value='month'>按月</a-select-option>
|
||||
<a-select-option value='year'>按年</a-select-option>
|
||||
</a-select>
|
||||
<a-date-picker placeholder="请选择时间" />
|
||||
<a-date-picker placeholder='请选择时间' />
|
||||
</div>
|
||||
</div>
|
||||
<div class="contentView">
|
||||
<div class='contentView'>
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:data-source="loadData"
|
||||
showPagination="true"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
:columns='columns'
|
||||
:data-source='loadData'
|
||||
showPagination='true'
|
||||
:rowSelection='{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}'
|
||||
|
||||
>
|
||||
</a-table>
|
||||
@ -173,7 +185,7 @@ import { repairAdminStats, repairStats, floorStats } from '@/api/admin/repair/re
|
||||
|
||||
export default {
|
||||
name: 'RepairStatistics',
|
||||
data () {
|
||||
data() {
|
||||
return {
|
||||
type: '',
|
||||
adminStatsCount: [],
|
||||
@ -186,6 +198,12 @@ export default {
|
||||
queryParam: {},
|
||||
selectedRowKeys: [],
|
||||
selectedRows: [],
|
||||
//
|
||||
floor: {
|
||||
type: '',
|
||||
time: '',
|
||||
open: false
|
||||
},
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
@ -233,7 +251,7 @@ export default {
|
||||
]
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
mounted() {
|
||||
this.adminStats()
|
||||
this.repairCount()
|
||||
this.getfloorStats()
|
||||
@ -257,12 +275,34 @@ export default {
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
adminStats () {
|
||||
// 使用openChange事件控制日期下拉面板显示与收起
|
||||
openChange(open) {
|
||||
console.log('openChange', open)
|
||||
this.floor.open = open
|
||||
},
|
||||
// 使用panelChange事件控制选中年份的方法
|
||||
panelChange(value) {
|
||||
console.log('panelChange', value)
|
||||
// 接收panelChange返回的值
|
||||
this.floor.time = value
|
||||
this.floor.open = false
|
||||
console.log('this.floor.time', new Date(this.floor.time))
|
||||
},
|
||||
// 选择-楼层负责人情况
|
||||
selectFloor(value, option) {
|
||||
console.log('selectFloor', value)
|
||||
this.floor.type = value
|
||||
},
|
||||
clickFloor(a, c) {
|
||||
console.log('clickFloor', a, c)
|
||||
},
|
||||
|
||||
adminStats() {
|
||||
repairAdminStats().then(res => {
|
||||
this.adminStatsCount = res.repairAdminStats
|
||||
})
|
||||
},
|
||||
getYearCount () {
|
||||
getYearCount() {
|
||||
this.type = 'year'
|
||||
repairStats().then(res => {
|
||||
this.repairStatsCount = res.currentYear.stats
|
||||
@ -286,7 +326,7 @@ export default {
|
||||
}, this.pj)
|
||||
})
|
||||
},
|
||||
repairCount () {
|
||||
repairCount() {
|
||||
repairStats().then(res => {
|
||||
this.type = 'month'
|
||||
|
||||
@ -313,17 +353,17 @@ export default {
|
||||
})
|
||||
},
|
||||
// 楼层负责人情况
|
||||
getfloorStats () {
|
||||
getfloorStats() {
|
||||
floorStats().then(res => {
|
||||
console.log(res)
|
||||
})
|
||||
},
|
||||
|
||||
onSelectChange (selectedRowKeys, selectedRows) {
|
||||
onSelectChange(selectedRowKeys, selectedRows) {
|
||||
this.selectedRowKeys = selectedRowKeys
|
||||
this.selectedRows = selectedRows
|
||||
},
|
||||
createEchartCake (id, legend, data) {
|
||||
createEchartCake(id, legend, data) {
|
||||
console.log(data)
|
||||
// 基于准备好的dom，初始化echarts实例
|
||||
let myChart = echarts.init(document.getElementById(id))
|
||||
@ -365,7 +405,7 @@ export default {
|
||||
// 使用刚指定的配置项和数据显示图表。
|
||||
myChart.setOption(option)
|
||||
},
|
||||
createEchartLine (id) {
|
||||
createEchartLine(id) {
|
||||
// 基于准备好的dom，初始化echarts实例
|
||||
let myChart = echarts.init(document.getElementById(id))
|
||||
let option = {
|
||||
@ -409,7 +449,7 @@ export default {
|
||||
// 使用刚指定的配置项和数据显示图表。
|
||||
myChart.setOption(option)
|
||||
},
|
||||
createColumnEcharrt (id) {
|
||||
createColumnEcharrt(id) {
|
||||
// 基于准备好的dom，初始化echarts实例
|
||||
let myChart = echarts.init(document.getElementById(id))
|
||||
// There should not be negative values in rawData
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user