Skip to content

G
gavel-hafms-vue
Commit 79f1385f authored by 李苏's avatar 李苏 💬
Browse files
Options

调整

parent ed733825
Show whitespace changes
Inline Side-by-side
Showing with 637 additions and 624 deletions
src/views/hzcxbb/szkb/index.vue
View file @ 79f1385f
...@@ -121,6 +121,16 @@ ...@@ -121,6 +121,16 @@
<div class="flex1 text-center "> <div class="flex1 text-center ">
项目类别 项目类别
</div> </div>
<div class="flex1 text-center ">
省完成率
</div>
<div class="flex1 text-center ">
公司完成率
</div>
<div class="flex1 text-center ">
单位完成率
</div>
<div class="flex1 text-center "> <div class="flex1 text-center ">
完成率 完成率
</div> </div>
...@@ -132,6 +142,9 @@ ...@@ -132,6 +142,9 @@
<div class="full lbtit"> <div class="full lbtit">
<div style="line-height: 25px;display: flex;" v-for="item in listData"> <div style="line-height: 25px;display: flex;" v-for="item in listData">
<div style="color: #fff ;" v-text="item.xmflname"></div> <div style="color: #fff ;" v-text="item.xmflname"></div>
<div style="color: #fff ;" v-text="item.spjwcl"></div>
<div style="color: #fff ;" v-text="item.gdgswcl"></div>
<div style="color: #fff ;" v-text="item.zsdwwcl"></div>
<div style="color: #fff ;" v-text="item.wcl"></div> <div style="color: #fff ;" v-text="item.wcl"></div>
<div style="color: #fff ;" v-text="item.pm"></div> <div style="color: #fff ;" v-text="item.pm"></div>
</div> </div>
...@@ -188,10 +201,10 @@ ...@@ -188,10 +201,10 @@
mounted() { mounted() {
this.mounted() this.mounted()
/* 刷新频率*/ /* 刷新频率*/
const DELAY=1000*60*30 const DELAY = 1000 * 60 * 30
this.DELAYNUM=setInterval(()=>{ this.DELAYNUM = setInterval(() => {
this.mounted() this.mounted()
},DELAY) }, DELAY)
}, },
destroyed() { destroyed() {
clearInterval(this.DELAYNUM) clearInterval(this.DELAYNUM)
...@@ -199,7 +212,7 @@ ...@@ -199,7 +212,7 @@
data() { data() {
return { return {
/* 定时器id*/ /* 定时器id*/
DELAYNUM:null, DELAYNUM: null,
/* 两区农电预算一览 */ /* 两区农电预算一览 */
lqndylName1: '', lqndylName1: '',
lqndylName2: '', lqndylName2: '',
...@@ -215,12 +228,11 @@ ...@@ -215,12 +228,11 @@
DialogWidth: '40vw' DialogWidth: '40vw'
}, },
/* 淮安公司*/ /* 淮安公司*/
listData: [ listData: []
]
} }
}, },
methods: { methods: {
mounted(){ mounted() {
/*初始化*/ /*初始化*/
/* 地图后端数据*/ /* 地图后端数据*/
doQueryRepDetail({ doQueryRepDetail({
...@@ -244,13 +256,13 @@ ...@@ -244,13 +256,13 @@
return item.bmName == '淮安供电公司本部' return item.bmName == '淮安供电公司本部'
}) })
/* 展示数据查询*/ /* 展示数据查询*/
if(habbList.length>0){ if (habbList.length > 0) {
let bmid=habbList[0].bmid let bmid = habbList[0].bmid
this.$post('hafms/yszxjdlog/queryRepDetail',{ this.$post('hafms/yszxjdlog/queryRepDetail', {
bmid:bmid bmid: bmid
}).then(res=>{ }).then(res => {
if(res.success){ if (res.success) {
this.listData=res.data.records||[] this.listData = res.data.records || []
} }
}) })
} }
...@@ -323,15 +335,15 @@ ...@@ -323,15 +335,15 @@
} }
}) })
/* 开始构建参数*/ /* 开始构建参数*/
const LENGTH=6 const LENGTH = 6
/* 选取前LENGTH个展示*/ /* 选取前LENGTH个展示*/
let showLxg1=lxh1.filter((item,index)=>{ let showLxg1 = lxh1.filter((item, index) => {
if(index<LENGTH){ if (index < LENGTH) {
return true return true
} }
}) })
let showLxg2=lxh2.filter((item,index)=>{ let showLxg2 = lxh2.filter((item, index) => {
if(index<LENGTH){ if (index < LENGTH) {
return true return true
} }
}) })
...@@ -363,15 +375,15 @@ ...@@ -363,15 +375,15 @@
} }
}) })
const LENGTH=6 const LENGTH = 6
/* 选取前LENGTH个展示*/ /* 选取前LENGTH个展示*/
let showLxg1=lxh1.filter((item,index)=>{ let showLxg1 = lxh1.filter((item, index) => {
if(index<LENGTH){ if (index < LENGTH) {
return true return true
} }
}) })
let showLxg2=lxh2.filter((item,index)=>{ let showLxg2 = lxh2.filter((item, index) => {
if(index<LENGTH){ if (index < LENGTH) {
return true return true
} }
}) })
...@@ -401,8 +413,8 @@ ...@@ -401,8 +413,8 @@
item.properties.apiData = habbList[0] item.properties.apiData = habbList[0]
item.properties.name = `淮安供电公司本部 item.properties.name = `淮安供电公司本部
${habbList[0].pm}(排名) ${habbList[0].pm}
${habbList[0].wcl}(完成率) ${habbList[0].wcl}%
` `
this.mapList.push({ this.mapList.push({
name: item.properties.name, name: item.properties.name,
...@@ -417,8 +429,9 @@ ...@@ -417,8 +429,9 @@
item.properties.name = item.properties.name =
`金湖县供电公司 `金湖县供电公司
${jhxList[0].pm}(排名) ${jhxList[0].pm}
${jhxList[0].wcl}(完成率)
${jhxList[0].wcl}%
` `
this.mapList.push({ this.mapList.push({
name: item.properties.name, name: item.properties.name,
...@@ -432,8 +445,9 @@ ...@@ -432,8 +445,9 @@
item.properties.name = item.properties.name =
`盱眙县供电公司 `盱眙县供电公司
${xyxList[0].pm}(排名) ${xyxList[0].pm}
${xyxList[0].wcl}(完成率)
${xyxList[0].wcl}%
` `
this.mapList.push({ this.mapList.push({
name: item.properties.name, name: item.properties.name,
...@@ -446,8 +460,9 @@ ...@@ -446,8 +460,9 @@
item.properties.apiData = hzxList[0] item.properties.apiData = hzxList[0]
item.properties.name = `洪泽县供电公司 item.properties.name = `洪泽县供电公司
${hzxList[0].pm}(排名) ${hzxList[0].pm}
${hzxList[0].wcl}(完成率)
${hzxList[0].wcl}%
` `
this.mapList.push({ this.mapList.push({
name: item.properties.name, name: item.properties.name,
...@@ -460,8 +475,9 @@ ...@@ -460,8 +475,9 @@
item.properties.apiData = lsxList[0] item.properties.apiData = lsxList[0]
item.properties.name = `涟水县供电公司 item.properties.name = `涟水县供电公司
${lsxList[0].pm}(排名) ${lsxList[0].pm}
${lsxList[0].wcl}(完成率)
${lsxList[0].wcl}%
` `
this.mapList.push({ this.mapList.push({
name: item.properties.name, name: item.properties.name,
...@@ -478,8 +494,7 @@ ...@@ -478,8 +494,7 @@
initslt() { initslt() {
const charts = this.$echarts.init(this.$refs["slt"]); const charts = this.$echarts.init(this.$refs["slt"]);
var num = 77.8 var num = 77.8
var color = new this.$echarts.graphic.LinearGradient(0, 1, 0, 0, [ var color = new this.$echarts.graphic.LinearGradient(0, 1, 0, 0, [{
{
offset: 0, offset: 0,
color: 'rgb(255,46,46)', // 0% 处的颜色 color: 'rgb(255,46,46)', // 0% 处的颜色
}, },
...@@ -489,8 +504,8 @@ ...@@ -489,8 +504,8 @@
}, },
]); ]);
let data1 = { let data1 = {
name:'', name: '',
value:num value: num
} }
let n = num; let n = num;
let progress = (n * 0.01).toFixed(2); let progress = (n * 0.01).toFixed(2);
...@@ -522,8 +537,7 @@ ...@@ -522,8 +537,7 @@
}; };
var option = { var option = {
title: [ title: [{
{
text: '处理率', text: '处理率',
x: 'center', x: 'center',
top: '32%', top: '32%',
...@@ -547,8 +561,7 @@ ...@@ -547,8 +561,7 @@
tooltip: { tooltip: {
formatter: '{a} <br/>{b} : {c}%', formatter: '{a} <br/>{b} : {c}%',
}, },
series: [ series: [{
{
type: 'gauge', type: 'gauge',
center: ['50%', '60%'], center: ['50%', '60%'],
radius: '110%', radius: '110%',
...@@ -612,7 +625,9 @@ ...@@ -612,7 +625,9 @@
axisLine: { axisLine: {
show: false, show: false,
lineStyle: { lineStyle: {
color: [[1, 'transparent']], color: [
[1, 'transparent']
],
width: 20, width: 20,
}, },
}, },
...@@ -628,7 +643,7 @@ ...@@ -628,7 +643,7 @@
axisLabel: { axisLabel: {
show: true, show: true,
distance: -24, distance: -24,
formatter: function (value) { formatter: function(value) {
if (value === 0) { if (value === 0) {
return '{white|' + value + '}'; return '{white|' + value + '}';
} }
...@@ -643,11 +658,9 @@ ...@@ -643,11 +658,9 @@
detail: { detail: {
show: false, show: false,
}, },
data: [ data: [{
{
value: 20, value: 20,
}, }, ],
],
}, },
// // 又边刻度线 // // 又边刻度线
{ {
...@@ -672,7 +685,9 @@ ...@@ -672,7 +685,9 @@
axisLine: { axisLine: {
show: false, show: false,
lineStyle: { lineStyle: {
color: [[1, 'transparent']], color: [
[1, 'transparent']
],
width: 20, width: 20,
}, },
}, },
...@@ -688,7 +703,7 @@ ...@@ -688,7 +703,7 @@
axisLabel: { axisLabel: {
show: true, show: true,
distance: -30, distance: -30,
formatter: function (value) { formatter: function(value) {
if (value === 100) { if (value === 100) {
return '{white|' + value + '}'; return '{white|' + value + '}';
} }
...@@ -705,11 +720,9 @@ ...@@ -705,11 +720,9 @@
detail: { detail: {
show: false, show: false,
}, },
data: [ data: [{
{
value: 0, value: 0,
}, }, ],
],
}, },
], ],
}; };
...@@ -825,8 +838,8 @@ ...@@ -825,8 +838,8 @@
}, },
initlg1(apidata) { initlg1(apidata) {
let colorList=['#f18c6e', '#d5f69b','#22f2e5','#2ca4fb'] let colorList = ['#f18c6e', '#d5f69b', '#22f2e5', '#2ca4fb']
let XAXIS=apidata.map(item=>item.fyname) let XAXIS = apidata.map(item => item.fyname)
const charts = this.$echarts.init(this.$refs["lg1"]); const charts = this.$echarts.init(this.$refs["lg1"]);
var option = { var option = {
tooltip: { tooltip: {
...@@ -837,14 +850,14 @@ ...@@ -837,14 +850,14 @@
}, },
legend: { legend: {
right: 10, right: 10,
top:10, top: 10,
textStyle: { textStyle: {
color: '#61d2f7' color: '#61d2f7'
}, },
left: 'center', left: 'center',
itemWidth: 9, itemWidth: 9,
itemHeight: 9, itemHeight: 9,
data: ['年度预算目标值', '平衡目标值','累计分解值','发生值'] data: ['年度预算目标值', '平衡目标值', '累计分解值', '发生值']
}, },
grid: { grid: {
left: '10%', left: '10%',
...@@ -890,7 +903,7 @@ ...@@ -890,7 +903,7 @@
}, },
series: [{ series: [{
stack: '预算', stack: '预算',
name:'年度预算目标值', name: '年度预算目标值',
type: "bar", type: "bar",
barWidth: 18, barWidth: 18,
itemStyle: { itemStyle: {
...@@ -906,11 +919,11 @@ ...@@ -906,11 +919,11 @@
fontSize: 10, fontSize: 10,
}, },
}, },
data:apidata.map(item=>item.ndysmb) data: apidata.map(item => item.ndysmb)
}, },
{ {
stack: '预算', stack: '预算',
name:'平衡目标值', name: '平衡目标值',
type: "bar", type: "bar",
barWidth: 18, barWidth: 18,
itemStyle: { itemStyle: {
...@@ -926,16 +939,16 @@ ...@@ -926,16 +939,16 @@
fontSize: 10, fontSize: 10,
}, },
}, },
data:apidata.map(item=>item.phmb) data: apidata.map(item => item.phmb)
}, },
{ {
stack: '预算', stack: '预算',
name:'累计分解值', name: '累计分解值',
type: "bar", type: "bar",
barWidth: 18, barWidth: 18,
itemStyle: { itemStyle: {
normal: { normal: {
color:colorList[2], color: colorList[2],
}, },
}, },
label: { label: {
...@@ -946,12 +959,12 @@ ...@@ -946,12 +959,12 @@
fontSize: 10, fontSize: 10,
}, },
}, },
data:apidata.map(item=>item.ljfj) data: apidata.map(item => item.ljfj)
}, },
{ {
stack: '预算', // 设置堆叠的组名 stack: '预算', // 设置堆叠的组名
type: "bar", type: "bar",
name:'发生值', name: '发生值',
barWidth: 18, barWidth: 18,
itemStyle: { itemStyle: {
normal: { normal: {
...@@ -966,7 +979,7 @@ ...@@ -966,7 +979,7 @@
fontSize: 10, fontSize: 10,
}, },
}, },
data:apidata.map(item=>item.fsz) data: apidata.map(item => item.fsz)
}, },
], ],
}; };
...@@ -976,8 +989,8 @@ ...@@ -976,8 +989,8 @@
}, },
initlg2(apidata) { initlg2(apidata) {
let colorList=['#f18c6e', '#d5f69b','#22f2e5','#2ca4fb'] let colorList = ['#f18c6e', '#d5f69b', '#22f2e5', '#2ca4fb']
let XAXIS=apidata.map(item=>item.fyname) let XAXIS = apidata.map(item => item.fyname)
const charts = this.$echarts.init(this.$refs["lg2"]); const charts = this.$echarts.init(this.$refs["lg2"]);
var option = { var option = {
tooltip: { tooltip: {
...@@ -988,14 +1001,14 @@ ...@@ -988,14 +1001,14 @@
}, },
legend: { legend: {
right: 10, right: 10,
top:10, top: 10,
textStyle: { textStyle: {
color: '#61d2f7' color: '#61d2f7'
}, },
left: 'center', left: 'center',
itemWidth: 9, itemWidth: 9,
itemHeight: 9, itemHeight: 9,
data: ['年度预算目标值', '平衡目标值','累计分解值','发生值'] data: ['年度预算目标值', '平衡目标值', '累计分解值', '发生值']
}, },
grid: { grid: {
left: '10%', left: '10%',
...@@ -1041,7 +1054,7 @@ ...@@ -1041,7 +1054,7 @@
}, },
series: [{ series: [{
stack: '预算', stack: '预算',
name:'年度预算目标值', name: '年度预算目标值',
type: "bar", type: "bar",
barWidth: 18, barWidth: 18,
itemStyle: { itemStyle: {
...@@ -1057,11 +1070,11 @@ ...@@ -1057,11 +1070,11 @@
fontSize: 10, fontSize: 10,
}, },
}, },
data:apidata.map(item=>item.ndysmb) data: apidata.map(item => item.ndysmb)
}, },
{ {
stack: '预算', stack: '预算',
name:'平衡目标值', name: '平衡目标值',
type: "bar", type: "bar",
barWidth: 18, barWidth: 18,
itemStyle: { itemStyle: {
...@@ -1077,16 +1090,16 @@ ...@@ -1077,16 +1090,16 @@
fontSize: 10, fontSize: 10,
}, },
}, },
data:apidata.map(item=>item.phmb) data: apidata.map(item => item.phmb)
}, },
{ {
stack: '预算', stack: '预算',
name:'累计分解值', name: '累计分解值',
type: "bar", type: "bar",
barWidth: 18, barWidth: 18,
itemStyle: { itemStyle: {
normal: { normal: {
color:colorList[2], color: colorList[2],
}, },
}, },
label: { label: {
...@@ -1097,12 +1110,12 @@ ...@@ -1097,12 +1110,12 @@
fontSize: 10, fontSize: 10,
}, },
}, },
data:apidata.map(item=>item.ljfj) data: apidata.map(item => item.ljfj)
}, },
{ {
stack: '预算', // 设置堆叠的组名 stack: '预算', // 设置堆叠的组名
type: "bar", type: "bar",
name:'发生值', name: '发生值',
barWidth: 18, barWidth: 18,
itemStyle: { itemStyle: {
normal: { normal: {
...@@ -1117,7 +1130,7 @@ ...@@ -1117,7 +1130,7 @@
fontSize: 10, fontSize: 10,
}, },
}, },
data:apidata.map(item=>item.fsz) data: apidata.map(item => item.fsz)
}, },
], ],
}; };
...@@ -1128,8 +1141,8 @@ ...@@ -1128,8 +1141,8 @@
}, },
initlg3(apidata) { initlg3(apidata) {
let colorList=['#f18c6e', '#d5f69b','#22f2e5','#2ca4fb'] let colorList = ['#f18c6e', '#d5f69b', '#22f2e5', '#2ca4fb']
let XAXIS=apidata.map(item=>item.fyname) let XAXIS = apidata.map(item => item.fyname)
const charts = this.$echarts.init(this.$refs["lg3"]); const charts = this.$echarts.init(this.$refs["lg3"]);
var option = { var option = {
tooltip: { tooltip: {
...@@ -1140,14 +1153,14 @@ ...@@ -1140,14 +1153,14 @@
}, },
legend: { legend: {
right: 10, right: 10,
top:10, top: 10,
textStyle: { textStyle: {
color: '#61d2f7' color: '#61d2f7'
}, },
left: 'center', left: 'center',
itemWidth: 9, itemWidth: 9,
itemHeight: 9, itemHeight: 9,
data: ['年度预算目标值', '平衡目标值','累计分解值','发生值'] data: ['年度预算目标值', '平衡目标值', '累计分解值', '发生值']
}, },
grid: { grid: {
left: '10%', left: '10%',
...@@ -1193,7 +1206,7 @@ ...@@ -1193,7 +1206,7 @@
}, },
series: [{ series: [{
stack: '预算', stack: '预算',
name:'年度预算目标值', name: '年度预算目标值',
type: "bar", type: "bar",
barWidth: 18, barWidth: 18,
itemStyle: { itemStyle: {
...@@ -1209,11 +1222,11 @@ ...@@ -1209,11 +1222,11 @@
fontSize: 10, fontSize: 10,
}, },
}, },
data:apidata.map(item=>item.ndysmb) data: apidata.map(item => item.ndysmb)
}, },
{ {
stack: '预算', stack: '预算',
name:'平衡目标值', name: '平衡目标值',
type: "bar", type: "bar",
barWidth: 18, barWidth: 18,
itemStyle: { itemStyle: {
...@@ -1229,16 +1242,16 @@ ...@@ -1229,16 +1242,16 @@
fontSize: 10, fontSize: 10,
}, },
}, },
data:apidata.map(item=>item.phmb) data: apidata.map(item => item.phmb)
}, },
{ {
stack: '预算', stack: '预算',
name:'累计分解值', name: '累计分解值',
type: "bar", type: "bar",
barWidth: 18, barWidth: 18,
itemStyle: { itemStyle: {
normal: { normal: {
color:colorList[2], color: colorList[2],
}, },
}, },
label: { label: {
...@@ -1249,12 +1262,12 @@ ...@@ -1249,12 +1262,12 @@
fontSize: 10, fontSize: 10,
}, },
}, },
data:apidata.map(item=>item.ljfj) data: apidata.map(item => item.ljfj)
}, },
{ {
stack: '预算', // 设置堆叠的组名 stack: '预算', // 设置堆叠的组名
type: "bar", type: "bar",
name:'发生值', name: '发生值',
barWidth: 18, barWidth: 18,
itemStyle: { itemStyle: {
normal: { normal: {
...@@ -1269,7 +1282,7 @@ ...@@ -1269,7 +1282,7 @@
fontSize: 10, fontSize: 10,
}, },
}, },
data:apidata.map(item=>item.fsz) data: apidata.map(item => item.fsz)
}, },
], ],
}; };
...@@ -1280,8 +1293,8 @@ ...@@ -1280,8 +1293,8 @@
}, },
initlg4(apidata) { initlg4(apidata) {
let colorList=['#f18c6e', '#d5f69b','#22f2e5','#2ca4fb'] let colorList = ['#f18c6e', '#d5f69b', '#22f2e5', '#2ca4fb']
let XAXIS=apidata.map(item=>item.fyname) let XAXIS = apidata.map(item => item.fyname)
const charts = this.$echarts.init(this.$refs["lg4"]); const charts = this.$echarts.init(this.$refs["lg4"]);
var option = { var option = {
tooltip: { tooltip: {
...@@ -1292,14 +1305,14 @@ ...@@ -1292,14 +1305,14 @@
}, },
legend: { legend: {
right: 10, right: 10,
top:10, top: 10,
textStyle: { textStyle: {
color: '#61d2f7' color: '#61d2f7'
}, },
left: 'center', left: 'center',
itemWidth: 9, itemWidth: 9,
itemHeight: 9, itemHeight: 9,
data: ['年度预算目标值', '平衡目标值','累计分解值','发生值'] data: ['年度预算目标值', '平衡目标值', '累计分解值', '发生值']
}, },
grid: { grid: {
left: '10%', left: '10%',
...@@ -1345,7 +1358,7 @@ ...@@ -1345,7 +1358,7 @@
}, },
series: [{ series: [{
stack: '预算', stack: '预算',
name:'年度预算目标值', name: '年度预算目标值',
type: "bar", type: "bar",
barWidth: 18, barWidth: 18,
itemStyle: { itemStyle: {
...@@ -1361,11 +1374,11 @@ ...@@ -1361,11 +1374,11 @@
fontSize: 10, fontSize: 10,
}, },
}, },
data:apidata.map(item=>item.ndysmb) data: apidata.map(item => item.ndysmb)
}, },
{ {
stack: '预算', stack: '预算',
name:'平衡目标值', name: '平衡目标值',
type: "bar", type: "bar",
barWidth: 18, barWidth: 18,
itemStyle: { itemStyle: {
...@@ -1381,16 +1394,16 @@ ...@@ -1381,16 +1394,16 @@
fontSize: 10, fontSize: 10,
}, },
}, },
data:apidata.map(item=>item.phmb) data: apidata.map(item => item.phmb)
}, },
{ {
stack: '预算', stack: '预算',
name:'累计分解值', name: '累计分解值',
type: "bar", type: "bar",
barWidth: 18, barWidth: 18,
itemStyle: { itemStyle: {
normal: { normal: {
color:colorList[2], color: colorList[2],
}, },
}, },
label: { label: {
...@@ -1401,12 +1414,12 @@ ...@@ -1401,12 +1414,12 @@
fontSize: 10, fontSize: 10,
}, },
}, },
data:apidata.map(item=>item.ljfj) data: apidata.map(item => item.ljfj)
}, },
{ {
stack: '预算', // 设置堆叠的组名 stack: '预算', // 设置堆叠的组名
type: "bar", type: "bar",
name:'发生值', name: '发生值',
barWidth: 18, barWidth: 18,
itemStyle: { itemStyle: {
normal: { normal: {
...@@ -1421,7 +1434,7 @@ ...@@ -1421,7 +1434,7 @@
fontSize: 10, fontSize: 10,
}, },
}, },
data:apidata.map(item=>item.fsz) data: apidata.map(item => item.fsz)
}, },
], ],
}; };
......
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