Skip to content

T
template_vue
Commit deb0e212 authored by W_Y's avatar W_Y
Browse files
Options

废弃

parent d835ec49
Hide whitespace changes
Inline Side-by-side
Showing with 201 additions and 162 deletions
src/views/controlPlatform/control.vue
View file @ deb0e212
......@@ -94,7 +94,7 @@
<!-- </div>-->
</el-col>
</el-row>
<el-divider class="controlDivider" />
<el-divider class="controlDivider"/>
<!-- <div>-->
<!-- <el-row>-->
<!-- &lt;!&ndash; <el-col :span="6">&ndash;&gt;-->
......@@ -121,7 +121,7 @@
<!-- </el-row>-->
<!-- </div>-->
<div id="echarts-data" class="span_1">
<div id="dataCharts_data" ref="chart_data" style="height: 40vh" />
<div id="dataCharts_data" ref="chart_data" style="height: 40vh"/>
</div>
</el-card>
</el-col>
......@@ -129,7 +129,7 @@
<el-card>
<el-row>
<el-col :span="12">
<div class="controlSpan_middle">留言</div>
<div class="controlSpan_middle">废弃详情</div>
</el-col>
<!-- <el-col :span="12">-->
<!-- <div style="float: right">-->
......@@ -139,15 +139,18 @@
<!-- </div>-->
<!-- </el-col>-->
</el-row>
<el-divider class="controlDivider" />
<el-divider class="controlDivider"/>
<el-row>
<div style="float: right">
<el-button size="mini" :class="isShow ? 'active' : 'btn1'" @click="leaveMessageBtnMonth">本月</el-button>
<el-button size="mini" :class="isShow2 ? 'active' : 'btn1'" style="margin-left: 3px!important;" @click="leaveMessageBtnYear">本年</el-button>
</div>
<!-- <div style="float: right">-->
<!-- <el-button size="mini" :class="isShow ? 'active' : 'btn1'" @click="leaveMessageBtnMonth">本月-->
<!-- </el-button>-->
<!-- <el-button size="mini" :class="isShow2 ? 'active' : 'btn1'" style="margin-left: 3px!important;"-->
<!-- @click="leaveMessageBtnYear">本年-->
<!-- </el-button>-->
<!-- </div>-->
</el-row>
<div id="echarts-leaveMessage" class="span_1">
<div id="dataCharts_leaveMessage" ref="chart_leaveMessage" style="height: 40vh" />
<div id="dataCharts_leaveMessage" ref="chart_leaveMessage" style="height: 40vh"/>
</div>
</el-card>
</el-col>
......@@ -165,9 +168,9 @@
当前院内访客: <span style="color: #333333;font-size: 16px;font-weight: bold">20</span>人
</div>
</div>
<el-divider class="chosenOne-divider" />
<el-divider class="chosenOne-divider"/>
<div id="echarts-visitor" class="span_1" style="margin-top: -20px">
<div id="dataCharts_visitor" ref="chart_data" style="height: 350px" />
<div id="dataCharts_visitor" ref="chart_data" style="height: 350px"/>
</div>
</el-card>
</el-col>
......@@ -185,16 +188,16 @@
<!-- </div>-->
<!-- </el-col>-->
</el-row>
<el-divider class="controlDivider" />
<el-divider class="controlDivider"/>
<div class="end_table">
<el-table
class="table-list"
:data="tableList"
>
<el-table-column type="index" label="序号" width="55" />
<el-table-column label="留言人" prop="userName" />
<el-table-column label="标题" prop="leaveTitle" />
<el-table-column label="留言时间" prop="leaveDate" />
<el-table-column type="index" label="序号" width="55"/>
<el-table-column label="留言人" prop="userName"/>
<el-table-column label="标题" prop="leaveTitle"/>
<el-table-column label="留言时间" prop="leaveDate"/>
<el-table-column
label="操作"
width="150"
......@@ -218,7 +221,8 @@ import * as echarts from 'echarts'
import judgeLeaveMessage from 'svg-sprite-loader/examples/custom-runtime-generator/build/main'
// import { controlData } from './apis'
// import { judgeLeaveMessage } from '@/views/judgeMessageManage/apis'
import { findCountIdByUpdateDate,findCountIdByFqYy } from '@/api/controlPlatform'
import {findCountIdByUpdateDate, findCountIdByFqYy} from '@/api/controlPlatform'
export default {
name: 'Control',
data() {
......@@ -226,7 +230,12 @@ export default {
sumUpdateList: [],
dataList: [],
numList: [],
// 柱状图
sumFqYyList: [],
// 原因
YyList: [],
// 数量
FqNumList: [],
isShow: true,
isShow2: false,
judgeMessageData: 0,
......@@ -287,11 +296,11 @@ export default {
}
],
options: [
{ value: 1, label: '审判立案' },
{ value: 2, label: '执行立案' },
{ value: 3, label: '保全立案' },
{ value: 4, label: '调解立案' },
{ value: 5, label: '信访立案' }
{value: 1, label: '审判立案'},
{value: 2, label: '执行立案'},
{value: 3, label: '保全立案'},
{value: 4, label: '调解立案'},
{value: 5, label: '信访立案'}
]
}
},
......@@ -309,34 +318,34 @@ export default {
var elementResizeDetectorMaker = require('element-resize-detector')
var erd = elementResizeDetectorMaker()
var that = this
erd.listenTo(document.getElementById('echarts-data'), function(element) {
erd.listenTo(document.getElementById('echarts-data'), function (element) {
var width = element.offsetWidth
var height = element.offsetHeight
self.tableHeight = height // 将监听到的宽高进行赋值
self.tableWidth = width
that.$nextTick(function() {
that.$nextTick(function () {
console.log('Size: ' + width + 'x' + height)
// 使echarts尺寸重置
echarts.init(document.getElementById('dataCharts_data')).resize()
})
})
erd.listenTo(document.getElementById('echarts-leaveMessage'), function(element) {
erd.listenTo(document.getElementById('echarts-leaveMessage'), function (element) {
var width = element.offsetWidth
var height = element.offsetHeight
self.tableHeight = height // 将监听到的宽高进行赋值
self.tableWidth = width
that.$nextTick(function() {
that.$nextTick(function () {
console.log('Size: ' + width + 'x' + height)
// 使echarts尺寸重置
echarts.init(document.getElementById('dataCharts_leaveMessage')).resize()
})
})
erd.listenTo(document.getElementById('echarts-visitor'), function(element) {
erd.listenTo(document.getElementById('echarts-visitor'), function (element) {
var width = element.offsetWidth
var height = element.offsetHeight
self.tableHeight = height // 将监听到的宽高进行赋值
self.tableWidth = width
that.$nextTick(function() {
that.$nextTick(function () {
console.log('Size: ' + width + 'x' + height)
// 使echarts尺寸重置
echarts.init(document.getElementById('dataCharts_visitor')).resize()
......@@ -360,6 +369,11 @@ export default {
getSumList() {
findCountIdByFqYy().then(res => {
this.sumFqYyList = res.data
this.sumFqYyList.forEach(item => {
this.YyList.push(item.fqYy)
this.FqNumList.push(item.sum)
})
this.dataChartsLeaveMessage()
})
},
handleClick(row) {
......@@ -546,124 +560,138 @@ export default {
/** 法官留言(雷达图)
* */
dataChartsLeaveMessage() {
if (this.judgeMessageData === 0) {
const myChartAverage = echarts.init(document.getElementById('dataCharts_leaveMessage'))
const optionAverage = {
tooltip: {
trigger: 'axis'
},
legend: {
x: 'center',
y: 'bottom',
data: ['本月留言量', '本月回复量'],
// 图例之间的间距
itemGap: 20,
// 图标高度
itemHeight: 12,
textStyle: {
// 字体大小
fontSize: 13
}
},
radar: {
// shape: 'circle',
radius: '53%',
indicator: [
{ name: '咨询', min: 0 },
{ name: '感谢', min: 0 },
{ name: '求助', min: 0 },
{ name: '投诉', min: 0 },
{ name: '谏言', min: 0 }
],
name: {
textStyle: {
color: '#333',
fontSize: '14px'
}
}
},
color: ['#46BCF3', '#C760F2'],
series: [{
type: 'radar',
tooltip: {
trigger: 'item'
},
data: [
{
value: ['14', '38', '15', '36', '12'],
name: '本月留言量',
areaStyle: {
color: '#46BCF3'
}
},
{
value: ['10', '20', '5', '13', '8'],
name: '本月回复量'
}
]
}]
}
myChartAverage.setOption(optionAverage)
}
if (this.judgeMessageData === 1) {
const myChartAverage = echarts.init(document.getElementById('dataCharts_leaveMessage'))
const optionAverage = {
tooltip: {
trigger: 'axis'
},
legend: {
x: 'center',
y: 'bottom',
data: ['本年留言量', '本年回复量'],
// 图例之间的间距
itemGap: 20,
// 图标高度
itemHeight: 12,
textStyle: {
// 字体大小
fontSize: 13
}
},
radar: {
// shape: 'circle',
radius: '53%',
indicator: [
{ name: '咨询', min: 0 },
{ name: '感谢', min: 0 },
{ name: '求助', min: 0 },
{ name: '投诉', min: 0 },
{ name: '谏言', min: 0 }
],
name: {
textStyle: {
color: '#333',
fontSize: '14px'
}
}
},
color: ['#46BCF3', '#C760F2'],
series: [{
type: 'radar',
tooltip: {
trigger: 'item'
},
data: [
{
value: ['97', '93', '84', '98', '44'],
name: '本年留言量',
areaStyle: {
color: '#46BCF3'
}
},
{
value: ['70', '83', '65', '90', '32'],
name: '本年回复量'
}
]
}]
}
myChartAverage.setOption(optionAverage)
const myChartAverage = echarts.init(document.getElementById('dataCharts_leaveMessage'))
const optionAverage = {
tooltip: {
trigger: 'axis'
},
legend: {
x: 'center',
y: 'bottom',
data: ['废弃原因'],
// 图例之间的间距
itemGap: 20,
// 图标高度
itemHeight: 12,
textStyle: {
// 字体大小
fontSize: 13
}
},
xAxis: {
data: this.YyList
},
yAxis: {
type: 'value'
},
series: [
{
type: 'bar',
data: this.FqNumList,
barWidth: '10%'
}
],
// radar: {
// // shape: 'circle',
// radius: '53%',
// indicator: [
// {name: '咨询', min: 0},
// {name: '感谢', min: 0},
// {name: '求助', min: 0},
// {name: '投诉', min: 0},
// {name: '谏言', min: 0}
// ],
// name: {
// textStyle: {
// color: '#333',
// fontSize: '14px'
// }
// }
// },
// color: ['#46BCF3', '#C760F2'],
// series: [{
// type: 'radar',
// tooltip: {
// trigger: 'item'
// },
// data: [
// {
// value: ['14', '38', '15', '36', '12'],
// name: '本月留言量',
// areaStyle: {
// color: '#46BCF3'
// }
// },
// {
// value: ['10', '20', '5', '13', '8'],
// name: '本月回复量'
// }
// ]
// }]
}
myChartAverage.setOption(optionAverage)
// if (this.judgeMessageData === 0) {
//
// }
// if (this.judgeMessageData === 1) {
// const myChartAverage = echarts.init(document.getElementById('dataCharts_leaveMessage'))
// const optionAverage = {
// tooltip: {
// trigger: 'axis'
// },
// legend: {
// x: 'center',
// y: 'bottom',
// data: ['本年留言量', '本年回复量'],
// // 图例之间的间距
// itemGap: 20,
// // 图标高度
// itemHeight: 12,
// textStyle: {
// // 字体大小
// fontSize: 13
// }
// },
// radar: {
// // shape: 'circle',
// radius: '53%',
// indicator: [
// {name: '咨询', min: 0},
// {name: '感谢', min: 0},
// {name: '求助', min: 0},
// {name: '投诉', min: 0},
// {name: '谏言', min: 0}
// ],
// name: {
// textStyle: {
// color: '#333',
// fontSize: '14px'
// }
// }
// },
// color: ['#46BCF3', '#C760F2'],
// series: [{
// type: 'radar',
// tooltip: {
// trigger: 'item'
// },
// data: [
// {
// value: ['97', '93', '84', '98', '44'],
// name: '本年留言量',
// areaStyle: {
// color: '#46BCF3'
// }
// },
// {
// value: ['70', '83', '65', '90', '32'],
// name: '本年回复量'
// }
// ]
// }]
// }
// myChartAverage.setOption(optionAverage)
// }
},
/** 访客数据(饼状图)
* */
......@@ -698,8 +726,8 @@ export default {
type: 'pie',
radius: '50%',
data: [
{ value: '10', name: '离院' },
{ value: '30', name: '来访' }
{value: '10', name: '离院'},
{value: '30', name: '来访'}
],
emphasis: {
......@@ -719,21 +747,24 @@ export default {
</script>
<style lang="scss">
.app-main .container{
.app-main .container {
background-color: #F4F4F4;
}
.controlPlatform{
.controlDivider{
margin-top: 10px!important;
.controlPlatform {
.controlDivider {
margin-top: 10px !important;
}
.controlPlatform-footer{
.end_title{
.controlPlatform-footer {
.end_title {
font-size: 16px;
font-weight: bold;
color: #333;
}
}
.controlSpan_middle{
.controlSpan_middle {
font-size: 16px;
font-weight: bold;
color: #333;
......@@ -742,31 +773,39 @@ export default {
.chosenOne-divider {
margin-bottom: 0;
}
.controlPlatform-top{
.controlPlatform-top {
margin-top: 10px;
.arrows{
.arrows {
width: 5.67px;
height: 18.04px;
}
.TopBody{
.TopBody {
display: flex;
margin-top: 20px;
}
.TopFooter{
.TopFooter {
margin-top: 20px;
}
}
.controlPlatform-body{
.controlPlatform-body {
margin-top: 10px;
.btn1{
.btn1 {
background-color: white;
color: black;
}
.active{
.active {
background-color: #666;
color: white;
}
.el-card__body{
.el-card__body {
min-height: 445px;
}
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment