Skip to content

D
dsk-cr20g
Commit 4203a4ad authored by danfuman's avatar danfuman
Browse files
Options

修改

parent 7279829a
Hide whitespace changes
Inline Side-by-side
Showing with 526 additions and 113 deletions
dsk-operate-ui/src/assets/styles/index.scss
View file @ 4203a4ad
...@@ -272,6 +272,10 @@ ul, li { ...@@ -272,6 +272,10 @@ ul, li {
.el-table{ .el-table{
font-size: 12px; font-size: 12px;
color: #232323; color: #232323;
th{
font-size: 12px !important;
font-weight: 400 !important;
}
.cell{ .cell{
padding-right: 12px !important; padding-right: 12px !important;
padding-left: 12px !important; padding-left: 12px !important;
...@@ -298,6 +302,14 @@ ul, li { ...@@ -298,6 +302,14 @@ ul, li {
text-align: left; text-align: left;
} }
} }
.el-table__fixed-header-wrapper{
th{
background: #F0F3FA;
}
}
.caret-wrapper{
width: 10px;
}
.el-table__body-wrapper{ .el-table__body-wrapper{
&::-webkit-scrollbar { &::-webkit-scrollbar {
width: 16px; //竖轴宽度 width: 16px; //竖轴宽度
......
dsk-operate-ui/src/router/index.js
View file @ 4203a4ad
...@@ -112,12 +112,13 @@ export const constantRoutes = [ ...@@ -112,12 +112,13 @@ export const constantRoutes = [
path: '/financing', path: '/financing',
component: Layout, component: Layout,
hidden: true, hidden: true,
redirect: 'noredirect',
children: [ children: [
{ {
path: '/macro/financing/details/:id(\\d+)', path: '/macro/financing/details/:id(\\d+)',
component: () => import('@/views/macro/financing/details'), component: () => import('@/views/macro/financing/details'),
name: 'financingDetails', name: 'financingDetails',
meta: { title: '区域专项债详情' } meta: { title: '区域专项债详情', icon: 'user' }
} }
] ]
} }
......
dsk-operate-ui/src/views/macro/economies/component/industrialStructure.vue
View file @ 4203a4ad
<template> <template>
<div class="regionalEconomy"> <div class="regionalEconomy">
产业结构 <div class="flex-box query-box">
<div class="flex-box query-params">
<span class="common-title">主要指标</span>
</div>
<div class="flex-box query-ability">
<span class="flex-box"><img src="@/assets/images/ability_excel.png">导出EXCEL</span>
</div>
</div>
<div class="content">
<div class="content-left">
<div id="echarts" style="height: 400px"></div>
</div>
<div class="content-right">
<el-table
v-loading="tableLoading"
:data="tableData"
border
highlight-current-row
>
<el-table-column label="序号" width="60" align="left">
<template slot-scope="scope">{{ pageIndex * pageSize - pageSize + scope.$index + 1 }}</template>
</el-table-column>
<el-table-column label="产业类型" prop="type" width="200"></el-table-column>
<el-table-column label="2022年">
<el-table-column prop="je" label="金额（亿元）" sortable width="150"> </el-table-column>
<el-table-column prop="zb" label="占比" sortable width="100"> </el-table-column>
</el-table-column>
<el-table-column label="2021年">
<el-table-column prop="province" label="金额（亿元）" sortable width="150"> </el-table-column>
<el-table-column prop="province" label="占比" sortable width="100"> </el-table-column>
</el-table-column>
</el-table>
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
import * as echarts from 'echarts';
export default { export default {
name: 'industrialStructure', name: 'industrialStructure',
data() { data() {
return { return {
activeName: 'first' tableData:[
{
type:'直接控股',
je:'29,175.61',
zb:'26%'
}
],
tableLoading: false,
pageIndex: 1,
pageSize: 10,
tableDataTotal: 0,
data:[
{
name: '房建工程',
value: 11
},
{
name: '市政工程',
value: 22
},
{
name: '公路工程',
value: 33
}
]
} }
}, },
created() { created() {
this.$nextTick(()=>{
this.initChart()
})
}, },
methods: { methods: {
handleClick() { handleClick() {
},
initChart() {
let myChart = echarts.init(document.getElementById("echarts"))
let option ={
label: {
formatter: function (info) {
var value = info.value
var treePathInfo = info.treePathInfo
var treePath = []
for (var i = 1; i < treePathInfo.length; i++) {
treePath.push(treePathInfo[i].name)
}
let arr=[treePath[0]]
arr.push(value)
return arr.join('\n');
},
},
//鼠标悬停时显示的样式
tooltip: {
extraCssText:'width:100px!important;',
formatter: function (params){
var result = ''
result+='<p style="color: rgba(35,35,35,0.8);padding: 0;margin: 0;">'+ params.name +'</p>'
result+='<p style="color: rgba(35,35,35,0.8);padding: 0;margin: 0;">'+ params.value +'</p>'
return result
},
},
legend: {
data: this.data,
},
series: [
{
type: 'treemap',
data: this.data
}
]
}
myChart.setOption(option);
} }
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.app-container{ .regionalEconomy{
padding: 0; width: 100%;
} background: #ffffff;
.eco-header{ padding: 16px;
justify-content: space-between; margin-top: 12px;
height: 48px;
background: #FFFFFF;
border-radius: 4px; border-radius: 4px;
padding:0 16px; .el-form{
color: #232323; margin-left: 24px;
::v-deep .el-tabs{ .el-form-item{
height: 48px; margin: 0 !important;
line-height: 48px; .form-content-width{
.el-tabs__nav-wrap::after { width: 100px;
position: static !important;
}
.el-tabs__header{
margin: 0;
.el-tabs__item{
padding: 0 16px;
font-size: 16px;
}
.is-active{
font-weight: bold;
} }
} }
} }
.location{ .content{
font-size: 14px; margin-top: 22px;
color: #0081FF; display: flex;
i{ justify-content: space-between;
margin-right: 6px; .content-left{
font-size: 16px; width: 50%;
} }
} }
} }
......
dsk-operate-ui/src/views/macro/economies/component/localEconomy.vue
View file @ 4203a4ad
<template> <template>
<div class="regionalEconomy"> <div class="regionalEconomy">
辖区经济 <div class="content">
<div class="flex-box query-box">
<div class="flex-box query-params">
<span class="common-title">经济数据</span>
<el-form ref="queryForm" :model="queryParams" :inline="true" size="small">
<el-form-item prop="year">
<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-select>
</el-form-item>
</el-form>
</div>
<div class="flex-box query-ability">
<span class="flex-box"><img src="@/assets/images/ability_excel.png">导出EXCEL</span>
</div>
</div>
<div class="table-item">
<el-table
v-loading="tableLoading"
:data="tableData"
border
highlight-current-row
>
<el-table-column prop="area" label="下辖区" width="100" />
<el-table-column prop="tz" label="GDP（亿元）" sortable width="120" />
<el-table-column prop="tz" label="GDP增速" sortable width="100" />
<el-table-column prop="tz" label="人均GDP（元）" sortable width="130" />
<el-table-column prop="tz" label="人口（万人）" sortable width="120" />
<el-table-column prop="tz" label="固定资产投资 （亿元） " sortable width="170" />
<el-table-column prop="tz" label="一般公共预算收入（亿元）" sortable width="160" />
<el-table-column prop="tz" label="一般公共预算支持（亿 元）" sortable width="160" />
<el-table-column prop="tz" label="政府性基金收入（亿元）" sortable width="160" />
<el-table-column prop="zxzzj" label="地方政府债务余额（亿元）" sortable width="160" />
<el-table-column prop="zxzzj" label="城投平台有息债务（亿元）" sortable width="160" />
<el-table-column prop="zxzzj" label="财政自给率" sortable width="120"/>
<el-table-column prop="zxzzj" label="债务率-宽口径" sortable width="130"/>
</el-table>
</div>
</div>
</div> </div>
</template> </template>
...@@ -9,7 +48,27 @@ export default { ...@@ -9,7 +48,27 @@ export default {
name: 'localEconomy', name: 'localEconomy',
data() { data() {
return { return {
activeName: 'first' queryParams: {
year: '',
address: ''
},
yearOptions: [
{ name: '2023年', value: '2023' },
{ name: '2022年', value: '2022' },
{ name: '2021年', value: '2021' },
],
tableData:[
{
dataId:'1',
area:'重庆',
tz:'100',
zxzzj:'200'
}
],
tableLoading: false,
pageIndex: 1,
pageSize: 10,
tableDataTotal: 0
} }
}, },
created() { created() {
...@@ -23,40 +82,26 @@ export default { ...@@ -23,40 +82,26 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.app-container{ .regionalEconomy{
padding: 0; .el-form{
} margin-left: 24px;
.eco-header{ .el-form-item{
justify-content: space-between; margin: 0 !important;
height: 48px; .form-content-width{
background: #FFFFFF; width: 100px;
border-radius: 4px;
padding:0 16px;
color: #232323;
::v-deep .el-tabs{
height: 48px;
line-height: 48px;
.el-tabs__nav-wrap::after {
position: static !important;
}
.el-tabs__header{
margin: 0;
.el-tabs__item{
padding: 0 16px;
font-size: 16px;
}
.is-active{
font-weight: bold;
} }
} }
} }
.location{ .content{
font-size: 14px; width: 100%;
color: #0081FF; background: #ffffff;
i{ padding: 16px;
margin-right: 6px; margin-top: 12px;
font-size: 16px; border-radius: 4px;
} }
.table-item{
margin-top: 22px;
} }
} }
</style> </style>
dsk-operate-ui/src/views/macro/economies/component/regionalEconomy.vue
View file @ 4203a4ad
<template> <template>
<div class="regionalEconomy"> <div class="regionalEconomy">
地区经济 <div class="content content1">
<div class="common-title">经济数据</div>
<div class="content-box">
<div>2022年GDP</div>
<div>2022年GDP增速</div>
<div>2022年人口</div>
<div>2022年一般公共预算收入</div>
<div>2000年地方政府债务余额</div>
</div>
</div>
<div class="content content2">
<div class="common-title">经济信息</div>
<div class="content-box">
<span><img src="@/assets/images/economies/icon_1.png">下属辖区 <label>38</label><i>个</i></span>
<span><img src="@/assets/images/economies/icon_2.png">地方债余额 <label>10,567.32</label><i>亿</i></span>
<span><img src="@/assets/images/economies/icon_3.png">专项债项目 <label>10</label><i>个</i></span>
<span><img src="@/assets/images/economies/icon_4.png">城投平台有息债务 <label>17,710.19</label><i>亿</i></span>
</div>
</div>
<div class="content content3">
<div class="flex-box query-box">
<div class="flex-box query-params">
<span class="common-title">主要指标</span>
</div>
<div class="flex-box query-ability">
<span class="flex-box"><img src="@/assets/images/ability_vs.png">地区经济对比</span>
<span class="flex-box"><img src="@/assets/images/ability_excel.png">导出EXCEL</span>
</div>
</div>
<div class="table-item">
<el-table
:data="getValues"
:show-header="false"
border
>
<el-table-column
v-for="(item, index) in getHeaders"
:key="index"
:prop="item"
>
</el-table-column>
</el-table>
</div>
</div>
</div> </div>
</template> </template>
...@@ -9,11 +52,211 @@ export default { ...@@ -9,11 +52,211 @@ export default {
name: 'regionalEconomy', name: 'regionalEconomy',
data() { data() {
return { return {
activeName: 'first' activeName: 'first',
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: [
{
prop: 'zb',
label: '指标',
},
{
prop: 'name',
label: '经济',
},
{
prop: 'gdp',
label: 'GDP（亿元）',
},
{
prop: 'gdpzs',
label: 'GDP增速',
},
{
prop: 'rjgdp',
label: '人均GDP（元）',
},
{
prop: 'rjgdp',
label: '第一产业增加值（亿元）',
},
{
prop: 'rjgdp',
label: '第二产业增加值（亿元）',
},
{
prop: 'rjgdp',
label: '第三产业增加值（亿元）',
},
{
prop: 'rjgdp',
label: '人口（万人）',
},
{
prop: 'rjgdp',
label: '工业增加值（亿元）',
},
{
prop: 'rjgdp',
label: '工业总产值（亿元）',
},
{
prop: 'rjgdp',
label: '房地产开发投资（亿元）',
},
{
prop: 'rjgdp',
label: '进出口总额（亿美元）',
},
{
prop: 'rjgdp',
label: '社会消费品零售总额（亿元）',
},
{
prop: 'rjgdp',
label: '城镇居民人均可支配收入（元）',
},
{
prop: 'cz',
label: '财政',
},
{
prop: 'rjgdp',
label: '一般公共预算收入（亿元）',
},
{
prop: 'rjgdp',
label: '般公共预算收入增速',
},
{
prop: 'rjgdp',
label: '税收收入（亿元）',
},
{
prop: 'rjgdp',
label: '转移性收入（亿元）',
},
{
prop: 'rjgdp',
label: '上级补助收入（亿元）',
},
{
prop: 'rjgdp',
label: '一般公共预算支出（亿元）',
},
{
prop: 'rjgdp',
label: '政府性基金收入（亿元）',
},
{
prop: 'rjgdp',
label: '土地出让收入（亿元）',
},
{
prop: 'rjgdp',
label: '政府性基金支出（亿元）',
},
{
prop: 'rjgdp',
label: '国有资本经营收入（亿元）',
},
{
prop: 'rjgdp',
label: '国有资本经营支出（亿元）',
},
{
prop: 'zw',
label: '债务',
},
{
prop: 'rjgdp',
label: '地方政府债务余额（亿元）',
},
{
prop: 'rjgdp',
label: '一般债余额（亿元）',
},
{
prop: 'rjgdp',
label: '专项债余额（亿元）',
},
{
prop: 'rjgdp',
label: '地方政府债务限额（亿元）',
},
{
prop: 'rjgdp',
label: '城投平台有息债务（亿元）',
},
{
prop: 'rjgdp',
label: '财政自给率',
},
{
prop: 'rjgdp',
label: '负债率',
},
{
prop: 'rjgdp',
label: '负债率-宽口径',
},
{
prop: 'rjgdp',
label: '债务率',
},
{
prop: 'rjgdp',
label: '债务率-宽口径',
},
],
tableLoading: false,
pageIndex: 1,
pageSize: 10,
tableDataTotal: 0
} }
}, },
created() { created() {
}, },
computed: {
getHeaders() {
return this.tableData.reduce((pre, cur, index) => pre.concat(`value${index}`), ['title'])
},
getValues() {
return this.headers.map(item => {
return this.tableData.reduce((pre, cur, index) => Object.assign(pre, {['value' + index]: cur[item.prop]}), {'title': item.label,});
});
}
},
methods: { methods: {
handleClick() { handleClick() {
...@@ -23,40 +266,61 @@ export default { ...@@ -23,40 +266,61 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.app-container{ .regionalEconomy{
padding: 0; .content{
} width: 100%;
.eco-header{ background: #ffffff;
justify-content: space-between; padding: 16px;
height: 48px; margin-top: 12px;
background: #FFFFFF; border-radius: 4px;
border-radius: 4px; }
padding:0 16px; .content1{
color: #232323; .content-box{
::v-deep .el-tabs{ margin-top: 22px;
height: 48px; display: flex;
line-height: 48px; justify-content: space-between;
.el-tabs__nav-wrap::after { div{
position: static !important; width: 19%;
}
} }
.el-tabs__header{ }
margin: 0; .content2{
.el-tabs__item{ .content-box{
padding: 0 16px; margin-top: 18px;
font-size: 16px; span{
border-right: 1px solid #E4E4E4;
display: inline-block;
color: rgba(35,35,35,0.8);
font-size: 12px;
padding-left: 16px;
img{
width: 12px;
height: 12px;
margin-right: 4px;
}
label{
font-weight: 700;
color: #232323;
font-size: 20px;
margin-left: 12px;
}
i{
color: #232323;
margin-right: 16px;
font-style: normal;
margin-left: 4px;
}
} }
.is-active{ span:last-child{
font-weight: bold; border-right: 0;
}
span:first-child{
padding-left: 0;
} }
} }
} }
.location{ .table-item{
font-size: 14px; margin-top: 22px;
color: #0081FF;
i{
margin-right: 6px;
font-size: 16px;
}
} }
} }
</style> </style>
dsk-operate-ui/src/views/macro/economies/index.vue
View file @ 4203a4ad
...@@ -2,21 +2,17 @@ ...@@ -2,21 +2,17 @@
<div class="app-container"> <div class="app-container">
<div class="flex-box eco-header"> <div class="flex-box eco-header">
<el-tabs v-model="activeName" @tab-click="handleClick"> <el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="地区经济" name="first"> <el-tab-pane label="地区经济" name="first"></el-tab-pane>
<RegionalEconomy></RegionalEconomy> <el-tab-pane label="辖区经济" name="second"></el-tab-pane>
</el-tab-pane> <el-tab-pane label="地区经济对比" name="third"></el-tab-pane>
<el-tab-pane label="辖区经济" name="second"> <el-tab-pane label="产业结构" name="four"></el-tab-pane>
<LocalEconomy></LocalEconomy>
</el-tab-pane>
<el-tab-pane label="地区经济对比" name="third">
<Comparison></Comparison>
</el-tab-pane>
<el-tab-pane label="产业结构" name="four">
<IndustrialStructure></IndustrialStructure>
</el-tab-pane>
</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>
<LocalEconomy v-if="activeName === 'second'"></LocalEconomy>
<Comparison v-if="activeName === 'third'"></Comparison>
<IndustrialStructure v-if="activeName === 'four'"></IndustrialStructure>
</div> </div>
</template> </template>
...@@ -39,10 +35,14 @@ export default { ...@@ -39,10 +35,14 @@ export default {
} }
}, },
created() { created() {
let name = sessionStorage.getItem('currentTab')
if (name != "undefined" && name){
this.activeName = name;
}
}, },
methods: { methods: {
handleClick() { handleClick() {
sessionStorage.setItem('currentTab', this.activeName)
} }
} }
} }
...@@ -75,6 +75,9 @@ export default { ...@@ -75,6 +75,9 @@ export default {
font-weight: bold; font-weight: bold;
} }
} }
.el-tabs__content{
width: 100%;
}
} }
.location{ .location{
font-size: 14px; font-size: 14px;
......
dsk-operate-ui/src/views/macro/financing/details.vue
View file @ 4203a4ad
<template> <template>
<div class="app-container qyzx-details"> <div class="app-container qyzx-details">
<p class="tab">区域专项债 <span>/ 专项债项目详情{{id}}</span></p> <p class="tab">区域专项债 <span>/ 专项债项目详情</span></p>
<div class="content main1"> <div class="content main1">
<div class="title"><img src="@/assets/images/financing/head_icon.png" />重庆至黔江高速铁路项目一项目详情</div> <div class="title"><img src="@/assets/images/financing/head_icon.png" />重庆至黔江高速铁路项目一项目详情</div>
<p>本项目是厦渝高铁通道的重要组成部分，是成渝地区、海西经济区间高速客运交流的主通道;是成渝地区与华南、华东地区间客运交流的辅助通道;是以重庆主城为核心的城际客流的快速客运通道; <p>本项目是厦渝高铁通道的重要组成部分，是成渝地区、海西经济区间高速客运交流的主通道;是成渝地区与华南、华东地区间客运交流的辅助通道;是以重庆主城为核心的城际客流的快速客运通道;
...@@ -180,6 +180,7 @@ export default { ...@@ -180,6 +180,7 @@ export default {
margin-top: 16px; margin-top: 16px;
background: #FFFFFF; background: #FFFFFF;
padding: 16px; padding: 16px;
border-radius: 4px;
} }
.common-title{ .common-title{
margin-bottom: 8px; margin-bottom: 8px;
......
dsk-operate-ui/src/views/macro/financing/index.vue
View file @ 4203a4ad
...@@ -229,6 +229,7 @@ export default { ...@@ -229,6 +229,7 @@ export default {
background: #ffffff; background: #ffffff;
padding: 16px; padding: 16px;
margin-bottom: 16px; margin-bottom: 16px;
border-radius: 4px;
} }
.common-title{ .common-title{
justify-content: space-between; justify-content: space-between;
......
dsk-operate-ui/src/views/macro/nationalEconomies/index.vue
View file @ 4203a4ad
...@@ -290,6 +290,8 @@ export default { ...@@ -290,6 +290,8 @@ export default {
} }
.nationalEconomies{ .nationalEconomies{
background: #ffffff;
border-radius: 4px;
.table-item{ .table-item{
::v-deep .el-table{ ::v-deep .el-table{
th{ th{
...@@ -299,9 +301,6 @@ export default { ...@@ -299,9 +301,6 @@ export default {
.el-table__fixed-header-wrapper th{ .el-table__fixed-header-wrapper th{
background: #F0F3FA; background: #F0F3FA;
} }
.cell{
position: relative;
}
.caret-wrapper{ .caret-wrapper{
width: 10px; width: 10px;
/*<!--position: absolute;-->*/ /*<!--position: absolute;-->*/
......
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