提交 3949b7b5 authored 作者: quanlili's avatar quanlili

Merge branch 'qll' into dev

import request from '@/utils/request'
import { requestPath } from '@/utils/global.js'
//数据可视化
export function getSurveyAPI(params) { //查看资源概况
return request({
url: `${requestPath.resource}/resource/statistics/resource/count`,
method: 'get',
params
})
}
<template>
<div></div>
<div class="app-container dataChart_wrap">
<div>
<div class="metaDataTop">
<em>资源检索</em>
</div>
<div id="surveyChart" style="height:500px">
</div>
</div>
</div>
</template>
<script>
import echarts from "echarts";
import { debounce } from '@/utils'
import { getSurveyAPI} from '@/api/dataManagement/index'
var surveyOption = {
backgroundColor: "#fff",
"title": {
"text": "资源数量概况",
// "subtext": "BY MICVS",
// x: "4%",
textStyle: {
color: '#333',
fontSize: '22',
},
subtextStyle: {
color: '#90979c',
fontSize: '16',
},
},
"tooltip": {
"trigger": "axis",
"axisPointer": {
"type": "shadow",
textStyle: {
color: "#000"
}
},
},
"grid": {
"borderWidth": 0,
"top": 110,
"bottom": 95,
textStyle: {
color: "#000"
}
},
"legend": {
x: '4%',
top: '11%',
textStyle: {
color: '#90979c',
},
"data": ['提交信息包', '档案信息包', '资源交接比例','文件挂接比例']
},
"calculable": true,
"xAxis": [{
"type": "category",
"axisLine": {
lineStyle: {
color: '#90979c'
}
},
"splitLine": {
"show": false
},
"axisTick": {
"show": false
},
"splitArea": {
"show": false
},
"axisLabel": {
"interval": 0,
},
"data": [],
}],
"yAxis": [{
"type": "value",
"splitLine": {
"show": false
},
"axisLine": {
lineStyle: {
color: '#90979c'
}
},
"axisTick": {
"show": false
},
"axisLabel": {
"interval": 0,
},
"splitArea": {
"show": false
},
}],
"dataZoom": [{
"show": true,
"height": 30,
"xAxisIndex": [
0
],
bottom: 30,
"start": 10,
"end": 80,
handleIcon: 'path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z',
handleSize: '110%',
handleStyle:{
color:"#d3dee5",
},
textStyle:{
color:"#000"},
borderColor:"#90979c"
}, {
"type": "inside",
"show": true,
"height": 15,
"start": 1,
"end": 35
}],
"series": [{
"name": "提交信息包",
"type": "bar",
//"stack": "总量",
//"barMaxWidth": 35,
//"barGap": "10%",
"itemStyle": {
"normal": {
"color": "rgba(255,144,128,1)",
"label": {
"show": true,
"textStyle": {
"color": "#fff"
},
"position": "insideTop",
formatter: function(p) {
return p.value > 0 ? (p.value) : '';
}
}
}
},
"data": [
198.66,
330.81,
151.95,
160.12,
222.56,
229.05,
128.53,
250.91,
224.47,
473.99,
126.85,
260.50
],
},
{
"name": "档案信息包",
"type": "bar",
//"stack": "总量",
"itemStyle": {
"normal": {
"color": "rgba(0,191,183,1)",
"barBorderRadius": 0,
"label": {
"show": true,
"position": "top",
formatter: function(p) {
return p.value > 0 ? (p.value) : '';
}
}
}
},
"data": [
82.89,
67.54,
62.07,
59.43,
67.02,
67.09,
35.66,
71.78,
81.61,
78.85,
79.12,
72.30
]
}, {
"name": "资源交接比例",
"type": "line",
//"stack": "总量",
symbolSize:10,
symbol:'circle',
"itemStyle": {
"normal": {
"color": "rgba(252,230,48,1)",
"barBorderRadius": 0,
"label": {
"show": true,
"position": "top",
formatter: function(p) {
return p.value > 0 ? (p.value) : '';
}
}
}
},
"data": [
281.55,
398.35,
214.02,
219.55,
289.57,
296.14,
164.18,
322.69,
306.08,
552.84,
205.97,
332.79
]
},
{
"name": "文件挂接比例",
"type": "line",
//"stack": "总量",
symbolSize:10,
symbol:'circle',
"itemStyle": {
"normal": {
"color": "#68F076",
"barBorderRadius": 0,
"label": {
"show": true,
"position": "top",
formatter: function(p) {
return p.value > 0 ? (p.value) : '';
}
}
}
},
"data": [
281.55,
398.35,
214.02,
29.55,
289.57,
296.14,
164.18,
322.69,
306.08,
52.84,
205.97,
332.79
]
},
]
}
export default {
name: "chart",
data() {
return {
lineChart:null,
};
},
mounted() {
this.__resizeHanlder = debounce(() => {
if (this.surveyChart) {
this.surveyChart.resize()
}
}, 100)
window.addEventListener('resize', this.__resizeHanlder);
this.initSurveyEchart();
this.getSurvey();
},
methods: {
initSurveyEchart() {
this.surveyChart = echarts.init(document.getElementById("surveyChart"));
},
getSurvey(){
let params={
day:20
}
getSurveyAPI(params).then(res=>{
if(res.data.code==0){
let resData=res.data.data;
let dateDate=Object.keys(resData);
let archiveNum=[];
let handoverRatio=[];
let hookRatio=[];
let submitNum=[];
//['提交信息包', '档案信息包', '资源交接比例','文件挂接比例']
dateDate.forEach(list=>{
archiveNum.push(resData[list]['archiveNum']);
handoverRatio.push(resData[list]['handoverRatio']);
hookRatio.push(resData[list]['hookRatio']);
submitNum.push(resData[list]['submitNum']);
})
surveyOption.xAxis[0].data=dateDate;
surveyOption.series[0]['data']=submitNum;
surveyOption.series[1]['data']=archiveNum;
surveyOption.series[2]['data']=handoverRatio;
surveyOption.series[3]['data']=hookRatio;
this.surveyChart.setOption(surveyOption)
}else{
this.$message.error('获取资源概况失败')
}
})
}
}
};
</script>
......
......@@ -187,7 +187,6 @@
.timer_dialog .el-date-editor,.user_search_dialog .el-select{
width: 100% !important;
}
.user_search{
.el-select-dropdown__item{
height: 75px;
......@@ -213,4 +212,27 @@
}
}
}
\ No newline at end of file
}
.dataChart_wrap{
.metaDataTop {
width:100%;
border-bottom:1px solid #EBEEF1;
padding-bottom:23px;
em {
color:#3F4560;
font-size:20px;
font-style:normal;
cursor: pointer;
}
span {
float:right;
width:50px;
font-size:14px;
color:#868BA3;
background:url(../../assets/img/sx.png) no-repeat;
background-size:12px 12px;
background-position:37px 2px;
cursor: pointer;
}
}
}
......@@ -371,6 +371,7 @@ export default {
this.getList();
this.passVisible=false;
});
},
alertRefuse(item){
this.batchUpdateVisible=false;
......
......@@ -321,9 +321,11 @@ let relateOptaion={
// //return params.data.target+">"+params.data.source+":"+params.data.value
// console.log(params.data,'777777')
// }
},
},
animationDuration: 1500,
animationEasingUpdate: 'quinticInOut',
toolbox: {
show: true,
show: false,
feature: {
restore: {
show: true
......@@ -353,18 +355,17 @@ let relateOptaion={
itemWidth: 10,
itemHeight: 10
},
animationDuration: 1000,
animationEasingUpdate: 'quinticInOut',
series: [{
name: '',
type: 'graph',
layout: 'force',
force: {
repulsion: 200,
gravity: 0.02,
edgeLength: 90,
repulsion: 1000,
//gravity: 0.02,
//edgeLength: 90,
layoutAnimation: true,
},
edgeSymbolSize: [4, 50],
symbolSize: 50,
data: [
//{name: "工程建设情况", showName: "工程建设情况", symbolSize: 50, category: 0},
......@@ -710,7 +711,22 @@ export default {
},
tooltip: {
show: true
},
},
toolbox: {
show: false,
feature: {
restore: {
show: true
},
magicType: {
show: true,
type: ['force', 'chord']
},
saveAsImage: {
show: true
}
}
},
series: [{
name: '',
type: 'wordCloud',
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论