Commit fb94a121 authored by danfuman's avatar danfuman

修改

parent 3abe1cf1
...@@ -710,7 +710,7 @@ export default { ...@@ -710,7 +710,7 @@ export default {
}, },
getBigBidPage(){ getBigBidPage(){
let params={} let params={}
bigBidPage(this.queryParams3).then(res=>{ bigBidPage(this.queryParams2).then(res=>{
console.log(res) console.log(res)
if(res.code == 200){ if(res.code == 200){
this.zbList=res.rows; this.zbList=res.rows;
......
<template> <template>
<div class="regionalEconomy"> <div class="regionalEconomy">
<skeleton v-if="isSkeleton" style="padding: 16px"></skeleton> <skeleton v-if="isSkeleton" style="padding: 16px"></skeleton>
<div v-if="!isSkeleton"> <div v-if="state && !isSkeleton">
<div class="content content1"> <div class="content content1">
<div class="common-title">经济数据</div> <div class="common-title">经济数据</div>
<div class="content-box"> <div class="content-box">
...@@ -101,7 +101,11 @@ ...@@ -101,7 +101,11 @@
</div> </div>
</div> </div>
</div> </div>
<div class="empty" v-if="!state && !isSkeleton">
<img class="img" src="@/assets/images/project/empty.png">
<div class="p1">抱歉,没找到相关数据</div>
<div class="p2">建议调整关键词或筛选条件,重新搜索</div>
</div>
</div> </div>
</template> </template>
...@@ -288,7 +292,8 @@ export default { ...@@ -288,7 +292,8 @@ export default {
valData4:[], valData4:[],
recentlyYear:{}, recentlyYear:{},
nextYearMap:{}, nextYearMap:{},
isSkeleton:true isSkeleton:true,
state:true,
} }
}, },
created() { created() {
...@@ -342,336 +347,353 @@ export default { ...@@ -342,336 +347,353 @@ export default {
} }
regional(params).then(res => { regional(params).then(res => {
this.isSkeleton = false this.isSkeleton = false
this.recentlyYear=res.data[0].recentlyYear; if(res.data[0].recentlyYear){
this.nextYearMap=res.data[0].nextYearMap; this.state=true;
this.valData=[this.getMoneyNum(this.nextYearMap.gdp),this.getMoneyNum(this.recentlyYear.gdp)] this.recentlyYear=res.data[0].recentlyYear;
this.valData1=[this.getMoneyNum(this.nextYearMap.gdpGrowth),this.getMoneyNum(this.recentlyYear.gdpGrowth)] this.nextYearMap=res.data[0].nextYearMap;
this.valData2=[this.getMoneyNum(this.nextYearMap.population),this.getMoneyNum(this.recentlyYear.population)] this.valData=[this.getMoneyNum(this.nextYearMap.gdp),this.getMoneyNum(this.recentlyYear.gdp)]
this.valData3=[this.getMoneyNum(this.nextYearMap.gbr),this.getMoneyNum(this.recentlyYear.gbr)] this.valData1=[this.getMoneyNum(this.nextYearMap.gdpGrowth),this.getMoneyNum(this.recentlyYear.gdpGrowth)]
this.valData4=[this.getMoneyNum(this.nextYearMap.govDebtBalance),this.getMoneyNum(this.recentlyYear.govDebtBalance)] this.valData2=[this.getMoneyNum(this.nextYearMap.population),this.getMoneyNum(this.recentlyYear.population)]
this.$nextTick(() => { this.valData3=[this.getMoneyNum(this.nextYearMap.gbr),this.getMoneyNum(this.recentlyYear.gbr)]
this.initChart() this.valData4=[this.getMoneyNum(this.nextYearMap.govDebtBalance),this.getMoneyNum(this.recentlyYear.govDebtBalance)]
this.initChart1() this.$nextTick(() => {
this.initChart2() this.initChart()
this.initChart3() this.initChart1()
this.initChart4() this.initChart2()
}) this.initChart3()
this.initChart4()
})
}else {
this.recentlyYear={};
this.nextYearMap={};
this.state=false;
}
}) })
regionalList(params).then(res => { regionalList(params).then(res => {
this.tableData=res.data; this.tableData=res.data;
}) })
}, },
initChart() { initChart() {
let myChart = echarts.init(document.getElementById("echartsGDP")) this.$nextTick(() => {
let option ={ let myChart = echarts.init(document.getElementById("echartsGDP"))
tooltip: { let option ={
show:false tooltip: {
}, show:false
xAxis: { },
type: 'category', xAxis: {
boundaryGap: false, type: 'category',
data: this.labelData, boundaryGap: false,
show:false, data: this.labelData,
}, show:false,
yAxis: { },
type: 'value', yAxis: {
show:false, type: 'value',
}, show:false,
grid: { },
top:20, grid: {
// right:15, top:20,
bottom:5, // right:15,
}, bottom:5,
series: [ },
{ series: [
data: this.valData, {
type: 'line', data: this.valData,
smooth: true, type: 'line',
emphasis: { smooth: true,
disabled: true, emphasis: {
focus: 'none' disabled: true,
}, focus: 'none'
label: { },
show: this.valData[1] ? true : false, label: {
position: 'top' show: this.valData[1] ? true : false,
}, position: 'top'
//设置折线颜色和粗细 },
lineStyle: { //设置折线颜色和粗细
width: 1, lineStyle: {
color: "#4E8EFF", width: 1,
}, color: "#4E8EFF",
itemStyle:{ },
color: "#4E8EFF", itemStyle:{
}, color: "#4E8EFF",
//设置面积区域为渐变效果 },
areaStyle: { //设置面积区域为渐变效果
color: echarts.graphic.LinearGradient(0, 1, 0, 0, [ areaStyle: {
{ color: echarts.graphic.LinearGradient(0, 1, 0, 0, [
offset: 0.2, {
offset: 0.2,
color: "#DFEAFF", color: "#DFEAFF",
}, },
{ {
offset: 1, offset: 1,
color: "#5895FF", color: "#5895FF",
}, },
]), ]),
}, },
} }
] ]
} }
myChart.setOption(option); myChart.setOption(option);
window.addEventListener("resize", function () { window.addEventListener("resize", function () {
myChart.resize();//图表跟随页面大小变化宽度 myChart.resize();//图表跟随页面大小变化宽度
}); });
})
}, },
initChart1(){ initChart1(){
let myChartZS = echarts.init(document.getElementById("echartsZS")) this.$nextTick(() => {
let option ={ let myChartZS = echarts.init(document.getElementById("echartsZS"))
tooltip: { let option ={
show:false tooltip: {
}, show:false
xAxis: { },
type: 'category', xAxis: {
boundaryGap: false, type: 'category',
data: this.labelData, boundaryGap: false,
show:false, data: this.labelData,
}, show:false,
yAxis: { },
type: 'value', yAxis: {
show:false, type: 'value',
}, show:false,
grid: { },
top:20, grid: {
bottom:5, top:20,
}, bottom:5,
series: [ },
{ series: [
data: this.valData1, {
type: 'line', data: this.valData1,
smooth: true, type: 'line',
emphasis: { smooth: true,
disabled: true, emphasis: {
focus: 'none' disabled: true,
}, focus: 'none'
label: { },
show: this.valData1[1] ? true : false, label: {
position: 'top' show: this.valData1[1] ? true : false,
}, position: 'top'
itemStyle:{ },
color: "#718AFF", itemStyle:{
}, color: "#718AFF",
//设置折线颜色和粗细 },
lineStyle: { //设置折线颜色和粗细
width: 1, lineStyle: {
color: "#718AFF", width: 1,
}, color: "#718AFF",
//设置面积区域为渐变效果 },
areaStyle: { //设置面积区域为渐变效果
color: echarts.graphic.LinearGradient(0, 1, 0, 0, [ areaStyle: {
{ color: echarts.graphic.LinearGradient(0, 1, 0, 0, [
offset: 0.2, {
color: "#E3E8FF", offset: 0.2,
}, color: "#E3E8FF",
{ },
offset: 1, {
color: "#5B76FD", offset: 1,
}, color: "#5B76FD",
]), },
}, ]),
} },
] }
} ]
myChartZS.setOption(option); }
window.addEventListener("resize", function () { myChartZS.setOption(option);
myChartZS.resize();//图表跟随页面大小变化宽度 window.addEventListener("resize", function () {
}); myChartZS.resize();//图表跟随页面大小变化宽度
});
})
}, },
initChart2(){ initChart2(){
let myChartRK = echarts.init(document.getElementById("echartsRK")) this.$nextTick(() => {
let option ={ let myChartRK = echarts.init(document.getElementById("echartsRK"))
tooltip: { let option ={
show:false tooltip: {
}, show:false
xAxis: { },
type: 'category', xAxis: {
boundaryGap: false, type: 'category',
data: this.labelData, boundaryGap: false,
show:false, data: this.labelData,
}, show:false,
yAxis: { },
type: 'value', yAxis: {
show:false, type: 'value',
}, show:false,
grid: { },
top:20, grid: {
bottom:5, top:20,
}, bottom:5,
series: [ },
{ series: [
data: this.valData2, {
type: 'line', data: this.valData2,
smooth: true, type: 'line',
emphasis: { smooth: true,
disabled: true, emphasis: {
focus: 'none' disabled: true,
}, focus: 'none'
label: { },
show: this.valData2[1] ? true : false, label: {
position: 'top' show: this.valData2[1] ? true : false,
}, position: 'top'
//设置折线颜色和粗细 },
lineStyle: { //设置折线颜色和粗细
width: 1, lineStyle: {
color: "#3AD0D1", width: 1,
}, color: "#3AD0D1",
itemStyle:{ },
color: "#3AD0D1", itemStyle:{
}, color: "#3AD0D1",
//设置面积区域为渐变效果 },
areaStyle: { //设置面积区域为渐变效果
color: echarts.graphic.LinearGradient(0, 1, 0, 0, [ areaStyle: {
{ color: echarts.graphic.LinearGradient(0, 1, 0, 0, [
offset: 0.2, {
color: "#D3F3F3", offset: 0.2,
}, color: "#D3F3F3",
{ },
offset: 1, {
color: "#60D1D1", offset: 1,
}, color: "#60D1D1",
]), },
}, ]),
} },
] }
} ]
myChartRK.setOption(option); }
window.addEventListener("resize", function () { myChartRK.setOption(option);
myChartRK.resize();//图表跟随页面大小变化宽度 window.addEventListener("resize", function () {
}); myChartRK.resize();//图表跟随页面大小变化宽度
});
})
}, },
initChart3(){ initChart3(){
let myChartSR = echarts.init(document.getElementById("echartsSR")) this.$nextTick(() => {
let option ={ let myChartSR = echarts.init(document.getElementById("echartsSR"))
tooltip: { let option ={
show:false tooltip: {
}, show:false
xAxis: { },
type: 'category', xAxis: {
boundaryGap: false, type: 'category',
data: this.labelData, boundaryGap: false,
show:false, data: this.labelData,
}, show:false,
yAxis: { },
type: 'value', yAxis: {
show:false, type: 'value',
}, show:false,
grid: { },
top:20, grid: {
bottom:5, top:20,
}, bottom:5,
series: [ },
{ series: [
data: this.valData3, {
type: 'line', data: this.valData3,
smooth: true, type: 'line',
emphasis: { smooth: true,
disabled: true, emphasis: {
focus: 'none' disabled: true,
}, focus: 'none'
label: { },
show: this.valData3[1] ? true : false, label: {
position: 'top' show: this.valData3[1] ? true : false,
}, position: 'top'
//设置折线颜色和粗细 },
lineStyle: { //设置折线颜色和粗细
width: 1, lineStyle: {
color: "#FFAE35", width: 1,
}, color: "#FFAE35",
itemStyle:{ },
color: "#FFBE5D", itemStyle:{
}, color: "#FFBE5D",
//设置面积区域为渐变效果 },
areaStyle: { //设置面积区域为渐变效果
color: echarts.graphic.LinearGradient(0, 1, 0, 0, [ areaStyle: {
{ color: echarts.graphic.LinearGradient(0, 1, 0, 0, [
offset: 0.2, {
color: "#FFE9C6", offset: 0.2,
}, color: "#FFE9C6",
{ },
offset: 1, {
color: "#FFB535", offset: 1,
}, color: "#FFB535",
]), },
}, ]),
} },
] }
} ]
myChartSR.setOption(option); }
window.addEventListener("resize", function () { myChartSR.setOption(option);
myChartSR.resize();//图表跟随页面大小变化宽度 window.addEventListener("resize", function () {
}); myChartSR.resize();//图表跟随页面大小变化宽度
});
})
}, },
initChart4(){ initChart4(){
let myChartYE = echarts.init(document.getElementById("echartsYE")) this.$nextTick(() => {
let option ={ let myChartYE = echarts.init(document.getElementById("echartsYE"))
tooltip: { let option ={
show:false tooltip: {
}, show:false
xAxis: { },
type: 'category', xAxis: {
boundaryGap: false, type: 'category',
data: this.labelData, boundaryGap: false,
show:false, data: this.labelData,
}, show:false,
yAxis: { },
type: 'value', yAxis: {
show:false, type: 'value',
}, show:false,
grid: { },
top:20, grid: {
// left:5, top:20,
bottom:5, // left:5,
}, bottom:5,
series: [ },
{ series: [
data: this.valData4, {
type: 'line', data: this.valData4,
smooth: true, type: 'line',
emphasis: { smooth: true,
disabled: true, emphasis: {
focus: 'none' disabled: true,
}, focus: 'none'
label: { },
show: this.valData4[1] ? true : false, label: {
position: 'top', show: this.valData4[1] ? true : false,
}, position: 'top',
//设置折线颜色和粗细 },
lineStyle: { //设置折线颜色和粗细
width: 1, lineStyle: {
color: "#FF8935", width: 1,
}, color: "#FF8935",
itemStyle:{ },
color: "#FF8935", itemStyle:{
}, color: "#FF8935",
//设置面积区域为渐变效果 },
areaStyle: { //设置面积区域为渐变效果
color: echarts.graphic.LinearGradient(0, 1, 0, 0, [ areaStyle: {
{ color: echarts.graphic.LinearGradient(0, 1, 0, 0, [
offset: 0.2, {
color: "#FEE5D2", offset: 0.2,
}, color: "#FEE5D2",
{ },
offset: 1, {
color: "#FF8935", offset: 1,
}, color: "#FF8935",
]), },
}, ]),
} },
] }
} ]
myChartYE.setOption(option); }
window.addEventListener("resize", function () { myChartYE.setOption(option);
myChartYE.resize();//图表跟随页面大小变化宽度 window.addEventListener("resize", function () {
}); myChartYE.resize();//图表跟随页面大小变化宽度
});
})
}, },
formatStatus: function(row, column, cellValue) { formatStatus: function(row, column, cellValue) {
if(row.title === '经济'||row.title === '财政'||row.title === '债务'){ if(row.title === '经济'||row.title === '财政'||row.title === '债务'){
...@@ -885,5 +907,27 @@ export default { ...@@ -885,5 +907,27 @@ export default {
} }
} }
} }
.empty{
margin: 0 auto;
height: 600px;
text-align: center;
border-top: 1px solid #EFEFEF;
.img{
width: 108px;
height: 108px;
margin-bottom: 24px;
margin-top: 150px;
}
.p1{
color: #333333;
font-size: 16px;
}
.p2{
color: #999999;
font-size: 14px;
margin-top: 8px;
}
}
} }
</style> </style>
...@@ -368,10 +368,6 @@ ...@@ -368,10 +368,6 @@
.table-item{ .table-item{
/*position: relative;*/ /*position: relative;*/
.empty{ .empty{
/*position: absolute;*/
/*top: 50%;*/
/*left: 50%;*/
/*transform: translate(-50%,-50%);*/
margin: 0 auto; margin: 0 auto;
height: 600px; height: 600px;
text-align: center; text-align: center;
......
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