Skip to content

D
dsk-operate-sys-cscec
Commit bb11a463 authored by danfuman's avatar danfuman
Browse files
Options

修改

parent 8c5faadb
Hide whitespace changes
Inline Side-by-side
Showing with 1284 additions and 587 deletions
dsk-operate-ui/src/api/macro/macro.js 0 → 100644
View file @ bb11a463
import request from '@/utils/request'
//全国经济大全列表
export function nationalPage(param) {
return request({
url: '/economic/national/nationalPage',
method: 'POST',
data: param
})
}
//全国经济大全详情
export function getNationalDetails(param) {
return request({
url: '/economic/details',
method: 'POST',
data: param
})
}
//获取年份-下拉
export function getYears(param) {
return request({
url: '/economic/years/list',
method: 'POST',
data: param
})
}
//全国按月招标统计
export function countGroupByMonth(param) {
return request({
url: '/marketAnalysis/countGroupByMonth',
method: 'POST',
data: param
})
}
//按属地统计招标数量
export function countGroupByProvince(param) {
return request({
url: '/marketAnalysis/countGroupByProvince',
method: 'POST',
data: param
})
}
//获取年份-下拉
export function getYear() {
return request({
url: '/marketAnalysis/getYear',
method: 'POST',
})
}
//全国建筑企业概览-资质等级按照行业、等级类型分组
export function certGroupByMajorAndLevel() {
return request({
url: '/marketAnalysis/certGroupByMajorAndLevel',
method: 'POST',
})
}
//全国建筑企业地区分布-资质等级按照行业、省份、等级类型分组
export function certGroupByMajorProvinceLevel() {
return request({
url: '/marketAnalysis/certGroupByMajorProvinceLevel',
method: 'POST',
})
}
//全国建筑企业备案分布-各省份备案企业统计
export function areaGroupByProvince() {
return request({
url: '/marketAnalysis/areaGroupByProvince',
method: 'POST',
})
}
//区域经济
//地区经济-统计
export function regional(param) {
return request({
url: '/economic/statistics/regional',
method: 'POST',
data: param
})
}
//地区经济-主要指标列表
export function regionalList(param) {
return request({
url: '/economic/regional/list',
method: 'POST',
data: param
})
}
dsk-operate-ui/src/layout/components/AppMain.vue
View file @ bb11a463
...@@ -42,7 +42,7 @@ export default { ...@@ -42,7 +42,7 @@ export default {
.hasTagsView { .hasTagsView {
.app-main { .app-main {
/* 84 = navbar + tags-view = 50 + 34 */ /* 84 = navbar + tags-view = 50 + 34 */
min-height: calc(100vh - 84px); min-height: calc(100vh - 56px);
background: #F5F5F5; background: #F5F5F5;
} }
......
dsk-operate-ui/src/views/index.vue
View file @ bb11a463
...@@ -865,7 +865,7 @@ export default { ...@@ -865,7 +865,7 @@ export default {
type: 'value', type: 'value',
}, },
grid: { grid: {
left: '16%', left: '20%',
top: 20, top: 20,
right: 20, right: 20,
bottom: 60, bottom: 60,
...@@ -972,6 +972,7 @@ export default { ...@@ -972,6 +972,7 @@ export default {
.title{ .title{
font-size: 12px; font-size: 12px;
color: #3D3D3D; color: #3D3D3D;
border-bottom: 0;
} }
.number{ .number{
font-weight: bold; font-weight: bold;
...@@ -1473,6 +1474,7 @@ export default { ...@@ -1473,6 +1474,7 @@ export default {
.item{ .item{
border-bottom: 1px solid #EEEEEE; border-bottom: 1px solid #EEEEEE;
padding: 10px 0; padding: 10px 0;
cursor: pointer;
h3{ h3{
font-weight: 400; font-weight: 400;
color: rgba(35,35,35,0.8); color: rgba(35,35,35,0.8);
...@@ -1494,6 +1496,11 @@ export default { ...@@ -1494,6 +1496,11 @@ export default {
} }
} }
} }
.item:hover{
h3{
color:#0081FF;
}
}
.item:last-child{ .item:last-child{
border-bottom: 0; border-bottom: 0;
} }
...@@ -1509,6 +1516,7 @@ export default { ...@@ -1509,6 +1516,7 @@ export default {
.item{ .item{
border-bottom: 1px solid #EEEEEE; border-bottom: 1px solid #EEEEEE;
padding: 10px 0; padding: 10px 0;
cursor: pointer;
h3{ h3{
font-weight: 400; font-weight: 400;
color: rgba(35,35,35,0.8); color: rgba(35,35,35,0.8);
...@@ -1530,6 +1538,11 @@ export default { ...@@ -1530,6 +1538,11 @@ export default {
} }
} }
} }
.item:hover{
h3{
color:#0081FF;
}
}
.item:last-child{ .item:last-child{
border-bottom: 0; border-bottom: 0;
} }
......
dsk-operate-ui/src/views/login.vue
View file @ bb11a463
...@@ -159,13 +159,13 @@ export default { ...@@ -159,13 +159,13 @@ export default {
<style rel="stylesheet/scss" lang="scss"> <style rel="stylesheet/scss" lang="scss">
.login { .login {
/*display: flex;*/
justify-content: center;
align-items: center; align-items: center;
height: 100%; height: 100%;
background-image: url("../assets/images/login_bg.png"); background-image: url("../assets/images/login_bg.png");
background-size: cover; background-size: cover;
overflow-y: hidden; overflow-y: hidden;
display: flex;
justify-content: center;
.content{ .content{
width: 1320px; width: 1320px;
margin: 0 auto; margin: 0 auto;
......
dsk-operate-ui/src/views/macro/economies/component/comparison.vue
View file @ bb11a463
...@@ -5,8 +5,8 @@ ...@@ -5,8 +5,8 @@
<span class="common-title">指标</span> <span class="common-title">指标</span>
<el-form ref="queryForm" :model="queryParams" :inline="true" size="small"> <el-form ref="queryForm" :model="queryParams" :inline="true" size="small">
<el-form-item prop="year"> <el-form-item prop="year">
<el-select v-model="queryParams.year" filterable multiple collapse-tags class="form-content-width" placeholder="请选择"> <el-select v-model="queryParams.year" filterable class="form-content-width" placeholder="请选择">
<el-option v-for="(item, index) in yearOptions" :key="index" :label="item.name" :value="item.value" /> <el-option v-for="(item, index) in yearOptions" :key="index" :label="item.year" :value="item.year" />
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-form> </el-form>
...@@ -20,57 +20,62 @@ ...@@ -20,57 +20,62 @@
<div class="table-title"> <div class="table-title">
<span class="title">指标</span> <span class="title">指标</span>
<span class="title"> <span class="title">
<span class="address" v-if="value1">{{addressValue1}}<i class="el-icon-circle-close" @click="handleDelete(1)"></i></span> <span class="address" v-if="value1Flag">{{addressValue1}}<i class="el-icon-circle-close" @click="handleDelete(1)"></i></span>
<el-cascader <el-cascader
v-else v-else
ref="address1" ref="address1"
:options="addressList" :options="addressList"
:props="props" :props="props"
v-model="value1" v-model="value1"
@visible-change="handleVisibleChange($event,1)"
@change="handleChange(1)" @change="handleChange(1)"
placeholder="添加地区"></el-cascader> placeholder="添加地区"></el-cascader>
</span> </span>
<span class="title"> <span class="title">
<span class="address" v-if="value2">{{addressValue2}}<i class="el-icon-circle-close" @click="handleDelete(2)"></i></span> <span class="address" v-if="value2Flag">{{addressValue2}}<i class="el-icon-circle-close" @click="handleDelete(2)"></i></span>
<el-cascader <el-cascader
v-else v-else
ref="address2" ref="address2"
:options="addressList" :options="addressList"
:props="props" :props="props"
v-model="value2" v-model="value2"
@visible-change="handleVisibleChange($event,2)"
@change="handleChange(2)" @change="handleChange(2)"
placeholder="添加地区"></el-cascader> placeholder="添加地区"></el-cascader>
</span> </span>
<span class="title"> <span class="title">
<span class="address" v-if="value3">{{addressValue3}}<i class="el-icon-circle-close" @click="handleDelete(3)"></i></span> <span class="address" v-if="value3Flag">{{addressValue3}}<i class="el-icon-circle-close" @click="handleDelete(3)"></i></span>
<el-cascader <el-cascader
v-else v-else
ref="address3" ref="address3"
:options="addressList" :options="addressList"
:props="props" :props="props"
v-model="value3" v-model="value3"
@visible-change="handleVisibleChange($event,3)"
@change="handleChange(3)" @change="handleChange(3)"
placeholder="添加地区"></el-cascader> placeholder="添加地区"></el-cascader>
</span> </span>
<span class="title"> <span class="title">
<span class="address" v-if="value4">{{addressValue4}}<i class="el-icon-circle-close" @click="handleDelete(4)"></i></span> <span class="address" v-if="value4Flag">{{addressValue4}}<i class="el-icon-circle-close" @click="handleDelete(4)"></i></span>
<el-cascader <el-cascader
v-else v-else
ref="address2" ref="address4"
:options="addressList" :options="addressList"
:props="props" :props="props"
v-model="value4" v-model="value4"
@visible-change="handleVisibleChange($event,4)"
@change="handleChange(4)" @change="handleChange(4)"
placeholder="添加地区"></el-cascader> placeholder="添加地区"></el-cascader>
</span> </span>
<span class="title"> <span class="title">
<span class="address" v-if="value5">{{addressValue5}}<i class="el-icon-circle-close" @click="handleDelete(5)"></i></span> <span class="address" v-if="value5Flag">{{addressValue5}}<i class="el-icon-circle-close" @click="handleDelete(5)"></i></span>
<el-cascader <el-cascader
v-else v-else
ref="address5" ref="address5"
:options="addressList" :options="addressList"
:props="props" :props="props"
v-model="value5" v-model="value5"
@visible-change="handleVisibleChange($event,5)"
@change="handleChange(5)" @change="handleChange(5)"
placeholder="添加地区"></el-cascader> placeholder="添加地区"></el-cascader>
</span> </span>
...@@ -95,51 +100,30 @@ ...@@ -95,51 +100,30 @@
<script> <script>
import dataRegion from '@/assets/json/dataRegion' import dataRegion from '@/assets/json/dataRegion'
import { nationalPage,getYears } from '@/api/macro/macro'
export default { export default {
name: 'comparison', name: 'comparison',
props:{
dataQuery:{}
},
data() { data() {
return { return {
queryParams: { queryParams: {
year: '', year: '',
}, },
yearOptions: [ yearOptions: [],
{ name: '2023年', value: '2023' },
{ name: '2022年', value: '2022' },
{ name: '2021年', value: '2021' },
],
tableData: [ tableData: [
{ {index:0},
zb:'', {index:1},
gdp:'129,118.58', {index:2},
gdpzs:'124,369.67', {index:3},
rjgdp:'134,369.67', {index:4},
},
{
zb:"",
gdp:'129,118.58',
gdpzs:'124,369.67',
rjgdp:'134,369.67',
},
{
zb:"",
gdp:'129,118.58',
gdpzs:'124,369.67',
rjgdp:'134,369.67',
},
{
zb:"",
gdp:'129,118.58',
gdpzs:'124,369.67',
rjgdp:'134,369.67',
},
{
zb:"",
gdp:'129,118.58',
gdpzs:'124,369.67',
rjgdp:'134,369.67',
},
], ],
headers: [ headers: [
{
prop: 'year',
label: '指标',
},
{ {
prop: 'name', prop: 'name',
label: '经济', label: '经济',
...@@ -149,148 +133,149 @@ export default { ...@@ -149,148 +133,149 @@ export default {
label: 'GDP（亿元）', label: 'GDP（亿元）',
}, },
{ {
prop: 'gdpzs', prop: 'gdpAddValue',
label: 'GDP增速', label: 'GDP增速',
}, },
{ {
prop: 'rjgdp', prop: 'gdpPerCapita',
label: '人均GDP（元）', label: '人均GDP（元）',
}, },
{ {
prop: 'rjgdp', prop: 'piAddValue',
label: '第一产业增加值（亿元）', label: '第一产业增加值（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'siAddValue',
label: '第二产业增加值（亿元）', label: '第二产业增加值（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'tiAddValue',
label: '第三产业增加值（亿元）', label: '第三产业增加值（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'population',
label: '人口（万人）', label: '人口（万人）',
}, },
{ {
prop: 'rjgdp', prop: 'industryAddValue',
label: '工业增加值（亿元）', label: '工业增加值（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'industryTotalValue',
label: '工业总产值（亿元）', label: '工业总产值（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'realEstateInvestment',
label: '房地产开发投资（亿元）', label: '房地产开发投资（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'eximTotalValue',
label: '进出口总额（亿美元）', label: '进出口总额（亿美元）',
}, },
{ {
prop: 'rjgdp', prop: 'trscg',
label: '社会消费品零售总额（亿元）', label: '社会消费品零售总额（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'urbanPcdi',
label: '城镇居民人均可支配收入（元）', label: '城镇居民人均可支配收入（元）',
}, },
{ {
prop: 'cz', prop: 'name',
label: '财政', label: '财政',
}, },
{ {
prop: 'rjgdp', prop: 'gbr',
label: '一般公共预算收入（亿元）', label: '一般公共预算收入（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'gbrGrowth',
label: '般公共预算收入增速', label: '般公共预算收入增速',
}, },
{ {
prop: 'rjgdp', prop: 'taxIncome',
label: '税收收入（亿元）', label: '税收收入（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'transferIncome',
label: '转移性收入（亿元）', label: '转移性收入（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'superiorSubsidyIncome',
label: '上级补助收入（亿元）', label: '上级补助收入（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'gbe',
label: '一般公共预算支出（亿元）', label: '一般公共预算支出（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'govFundIncome',
label: '政府性基金收入（亿元）', label: '政府性基金收入（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'landTransferIncome',
label: '土地出让收入（亿元）', label: '土地出让收入（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'govFundExpenditure',
label: '政府性基金支出（亿元）', label: '政府性基金支出（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'soecoi',
label: '国有资本经营收入（亿元）', label: '国有资本经营收入（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'soecoe',
label: '国有资本经营支出（亿元）', label: '国有资本经营支出（亿元）',
}, },
{ {
prop: 'zw', prop: 'name',
label: '债务', label: '债务',
}, },
{ {
prop: 'rjgdp', prop: 'govDebtBalance',
label: '地方政府债务余额（亿元）', label: '地方政府债务余额（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'generalDebtBalance',
label: '一般债余额（亿元）', label: '一般债余额（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'specialDebtBalance',
label: '专项债余额（亿元）', label: '专项债余额（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'govDebtLimit',
label: '地方政府债务限额（亿元）', label: '地方政府债务限额（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'uipInterestBearingDebt',
label: '城投平台有息债务（亿元）', label: '城投平台有息债务（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'fiscalSelfSufficiencyRate',
label: '财政自给率', label: '财政自给率',
}, },
{ {
prop: 'rjgdp', prop: 'govDebtToGdpRate',
label: '负债率', label: '负债率',
}, },
{ {
prop: 'rjgdp', prop: 'govDebtToGdpRateWild',
label: '负债率-宽口径', label: '负债率-宽口径',
}, },
{ {
prop: 'rjgdp', prop: 'govDebtRate',
label: '债务率', label: '债务率',
}, },
{ {
prop: 'rjgdp', prop: 'govDebtRateWild',
label: '债务率-宽口径', label: '债务率-宽口径',
}, },
], ],
props: { props: {
value: 'id', value: 'id',
checkStrictly: true
}, },
addressList: [], addressList: [],
value1:'', value1:'',
...@@ -303,10 +288,20 @@ export default { ...@@ -303,10 +288,20 @@ export default {
addressValue3:'', addressValue3:'',
addressValue4:'', addressValue4:'',
addressValue5:'', addressValue5:'',
value1Flag:false,
value2Flag:false,
value3Flag:false,
value4Flag:false,
value5Flag:false,
} }
}, },
created() { created() {
this.dataRegion() this.dataRegion();
// this.getData();
getYears({}).then(res => {
this.yearOptions=res.data.reverse();
this.queryParams.year = this.yearOptions[0].year;
})
}, },
computed: { computed: {
getHeaders() { getHeaders() {
...@@ -319,6 +314,12 @@ export default { ...@@ -319,6 +314,12 @@ export default {
} }
}, },
methods: { methods: {
getData(params){
nationalPage(params).then(res => {
console.log(res.data)
// this.tableData = res.data.list
})
},
//地区 //地区
async dataRegion() { async dataRegion() {
// await axios.post("https://files.jiansheku.com/file/json/common/dataRegion.json", {}, { // await axios.post("https://files.jiansheku.com/file/json/common/dataRegion.json", {}, {
...@@ -372,6 +373,28 @@ export default { ...@@ -372,6 +373,28 @@ export default {
} }
this.addressList = str; this.addressList = str;
}, },
handleVisibleChange(flag,index){
if(!flag){
switch (index) {
case 1:
this.value1Flag=true
break;
case 2:
this.value2Flag=true
break;
case 3:
this.value3Flag=true
break;
case 4:
this.value4Flag=true
break;
case 5:
this.value5Flag=true
break;
}
}
},
handleChange(index) { handleChange(index) {
let arr = ''; let arr = '';
switch (index) { switch (index) {
...@@ -411,31 +434,51 @@ export default { ...@@ -411,31 +434,51 @@ export default {
break; break;
} }
} }
const params = { pageNum: this.pageIndex, pageSize: this.pageSize, year: this.queryParams.year,type:3 }
let provinceCode = [],cityCode = [],countyCode = [];
for (var i in arr) {
if (arr[i].parent) {
if (!arr[i].parent.checked) {
arr[i].hasChildren && cityCode.push(arr[i].value);
!arr[i].hasChildren && countyCode.push(arr[i].value);
}
} else {
provinceCode.push(arr[i].value)
}
}
if(provinceCode.length > 0){
params.provinceIds=provinceCode
}
if(cityCode.length > 0){
params.cityIds=cityCode
}
if(countyCode.length > 0){
params.areaIds=countyCode
}
this.getData(params)
}, },
handleDelete(index){ handleDelete(index){
switch (index) { switch (index) {
case 1: case 1:
this.addressValue1=''; this.addressValue1='';
this.value1='';
break; break;
case 2: case 2:
this.addressValue2=''; this.addressValue2='';
this.value2='';
break; break;
case 3: case 3:
this.addressValue3=''; this.addressValue3='';
this.value3='';
break; break;
case 4: case 4:
this.addressValue4=''; this.addressValue4='';
this.value4='';
break; break;
case 5: case 5:
this.addressValue5=''; this.addressValue5='';
this.value5='';
break; break;
} }
} },
} }
} }
</script> </script>
......
dsk-operate-ui/src/views/macro/economies/component/industrialStructure.vue
View file @ bb11a463
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
<el-form ref="queryForm" :model="queryParams" :inline="true" size="small"> <el-form ref="queryForm" :model="queryParams" :inline="true" size="small">
<el-form-item prop="year"> <el-form-item prop="year">
<el-select v-model="queryParams.year" filterable class="form-content-width" placeholder="请选择年度"> <el-select v-model="queryParams.year" filterable class="form-content-width" placeholder="请选择年度">
<el-option v-for="(item, index) in yearOptions" :key="index" :label="item.name" :value="item.value" /> <el-option v-for="(item, index) in yearOptions" :key="index" :label="item.year" :value="item.year" />
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-form> </el-form>
...@@ -48,19 +48,19 @@ ...@@ -48,19 +48,19 @@
<script> <script>
import * as echarts from 'echarts'; import * as echarts from 'echarts';
import { nationalPage,getYears } from '@/api/macro/macro'
export default { export default {
name: 'industrialStructure', name: 'industrialStructure',
props:{
dataQuery:{}
},
data() { data() {
return { return {
queryParams: { queryParams: {
year: '', year: '',
address: '' address: ''
}, },
yearOptions: [ yearOptions: [],
{ name: '2023年', value: '2023' },
{ name: '2022年', value: '2022' },
{ name: '2021年', value: '2021' },
],
tableData:[ tableData:[
{ {
type:'房建工程', type:'房建工程',
...@@ -104,6 +104,10 @@ export default { ...@@ -104,6 +104,10 @@ export default {
} }
}, },
created() { created() {
getYears({}).then(res => {
this.yearOptions=res.data.reverse();
this.queryParams.year = this.yearOptions[0].year;
})
this.$nextTick(()=>{ this.$nextTick(()=>{
this.initChart() this.initChart()
}) })
......
dsk-operate-ui/src/views/macro/economies/component/localEconomy.vue
View file @ bb11a463
...@@ -6,8 +6,8 @@ ...@@ -6,8 +6,8 @@
<span class="common-title">经济数据</span> <span class="common-title">经济数据</span>
<el-form ref="queryForm" :model="queryParams" :inline="true" size="small"> <el-form ref="queryForm" :model="queryParams" :inline="true" size="small">
<el-form-item prop="year"> <el-form-item prop="year">
<el-select v-model="queryParams.year" filterable class="form-content-width" placeholder="请选择年度"> <el-select v-model="queryParams.year" filterable class="form-content-width" placeholder="请选择年度" @change="getData">
<el-option v-for="(item, index) in yearOptions" :key="index" :label="item.name" :value="item.value" /> <el-option v-for="(item, index) in yearOptions" :key="index" :label="item.year" :value="item.year" />
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-form> </el-form>
...@@ -22,49 +22,46 @@ ...@@ -22,49 +22,46 @@
:data="tableData" :data="tableData"
border border
highlight-current-row highlight-current-row
@sort-change="sortChange"
> >
<el-table-column prop="area" label="下辖区" width="100" /> <el-table-column prop="province" label="下辖区" width="100" :formatter="formatStatus"/>
<el-table-column prop="tz" label="GDP（亿元）" sortable width="120" /> <el-table-column prop="gdp" label="GDP（亿元）" sortable width="120" :formatter="formatStatus"/>
<el-table-column prop="tz" label="GDP增速" sortable width="100" /> <el-table-column prop="gdpGrowth" label="GDP增速" sortable width="100" :formatter="formatStatus"/>
<el-table-column prop="tz" label="人均GDP（元）" sortable width="130" /> <el-table-column prop="gdpPerCapita" label="人均GDP（元）" sortable width="130" :formatter="formatStatus"/>
<el-table-column prop="tz" label="人口（万人）" sortable width="120" /> <el-table-column prop="population" label="人口（万人）" sortable width="120" :formatter="formatStatus"/>
<el-table-column prop="tz" label="固定资产投资 （亿元） " sortable width="170" /> <el-table-column prop="fixedInvestment" label="固定资产投资 （亿元） " sortable width="170" :formatter="formatStatus"/>
<el-table-column prop="tz" label="一般公共预算收入（亿元）" sortable width="160" /> <el-table-column prop="gbr" label="一般公共预算收入（亿元）" sortable width="180" :formatter="formatStatus"/>
<el-table-column prop="tz" label="一般公共预算支持（亿 元）" sortable width="160" /> <el-table-column prop="gbe" label="一般公共预算支出（亿 元）" sortable width="190" :formatter="formatStatus"/>
<el-table-column prop="tz" label="政府性基金收入（亿元）" sortable width="160" /> <el-table-column prop="govFundIncome" label="政府性基金收入（亿元）" sortable width="180" :formatter="formatStatus"/>
<el-table-column prop="zxzzj" label="地方政府债务余额（亿元）" sortable width="160" /> <el-table-column prop="govDebtBalance" label="地方政府债务余额（亿元）" sortable width="180" :formatter="formatStatus"/>
<el-table-column prop="zxzzj" label="城投平台有息债务（亿元）" sortable width="160" /> <el-table-column prop="uipInterestBearingDebt" label="城投平台有息债务（亿元）" sortable width="180" :formatter="formatStatus"/>
<el-table-column prop="zxzzj" label="财政自给率" sortable width="120"/> <el-table-column prop="fiscalSelfSufficiencyRate" label="财政自给率" sortable width="120":formatter="formatStatus"/>
<el-table-column prop="zxzzj" label="债务率-宽口径" sortable width="130"/> <el-table-column prop="govDebtRateWild" label="债务率-宽口径" sortable width="130" :formatter="formatStatus"/>
</el-table> </el-table>
</div> </div>
<div class="pagination-box">
<el-pagination background :current-page="pageIndex" :page-size="pageSize" :total="tableDataTotal" layout="prev, pager, next, jumper" @current-change="handleCurrentChange" @size-change="handleSizeChange" />
</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { nationalPage,getYears } from '@/api/macro/macro'
export default { export default {
name: 'localEconomy', name: 'localEconomy',
props:{
dataQuery:{}
},
data() { data() {
return { return {
queryParams: { queryParams: {
year: '', year: '',
address: '' address: ''
}, },
yearOptions: [ yearOptions: [],
{ name: '2023年', value: '2023' }, tableData:[],
{ name: '2022年', value: '2022' },
{ name: '2021年', value: '2021' },
],
tableData:[
{
dataId:'1',
area:'重庆',
tz:'100',
zxzzj:'200'
}
],
tableLoading: false, tableLoading: false,
pageIndex: 1, pageIndex: 1,
pageSize: 10, pageSize: 10,
...@@ -72,11 +69,52 @@ export default { ...@@ -72,11 +69,52 @@ export default {
} }
}, },
created() { created() {
this.getData();
getYears({}).then(res => {
this.yearOptions=res.data.reverse();
})
}, },
methods: { methods: {
handleClick() { getData(){
const params = { pageNum: this.pageIndex, pageSize: this.pageSize, year: this.queryParams.year,type:2 }
} if(this.queryParams.field){
params.field=this.queryParams.field
}
if(this.queryParams.order){
params.order=this.queryParams.order
}
nationalPage(params).then(res => {
this.tableData = res.data.list
this.tableDataTotal = res.data.totalCount
})
},
// 重置页数
handleSizeChange(val) {
this.pageIndex = 1
this.pageSize = val
this.getData()
},
// 跳转指定页数
handleCurrentChange(val) {
this.pageIndex = val
this.getData()
},
formatStatus: function(row, column, cellValue) {
return cellValue? cellValue : '-'
},
sortChange({ column, prop, order }){
this.queryParams.field = prop
if(column.order === "ascending"){
this.queryParams.order = 'asc'
}else if(column.order === "descending"){
this.queryParams.order = 'desc'
}else {
this.queryParams.order=''
this.queryParams.field=''
}
this.pageIndex = 1;
this.getData()
},
} }
} }
</script> </script>
......
dsk-operate-ui/src/views/macro/economies/component/regionalEconomy.vue
View file @ bb11a463
...@@ -60,11 +60,13 @@ ...@@ -60,11 +60,13 @@
:data="getValues" :data="getValues"
:show-header="false" :show-header="false"
border border
:cell-style="rowStyle"
> >
<el-table-column <el-table-column
v-for="(item, index) in getHeaders" v-for="(item, index) in getHeaders"
:key="index" :key="index"
:prop="item" :prop="item"
:formatter="formatStatus"
> >
</el-table-column> </el-table-column>
</el-table> </el-table>
...@@ -75,46 +77,19 @@ ...@@ -75,46 +77,19 @@
<script> <script>
import * as echarts from 'echarts'; import * as echarts from 'echarts';
import { regional,regionalList } from '@/api/macro/macro'
export default { export default {
name: 'regionalEconomy', name: 'regionalEconomy',
props:{
dataQuery:{}
},
data() { data() {
return { return {
activeName: 'first', activeName: 'first',
tableData: [ tableData: [],
{
zb:"2022年",
gdp:'129,118.58',
gdpzs:'124,369.67',
rjgdp:'134,369.67',
},
{
zb:"2021年",
gdp:'129,118.58',
gdpzs:'124,369.67',
rjgdp:'134,369.67',
},
{
zb:"2020年",
gdp:'129,118.58',
gdpzs:'124,369.67',
rjgdp:'134,369.67',
},
{
zb:"2019年",
gdp:'129,118.58',
gdpzs:'124,369.67',
rjgdp:'134,369.67',
},
{
zb:"2018年",
gdp:'129,118.58',
gdpzs:'124,369.67',
rjgdp:'134,369.67',
},
],
headers: [ headers: [
{ {
prop: 'zb', prop: 'year',
label: '指标', label: '指标',
}, },
{ {
...@@ -126,143 +101,143 @@ export default { ...@@ -126,143 +101,143 @@ export default {
label: 'GDP（亿元）', label: 'GDP（亿元）',
}, },
{ {
prop: 'gdpzs', prop: 'gdpAddValue',
label: 'GDP增速', label: 'GDP增速',
}, },
{ {
prop: 'rjgdp', prop: 'gdpPerCapita',
label: '人均GDP（元）', label: '人均GDP（元）',
}, },
{ {
prop: 'rjgdp', prop: 'piAddValue',
label: '第一产业增加值（亿元）', label: '第一产业增加值（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'siAddValue',
label: '第二产业增加值（亿元）', label: '第二产业增加值（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'tiAddValue',
label: '第三产业增加值（亿元）', label: '第三产业增加值（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'population',
label: '人口（万人）', label: '人口（万人）',
}, },
{ {
prop: 'rjgdp', prop: 'industryAddValue',
label: '工业增加值（亿元）', label: '工业增加值（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'industryTotalValue',
label: '工业总产值（亿元）', label: '工业总产值（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'realEstateInvestment',
label: '房地产开发投资（亿元）', label: '房地产开发投资（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'eximTotalValue',
label: '进出口总额（亿美元）', label: '进出口总额（亿美元）',
}, },
{ {
prop: 'rjgdp', prop: 'trscg',
label: '社会消费品零售总额（亿元）', label: '社会消费品零售总额（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'urbanPcdi',
label: '城镇居民人均可支配收入（元）', label: '城镇居民人均可支配收入（元）',
}, },
{ {
prop: 'cz', prop: 'name',
label: '财政', label: '财政',
}, },
{ {
prop: 'rjgdp', prop: 'gbr',
label: '一般公共预算收入（亿元）', label: '一般公共预算收入（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'gbrGrowth',
label: '般公共预算收入增速', label: '般公共预算收入增速',
}, },
{ {
prop: 'rjgdp', prop: 'taxIncome',
label: '税收收入（亿元）', label: '税收收入（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'transferIncome',
label: '转移性收入（亿元）', label: '转移性收入（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'superiorSubsidyIncome',
label: '上级补助收入（亿元）', label: '上级补助收入（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'gbe',
label: '一般公共预算支出（亿元）', label: '一般公共预算支出（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'govFundIncome',
label: '政府性基金收入（亿元）', label: '政府性基金收入（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'landTransferIncome',
label: '土地出让收入（亿元）', label: '土地出让收入（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'govFundExpenditure',
label: '政府性基金支出（亿元）', label: '政府性基金支出（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'soecoi',
label: '国有资本经营收入（亿元）', label: '国有资本经营收入（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'soecoe',
label: '国有资本经营支出（亿元）', label: '国有资本经营支出（亿元）',
}, },
{ {
prop: 'zw', prop: 'name',
label: '债务', label: '债务',
}, },
{ {
prop: 'rjgdp', prop: 'govDebtBalance',
label: '地方政府债务余额（亿元）', label: '地方政府债务余额（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'generalDebtBalance',
label: '一般债余额（亿元）', label: '一般债余额（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'specialDebtBalance',
label: '专项债余额（亿元）', label: '专项债余额（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'govDebtLimit',
label: '地方政府债务限额（亿元）', label: '地方政府债务限额（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'uipInterestBearingDebt',
label: '城投平台有息债务（亿元）', label: '城投平台有息债务（亿元）',
}, },
{ {
prop: 'rjgdp', prop: 'fiscalSelfSufficiencyRate',
label: '财政自给率', label: '财政自给率',
}, },
{ {
prop: 'rjgdp', prop: 'govDebtToGdpRate',
label: '负债率', label: '负债率',
}, },
{ {
prop: 'rjgdp', prop: 'govDebtToGdpRateWild',
label: '负债率-宽口径', label: '负债率-宽口径',
}, },
{ {
prop: 'rjgdp', prop: 'govDebtRate',
label: '债务率', label: '债务率',
}, },
{ {
prop: 'rjgdp', prop: 'govDebtRateWild',
label: '债务率-宽口径', label: '债务率-宽口径',
}, },
], ],
...@@ -275,6 +250,8 @@ export default { ...@@ -275,6 +250,8 @@ export default {
} }
}, },
created() { created() {
console.log(this.dataQuery)
this.getData()
this.$nextTick(()=>{ this.$nextTick(()=>{
this.initChart() this.initChart()
this.initChart1() this.initChart1()
...@@ -294,6 +271,21 @@ export default { ...@@ -294,6 +271,21 @@ export default {
} }
}, },
methods: { methods: {
getData(){
let params={}
if(this.dataQuery.id){
params.id=this.dataQuery.id
}
if(this.dataQuery.provinceId){
params.provinceId=this.dataQuery.provinceId
}
regional(params).then(res => {
console.log(res.data)
})
regionalList(params).then(res => {
this.tableData=res.data;
})
},
initChart() { initChart() {
let myChart = echarts.init(document.getElementById("echartsGDP")) let myChart = echarts.init(document.getElementById("echartsGDP"))
let option ={ let option ={
...@@ -591,6 +583,22 @@ export default { ...@@ -591,6 +583,22 @@ export default {
} }
myChartYE.setOption(option); myChartYE.setOption(option);
}, },
formatStatus: function(row, column, cellValue) {
if(row.title === '经济'||row.title === '财政'||row.title === '债务'){
return cellValue
}else {
return cellValue? cellValue : '-'
}
},
rowStyle(row){
if (row.row.title === '经济'||row.row.title === '财政'||row.row.title === '债务'){
return {
// background: '#FAF5EB',
color:'#232323',
fontWeight: 'bold'
}
}
}
} }
} }
</script> </script>
......
dsk-operate-ui/src/views/macro/economies/index.vue
View file @ bb11a463
...@@ -9,10 +9,10 @@ ...@@ -9,10 +9,10 @@
</el-tabs> </el-tabs>
<div class="location"><i class="el-icon-location"></i>重庆市</div> <div class="location"><i class="el-icon-location"></i>重庆市</div>
</div> </div>
<RegionalEconomy v-if="activeName === 'first'"></RegionalEconomy> <RegionalEconomy v-if="activeName === 'first'" :dataQuery="dataQuery"></RegionalEconomy>
<LocalEconomy v-if="activeName === 'second'"></LocalEconomy> <LocalEconomy v-if="activeName === 'second'" :dataQuery="dataQuery"></LocalEconomy>
<IndustrialStructure v-if="activeName === 'third'"></IndustrialStructure> <IndustrialStructure v-if="activeName === 'third'" :dataQuery="dataQuery"></IndustrialStructure>
<Comparison v-if="activeName === 'four'"></Comparison> <Comparison v-if="activeName === 'four'" :dataQuery="dataQuery"></Comparison>
</div> </div>
</template> </template>
...@@ -31,10 +31,12 @@ export default { ...@@ -31,10 +31,12 @@ export default {
}, },
data() { data() {
return { return {
activeName: 'first' activeName: 'third',
dataQuery:{}
} }
}, },
created() { created() {
this.dataQuery=this.$route.query
// let name = sessionStorage.getItem('currentTab') // let name = sessionStorage.getItem('currentTab')
// if (name != "undefined" && name){ // if (name != "undefined" && name){
// this.activeName = name; // this.activeName = name;
......
dsk-operate-ui/src/views/macro/nationalEconomies/component/economies-detail.vue
View file @ bb11a463
...@@ -6,39 +6,18 @@ ...@@ -6,39 +6,18 @@
size="50%" size="50%"
> >
<div slot="title" class="ndmx-title"><img src="@/assets/images/economies/icon.png" class="icon">年度明细</div> <div slot="title" class="ndmx-title"><img src="@/assets/images/economies/icon.png" class="icon">年度明细</div>
<!--<div class="content">-->
<!--<div class="main-title">-->
<!--<span class="label-200">指标</span>-->
<!--<span>2022年</span>-->
<!--<span>2021年</span>-->
<!--<span>2020年</span>-->
<!--<span>2019年</span>-->
<!--<span>2018年</span>-->
<!--</div>-->
<!--<div class="main-list">-->
<!--<div class="item">-->
<!--<h3></h3>-->
<!--<div class="item-cont">-->
<!--<span>指标</span>-->
<!--<span>2022年</span>-->
<!--<span>2021年</span>-->
<!--<span>2020年</span>-->
<!--<span>2019年</span>-->
<!--<span>2018年</span>-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<div class="table-item"> <div class="table-item">
<el-table <el-table
:data="getValues" :data="getValues"
:show-header="false" :show-header="false"
border border
:cell-style="rowStyle"
> >
<el-table-column <el-table-column
v-for="(item, index) in getHeaders" v-for="(item, index) in getHeaders"
:key="index" :key="index"
:prop="item" :prop="item"
:formatter="formatStatus"
> >
</el-table-column> </el-table-column>
</el-table> </el-table>
...@@ -48,6 +27,7 @@ ...@@ -48,6 +27,7 @@
</template> </template>
<script> <script>
import { getNationalDetails } from '@/api/macro/macro'
export default { export default {
name: '', name: '',
components: { components: {
...@@ -57,29 +37,10 @@ export default { ...@@ -57,29 +37,10 @@ export default {
data() { data() {
return { return {
dialogVisible: false, dialogVisible: false,
tableData: [ tableData: [],
{
zb:"2022年",
gdp:'129,118.58',
gdpzs:'124,369.67',
rjgdp:'134,369.67',
},
{
zb:"2021年",
gdp:'129,118.58',
gdpzs:'124,369.67',
rjgdp:'134,369.67',
},
{
zb:"2020年",
gdp:'129,118.58',
gdpzs:'124,369.67',
rjgdp:'134,369.67',
},
],
headers: [ headers: [
{ {
prop: 'zb', prop: 'year',
label: '指标', label: '指标',
}, },
{ {
...@@ -91,13 +52,173 @@ export default { ...@@ -91,13 +52,173 @@ export default {
label: 'GDP（亿元）', label: 'GDP（亿元）',
}, },
{ {
prop: 'gdpzs', prop: 'gdpGrowth',
label: 'GDP增速', label: 'GDP增速',
}, },
{ {
prop: 'rjgdp', prop: 'gdpPerCapita',
label: '人均GDP（元）', label: '人均GDP（元）',
}, },
{
prop: 'piAddValue',
label: '第一产业增加值(亿元)',
},
{
prop: 'siAddValue',
label: '第二产业增加值(亿元)',
},
{
prop: 'tiAddValue',
label: '第三产业增加值(亿元)',
},
{
prop: 'name',
label: '人口',
},
{
prop: 'population',
label: '人口(万人)',
},
{
prop: 'name',
label: '一般公共预算收入',
},
{
prop: 'gbr',
label: '一般公共预算收入(亿元)',
},
{
prop: 'gbrGrowth',
label: '一般公共预算收入增速(%)',
},
{
prop: 'taxIncome',
label: '一般公共预算收入:税收收入(亿元)',
},
{
prop: 'gbe',
label: '一般公共预算支出(亿元)',
},
{
prop: 'name',
label: '政府性基金收支',
},
{
prop: 'govFundIncome',
label: '政府性基金收入(亿元)',
},
{
prop: 'landTransferIncome',
label: '政府性基金收入:土地出让收入(亿元)',
},
{
prop: 'govFundExpenditure',
label: '政府性基金支出(亿元)',
},
{
prop: 'name',
label: '国有资本预算收支',
},
{
prop: 'soecoi',
label: '国有资本经营收入(亿元)',
},
{
prop: 'soecoe',
label: '国有资本经营支出(亿元)',
},
{
prop: 'name',
label: '综合财力',
},
{
prop: 'fiscalSelfSufficiencyRate',
label: '财政自给率(%)',
},
{
prop: 'name',
label: '地方政府债务',
},
{
prop: 'govDebtBalance',
label: '地方政府债务余额(亿元)',
},
{
prop: 'generalDebtBalance',
label: '一般债余额(亿元)',
},
{
prop: 'specialDebtBalance',
label: '专项债余额(亿元)',
},
{
prop: 'govDebtLimit',
label: '地方政府债务限额(亿元)',
},
{
prop: 'uipInterestBearingDebt',
label: '城投平台有息债务(亿元)',
},
{
prop: 'govDebtToGdpRate',
label: '负债率(%)',
},
{
prop: 'govDebtToGdpRateWild',
label: '负债率(宽口径)(%)',
},
{
prop: 'govDebtRate',
label: '债务率(%)',
},
{
prop: 'name',
label: '工业',
},
{
prop: 'industryAddValue',
label: '工业增加值（亿元）',
},
{
prop: 'industryTotalValue',
label: '工业总产值（亿元）',
},
{
prop: 'name',
label: '投资与房地产',
},
{
prop: 'fixedInvestment',
label: '固定资产投资（亿元）',
},
{
prop: 'name',
label: '对外贸易',
},
{
prop: 'eximTotalValue',
label: '进出口总额（亿美元）',
},
{
prop: 'name',
label: '消费、收入和存贷款',
},
{
prop: 'trscg',
label: '社会消费品零售总额(亿元)',
},
{
prop: 'urbanPcdi',
label: '城镇居民人均可支配收入(元)',
},
// {
// prop: 'name',
// label: '金融机构存款余额(本外币)(亿元)',
// },
// {
// prop: 'name',
// label: '金融机构贷款余额(本外币)(亿元)',
// },
], ],
} }
}, },
...@@ -122,7 +243,30 @@ export default { ...@@ -122,7 +243,30 @@ export default {
}, },
// 获取明细 // 获取明细
async getDetail(row) { async getDetail(row) {
this.dialogVisible = true console.log(row)
getNationalDetails({id:row.id}).then(res => {
console.log(res.data)
this.tableData=res.data;
this.dialogVisible = true;
})
},
formatStatus: function(row, column, cellValue) {
if(row.title === '国民经济核算'||row.title === '人口'||row.title === '一般公共预算收入'||row.title === '政府性基金收支'||row.title === '国有资本预算收支'
||row.title === '综合财力'||row.title === '地方政府债务'||row.title === '工业'||row.title === '投资与房地产'||row.title === '对外贸易'||row.title === '消费、收入和存贷款'){
return cellValue
}else {
return cellValue? cellValue : '-'
}
},
rowStyle(row){
if (row.row.title === "国民经济核算"||row.row.title === "人口"||row.row.title === "一般公共预算收入"||row.row.title === "政府性基金收支"||row.row.title === "国有资本预算收支"
||row.row.title === '综合财力'||row.row.title === '地方政府债务'||row.row.title === '工业'||row.row.title === '投资与房地产'||row.row.title === '对外贸易'||row.row.title === '消费、收入和存贷款'){
return {
background: '#FAF5EB',
color:'#F38600',
fontWeight: 'bold'
}
}
} }
} }
} }
......
dsk-operate-ui/src/views/macro/nationalEconomies/component/qgjjdq.vue
View file @ bb11a463
...@@ -6,8 +6,8 @@ ...@@ -6,8 +6,8 @@
<span class="common-title">全国经济大全</span> <span class="common-title">全国经济大全</span>
<el-form ref="queryForm" :model="queryParams" :inline="true" size="small"> <el-form ref="queryForm" :model="queryParams" :inline="true" size="small">
<el-form-item prop="year"> <el-form-item prop="year">
<el-select v-model="queryParams.year" filterable multiple collapse-tags class="form-content-width" placeholder="请选择年度" @change="querySubmit"> <el-select v-model="queryParams.year" filterable class="form-content-width" placeholder="请选择年度" @change="querySubmit">
<el-option v-for="(item, index) in yearOptions" :key="index" :label="item.name" :value="item.value" /> <el-option v-for="(item, index) in yearOptions" :key="index" :label="item.year" :value="item.year" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item prop="area"> <el-form-item prop="area">
...@@ -24,7 +24,7 @@ ...@@ -24,7 +24,7 @@
</el-form> </el-form>
</div> </div>
<div class="flex-box query-ability"> <div class="flex-box query-ability">
<span class="flex-box"><img src="@/assets/images/ability_vs.png">地区经济对比</span> <router-link to="/macro/economies" tag="a" class="a-link"><span class="flex-box"><img src="@/assets/images/ability_vs.png">地区经济对比</span></router-link>
<span class="flex-box"><img src="@/assets/images/ability_excel.png">导出EXCEL</span> <span class="flex-box"><img src="@/assets/images/ability_excel.png">导出EXCEL</span>
</div> </div>
</div> </div>
...@@ -33,6 +33,7 @@ ...@@ -33,6 +33,7 @@
v-loading="tableLoading" v-loading="tableLoading"
:data="tableData" :data="tableData"
element-loading-text="Loading" element-loading-text="Loading"
@sort-change="sortChange"
border border
fit fit
highlight-current-row highlight-current-row
...@@ -42,37 +43,34 @@ ...@@ -42,37 +43,34 @@
</el-table-column> </el-table-column>
<el-table-column label="地区" min-width="70" align="left" fixed> <el-table-column label="地区" min-width="70" align="left" fixed>
<template slot-scope="scope"> <template slot-scope="scope">
<router-link to="" tag="a" class="a-link">{{ scope.row.address || '广东省' }}</router-link> <router-link :to="{path:'/macro/economies',query:{id:scope.row.id,provinceId:scope.row.provinceId}}" tag="a" class="a-link">{{ scope.row.province}}</router-link>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="年度明细" prop="dataId" width="90" align="left" fixed> <el-table-column label="年度明细" prop="id" width="90" align="center" fixed>
<template slot-scope="scope"> <template slot-scope="scope">
<img src="@/assets/images/icon_detailed.png" class="icon-detailed" @click="handleDetail(scope.row)"> <img src="@/assets/images/icon_detailed.png" class="icon-detailed" @click="handleDetail(scope.row)">
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="GDP（元）" prop="dataId" sortable min-width="115" align="right" /> <el-table-column label="GDP（元）" prop="gdp" :formatter="formatStatus" sortable="custom" min-width="115" align="right"></el-table-column>
<el-table-column label="GDP增速" prop="cgrdm" sortable min-width="100" align="right" /> <el-table-column label="GDP增速" prop="gdpGrowth" :formatter="formatStatus" sortable="custom" min-width="100" align="right"></el-table-column>
<el-table-column label="人均GDP（元）" prop="cgrssqy" sortable width="125" align="right" /> <el-table-column label="人均GDP（元）" prop="gdpPerCapita" :formatter="formatStatus" sortable="custom" width="125" align="right"></el-table-column>
<el-table-column label="人口（万人）" prop="cgrssqy" sortable width="120" align="right" /> <el-table-column label="人口（万人）" prop="population" :formatter="formatStatus" sortable="custom" width="120" align="right"></el-table-column>
<el-table-column label="一般公共预算收入 (亿元)" prop="cgrzyhy" sortable width="170" align="right" /> <el-table-column label="一般公共预算收入 (亿元)" prop="gbr" sortable="custom" width="170" align="right"></el-table-column>
<el-table-column label="一般公共预算收入增速（%）" prop="cgzzxs" sortable min-width="140" align="right" /> <el-table-column label="一般公共预算收入增速（%）" prop="gbrGrowth" :formatter="formatStatus" sortable="custom" min-width="140" align="right"></el-table-column>
<el-table-column label="一般公共预算支出（亿元）" prop="cgfs" sortable width="140" align="left" /> <el-table-column label="一般公共预算收入：税收收入" prop="taxIncome" :formatter="formatStatus" sortable="custom" min-width="140" align="right"></el-table-column>
<el-table-column label="政府性基金收入（亿元）" width="140" sortable align="left"> <el-table-column label="一般公共预算支出（亿元）" prop="gbe" :formatter="formatStatus" sortable="custom" width="140" align="left"></el-table-column>
<template slot-scope="scope"> <el-table-column label="政府性基金收入（亿元）" width="140" prop="govFundIncome" :formatter="formatStatus" sortable="custom" align="left"></el-table-column>
<router-link to="/purchaserDetail" target="_blank" tag="a" class="a-link">{{ scope.row.zbwj }}</router-link> <el-table-column label="政府性基金收入：土地出让收入（亿元）" prop="landTransferIncome" sortable="custom" width="150" align="left"></el-table-column>
</template> <el-table-column label="政府性基金支出（亿元）" prop="govFundExpenditure" :formatter="formatStatus" width="170" sortable="custom" align="left"></el-table-column>
</el-table-column> <el-table-column label="国有资产经营收入（亿元）" prop="soecoi" width="160" :formatter="formatStatus" align="left"></el-table-column>
<el-table-column label="政府性基金收入：土地出让收入（亿元）" prop="cgfs" sortable width="150" align="left" /> <el-table-column label="国有资产经营支出（亿元）" prop="soecoe" width="160" :formatter="formatStatus" align="left"></el-table-column>
<el-table-column label="政府性基金支出（亿元）" prop="cgfs" width="170" sortable align="left" /> <el-table-column label="固定资产投资（亿元）" prop="fixedInvestment" :formatter="formatStatus" width="160" align="left"></el-table-column>
<el-table-column label="国有资产经营收入（亿元）" prop="cgfs" width="160" align="left" /> <el-table-column label="财政自给率（%）" prop="fiscalSelfSufficiencyRate" :formatter="formatStatus" width="160" align="left"></el-table-column>
<el-table-column label="国有资产经营支出（亿元）" prop="cgfs" width="160" align="left" /> <el-table-column label="地方政府债务余额（亿元）" prop="govDebtBalance" :formatter="formatStatus" width="160" align="left"></el-table-column>
<el-table-column label="固定资产投资（亿元）" prop="cgfs" width="160" align="left" /> <el-table-column label="一般债余额（亿元）" prop="generalDebtBalance" :formatter="formatStatus" width="160" align="left"></el-table-column>
<el-table-column label="财政自给率（%）" prop="cgfs" width="160" align="left" /> <el-table-column label="专项债余额（亿元）" prop="specialDebtBalance" :formatter="formatStatus" width="160" align="left"></el-table-column>
<el-table-column label="地方政府债务余额（亿元）" prop="cgfs" width="160" align="left" /> <el-table-column label="地方政府债务限额（亿元）" prop="govDebtLimit" :formatter="formatStatus" width="160" align="left"></el-table-column>
<el-table-column label="一般债余额（亿元）" prop="cgfs" width="160" align="left" /> <el-table-column label="城投平台有息债务（亿元）" prop="uipInterestBearingDebt" :formatter="formatStatus" width="160" align="left" >
<el-table-column label="专项债余额（亿元）" prop="cgfs" width="160" align="left" />
<el-table-column label="地方政府债务限额（亿元）" prop="cgfs" width="160" align="left" />
<el-table-column label="城投平台有息债务（亿元）" prop="cgfs" width="160" align="left" >
<template slot="header" slot-scope="scope"> <template slot="header" slot-scope="scope">
<span>城投平台有息债务（亿元） <span>城投平台有息债务（亿元）
<el-tooltip popper-class="tips" effect="light" content="城投平台有息债务是该地区行政区划下所有的城投公司的短期债务与长期债务合计。其中，短期债务=短期借款+一年内到期的非流动负债+应付短期债券，长期债务=长期借款+应付长期债券。" placement="top"> <el-tooltip popper-class="tips" effect="light" content="城投平台有息债务是该地区行政区划下所有的城投公司的短期债务与长期债务合计。其中，短期债务=短期借款+一年内到期的非流动负债+应付短期债券，长期债务=长期借款+应付长期债券。" placement="top">
...@@ -81,22 +79,25 @@ ...@@ -81,22 +79,25 @@
</span> </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="负债率（%）" prop="cgfs" width="160" align="left" /> <el-table-column label="负债率（%）" prop="govDebtToGdpRate" :formatter="formatStatus" width="160" align="left"></el-table-column>
<el-table-column label="负债率（宽口径）（%）" prop="cgfs" width="160" align="left" /> <el-table-column label="负债率（宽口径）（%）" prop="govDebtToGdpRateWild" :formatter="formatStatus" width="160" align="left"></el-table-column>
<el-table-column label="债务率（%）" prop="cgfs" width="160" align="left" /> <el-table-column label="债务率（%）" prop="govDebtRate" :formatter="formatStatus" width="160" align="left"></el-table-column>
<el-table-column label="债务率（宽口径）（%）" prop="cgfs" width="160" align="left" /> <el-table-column label="债务率（宽口径）（%）" prop="govDebtRateWild" :formatter="formatStatus" width="160" align="left"></el-table-column>
<el-table-column label="金融机构存款余额（本外币）（亿元）" prop="cgfs" width="160" align="left" /> <!--<el-table-column label="金融机构存款余额（本外币）（亿元）" prop="cgfs" width="160" align="left" />-->
<el-table-column label="金融机构贷款余额（本外币）（亿元）" prop="cgfs" width="160" align="left" /> <!--<el-table-column label="金融机构贷款余额（本外币）（亿元）" prop="cgfs" width="160" align="left" />-->
<el-table-column label="第一产业增加值（亿元）" prop="cgfs" width="160" align="left" /> <el-table-column label="第一产业增加值（亿元）" prop="piAddValue" :formatter="formatStatus" width="160" align="left"></el-table-column>
<el-table-column label="第二产业增加值（亿元）" prop="cgfs" width="160" align="left" /> <el-table-column label="第二产业增加值（亿元）" prop="siAddValue" :formatter="formatStatus" width="160" align="left"></el-table-column>
<el-table-column label="第三产业增加值（亿元）" prop="cgfs" width="160" align="left" /> <el-table-column label="第三产业增加值（亿元）" prop="tiAddValue" :formatter="formatStatus" width="160" align="left"></el-table-column>
<el-table-column label="工业增加值（亿元）" prop="cgfs" width="160" align="left" /> <el-table-column label="工业增加值（亿元）" prop="industryAddValue" :formatter="formatStatus" width="160" align="left"></el-table-column>
<el-table-column label="工业总产值（亿元）" prop="cgfs" width="160" align="left" /> <el-table-column label="工业总产值（亿元）" prop="industryTotalValue" :formatter="formatStatus" width="160" align="left"></el-table-column>
<el-table-column label="进出口总额（亿美元）" prop="cgfs" width="160" align="left" /> <el-table-column label="进出口总额（亿美元）" prop="eximTotalValue" :formatter="formatStatus" width="160" align="left"></el-table-column>
<el-table-column label="社会消费品零售总额（亿元）" prop="cgfs" width="160" align="left" /> <el-table-column label="社会消费品零售总额（亿元）" prop="trscg" :formatter="formatStatus" width="160" align="left"></el-table-column>
<el-table-column label="城镇居民人均可支配收入（元）" prop="cgfs" width="160" align="left" /> <el-table-column label="城镇居民人均可支配收入（元）" prop="urbanPcdi" :formatter="formatStatus" width="160" align="left"></el-table-column>
</el-table> </el-table>
</div> </div>
<!--<template slot-scope="scope">-->
<!--<router-link to="/purchaserDetail" target="_blank" tag="a" class="a-link">{{ scope.row.zbwj }}</router-link>-->
<!--</template>-->
<div class="pagination-box"> <div class="pagination-box">
<el-pagination background :current-page="pageIndex" :page-size="pageSize" :total="tableDataTotal" layout="prev, pager, next, jumper" @current-change="handleCurrentChange" @size-change="handleSizeChange" /> <el-pagination background :current-page="pageIndex" :page-size="pageSize" :total="tableDataTotal" layout="prev, pager, next, jumper" @current-change="handleCurrentChange" @size-change="handleSizeChange" />
</div> </div>
...@@ -106,7 +107,7 @@ ...@@ -106,7 +107,7 @@
</template> </template>
<script> <script>
import { browsedIndexPage } from '@/api/nationalEconomies' import { nationalPage,getYears } from '@/api/macro/macro'
import dataRegion from '@/assets/json/dataRegion' import dataRegion from '@/assets/json/dataRegion'
import economiesDetail from './economies-detail' import economiesDetail from './economies-detail'
import axios from 'axios' import axios from 'axios'
...@@ -118,26 +119,16 @@ ...@@ -118,26 +119,16 @@
data() { data() {
return { return {
queryParams: { queryParams: {
year: '', year:'',
address: '' address: ''
}, },
yearOptions: [ yearOptions: [],
{ name: '2023年', value: '2023' },
{ name: '2022年', value: '2022' },
{ name: '2021年', value: '2021' },
],
props: { props: {
value: 'id', value: 'id',
multiple: true, multiple: true,
}, },
addressList: [], addressList: [],
tableData: [ tableData: [],
{
dataId:'1',
cgrssqy:'100',
cgfs:'200'
}
],
tableLoading: false, tableLoading: false,
pageIndex: 1, pageIndex: 1,
pageSize: 10, pageSize: 10,
...@@ -147,8 +138,14 @@ ...@@ -147,8 +138,14 @@
created() { created() {
this.querySubmit() this.querySubmit()
this.dataRegion() this.dataRegion()
this.getYears()
}, },
methods: { methods: {
getYears(){
getYears({}).then(res => {
this.yearOptions=res.data.reverse();
})
},
//地区 //地区
async dataRegion() { async dataRegion() {
// await axios.post("https://files.jiansheku.com/file/json/common/dataRegion.json", {}, { // await axios.post("https://files.jiansheku.com/file/json/common/dataRegion.json", {}, {
...@@ -205,8 +202,7 @@ ...@@ -205,8 +202,7 @@
// 查询提交 // 查询提交
async querySubmit() { async querySubmit() {
// this.tableLoading = true // this.tableLoading = true
const params = { pageIndex: this.pageIndex, pageSize: this.pageSize, browsedType: 1 } const params = { pageNum: this.pageIndex, pageSize: this.pageSize, year: this.queryParams.year,type:1 }
if(this.queryParams.address){ if(this.queryParams.address){
let arr = this.$refs.address.getCheckedNodes(); let arr = this.$refs.address.getCheckedNodes();
let provinceCode = [],cityCode = [],countyCode = []; let provinceCode = [],cityCode = [],countyCode = [];
...@@ -221,25 +217,31 @@ ...@@ -221,25 +217,31 @@
} }
} }
if(provinceCode.length > 0){ if(provinceCode.length > 0){
params.procinceId=provinceCode.join(',') params.provinceIds=provinceCode
} }
if(cityCode.length > 0){ if(cityCode.length > 0){
params.cityId=cityCode.join(',') params.cityIds=cityCode
} }
if(countyCode.length > 0){ if(countyCode.length > 0){
params.districtId=countyCode.join(',') params.areaIds=countyCode
} }
} }
console.log(params)
// browsedIndexPage(params).then(res => { if(this.queryParams.field){
// this.tableData = res.data.list params.field=this.queryParams.field
// this.tableDataTotal = res.data.totalCount }
// }) if(this.queryParams.order){
// // 延迟关闭加载效果 params.order=this.queryParams.order
// setTimeout(() => { }
// this.tableLoading = false
// }, 200) nationalPage(params).then(res => {
this.tableData = res.data.list
this.tableDataTotal = res.data.totalCount
})
// 延迟关闭加载效果
setTimeout(() => {
this.tableLoading = false
}, 200)
}, },
// 明细 // 明细
handleDetail(row) { handleDetail(row) {
...@@ -256,6 +258,22 @@ ...@@ -256,6 +258,22 @@
this.pageIndex = val this.pageIndex = val
this.querySubmit() this.querySubmit()
}, },
formatStatus: function(row, column, cellValue) {
return cellValue? cellValue : '-'
},
sortChange({ column, prop, order }){
this.queryParams.field = prop
if(column.order === "ascending"){
this.queryParams.order = 'asc'
}else if(column.order === "descending"){
this.queryParams.order = 'desc'
}else {
this.queryParams.order=''
this.queryParams.field=''
}
this.pageIndex = 1;
this.querySubmit()
},
} }
} }
</script> </script>
......
dsk-operate-ui/src/views/macro/nationalEconomies/component/zhaobiao.vue
View file @ bb11a463
...@@ -6,17 +6,55 @@ ...@@ -6,17 +6,55 @@
<span class="common-title">近五年全国招标数量</span> <span class="common-title">近五年全国招标数量</span>
</div> </div>
</div> </div>
<div class="text">近五年全国项目招标数量达到10,610,000个，招标数量前五的地区分别是广东（38251个）、江苏（36812个）、山东（32615个）、浙江（26341个）、河南（21621个）。</div> <div class="text">{{value}}全国项目招标数量达到{{totalCount}}万个，招标数量前五的地区分别是
{{tableData[0].type}}（{{tableData[0].count}}个）、{{tableData[1].type}}（{{tableData[1].count}}个）、{{tableData[2].type}}（{{tableData[2].count}}个）、{{tableData[3].type}}（{{tableData[3].count}}个）、{{tableData[4].type}}（{{tableData[4].count}}个）。</div>
<div class="main1"> <div class="main1">
<div id="zb-echarts" style="height: 250px"></div> <div id="zb-echarts" style="height: 250px"></div>
<p class="tips"><i class="el-icon-info"></i>数据来源大司空建筑大数据平台，统计范围为近5年全国公开的招标项目，未公开的不含在内</p> <p class="tips"><i class="el-icon-info"></i>数据来源大司空建筑大数据平台，统计范围为{{value}}全国公开的招标项目，未公开的不含在内</p>
</div> </div>
<div class="main2"> <div class="main2">
<div class="flex-box query-box head"> <div class="flex-box query-box head">
<span>近五年全国招标总数<span class="number">10,610,000 </span>个</span> <span>{{value}}全国招标总数<span class="number"> {{totalCount}} </span>万个</span>
<!--<el-select v-model="year" filterable multiple collapse-tags class="form-content-width" placeholder="请选择">--> <div class="select-popper" style="position: relative;">
<!--<el-option v-for="(item, index) in yearOptions" :key="index" :label="item.name" :value="item.value" />--> <el-dropdown
<!--</el-select>--> @command="handleDate"
trigger="click"
ref="punishDateShowPopper"
:hide-on-click="false"
>
<span class="el-dropdown-link" :class="punishDateValue ? 'color_text' : ''">{{punishDateValue}}<i class="el-icon-caret-bottom"></i></span>
<div>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item
v-for="(item, i) in yearOptions"
:class=" punishDateValue && punishDateValue == item.value? 'color_text': ''"
:key="i"
:command="item.value"
>
<div @mouseenter="hidePoper">{{ item.label }}</div>
</el-dropdown-item>
<el-dropdown-item command="自定义" style="padding: 0; text-indent: 20px">
<div @mouseenter="mouseenter">
<span :class="punishDateValue == '自定义' ? 'color_text' : ''">自定义<i class="el-icon-arrow-right"></i></span>
<el-date-picker
v-if="punishDateShowPopper"
@change="changepunishDate"
class="land_date_picker"
v-model="punishDate"
ref="datePicker"
value-format="yyyy-MM-dd"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</div>
</el-dropdown-item>
</el-dropdown-menu>
</div>
</el-dropdown>
</div>
</div> </div>
<div class="table-item"> <div class="table-item">
<el-table <el-table
...@@ -29,9 +67,9 @@ ...@@ -29,9 +67,9 @@
<el-table-column label="序号" width="50" align="left"> <el-table-column label="序号" width="50" align="left">
<template slot-scope="scope">{{ scope.$index + 1 }}</template> <template slot-scope="scope">{{ scope.$index + 1 }}</template>
</el-table-column> </el-table-column>
<el-table-column prop="area" label="地区"/> <el-table-column prop="type" label="地区"/>
<el-table-column prop="number" sortable label="招标数量"/> <el-table-column prop="count" sortable label="招标数量"/>
<el-table-column prop="zb" sortable label="占比"/> <el-table-column prop="rate" sortable label="占比"/>
</el-table> </el-table>
</div> </div>
</div> </div>
...@@ -42,26 +80,33 @@ ...@@ -42,26 +80,33 @@
<span class="common-title">全国招标项目概览</span> <span class="common-title">全国招标项目概览</span>
</div> </div>
</div> </div>
<div class="text">通过对近五年全国招标数据进行分析，发现该企业主要集中在3月（230个）、6月（209个）进行招标。</div> <div class="text">通过对近五年全国招标数据进行分析，发现该企业主要集中在{{dataSort[0].label}}（{{dataSort[0].count}}个）、{{dataSort[1].label}}（{{dataSort[1].count}}个）进行招标。</div>
<div class="main1"> <div class="main1">
<div id="gl-echarts" style="height: 250px"></div> <div id="gl-echarts" style="height: 250px"></div>
<p class="tips"><i class="el-icon-info"></i>数据来源大司空建筑大数据平台，统计范围为近五年全国公开的招标项目，未公开的不含在内</p> <p class="tips"><i class="el-icon-info"></i>数据来源大司空建筑大数据平台，统计范围为近五年全国公开的招标项目，未公开的不含在内</p>
</div> </div>
<div class="table-item"> <div class="main2">
<el-table <div class="selectYear">
:data="tableData1" <el-select v-model="year" filterable class="form-content-width" placeholder="请选择" @change="changeValue()">
border <el-option v-for="(item, index) in yearData" :key="index" :label="item" :value="item" />
height="430" </el-select>
fit </div>
highlight-current-row <div class="table-item">
> <el-table
<el-table-column label="序号" width="50" align="left"> :data="tableData1"
<template slot-scope="scope">{{ scope.$index + 1 }}</template> border
</el-table-column> height="430"
<el-table-column prop="area" label="月份"/> fit
<el-table-column prop="number" sortable label="招标数量"/> highlight-current-row
<el-table-column prop="zb" sortable label="占比"/> >
</el-table> <el-table-column label="序号" width="50" align="left">
<template slot-scope="scope">{{ scope.$index + 1 }}</template>
</el-table-column>
<el-table-column prop="label" label="月份"/>
<el-table-column prop="count" sortable label="招标数量"/>
<el-table-column prop="rate" sortable label="占比"/>
</el-table>
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -69,15 +114,16 @@ ...@@ -69,15 +114,16 @@
<script> <script>
import * as echarts from 'echarts'; import * as echarts from 'echarts';
import { countGroupByMonth,countGroupByProvince,getYear } from '@/api/macro/macro'
export default { export default {
name: 'NationalEconomies', name: 'NationalEconomies',
data() { data() {
return { return {
year:'', year:'',
yearOptions: [ yearOptions: [
{ name: '2023年', value: '2023' }, { label: '近五年', value: '近五年' },
{ name: '2022年', value: '2022' }, { label: '近三年', value: '近三年' },
{ name: '2021年', value: '2021' }, { label: '近一年', value: '近一年' },
], ],
zbData:['广东','江苏','山东','浙江','河南','安徽','河北','四川','湖北','江西','甘肃','重庆','福建','云南','北京','湖南','山西'], zbData:['广东','江苏','山东','浙江','河南','安徽','河北','四川','湖北','江西','甘肃','重庆','福建','云南','北京','湖南','山西'],
zbData1:[123,156,236,426,412,231,96,105,210,420,213,86,120,230,150,132,196], zbData1:[123,156,236,426,412,231,96,105,210,420,213,86,120,230,150,132,196],
...@@ -138,79 +184,57 @@ export default { ...@@ -138,79 +184,57 @@ export default {
zb:'0.34%' zb:'0.34%'
}, },
], ],
glData:['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'], tableData1:[],
glData1:[503,156,132,186,203,143,189,301,211,195,132,176], dataSort:[
tableData1:[
{
area:'1月',
number:'123',
zb:'0.19%'
},
{
area:'2月',
number:'156',
zb:'0.29%'
},
{
area:'3月',
number:'236',
zb:'0.34%'
},
{
area:'4月',
number:'426',
zb:'0.34%'
},
{
area:'5月',
number:'412',
zb:'0.34%'
},
{
area:'6月',
number:'231',
zb:'0.34%'
},
{
area:'7月',
number:'96',
zb:'0.34%'
},
{
area:'8月',
number:'105',
zb:'0.34%'
},
{
area:'9月',
number:'210',
zb:'0.34%'
},
{ {
area:'10月', label:'',
number:'420', count:''
zb:'0.34%'
}, },
{ {
area:'11月', label:'',
number:'213', count:''
zb:'0.34%'
},
{
area:'12月',
number:'213',
zb:'0.34%'
}, },
], ],
totalCount:'',
punishDateValue: "请选择",
value:'近五年',
punishDateShowPopper: false,
punishDate: "",
yearData:[]
} }
}, },
created() { created() {
let params={}
this.getDataByProvince(params)
this.getDataByMonth(params)
this.$nextTick(()=>{ this.$nextTick(()=>{
this.initChart() // this.initChart()
this.initChart1() // this.initChart1()
})
getYear().then(res => {
this.yearData=res.rows;
}) })
}, },
methods: { methods: {
getDataByProvince(params){
countGroupByProvince(params).then(res => {
this.tableData=res.data.provinceDate;
this.totalCount=res.data.totalCount;
this.initChart()
})
},
getDataByMonth(params){
countGroupByMonth(params).then(res => {
this.tableData1=res.data;
let companyValue1 = JSON.parse(JSON.stringify(this.tableData1))
let arr = this.tableData1.sort((a, b) => {
return b.count - a.count
})
this.tableData1 = JSON.parse(JSON.stringify(companyValue1))
this.dataSort=arr;
this.initChart1()
})
},
initChart() { initChart() {
let myChart = echarts.init(document.getElementById("zb-echarts")) let myChart = echarts.init(document.getElementById("zb-echarts"))
let option = { let option = {
...@@ -223,27 +247,33 @@ export default { ...@@ -223,27 +247,33 @@ export default {
grid: { grid: {
left: '5', left: '5',
right: '5', right: '5',
top: '10', top: '15',
bottom: '10', bottom: '10',
containLabel: true containLabel: true
}, },
xAxis: { xAxis: {
type: 'category', type: 'category',
data: this.zbData data: this.tableData.map(item => item.type),
axisLabel: {
show: true,
// "interval": 0,
"rotate": 40 //X轴倾斜度
},
}, },
yAxis: { yAxis: {
type: 'value' type: 'value',
}, },
series: [ series: [
{ {
data: this.zbData1, data: this.tableData.map(item => item.count),
type: 'bar', type: 'bar',
barWidth: 16,
itemStyle: { itemStyle: {
normal: { normal: {
barBorderRadius: [4, 4, 0, 0], barBorderRadius: [4, 4, 0, 0],
color: '#165DFF', color: '#165DFF',
label: { label: {
show: true, //开启显示 show: false, //开启显示
position: 'top', //在上方显示 position: 'top', //在上方显示
textStyle: { //数值样式 textStyle: { //数值样式
color: '#165DFF', color: '#165DFF',
...@@ -263,7 +293,7 @@ export default { ...@@ -263,7 +293,7 @@ export default {
}, },
initChart1() { initChart1() {
let myChart = echarts.init(document.getElementById("gl-echarts")) let myChart = echarts.init(document.getElementById("gl-echarts"))
let dataList=this.glData1; let dataList=this.tableData1;
let option = { let option = {
tooltip: { tooltip: {
trigger: 'axis', //坐标轴触发，主要在柱状图，折线图等会使用类目轴的图表中使用 trigger: 'axis', //坐标轴触发，主要在柱状图，折线图等会使用类目轴的图表中使用
...@@ -280,20 +310,14 @@ export default { ...@@ -280,20 +310,14 @@ export default {
}, },
xAxis: { xAxis: {
type: 'category', type: 'category',
data: this.glData data: this.tableData1.map(item => item.label),
}, },
yAxis: { yAxis: {
type: 'value' type: 'value'
}, },
series: [ series: [
{ {
data: this.glData1, data: this.tableData1.map(item => item.count),
// markPoint:{
// data:[
// {type:'max',name:'最大值'},
// {type:'min',name:'最小值'},
// ]
// },
type: 'bar', type: 'bar',
barWidth: 20, barWidth: 20,
itemStyle: { itemStyle: {
...@@ -306,15 +330,15 @@ export default { ...@@ -306,15 +330,15 @@ export default {
//定义一个变量 保存柱形图数据 因为sort方法排序会改变原数组 使用JSON方法深拷贝 将原数值暂存 //定义一个变量 保存柱形图数据 因为sort方法排序会改变原数组 使用JSON方法深拷贝 将原数值暂存
let companyValue1 = JSON.parse(JSON.stringify(dataList)) let companyValue1 = JSON.parse(JSON.stringify(dataList))
let arr = dataList.sort((a, b) => { let arr = dataList.sort((a, b) => {
return b - a return b.count - a.count
}) })
//将原数组数据赋值回去 保持数据不变 //将原数组数据赋值回去 保持数据不变
dataList = JSON.parse(JSON.stringify(companyValue1)) dataList = JSON.parse(JSON.stringify(companyValue1))
//遍历数据 将原数组和排序后的数组比较 //遍历数据 将原数组和排序后的数组比较
dataList.map(i => { dataList.map(i => {
if (i == arr[0]) { if (i.count == arr[0].count) {
colorList.push('#F39F35') colorList.push('#F39F35')
} else if (i == arr[1]) { } else if (i.count == arr[1].count) {
colorList.push('#6675A5') colorList.push('#6675A5')
}else{ }else{
colorList.push('#2ECFCF') colorList.push('#2ECFCF')
...@@ -322,7 +346,7 @@ export default { ...@@ -322,7 +346,7 @@ export default {
}) })
//返回一个存储着颜色的数组根据数据index顺序渲染到页面 //返回一个存储着颜色的数组根据数据index顺序渲染到页面
return colorList[params.dataIndex] return colorList[params.dataIndex]
} },
}, },
} }
} }
...@@ -330,11 +354,97 @@ export default { ...@@ -330,11 +354,97 @@ export default {
}; };
myChart.setOption(option); myChart.setOption(option);
}, },
handleDate(command) {
if (command && command != "自定义") {
this.punishDateValue = command;
this.$refs.punishDateShowPopper.hide();
this.value = command;
let mydate=new Date();
var startTime, endTime, Year, Month, Day,startyear
Year = mydate.getFullYear();
Month = mydate.getMonth() + 1;
Day = mydate.getDate();
Month = Month < 10 ? '0' + Month : Month
Day = Day < 10 ? '0' + Day : Day
switch (command) {
case "近五年":
startyear=mydate.getFullYear()-5;
startTime = startyear + "-" + Month + "-" + Day;
endTime = Year + "-" + Month + "-" + Day;
break;
case "近三年":
startyear=mydate.getFullYear()-3;
startTime = startyear + "-" + Month + "-" + Day;
endTime = Year + "-" + Month + "-" + Day;
break;
case "近一年":
startyear=mydate.getFullYear()-1;
startTime = startyear + "-" + Month + "-" + Day;
endTime = Year + "-" + Month + "-" + Day;
break;
}
let params={
startDate:startTime,
endDate:endTime
}
this.getDataByProvince(params)
} else if (command == "自定义") {
this.$refs.datePicker.pickerVisible = true;
} else {
this.$refs.punishDateShowPopper.hide();
this.punishDateValue = "";
this.punishDate = "";
}
},
changepunishDate() {
if (this.punishDate) {
this.punishDateValue = "自定义";
this.value = this.punishDate[0] +' - '+this.punishDate[1];
let params={
startDate:this.punishDate[0],
endDate:this.punishDate[1]
}
this.getDataByProvince(params)
}
},
hidePoper() {
if (this.$refs.datePicker) {
this.$refs.datePicker.pickerVisible = false;
}
},
mouseenter() {
this.punishDateShowPopper = true;
if(this.punishDateValue=='自定义'){
this.$nextTick(() => {
// this.$refs.datePicker.focus()
this.$refs.datePicker.pickerVisible = true;
});
}
},
changeValue(){
this.getDataByMonth({year:this.year})
}
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.land_date_picker{
position: absolute!important;
visibility: hidden;
left: -645px;
top: 145px;
}
::v-deep .el-popper .popper__arrow, .el-popper .popper__arrow::after{
display: none;
}
.color_text{
background: #F3F4F5;
border-radius: 4px;
color: #0081FF;
}
.zhaobiao{ .zhaobiao{
.zb-content{ .zb-content{
background: #ffffff; background: #ffffff;
...@@ -385,6 +495,20 @@ export default { ...@@ -385,6 +495,20 @@ export default {
line-height: 32px; line-height: 32px;
} }
} }
.el-dropdown-link{
width: 96px;
height: 32px;
display: inline-block;
line-height: 32px;
text-align: center;
background: #FFFFFF;
border-radius: 4px;
border: 1px solid #D9D9D9;
cursor: pointer;
i{
margin-left: 8px;
}
}
} }
} }
.table-item{ .table-item{
...@@ -392,7 +516,24 @@ export default { ...@@ -392,7 +516,24 @@ export default {
} }
} }
.content2{ .content2{
.table-item{ .main2{
.selectYear{
height: 32px;
float: right;
margin-bottom:16px;
}
::v-deep .el-select{
width: 100px;
height: 32px;
.el-input{
width: 100%;
height: 32px;
}
.el-input__inner{
height: 32px !important;
line-height: 32px;
}
}
margin-top: 32px; margin-top: 32px;
} }
} }
......
dsk-operate-ui/src/views/macro/nationalEconomies/component/zhongbiao.vue
View file @ bb11a463
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
<div class="main1"> <div class="main1">
<div style="height: 300px;"> <div style="height: 300px;">
<div class="left"> <div class="left">
<div class="item" v-for="(item,index) in typeList" :class="typeIndex === index ? 'color':''" @click="handleClick(1,index)">{{item}}<i></i></div> <div class="item" v-for="(item,index) in glData" :class="typeIndex === index ? 'color':''" @click="handleClick(1,index)">{{item.major}}<i></i></div>
</div> </div>
<div class="right"> <div class="right">
<div id="gl-echarts" style="height: 260px;background: #ffffff;"></div> <div id="gl-echarts" style="height: 260px;background: #ffffff;"></div>
...@@ -19,12 +19,12 @@ ...@@ -19,12 +19,12 @@
<p class="tips"><i class="el-icon-info"></i>数据来源大司空建筑大数据平台，统计范围为有效期内资质，未公开不包含在内</p> <p class="tips"><i class="el-icon-info"></i>数据来源大司空建筑大数据平台，统计范围为有效期内资质，未公开不包含在内</p>
</div> </div>
<div class="main2"> <div class="main2">
<div class="flex-box query-box head"> <!--<div class="flex-box query-box head">-->
<span>近五年全国招标总数<span class="number">10,610,000 </span>个</span> <!--<span>近五年全国招标总数<span class="number">10,610,000 </span>个</span>-->
<!--<el-select v-model="year" filterable multiple collapse-tags class="form-content-width" placeholder="请选择">--> <!--<el-select v-model="year" filterable multiple collapse-tags class="form-content-width" placeholder="请选择">-->
<!--<el-option v-for="(item, index) in yearOptions" :key="index" :label="item.name" :value="item.value" />--> <!--<el-option v-for="(item, index) in yearOptions" :key="index" :label="item.name" :value="item.value" />-->
<!--</el-select>--> <!--</el-select>-->
</div> <!--</div>-->
<div class="table-item"> <div class="table-item">
<el-table <el-table
:data="zzTableData" :data="zzTableData"
...@@ -35,22 +35,23 @@ ...@@ -35,22 +35,23 @@
<el-table-column label="序号" width="50" align="left"> <el-table-column label="序号" width="50" align="left">
<template slot-scope="scope">{{ scope.$index + 1 }}</template> <template slot-scope="scope">{{ scope.$index + 1 }}</template>
</el-table-column> </el-table-column>
<el-table-column prop="name" label="资质类型"/> <el-table-column prop="major" label="资质类型"/>
<el-table-column label="特级" align="center"> <el-table-column label="特级" align="center">
<el-table-column prop="number" label="数量（个）"/> <el-table-column prop="tjCount" label="数量（个）"/>
<el-table-column prop="zb" label="占比（%）"/> <el-table-column prop="tjRate" label="占比（%）"/>
</el-table-column> </el-table-column>
<el-table-column label="一级" align="center"> <el-table-column label="一级" align="center">
<el-table-column prop="number" label="数量（个）"/> <el-table-column prop="oneCount" label="数量（个）"/>
<el-table-column prop="zb" label="占比（%）"/> <el-table-column prop="oneRate" label="占比（%）"/>
</el-table-column> </el-table-column>
<el-table-column label="二级"> <el-table-column label="二级">
<el-table-column prop="number" label="数量（个）"/> <el-table-column prop="twoCount" label="数量（个）"/>
<el-table-column prop="zb" label="占比（%）"/> <el-table-column prop="twoRate" label="占比（%）"/>
</el-table-column> </el-table-column>
<el-table-column label="三级"> <el-table-column label="三级">
<el-table-column prop="number" label="数量（个）"/> <el-table-column prop="threeCount" label="数量（个）"/>
<el-table-column prop="zb" label="占比（%）"/> <el-table-column prop="threeRate" label="占比（%）"/>
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
...@@ -64,14 +65,14 @@ ...@@ -64,14 +65,14 @@
</div> </div>
<div class="main1"> <div class="main1">
<div class="tabs"> <div class="tabs">
<div class="item" v-for="(item,index) in typeList" :class="qydqIndex === index ? 'color':''" @click="handleClick(2,index)">{{item}}<i></i></div> <div class="item" v-for="(item,index) in dqData" :class="qydqIndex === index ? 'color':''" @click="handleClick(2,index)">{{item.major}}<i></i></div>
</div> </div>
<div id="jzqy-echarts" style="height: 250px"></div> <div id="jzqy-echarts" style="height: 250px"></div>
<p class="tips"><i class="el-icon-info"></i>数据来源大司空建筑大数据平台，统计范围为有效期内资质，未公开不包含在内</p> <p class="tips"><i class="el-icon-info"></i>数据来源大司空建筑大数据平台，统计范围为有效期内资质，未公开不包含在内</p>
</div> </div>
<div class="table-item"> <div class="table-item">
<el-table <el-table
:data="tableData" :data="jzdqData"
border border
height="470" height="470"
fit fit
...@@ -80,22 +81,22 @@ ...@@ -80,22 +81,22 @@
<el-table-column label="序号" width="50" align="left"> <el-table-column label="序号" width="50" align="left">
<template slot-scope="scope">{{ scope.$index + 1 }}</template> <template slot-scope="scope">{{ scope.$index + 1 }}</template>
</el-table-column> </el-table-column>
<el-table-column prop="area" label="地区"/> <el-table-column prop="province" label="地区"/>
<el-table-column label="特级" align="center"> <el-table-column label="特级" align="center">
<el-table-column prop="number" label="数量（个）"/> <el-table-column prop="tjCount" label="数量（个）"/>
<el-table-column prop="zb" label="占比（%）"/> <el-table-column prop="tjRate" label="占比（%）"/>
</el-table-column> </el-table-column>
<el-table-column label="一级" align="center"> <el-table-column label="一级" align="center">
<el-table-column prop="number" label="数量（个）"/> <el-table-column prop="oneCount" label="数量（个）"/>
<el-table-column prop="zb" label="占比（%）"/> <el-table-column prop="oneRate" label="占比（%）"/>
</el-table-column> </el-table-column>
<el-table-column label="二级"> <el-table-column label="二级">
<el-table-column prop="number" label="数量（个）"/> <el-table-column prop="twoCount" label="数量（个）"/>
<el-table-column prop="zb" label="占比（%）"/> <el-table-column prop="twoRate" label="占比（%）"/>
</el-table-column> </el-table-column>
<el-table-column label="三级"> <el-table-column label="三级">
<el-table-column prop="number" label="数量（个）"/> <el-table-column prop="threeCount" label="数量（个）"/>
<el-table-column prop="zb" label="占比（%）"/> <el-table-column prop="threeRate" label="占比（%）"/>
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
...@@ -113,7 +114,7 @@ ...@@ -113,7 +114,7 @@
</div> </div>
<div class="table-item"> <div class="table-item">
<el-table <el-table
:data="tableData" :data="zbData"
border border
height="430" height="430"
fit fit
...@@ -122,9 +123,9 @@ ...@@ -122,9 +123,9 @@
<el-table-column label="序号" width="50" align="left"> <el-table-column label="序号" width="50" align="left">
<template slot-scope="scope">{{ scope.$index + 1 }}</template> <template slot-scope="scope">{{ scope.$index + 1 }}</template>
</el-table-column> </el-table-column>
<el-table-column prop="area" label="地区"/> <el-table-column prop="province" label="地区"/>
<el-table-column prop="number" label="企业异地备案数量（个）"/> <el-table-column prop="count" label="企业异地备案数量（个）"/>
<el-table-column prop="zb" label="占比"/> <!--<el-table-column prop="zb" label="占比"/>-->
</el-table> </el-table>
</div> </div>
</div> </div>
...@@ -133,19 +134,12 @@ ...@@ -133,19 +134,12 @@
<script> <script>
import * as echarts from 'echarts'; import * as echarts from 'echarts';
import { certGroupByMajorAndLevel,certGroupByMajorProvinceLevel,areaGroupByProvince } from '@/api/macro/macro'
export default { export default {
name: 'NationalEconomies', name: 'NationalEconomies',
data() { data() {
return { return {
year:'', tableData:[
yearOptions: [
{ name: '2023年', value: '2023' },
{ name: '2022年', value: '2022' },
{ name: '2021年', value: '2021' },
],
glData:['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
glData1:[103,156,132,186,203,143,189,301,211,195,132,176],
tableData1:[
{ {
area:'1月', area:'1月',
number:'123', number:'123',
...@@ -208,127 +202,175 @@ export default { ...@@ -208,127 +202,175 @@ export default {
}, },
], ],
typeList:['建筑工程企业','市政工程企业','公路工程企业','水利水电工程企业'],
typeIndex:0, typeIndex:0,
jzglData:['特级','一级','二级','三级'], glData:[],
jzglData1:[103,156,132,186], jzglData:[],
zzTableData:[ zzTableData:[],
tableOption:[
{ {
name:'建筑工程施工总承包', label:'资质类型',
number:'123', prop:'major'
zb:'0.19%'
}, },
{ {
name:'市政工程施工总承包', label: '特级',
number:'123', prop: 'levelValue',
zb:'0.19%' child:[
}, {
{ label: '数量（个）',
name:'公路工程施工总承包', prop: 'count'
number:'123', },
zb:'0.19%' {
}, label: '占比（%）',
{ prop: 'rate'
name:'水利水电工程施工总承包', },
number:'123', ]
zb:'0.19%'
},
],
qydqIndex:0,
zbData:['广东','江苏','山东','浙江','河南','安徽','河北','四川','湖北','江西','甘肃','重庆','福建','云南','北京','湖南','山西'],
zbData1:[123,156,236,426,412,231,96,105,210,420,213,86,120,230,150,132,196],
tableData:[
{
area:'广东',
number:'123',
zb:'0.19%'
},
{
area:'江苏',
number:'156',
zb:'0.29%'
},
{
area:'山东',
number:'236',
zb:'0.34%'
},
{
area:'浙江',
number:'426',
zb:'0.34%'
},
{
area:'河南',
number:'412',
zb:'0.34%'
},
{
area:'安徽',
number:'231',
zb:'0.34%'
},
{
area:'河北',
number:'96',
zb:'0.34%'
},
{
area:'四川',
number:'105',
zb:'0.34%'
}, },
{ {
area:'湖北', label: '一级',
number:'210', prop: 'levelValue',
zb:'0.34%' child:[
{
label: '数量（个）',
prop: 'count'
},
{
label: '占比（%）',
prop: 'rate'
},
]
}, },
{ {
area:'江西', label: '二级',
number:'420', prop: 'levelValue',
zb:'0.34%' child:[
{
label: '数量（个）',
prop: 'count'
},
{
label: '占比（%）',
prop: 'rate'
},
]
}, },
{ {
area:'甘肃', label: '三级',
number:'213', prop: 'levelValue',
zb:'0.34%' child:[
{
label: '数量（个）',
prop: 'count'
},
{
label: '占比（%）',
prop: 'rate'
},
]
}, },
], ],
dqData:[],
qydqIndex:0,
zbData:[],
jzdqData:[]
} }
}, },
created() { created() {
this.$nextTick(()=>{ this.getData()
this.initChart()
this.initChart1()
this.initChart2()
})
}, },
methods: { methods: {
getData(){
//全国建筑企业概览
certGroupByMajorAndLevel().then(res => {
this.glData=res.data;
this.jzglData=this.glData[0].levelList.reverse();
let list=[];
for (let i=0; i<res.data.length; i++){
let item={};
item.major=res.data[i].major;
for (let j=0; j<res.data[i].levelList.length; j++){
if(res.data[i].levelList[j].levelValue === '特级'){
item.tjCount=res.data[i].levelList[j].count;
item.tjRate=res.data[i].levelList[j].rate;
}
if(res.data[i].levelList[j].levelValue === '一级'){
item.oneCount=res.data[i].levelList[j].count;
item.oneRate=res.data[i].levelList[j].rate;
}
if(res.data[i].levelList[j].levelValue === '二级'){
item.twoCount=res.data[i].levelList[j].count;
item.twoRate=res.data[i].levelList[j].rate;
}
if(res.data[i].levelList[j].levelValue === '三级'){
item.threeCount=res.data[i].levelList[j].count;
item.threeRate=res.data[i].levelList[j].rate;
}
}
// item.levelList=res.data[i].levelList.reverse();
list.push(item)
}
this.zzTableData=list
this.initChart()
})
certGroupByMajorProvinceLevel().then(res => {
this.dqData=res.data;
let data=this.dqData[0].province;
let list=[];
for(let i=0; i<data.length; i++){
let item={};
item.province=data[i].province;
for (let j=0; j<data[i].levelList.length; j++){
if(data[i].levelList[j].levelValue === '特级'){
item.tjCount=data[i].levelList[j].count;
item.tjRate=data[i].levelList[j].rate;
}
if(data[i].levelList[j].levelValue === '一级'){
item.oneCount=data[i].levelList[j].count;
item.oneRate=data[i].levelList[j].rate;
}
if(data[i].levelList[j].levelValue === '二级'){
item.twoCount=data[i].levelList[j].count;
item.twoRate=data[i].levelList[j].rate;
}
if(data[i].levelList[j].levelValue === '三级'){
item.threeCount=data[i].levelList[j].count;
item.threeRate=data[i].levelList[j].rate;
}
}
list.push(item)
}
this.jzdqData=list
this.initChart1()
})
areaGroupByProvince().then(res => {
this.zbData=res.data;
this.initChart2()
})
},
initChart() { initChart() {
let myChart = echarts.init(document.getElementById("gl-echarts")) let myChart = echarts.init(document.getElementById("gl-echarts"))
let option ={ let option ={
tooltip: { tooltip: {
show:false // show:false
}, },
xAxis: { xAxis: {
type: 'category', type: 'category',
boundaryGap: false, boundaryGap: false,
data: this.jzglData, data: this.jzglData.map(item => item.levelValue),
}, },
yAxis: { yAxis: {
type: 'value', type: 'value',
}, },
grid: { grid: {
top:40, top:40,
left:50, left:70,
right:40, right:40,
bottom:40, bottom:40,
}, },
series: [ series: [
{ {
data: this.jzglData1, data: this.jzglData.map(item => item.count),
type: 'line', type: 'line',
smooth: true, smooth: true,
emphasis: { emphasis: {
...@@ -363,77 +405,192 @@ export default { ...@@ -363,77 +405,192 @@ export default {
}, },
initChart1() { initChart1() {
let myChart = echarts.init(document.getElementById("jzqy-echarts")) let myChart = echarts.init(document.getElementById("jzqy-echarts"))
let option = { let option ={
legend: {
x:'right',
padding:[0,120,0,0],
},
tooltip: { tooltip: {
trigger: 'axis', //坐标轴触发，主要在柱状图，折线图等会使用类目轴的图表中使用 trigger: 'axis',
axisPointer: {// 坐标轴指示器，坐标轴触发有效 axisPointer: {
type: 'shadow' // 默认为直线，可选为：'line' | 'shadow' type: 'line',
label: {
backgroundColor: '#FFFFFF'
}
} }
}, },
grid: {
left: '5',
right: '5',
top: '20',
bottom: '10',
containLabel: true
},
xAxis: { xAxis: {
type: 'category', type: 'category',
data: this.zbData boundaryGap: false,
data: this.jzdqData.map(item => item.province),
}, },
yAxis: { yAxis: {
type: 'value' type: 'value',
},
grid: {
top:35,
left:60,
right:30,
bottom:20,
}, },
series: [ series: [
{ {
data: this.zbData1, data: this.jzdqData.map(item => item.tjCount),
type: 'bar', name:'特级',
itemStyle: { type: 'line',
normal: { smooth: true,
barBorderRadius: [4, 4, 0, 0], emphasis: {
color: '#165DFF', disabled: true,
label: { focus: 'none'
show: true, //开启显示 },
position: 'top', //在上方显示 //设置折线颜色和粗细
textStyle: { //数值样式 lineStyle: {
color: '#165DFF', width: 2,
fontSize: 16 color: "#0081FF",
} },
} itemStyle:{
}, color: "#4E8EFF",
// 移入当前的柱状图时改变颜色 },
emphasis: { //设置面积区域为渐变效果
color: '#3384FF', areaStyle: {
} opacity:0.8,
} color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
} {
offset: 0.2,
color: "#DFEAFF",
},
{
offset: 1,
color: "#5895FF",
},
]),
},
},
{
data: this.jzdqData.map(item => item.oneCount),
name:'一级',
type: 'line',
smooth: true,
emphasis: {
disabled: true,
focus: 'none'
},
//设置折线颜色和粗细
lineStyle: {
width: 2,
color: "#FA6C6C",
},
itemStyle:{
color: "#FA6C6C",
},
//设置面积区域为渐变效果
areaStyle: {
opacity:0.8,
color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
{
offset: 0.1,
color: "#FDF8F5",
},
{
offset: 1,
color: "#FCD7C8",
},
]),
},
},
{
data: this.jzdqData.map(item => item.twoCount),
name:'二级',
type: 'line',
smooth: true,
emphasis: {
disabled: true,
focus: 'none'
},
//设置折线颜色和粗细
lineStyle: {
width: 2,
color: "#8077F2",
},
itemStyle:{
color: "#8077F2",
},
//设置面积区域为渐变效果
areaStyle: {
opacity:0.8,
color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
{
offset: 0.1,
color: "#ECE8FF",
},
{
offset: 1,
color: "#BCC0FF",
},
]),
},
},
{
data: this.jzdqData.map(item => item.threeCount),
name:'三级',
type: 'line',
smooth: true,
emphasis: {
disabled: true,
focus: 'none'
},
//设置折线颜色和粗细
lineStyle: {
width: 2,
color: "#FA936C",
},
itemStyle:{
color: "#FA936C",
},
//设置面积区域为渐变效果
areaStyle: {
opacity:0.8,
color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
{
offset: 0.1,
color: "#FEFBFA",
},
{
offset: 1,
color: "#FCD7C8",
},
]),
},
},
] ]
}; }
myChart.clear();
myChart.setOption(option); myChart.setOption(option);
}, },
initChart2() { initChart2() {
let myChart = echarts.init(document.getElementById("ba-echarts")) let myChart = echarts.init(document.getElementById("ba-echarts"))
let option ={ let option ={
tooltip: { tooltip: {
show:false // show:false
}, },
legend:{},
xAxis: { xAxis: {
type: 'category', type: 'category',
boundaryGap: false, boundaryGap: false,
data: this.zbData, data: this.zbData.map(item => item.province),
}, },
yAxis: { yAxis: {
type: 'value', type: 'value',
}, },
grid: { grid: {
top:20, top:20,
left:30, left:65,
right:20, right:30,
bottom:20, bottom:20,
}, },
series: [ series: [
{ {
data: this.zbData1, data: this.zbData.map(item => item.count),
type: 'line', type: 'line',
smooth: true, smooth: true,
emphasis: { emphasis: {
...@@ -469,11 +626,42 @@ export default { ...@@ -469,11 +626,42 @@ export default {
handleClick(type,index){ handleClick(type,index){
if(type === 1){ if(type === 1){
this.typeIndex=index; this.typeIndex=index;
this.jzglData=this.glData[index].levelList.reverse();
this.initChart()
} }
if(type === 2){ if(type === 2){
this.qydqIndex=index; this.qydqIndex=index;
} let data=this.dqData[index].province;
let list=[];
for(let i=0; i<data.length; i++){
let item={};
item.province=data[i].province;
for (let j=0; j<data[i].levelList.length; j++){
if(data[i].levelList[j].levelValue === '特级'){
item.tjCount=data[i].levelList[j].count;
item.tjRate=data[i].levelList[j].rate;
}
if(data[i].levelList[j].levelValue === '一级'){
item.oneCount=data[i].levelList[j].count;
item.oneRate=data[i].levelList[j].rate;
}
if(data[i].levelList[j].levelValue === '二级'){
item.twoCount=data[i].levelList[j].count;
item.twoRate=data[i].levelList[j].rate;
}
if(data[i].levelList[j].levelValue === '三级'){
item.threeCount=data[i].levelList[j].count;
item.threeRate=data[i].levelList[j].rate;
}
}
list.push(item)
}
this.jzdqData=list;
this.$nextTick(()=>{
this.initChart1()
})
}
}, },
} }
} }
......
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