|
@@ -3,45 +3,62 @@
|
|
|
<el-row :gutter="10" style="margin-left: 0;">
|
|
|
<el-col :sm="24" :lg="24" >
|
|
|
<div class="group_6 flex-col">
|
|
|
- <div class="text-wrapper_2 flex-row">
|
|
|
- <span class="text_104">年度项目数统计</span>
|
|
|
- </div>
|
|
|
+ <div class="block_4 flex-row justify-between" style="justify-content: flex-start;">
|
|
|
+ <span class="text_28">年度项目数统计</span>
|
|
|
+ <div class="image-text_1 flex-row justify-between shouing" style="margin-top: -10px; margin-left: 20px;">
|
|
|
+ <el-date-picker
|
|
|
+ style="width: 100px;"
|
|
|
+ v-model="qurtn.time"
|
|
|
+ @change="zheschann"
|
|
|
+ type="year"
|
|
|
+ value-format="yyyy"
|
|
|
+ placeholder="选择年">
|
|
|
+ </el-date-picker>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
<div class="box_1 flex-row">
|
|
|
<div class="group_7 flex-col"></div>
|
|
|
</div>
|
|
|
<div class="box_2 flex-row">
|
|
|
<div class="group_8 flex-col">
|
|
|
<span class="text_4">本年度项目总数</span>
|
|
|
- <span class="text_5">34</span>
|
|
|
+ <span class="text_5">{{zheixnheyn.yearAll}}</span>
|
|
|
<div class="group_9 flex-row justify-between">
|
|
|
<span class="text_6">较上年</span>
|
|
|
<div class="image-wrapper_8 flex-col align-center">
|
|
|
<img
|
|
|
class="thumbnail_18"
|
|
|
referrerpolicy="no-referrer"
|
|
|
- src="https://lanhu-oss-2537-2.lanhuapp.com/psh6s7tc6zjhamn4h6hvkllcx4bwna60bxlc4d9f05b-3a98-49f5-b7d4-aeca0e46bab4"
|
|
|
+ src="../assets/images/icon_htgl_hp_tjss.png"
|
|
|
+ v-if="zheixnheyn.yearAllPtStatus == 1"
|
|
|
/>
|
|
|
+ <img
|
|
|
+ class="thumbnail_18"
|
|
|
+ referrerpolicy="no-referrer"
|
|
|
+ src="../assets/images/icon_htgl_sjtj_xj.png"
|
|
|
+ v-if="zheixnheyn.yearAllPtStatus == 2"
|
|
|
+ />
|
|
|
</div>
|
|
|
- <span class="text_7">25.9%</span>
|
|
|
+ <span class="text_7">{{zheixnheyn.yearAllPt}}</span>
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
<img
|
|
|
class="image_2"
|
|
|
referrerpolicy="no-referrer"
|
|
|
- src="https://lanhu-oss-2537-2.lanhuapp.com/pszgtvo3hly5hg90g62ravw49z87cy8mxhc1ad2ca7-7667-45e8-b7be-b0205a3958fe"
|
|
|
+ src="../assets/images/pic_xmtj_sx.png"
|
|
|
/>
|
|
|
|
|
|
<div style="display: flex;justify-content: space-between; flex: 1;">
|
|
|
<div class="group_10 flex-col">
|
|
|
<span class="text_8">签约中</span>
|
|
|
<div class="text-wrapper_3 flex-row">
|
|
|
- <span class="text_9">08</span>
|
|
|
- <span class="text_10">/ 34</span>
|
|
|
- <span class="text_11">23.5%</span>
|
|
|
+ <span class="text_9">{{zheixnheyn.qyxxNum}}</span>
|
|
|
+ <span class="text_10">/ {{zheixnheyn.yearAll}}</span>
|
|
|
+ <span class="text_11"> {{zheixnheyn.qyxxNumbfb}} %</span>
|
|
|
</div>
|
|
|
<div style="width: 82%; margin-top: 11px;">
|
|
|
- <el-progress :show-text="false" :percentage="50"></el-progress>
|
|
|
+ <el-progress :show-text="false" :percentage="zheixnheyn.qyxxNumbfb"></el-progress>
|
|
|
</div>
|
|
|
<!-- <img
|
|
|
class="image_3"
|
|
@@ -52,54 +69,46 @@
|
|
|
<div class="group_10 flex-col">
|
|
|
<span class="text_8">开工中</span>
|
|
|
<div class="text-wrapper_4 flex-row">
|
|
|
- <span class="text_9">04</span>
|
|
|
- <span class="text_10">/ 34</span>
|
|
|
- <span class="text_11">11.8%</span>
|
|
|
+ <span class="text_9">{{zheixnheyn.kgxxNum}}</span>
|
|
|
+ <span class="text_10">/ {{zheixnheyn.yearAll}}</span>
|
|
|
+ <span class="text_11">{{zheixnheyn.kgxxNumbfb}} %</span>
|
|
|
</div>
|
|
|
- <img
|
|
|
- class="image_3"
|
|
|
- referrerpolicy="no-referrer"
|
|
|
- src="https://lanhu-oss-2537-2.lanhuapp.com/pssb4m4zeqw4h5jbwwrfp7nj2ixa5gdaa0yde194fd4-9567-4f2f-8874-7607a5e935d6"
|
|
|
- />
|
|
|
+ <div style="width: 82%; margin-top: 11px;">
|
|
|
+ <el-progress color="#99C827" :show-text="false" :percentage="zheixnheyn.kgxxNumbfb"></el-progress>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div class="group_10 flex-col">
|
|
|
<span class="text_8">建设中</span>
|
|
|
<div class="text-wrapper_5 flex-row">
|
|
|
- <span class="text_9">09</span>
|
|
|
- <span class="text_10">/ 34</span>
|
|
|
- <span class="text_11">26.5%</span>
|
|
|
+ <span class="text_9">{{zheixnheyn.jsxxNum}}</span>
|
|
|
+ <span class="text_10">/ {{zheixnheyn.yearAll}}</span>
|
|
|
+ <span class="text_11">{{zheixnheyn.jsxxNumbfb}} %</span>
|
|
|
+ </div>
|
|
|
+ <div style="width: 82%; margin-top: 11px;">
|
|
|
+ <el-progress color="#FFB132" :show-text="false" :percentage="zheixnheyn.jsxxNumbfb"></el-progress>
|
|
|
</div>
|
|
|
- <img
|
|
|
- class="image_3"
|
|
|
- referrerpolicy="no-referrer"
|
|
|
- src="https://lanhu-oss-2537-2.lanhuapp.com/psknfj1q3bf99kr09seuikczoaxwt37bef85bfb26-97b4-43a6-a313-ed142cce88c8"
|
|
|
- />
|
|
|
</div>
|
|
|
<div class="group_10 flex-col">
|
|
|
<span class="text_8">投产中</span>
|
|
|
<div class="text-wrapper_6 flex-row">
|
|
|
- <span class="text_9">06</span>
|
|
|
- <span class="text_10">/ 34</span>
|
|
|
- <span class="text_11">17.6%</span>
|
|
|
+ <span class="text_9">{{zheixnheyn.tcxxNum}}</span>
|
|
|
+ <span class="text_10">/ {{zheixnheyn.yearAll}}</span>
|
|
|
+ <span class="text_11">{{zheixnheyn.tcxxNumbfb}} %</span>
|
|
|
</div>
|
|
|
- <img
|
|
|
- class="image_3"
|
|
|
- referrerpolicy="no-referrer"
|
|
|
- src="https://lanhu-oss-2537-2.lanhuapp.com/psabu0wt2xsxsyhou2a35x5tj4p15q06vjg503ac2d3-c06e-4128-9475-ad08abd0639b"
|
|
|
- />
|
|
|
+ <div style="width: 82%; margin-top: 11px;">
|
|
|
+ <el-progress color="#00A854" :show-text="false" :percentage="zheixnheyn.tcxxNumbfb"></el-progress>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div class="group_10 flex-col">
|
|
|
<span class="text_8">已完成</span>
|
|
|
<div class="text-wrapper_7 flex-row">
|
|
|
- <span class="text_9">07</span>
|
|
|
- <span class="text_10">/ 34</span>
|
|
|
- <span class="text_11">20.6%</span>
|
|
|
+ <span class="text_9">{{zheixnheyn.wcxxNum}}</span>
|
|
|
+ <span class="text_10">/ {{zheixnheyn.yearAll}}</span>
|
|
|
+ <span class="text_11">{{zheixnheyn.wcxxNumbfb}} %</span>
|
|
|
+ </div>
|
|
|
+ <div style="width: 82%; margin-top: 11px;">
|
|
|
+ <el-progress color="#FF6969" :show-text="false" :percentage="zheixnheyn.wcxxNumbfb"></el-progress>
|
|
|
</div>
|
|
|
- <img
|
|
|
- class="image_3"
|
|
|
- referrerpolicy="no-referrer"
|
|
|
- src="https://lanhu-oss-2537-2.lanhuapp.com/ps1xz8q6mzh9rlldlu8h9yyo3burwoqttk8bd30bfb4-8e0b-42ca-8ca2-5a75cc8440bc"
|
|
|
- />
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -108,15 +117,15 @@
|
|
|
<div class="block_3 flex-col">
|
|
|
<div class="block_4 flex-row justify-between">
|
|
|
<span class="text_28">年度投资额统计</span>
|
|
|
- <div class="image-text_1 flex-row justify-between">
|
|
|
- <el-select v-model="value" placeholder="请选择">
|
|
|
- <el-option
|
|
|
- v-for="item in options"
|
|
|
- :key="item.value"
|
|
|
- :label="item.label"
|
|
|
- :value="item.value">
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
+ <div class="image-text_1 flex-row justify-between shouing">
|
|
|
+ <el-date-picker
|
|
|
+ style="width: 100px;"
|
|
|
+ v-model="qurt.time"
|
|
|
+ @change="zheschan"
|
|
|
+ type="year"
|
|
|
+ value-format="yyyy"
|
|
|
+ placeholder="选择年">
|
|
|
+ </el-date-picker>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="block_5 flex-col"></div>
|
|
@@ -126,25 +135,18 @@
|
|
|
</div>
|
|
|
<div style="display: flex; padding-top: 18px;">
|
|
|
<div class="image-text_2 flex-row justify-between">
|
|
|
- <img
|
|
|
- class="thumbnail_20"
|
|
|
- referrerpolicy="no-referrer"
|
|
|
- src="https://lanhu-oss-2537-2.lanhuapp.com/ps54eqexkr545xrxh8jhppxgbo35ci2itxv3753c09a-f585-4a83-acf3-0e73c8902dab"
|
|
|
- />
|
|
|
+
|
|
|
+ <span class="thumbnail_20" style="background-color: #2777D0; border-radius: 50%;"></span>
|
|
|
<span class="text-group_2">总投资额</span>
|
|
|
</div>
|
|
|
<div class="image-text_3 flex-row justify-between">
|
|
|
- <img
|
|
|
- class="thumbnail_21"
|
|
|
- referrerpolicy="no-referrer"
|
|
|
- src="https://lanhu-oss-2537-2.lanhuapp.com/ps0qlzjq3n47btm8imql4pplfaybvey8arab77875e8-430e-47b8-b2bc-73c6b78f8a5a"
|
|
|
- />
|
|
|
+ <span class="thumbnail_21" style="background-color: #1BDD96; border-radius: 50%;"></span>
|
|
|
<span class="text-group_3">固定资产投资额</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div style="margin-top: 10px;">
|
|
|
- <line-chart :chart-data="lineChartData" />
|
|
|
+ <line-chart :chart-data="zheixnhey" v-if="zheshowe" />
|
|
|
</div>
|
|
|
|
|
|
|
|
@@ -154,15 +156,16 @@
|
|
|
<div class="block_3 flex-col">
|
|
|
<div class="block_4 flex-row justify-between">
|
|
|
<span class="text_28">年度产值与税收统计</span>
|
|
|
- <div class="image-text_1 flex-row justify-between">
|
|
|
- <el-select v-model="value" placeholder="请选择">
|
|
|
- <el-option
|
|
|
- v-for="item in options"
|
|
|
- :key="item.value"
|
|
|
- :label="item.label"
|
|
|
- :value="item.value">
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
+ <div class="image-text_1 flex-row justify-between shouing">
|
|
|
+ <el-date-picker
|
|
|
+ style="width: 100px;"
|
|
|
+ v-model="qurtt.time"
|
|
|
+ @change="zheschand"
|
|
|
+ type="year"
|
|
|
+ value-format="yyyy"
|
|
|
+ placeholder="选择年">
|
|
|
+ </el-date-picker>
|
|
|
+
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="block_5 flex-col"></div>
|
|
@@ -171,26 +174,18 @@
|
|
|
<span class="text_29">金额/万元</span>
|
|
|
</div>
|
|
|
<div style="display: flex; padding-top: 18px;">
|
|
|
- <div class="image-text_2 flex-row justify-between">
|
|
|
- <img
|
|
|
- class="thumbnail_20"
|
|
|
- referrerpolicy="no-referrer"
|
|
|
- src="https://lanhu-oss-2537-2.lanhuapp.com/ps54eqexkr545xrxh8jhppxgbo35ci2itxv3753c09a-f585-4a83-acf3-0e73c8902dab"
|
|
|
- />
|
|
|
- <span class="text-group_2">总投资额</span>
|
|
|
+ <div class="image-text_2 flex-row justify-between" style="width: 105px;">
|
|
|
+ <span class="thumbnail_20" style="background-color: #2777D0; border-radius: 50%;"></span>
|
|
|
+ <span class="text-group_2" style="width: 85px;">本年度累计产值</span>
|
|
|
</div>
|
|
|
- <div class="image-text_3 flex-row justify-between">
|
|
|
- <img
|
|
|
- class="thumbnail_21"
|
|
|
- referrerpolicy="no-referrer"
|
|
|
- src="https://lanhu-oss-2537-2.lanhuapp.com/ps0qlzjq3n47btm8imql4pplfaybvey8arab77875e8-430e-47b8-b2bc-73c6b78f8a5a"
|
|
|
- />
|
|
|
- <span class="text-group_3">固定资产投资额</span>
|
|
|
+ <div class="image-text_3 flex-row justify-between" style="width: 135px;">
|
|
|
+ <span class="thumbnail_21" style="background-color: #FFB132; border-radius: 50%;"></span>
|
|
|
+ <span class="text-group_3" style="width: 117px;">本会计年度实缴税收</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div style="margin-top: 10px;">
|
|
|
- <line-chart :chart-data="lineChartData" />
|
|
|
+ <line-chartone v-if="zheshowed" :chart-data="zheixnheyd" />
|
|
|
</div>
|
|
|
|
|
|
|
|
@@ -255,7 +250,9 @@
|
|
|
|
|
|
<script>
|
|
|
import LineChart from './dashboard/LineChart'
|
|
|
+import LineChartone from './dashboard/LineChartone'
|
|
|
import Calendar from 'vue-calendar-component';
|
|
|
+// import {warnManageIndexYear,warnManageIndexYear} from "@/api/index";
|
|
|
const lineChartData = {
|
|
|
newVisitis: {
|
|
|
expectedData: [100, 120, 161, 134, 105, 160, 165],
|
|
@@ -274,10 +271,12 @@ const lineChartData = {
|
|
|
actualData: [120, 82, 91, 154, 162, 140, 130]
|
|
|
}
|
|
|
}
|
|
|
+import {warnManageIndex,warnManageIndexYear,indextj} from "@/api/index";
|
|
|
export default {
|
|
|
name: "Index",
|
|
|
components: {
|
|
|
LineChart,
|
|
|
+ LineChartone,
|
|
|
Calendar
|
|
|
},
|
|
|
data() {
|
|
@@ -301,13 +300,109 @@ export default {
|
|
|
label: '北京烤鸭'
|
|
|
}],
|
|
|
value: '',
|
|
|
- lineChartData: lineChartData.newVisitis
|
|
|
+ qurt:{time:null},
|
|
|
+ qurtt:{time:null},
|
|
|
+ qurtn:{time:null},
|
|
|
+ lineChartData: lineChartData.newVisitis,
|
|
|
+ zheshowe:true,
|
|
|
+ zheshowed:true,
|
|
|
+ getyer:null,
|
|
|
+ zheixnhey:{},
|
|
|
+ zheixnheyd:{},
|
|
|
+ zheixnheyn:{
|
|
|
+ yearAll:0,
|
|
|
+ yearAllPt:null,
|
|
|
+ yearAllPtStatus:1,
|
|
|
+ qyxxNum:0,
|
|
|
+ kgxxNum:0,
|
|
|
+ jsxxNum:0,
|
|
|
+ tcxxNum:0,
|
|
|
+ wcxxNum:0,
|
|
|
+
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
+ created() {
|
|
|
+ this.qurtn.time = this.gettime() +''
|
|
|
+ this.qurt.time = this.gettime()+''
|
|
|
+ this.qurtt.time = this.gettime()+''
|
|
|
+ this.getcharnaecsb(this.gettime())
|
|
|
+ this.getcharnae(this.gettime())
|
|
|
+ this.getcharnaecs(this.gettime())
|
|
|
+ },
|
|
|
methods: {
|
|
|
goTarget(href) {
|
|
|
window.open(href, "_blank")
|
|
|
},
|
|
|
+ // 百分比统计
|
|
|
+ zheschann(){
|
|
|
+ this.getcharnaecsb(this.qurtn.time)
|
|
|
+ },
|
|
|
+ // 折线时间切换
|
|
|
+ zheschan(){
|
|
|
+ console.log(this.qurt)
|
|
|
+ this.getcharnae(this.qurt.time)
|
|
|
+ },
|
|
|
+ // 多统计图
|
|
|
+ zheschand(){
|
|
|
+ console.log(this.qurtt)
|
|
|
+ this.getcharnaecs(this.qurtt.time)
|
|
|
+ },
|
|
|
+ // 百分比
|
|
|
+ getcharnaecsb(row){
|
|
|
+ indextj(row).then(response => {
|
|
|
+ this.zheixnheyn = response.data;
|
|
|
+ this.zheixnheyn.qyxxNumbfb = ((this.zheixnheyn.qyxxNum/this.zheixnheyn.yearAll).toFixed(2)) * 100
|
|
|
+ this.zheixnheyn.kgxxNumbfb = ((this.zheixnheyn.kgxxNum/this.zheixnheyn.yearAll).toFixed(2)) * 100
|
|
|
+ this.zheixnheyn.jsxxNumbfb = ((this.zheixnheyn.jsxxNum/this.zheixnheyn.yearAll).toFixed(2)) * 100
|
|
|
+ this.zheixnheyn.tcxxNumbfb = ((this.zheixnheyn.tcxxNum/this.zheixnheyn.yearAll).toFixed(2)) * 100
|
|
|
+ this.zheixnheyn.wcxxNumbfb = ((this.zheixnheyn.wcxxNum/this.zheixnheyn.yearAll).toFixed(2)) * 100
|
|
|
+
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 折线
|
|
|
+ getcharnae(row){
|
|
|
+ this.zheshowe = false
|
|
|
+ warnManageIndexYear(row).then(response => {
|
|
|
+ this.zheixnhey = response.data;
|
|
|
+ this.zheshowe = true
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 多图
|
|
|
+ getcharnaecs(row){
|
|
|
+ this.zheshowed = false
|
|
|
+ warnManageIndex(row).then(response => {
|
|
|
+ this.zheixnheyd = response.data;
|
|
|
+ this.zheshowed = true
|
|
|
+ });
|
|
|
+ },
|
|
|
+ gettime() {
|
|
|
+ var _this = this;
|
|
|
+ let wk = new Date().getDay()
|
|
|
+ let yy = new Date().getFullYear();
|
|
|
+ let mm = new Date().getMonth() + 1;
|
|
|
+ if(mm < 10){
|
|
|
+ mm = '0'+mm
|
|
|
+ }
|
|
|
+ let dd = new Date().getDate();
|
|
|
+ if(dd < 10){
|
|
|
+ dd = '0'+dd
|
|
|
+ }
|
|
|
+ let hh = new Date().getHours() < 10 ? '0' + new Date().getHours() : new Date().getHours();
|
|
|
+ let mf = new Date().getMinutes() < 10 ? '0' + new Date().getMinutes() : new Date().getMinutes();
|
|
|
+ let ss = new Date().getSeconds() < 10 ? '0' + new Date().getSeconds() : new Date().getSeconds();
|
|
|
+ let weeks = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']
|
|
|
+ let week = weeks[wk]
|
|
|
+ _this.getyer = yy;
|
|
|
+
|
|
|
+ return yy
|
|
|
+ // _this.getyer = yy;
|
|
|
+ // _this.getmor = mm;
|
|
|
+ // _this.getday = dd;
|
|
|
+ // _this.getshifL = hh + ':' + mf;
|
|
|
+ // _this.getweek = week;
|
|
|
+ // console.log(this.gettime)
|
|
|
+ },
|
|
|
clickDay(data) {
|
|
|
console.log(data); //选中某天
|
|
|
},
|
|
@@ -322,6 +417,11 @@ export default {
|
|
|
}
|
|
|
</script>
|
|
|
<style lang="scss">
|
|
|
+ .shouing{
|
|
|
+ .el-input--medium .el-input__inner{
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+ }
|
|
|
.nsrilsur{
|
|
|
.wh_content_all{
|
|
|
background-color: #F7F9FF;
|