@@ -45,7 +45,9 @@ export default { | |||||
}; | }; | ||||
}, | }, | ||||
mounted () { | mounted () { | ||||
this.initChart(); | |||||
setTimeout(()=>{ | |||||
this.initChart(); | |||||
},2000) | |||||
}, | }, | ||||
computed: { | computed: { | ||||
}, | }, | ||||
@@ -66,10 +68,14 @@ export default { | |||||
chartSetOption () { | chartSetOption () { | ||||
let xAxisData = []; | let xAxisData = []; | ||||
let data = []; | let data = []; | ||||
let max = []; | |||||
this.data.forEach(item => { | this.data.forEach(item => { | ||||
xAxisData.push(item.name) | xAxisData.push(item.name) | ||||
data.push(item.value) | data.push(item.value) | ||||
}); | }); | ||||
data.forEach(item => { | |||||
max.push(Math.max(...data)) | |||||
}); | |||||
const CubeLeft = echarts.graphic.extendShape({ | const CubeLeft = echarts.graphic.extendShape({ | ||||
shape: { | shape: { | ||||
x: 0, | x: 0, | ||||
@@ -129,12 +135,8 @@ export default { | |||||
echarts.graphic.registerShape("CubeLeft", CubeLeft); | echarts.graphic.registerShape("CubeLeft", CubeLeft); | ||||
echarts.graphic.registerShape("CubeRight", CubeRight); | echarts.graphic.registerShape("CubeRight", CubeRight); | ||||
echarts.graphic.registerShape("CubeTop", CubeTop); | echarts.graphic.registerShape("CubeTop", CubeTop); | ||||
const MAX = [ | |||||
500, 500, 500, 500, 500, 500, 500, 500, 500, 500, 500, 500, | |||||
]; | |||||
const VALUE = [ | |||||
201, 123, 379, 234, 165, 123, 379, 234, 165, 379, 234, 165, | |||||
]; | |||||
const MAX = max; | |||||
const VALUE = data; | |||||
const option = { | const option = { | ||||
// backgroundColor: "#010d3a", | // backgroundColor: "#010d3a", | ||||
title: { | title: { | ||||
@@ -170,15 +172,7 @@ export default { | |||||
}, | }, | ||||
type: "category", | type: "category", | ||||
gridIndex: 0, | gridIndex: 0, | ||||
data: [ | |||||
"A镇", | |||||
"A镇", | |||||
"A镇", | |||||
"A镇", | |||||
"A镇", | |||||
"A镇", | |||||
"A镇" | |||||
], | |||||
data: xAxisData, | |||||
axisTick: { | axisTick: { | ||||
alignWithLabel: true, | alignWithLabel: true, | ||||
}, | }, | ||||
@@ -46,7 +46,7 @@ export default { | |||||
mounted () { | mounted () { | ||||
setTimeout(()=>{ | setTimeout(()=>{ | ||||
this.initChart(); | this.initChart(); | ||||
},1000) | |||||
},2000) | |||||
}, | }, | ||||
computed: { | computed: { | ||||
}, | }, | ||||
@@ -14,6 +14,10 @@ export default { | |||||
type: String, | type: String, | ||||
default: "总债务" | default: "总债务" | ||||
}, | }, | ||||
showTit: { | |||||
type: Boolean, | |||||
default: true | |||||
}, | |||||
data: { | data: { | ||||
type: Array, | type: Array, | ||||
default: function () { | default: function () { | ||||
@@ -48,7 +52,9 @@ export default { | |||||
}; | }; | ||||
}, | }, | ||||
mounted () { | mounted () { | ||||
this.initChart(); | |||||
setTimeout(()=>{ | |||||
this.initChart(); | |||||
},2000) | |||||
}, | }, | ||||
computed: { | computed: { | ||||
}, | }, | ||||
@@ -71,6 +77,8 @@ export default { | |||||
var echartData = [ | var echartData = [ | ||||
...this.data | ...this.data | ||||
]; | ]; | ||||
var that = this; | |||||
console.log(echartData) | |||||
var rich = { | var rich = { | ||||
yellow: { | yellow: { | ||||
color: "rgba(185, 211, 235, 1)", | color: "rgba(185, 211, 235, 1)", | ||||
@@ -102,9 +110,13 @@ export default { | |||||
}, | }, | ||||
}; | }; | ||||
const option = { | const option = { | ||||
tooltip: { | |||||
trigger: "item" | |||||
}, | |||||
title: [ | title: [ | ||||
{ | { | ||||
text: this.title, | text: this.title, | ||||
show: this.showTit, | |||||
left: "center", | left: "center", | ||||
top: "40%", | top: "40%", | ||||
padding: [0, 0], | padding: [0, 0], | ||||
@@ -116,6 +128,7 @@ export default { | |||||
}, | }, | ||||
{ | { | ||||
text: this.titleNum, | text: this.titleNum, | ||||
show: this.showTit, | |||||
left: "center", | left: "center", | ||||
top: "50%", | top: "50%", | ||||
padding: [0, 0], | padding: [0, 0], | ||||
@@ -132,7 +145,7 @@ export default { | |||||
type: "pie", | type: "pie", | ||||
radius: ["48%", "70%"], | radius: ["48%", "70%"], | ||||
color: ["rgba(15, 252, 252, 1)", "rgba(134, 91, 252, 1)", "rgba(49, 129, 246, 1)", "rgba(29, 197, 104, 1)"], | |||||
color: ["rgba(15, 252, 252, 1)", "rgba(134, 91, 252, 1)", "rgba(49, 129, 246, 1)", "rgba(29, 197, 104, 1)","#ffc72b"], | |||||
label: { | label: { | ||||
normal: { | normal: { | ||||
formatter: function (params, ticket, callback) { | formatter: function (params, ticket, callback) { | ||||
@@ -143,12 +156,9 @@ export default { | |||||
}); | }); | ||||
percent = ((params.value / total) * 100).toFixed(1); | percent = ((params.value / total) * 100).toFixed(1); | ||||
return ( | return ( | ||||
"{white|" + | |||||
percent + "%" + | |||||
"}\n{blue|" + | |||||
params.name + | |||||
"}\n{hr|}\n{yellow|" + | |||||
params.value + params.data.unit + '}' | |||||
"{white|" + percent + "%" + "}\n" + | |||||
"{blue|" + params.name + "}\n" + | |||||
(that.showTit ? "{hr|}\n{yellow|" + params.value + params.data.unit + '}':'') | |||||
); | ); | ||||
}, | }, | ||||
rich: rich, | rich: rich, | ||||
@@ -1,7 +1,7 @@ | |||||
<div class="pannel" :style="style" :class="[bkClass]"> | <div class="pannel" :style="style" :class="[bkClass]"> | ||||
<div class="header_box"> | <div class="header_box"> | ||||
<div class="header row align_item_center"> | |||||
<div class="header row"> | |||||
<div v-if="title" class="title_bk"> | <div v-if="title" class="title_bk"> | ||||
<!-- <i class="icon"></i>--> | <!-- <i class="icon"></i>--> | ||||
<p>{{title}}</p> | <p>{{title}}</p> | ||||
@@ -33,8 +33,9 @@ | |||||
margin-top: 2px; | margin-top: 2px; | ||||
height: 45px; | height: 45px; | ||||
background: #01142c url("header_bg.png") no-repeat -8px center; | background: #01142c url("header_bg.png") no-repeat -8px center; | ||||
background-size: 102% auto; | |||||
background-size: auto auto; | |||||
justify-content: space-between; | justify-content: space-between; | ||||
align-items: baseline; | |||||
.title_bk { | .title_bk { | ||||
// font-style: italic; | // font-style: italic; | ||||
@@ -18,7 +18,7 @@ export default [ | |||||
], | ], | ||||
[ | [ | ||||
{ | { | ||||
icon: require('./2.png'), | |||||
icon: require('./4.png'), | |||||
path: '/sanqing', | path: '/sanqing', | ||||
name: '三清五治一张图' | name: '三清五治一张图' | ||||
} | } | ||||
@@ -49,16 +49,4 @@ | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
<div> | |||||
<div class="flex_main_right"> | |||||
<p>{{data.xy23}}<span>万元</span></p> | |||||
<p>2023年盘活效益</p> | |||||
</div> | |||||
<div class="flex_main_right"> | |||||
<p>{{data.xy24}}<span>万元</span></p> | |||||
<p>2024年盘活效益</p> | |||||
</div> | |||||
</div> | |||||
</div> | </div> |
@@ -5,9 +5,9 @@ export default { | |||||
}, | }, | ||||
props: { | props: { | ||||
data: { | data: { | ||||
type: Array, | |||||
type: Object, | |||||
default: function () { | default: function () { | ||||
return [] | |||||
return {} | |||||
} | } | ||||
} | } | ||||
}, | }, | ||||
@@ -1,7 +1,11 @@ | |||||
.buttom2 { | .buttom2 { | ||||
width: 960px; | |||||
width: 220px; | |||||
display: flex; | display: flex; | ||||
justify-content: space-between; | justify-content: space-between; | ||||
position: absolute; | |||||
top: 100px; | |||||
left: 460px; | |||||
z-index: 2; | |||||
.flex_main{ | .flex_main{ | ||||
background: url("bg.png") no-repeat 10px center; | background: url("bg.png") no-repeat 10px center; | ||||
background-size: calc(100% - 10px) 100%; | background-size: calc(100% - 10px) 100%; | ||||
@@ -0,0 +1,34 @@ | |||||
export default [ | |||||
[ | |||||
{ | |||||
show: true, | |||||
name: '农用地(亩)', | |||||
value: '716' | |||||
}, | |||||
{ | |||||
show: true, | |||||
name: '建设用地(亩)', | |||||
value: '716' | |||||
}, | |||||
{ | |||||
show: true, | |||||
name: '未利用地(亩)', | |||||
value: '716' | |||||
}, | |||||
{ | |||||
show: true, | |||||
name: '农用地(宗)', | |||||
value: '716' | |||||
}, | |||||
{ | |||||
show: true, | |||||
name: '建设用地(宗)', | |||||
value: '716' | |||||
}, | |||||
{ | |||||
show: true, | |||||
name: '未利用地(宗)', | |||||
value: '103' | |||||
} | |||||
] | |||||
] |
@@ -0,0 +1,13 @@ | |||||
<div class="buttom2"> | |||||
<div> | |||||
<div class="flex_main_right"> | |||||
<p>{{data.xy23}}<span>万元</span></p> | |||||
<p>2023年盘活效益</p> | |||||
</div> | |||||
<div class="flex_main_right"> | |||||
<p>{{data.xy24}}<span>万元</span></p> | |||||
<p>2024年盘活效益</p> | |||||
</div> | |||||
</div> | |||||
</div> |
@@ -0,0 +1,24 @@ | |||||
import BlockValue from '@/components/value/index.vue'; | |||||
export default { | |||||
components: { | |||||
BlockValue | |||||
}, | |||||
props: { | |||||
data: { | |||||
type: Object, | |||||
default: function () { | |||||
return {} | |||||
} | |||||
} | |||||
}, | |||||
data () { | |||||
return { | |||||
}; | |||||
}, | |||||
created () { | |||||
}, | |||||
mounted () { | |||||
}, | |||||
methods: { | |||||
} | |||||
}; |
@@ -0,0 +1,93 @@ | |||||
.buttom2 { | |||||
width: 220px; | |||||
display: flex; | |||||
justify-content: space-between; | |||||
position: absolute; | |||||
top: 100px; | |||||
right: 460px; | |||||
z-index: 2; | |||||
.flex_main{ | |||||
background: url("bg.png") no-repeat 10px center; | |||||
background-size: calc(100% - 10px) 100%; | |||||
width: 220px; | |||||
height: 150px; | |||||
padding: 15px 15px 15px 25px; | |||||
display: flex; | |||||
flex-direction: column; | |||||
justify-content: space-between; | |||||
margin-bottom: 15px; | |||||
position: relative; | |||||
.flex_block{ | |||||
display: flex; | |||||
align-items: center; | |||||
justify-content: space-between; | |||||
p:nth-child(1){ | |||||
color: #e6f1ff; | |||||
} | |||||
} | |||||
.tt{ | |||||
text-shadow: 2px 2px 4px #000000; | |||||
font-size: 18px; | |||||
font-weight: bold; | |||||
} | |||||
i{ | |||||
display: block; | |||||
height: 100%; | |||||
width: 5px; | |||||
position: absolute; | |||||
top: 0; | |||||
left: 0; | |||||
} | |||||
&:nth-child(1){ | |||||
i{ | |||||
background-color: #00d6f8; | |||||
} | |||||
.flex_block{ | |||||
p:nth-child(2){ | |||||
color: #00d6f8; | |||||
} | |||||
} | |||||
} | |||||
&:nth-child(2){ | |||||
i{ | |||||
background-color: #f7cc3a; | |||||
} | |||||
.flex_block{ | |||||
p:nth-child(2){ | |||||
color: #f7cc3a; | |||||
} | |||||
} | |||||
} | |||||
&:nth-child(3){ | |||||
i{ | |||||
background-color: #04e26f; | |||||
} | |||||
.flex_block{ | |||||
p:nth-child(2){ | |||||
color: #04e26f; | |||||
} | |||||
} | |||||
} | |||||
} | |||||
.flex_main_right{ | |||||
background: url("bg2.png") no-repeat center; | |||||
background-size: 100% 100%; | |||||
width: 220px; | |||||
height: 100px; | |||||
margin-bottom: 15px; | |||||
display: flex; | |||||
flex-direction: column; | |||||
align-items: center; | |||||
justify-content: space-evenly; | |||||
p:nth-child(1){ | |||||
color: #01d5f8; | |||||
font-size: 26px; | |||||
font-weight: bold; | |||||
span{ | |||||
font-size: 14px; | |||||
} | |||||
} | |||||
} | |||||
} |
@@ -0,0 +1,4 @@ | |||||
<template src='./index.html'/> | |||||
<script lang='js' src='./index.js'></script> | |||||
<style lang='scss' src='./index.scss' scoped> | |||||
</style> |
@@ -1,9 +1,10 @@ | |||||
<Pannel title="资金支出分析" height="340" flexIble> | |||||
<Pannel title="农户资产类型分析" height="340" flexIble> | |||||
<div class="full"> | <div class="full"> | ||||
<div class="buttom"> | <div class="buttom"> | ||||
<Pie | <Pie | ||||
:title="'总资产'" | :title="'总资产'" | ||||
:titleNum="'167万元'" | |||||
:titleNum="countNum + '万元'" | |||||
:showTit="false" | |||||
:data="data" | :data="data" | ||||
></Pie> | ></Pie> | ||||
</div> | </div> | ||||
@@ -12,18 +12,21 @@ export default { | |||||
default: function () { | default: function () { | ||||
return [] | return [] | ||||
} | } | ||||
}, | |||||
countNum: { | |||||
type: Number, | |||||
default: 0 | |||||
} | } | ||||
}, | }, | ||||
data () { | data () { | ||||
return { | return { | ||||
pannelTabData: [], | |||||
tabIndex: '1' | tabIndex: '1' | ||||
}; | }; | ||||
}, | }, | ||||
created () { | created () { | ||||
}, | }, | ||||
mounted () { | mounted () { | ||||
console.log(this.countNum) | |||||
}, | }, | ||||
methods: { | methods: { | ||||
tabChange (info) { | tabChange (info) { | ||||
@@ -1,4 +1,4 @@ | |||||
<Pannel title="农业设施设备" height="300"> | |||||
<Pannel title="农业设施设备类型分析" height="300" flexIble> | |||||
<div class="full"> | <div class="full"> | ||||
<div class="buttom"> | <div class="buttom"> | ||||
<Bar id="bar3" | <Bar id="bar3" | ||||
@@ -1,4 +1,4 @@ | |||||
<Pannel title="集体资源资产" height="300"> | |||||
<Pannel title="集体资源资产类型分析" height="300" flexIble> | |||||
<div class="full"> | <div class="full"> | ||||
<div class="buttom"> | <div class="buttom"> | ||||
<Bar | <Bar | ||||
@@ -1,4 +1,4 @@ | |||||
<Pannel title="农户资产分布" height="300"> | |||||
<Pannel title="农户资产分布" height="300" flexIble> | |||||
<div class="full"> | <div class="full"> | ||||
<div class="buttom"> | <div class="buttom"> | ||||
<Bar id="bar6" | <Bar id="bar6" | ||||
@@ -1,4 +1,4 @@ | |||||
<Pannel title="农业设施设备分布" height="300"> | |||||
<Pannel title="农业设施设备分布" height="300" flexIble> | |||||
<div class="full"> | <div class="full"> | ||||
<div class="buttom"> | <div class="buttom"> | ||||
<Bar id="bar5" | <Bar id="bar5" | ||||
@@ -1,4 +1,4 @@ | |||||
<Pannel title="集体资源资产分布" height="300"> | |||||
<Pannel title="集体资源资产分布" height="300" flexIble> | |||||
<div class="full"> | <div class="full"> | ||||
<div class="buttom"> | <div class="buttom"> | ||||
<Bar id="bar4" | <Bar id="bar4" | ||||
@@ -7,6 +7,7 @@ export const comps = { | |||||
name: 'Left21', | name: 'Left21', | ||||
data: [] | data: [] | ||||
},{ | },{ | ||||
countNum: 0, | |||||
name: 'Left31', | name: 'Left31', | ||||
data: [] | data: [] | ||||
}], | }], | ||||
@@ -23,6 +24,9 @@ export const comps = { | |||||
buttom: [{ | buttom: [{ | ||||
name: 'Bottom1', | name: 'Bottom1', | ||||
data: {} | data: {} | ||||
},{ | |||||
name: 'Bottom2', | |||||
data: {} | |||||
}] | }] | ||||
} | } | ||||
} | } |
@@ -3,14 +3,15 @@ | |||||
<Header title="三清五治一张图" callBack></Header> | <Header title="三清五治一张图" callBack></Header> | ||||
<!-- 项目初始化 --> | <!-- 项目初始化 --> | ||||
<div class="left_side col space_between zIndextop"> | <div class="left_side col space_between zIndextop"> | ||||
<component :is="item.name" v-for="(item, index) in currentComp.left" :key="index" :data="item.data"></component> | |||||
<component :is="item.name" v-for="(item, index) in currentComp.left" :key="index" :data="item.data" :countNum="item.name == 'Left31'?item.countNum:0"></component> | |||||
</div> | </div> | ||||
<div class="right_side col space_between zIndextop"> | <div class="right_side col space_between zIndextop"> | ||||
<component :is="item.name" v-for="(item, index) in currentComp.right" :key="index" :data="item.data"></component> | <component :is="item.name" v-for="(item, index) in currentComp.right" :key="index" :data="item.data"></component> | ||||
</div> | </div> | ||||
<div class="buttom_side row space_between zIndextop"> | |||||
<div class="row"> | |||||
<component :is="item.name" v-for="(item, index) in currentComp.buttom" :key="index" :data="item.data"></component> | <component :is="item.name" v-for="(item, index) in currentComp.buttom" :key="index" :data="item.data"></component> | ||||
</div> | </div> | ||||
<Popover v-if="false"></Popover> | |||||
<Left></Left> | <Left></Left> | ||||
<Right></Right> | <Right></Right> | ||||
<Footer></Footer> | <Footer></Footer> | ||||
@@ -11,6 +11,9 @@ import Right11 from './comps/right/top/1/index.vue'; | |||||
import Right21 from './comps/right/middle/1/index.vue'; | import Right21 from './comps/right/middle/1/index.vue'; | ||||
import Right31 from './comps/right/bottom/1/index.vue'; | import Right31 from './comps/right/bottom/1/index.vue'; | ||||
import Bottom1 from './comps/buttom/1/index.vue'; | import Bottom1 from './comps/buttom/1/index.vue'; | ||||
import Bottom2 from './comps/buttom/2/index.vue'; | |||||
import Popover from './popover/index.vue'; | |||||
import MainGis from './main-gis/index.vue'; | import MainGis from './main-gis/index.vue'; | ||||
import { comps } from './data.js' | import { comps } from './data.js' | ||||
@@ -32,6 +35,8 @@ export default { | |||||
Right11, | Right11, | ||||
Right21, | Right21, | ||||
Right31, | Right31, | ||||
Popover, | |||||
Bottom2, | |||||
Bottom1 | Bottom1 | ||||
}, | }, | ||||
data () { | data () { | ||||
@@ -47,55 +52,66 @@ export default { | |||||
} | } | ||||
}, | }, | ||||
created () { | created () { | ||||
this.currentComp.right[0].data = []; | |||||
this.currentComp.right[1].data = []; | |||||
this.currentComp.right[2].data = []; | |||||
this.currentComp.left[0].data = []; | |||||
this.currentComp.left[1].data = []; | |||||
this.currentComp.left[2].data = []; | |||||
getInfo().then(res => { | getInfo().then(res => { | ||||
getStatistic({ deptId: res.user.deptId }).then((response) => { | getStatistic({ deptId: res.user.deptId }).then((response) => { | ||||
response.data.jtzyzcDeptList.map(rr => { | response.data.jtzyzcDeptList.map(rr => { | ||||
this.currentComp.left[0].data.push({ | |||||
this.currentComp.right[0].data.push({ | |||||
name: rr.deptName, | name: rr.deptName, | ||||
value: rr.ydmj | value: rr.ydmj | ||||
}) | }) | ||||
}) | }) | ||||
response.data.nysssbDeptList.map(rr => { | response.data.nysssbDeptList.map(rr => { | ||||
this.currentComp.left[1].data.push({ | |||||
this.currentComp.right[1].data.push({ | |||||
name: rr.deptName, | name: rr.deptName, | ||||
value: rr.ydmj | value: rr.ydmj | ||||
}) | }) | ||||
}) | }) | ||||
response.data.nhzcDeptList.map(rr => { | response.data.nhzcDeptList.map(rr => { | ||||
this.currentComp.left[2].data.push({ | |||||
this.currentComp.right[2].data.push({ | |||||
name: rr.deptName, | name: rr.deptName, | ||||
value: rr.ydmj | value: rr.ydmj | ||||
}) | }) | ||||
}) | }) | ||||
response.data.jtzyzcTypeList.map(rr => { | response.data.jtzyzcTypeList.map(rr => { | ||||
this.currentComp.right[0].data.push({ | |||||
this.currentComp.left[0].data.push({ | |||||
name: rr.threeDetailType, | name: rr.threeDetailType, | ||||
value: rr.ydmj | value: rr.ydmj | ||||
}) | }) | ||||
}) | }) | ||||
response.data.nysssbTypeList.map(rr => { | response.data.nysssbTypeList.map(rr => { | ||||
this.currentComp.right[1].data.push({ | |||||
this.currentComp.left[1].data.push({ | |||||
name: rr.threeDetailType, | name: rr.threeDetailType, | ||||
value: rr.ydmj | value: rr.ydmj | ||||
}) | }) | ||||
}) | }) | ||||
response.data.nhzcTypeList.map(rr => { | response.data.nhzcTypeList.map(rr => { | ||||
this.currentComp.right[2].data.push({ | |||||
this.currentComp.left[2].data.push({ | |||||
name: rr.threeDetailType, | name: rr.threeDetailType, | ||||
value: rr.ydmj | |||||
value: rr.ydmj, | |||||
unit: '万元' | |||||
}) | }) | ||||
this.currentComp.left[2].countNum += rr.ydmj; | |||||
}) | }) | ||||
this.currentComp.buttom[0].data = { | this.currentComp.buttom[0].data = { | ||||
jtzyzc: response.data.jtzyzc,//集体资源资产 | jtzyzc: response.data.jtzyzc,//集体资源资产 | ||||
nysssb: response.data.nysssb,//农业设施设备 | nysssb: response.data.nysssb,//农业设施设备 | ||||
nhzc: response.data.nhzc, | nhzc: response.data.nhzc, | ||||
} | |||||
this.currentComp.buttom[1].data = { | |||||
xy23: response.data.xy23, | xy23: response.data.xy23, | ||||
xy24: response.data.xy24 | xy24: response.data.xy24 | ||||
} | } | ||||
console.log(this.currentComp) | console.log(this.currentComp) | ||||
this.allData = response.data; | this.allData = response.data; | ||||
}); | }); | ||||
@@ -8,4 +8,5 @@ | |||||
.buttom_side { | .buttom_side { | ||||
top: 100px; | top: 100px; | ||||
bottom: auto; | bottom: auto; | ||||
left: 685px; | |||||
} | } |
@@ -48,20 +48,20 @@ | |||||
//选择地址 | //选择地址 | ||||
.select_address { | .select_address { | ||||
height: 30px; | |||||
width: 300px; | width: 300px; | ||||
position: absolute; | position: absolute; | ||||
left: 480px; | |||||
top: 112px; | |||||
left: 30px; | |||||
top: 40px; | |||||
z-index: 302; | z-index: 302; | ||||
box-shadow: inset 0 0 10px 2px rgba(27, 123, 204, 0.8); /* 添加内发光效果 */ | |||||
// <div class="dot left"></div> | // <div class="dot left"></div> | ||||
// <div class="dot right"></div> | // <div class="dot right"></div> | ||||
::v-deep { | ::v-deep { | ||||
.el-input--suffix { | .el-input--suffix { | ||||
// background: url('../../../../assets/images/dataScreen/bigDataMonitoring2/stockCooperative/addText_bg.png') center center no-repeat !important; | // background: url('../../../../assets/images/dataScreen/bigDataMonitoring2/stockCooperative/addText_bg.png') center center no-repeat !important; | ||||
background-size: 100% 100% !important; | background-size: 100% 100% !important; | ||||
height: 35px; | |||||
width: 280px; | width: 280px; | ||||
.el-input__inner { | .el-input__inner { | ||||
@@ -71,7 +71,6 @@ | |||||
font-size: 1.66vh; | font-size: 1.66vh; | ||||
text-align: center; | text-align: center; | ||||
padding: 0; | padding: 0; | ||||
padding-top: .9vh; | |||||
} | } | ||||
.el-input__icon { | .el-input__icon { | ||||
@@ -241,4 +240,4 @@ | |||||
} | } | ||||
} | } | ||||
} | } | ||||
} | |||||
} |
@@ -0,0 +1,79 @@ | |||||
<div class="popover_main"> | |||||
<h1><i></i>B镇详情<span>×</span></h1> | |||||
<div> | |||||
<p>资产编码</p> | |||||
<p>11111111</p> | |||||
<p>资产名称</p> | |||||
<p>11111111</p> | |||||
</div> | |||||
<div> | |||||
<p>三清类型</p> | |||||
<p>11111111</p> | |||||
<p>资产类型</p> | |||||
<p>11111111</p> | |||||
</div> | |||||
<div> | |||||
<p>用地面积</p> | |||||
<p>11111111</p> | |||||
<p>建筑面积(㎡)</p> | |||||
<p>11111111</p> | |||||
</div> | |||||
<div> | |||||
<p>所在组</p> | |||||
<p>11111111</p> | |||||
<p>权属性质</p> | |||||
<p>11111111</p> | |||||
</div> | |||||
<div> | |||||
<p>权属是否存在争议</p> | |||||
<p>11111111</p> | |||||
<p>权属主体</p> | |||||
<p>11111111</p> | |||||
</div> | |||||
<div> | |||||
<p>是否委托代管</p> | |||||
<p>11111111</p> | |||||
<p>联系电话</p> | |||||
<p>11111111</p> | |||||
</div> | |||||
<div> | |||||
<p>23年盘活方式</p> | |||||
<p>11111111</p> | |||||
<p>23年效益(万元)</p> | |||||
<p>11111111</p> | |||||
</div> | |||||
<div> | |||||
<p>24年盘活方式</p> | |||||
<p>11111111</p> | |||||
<p>24年效益(万元)</p> | |||||
<p>11111111</p> | |||||
</div> | |||||
<div> | |||||
<p>盘活情况</p> | |||||
<p>11111111</p> | |||||
<p>资产闲置原因</p> | |||||
<p>11111111</p> | |||||
</div> | |||||
<div> | |||||
<p>是否能正常使用</p> | |||||
<p>11111111</p> | |||||
<p>完善后使用</p> | |||||
<p>11111111</p> | |||||
</div> | |||||
<div> | |||||
<p>不能使用</p> | |||||
<p>11111111</p> | |||||
<p>盘活措施</p> | |||||
<p>11111111</p> | |||||
</div> | |||||
<div> | |||||
<p>盘活时限</p> | |||||
<p>11111111</p> | |||||
<p>资产统计年度</p> | |||||
<p>11111111</p> | |||||
</div> | |||||
<div> | |||||
<p>备注</p> | |||||
<p>11111111</p> | |||||
</div> | |||||
</div> |
@@ -0,0 +1,21 @@ | |||||
export default { | |||||
props: { | |||||
data: { | |||||
type: Array, | |||||
default: function () { | |||||
return [] | |||||
} | |||||
} | |||||
}, | |||||
data () { | |||||
return { | |||||
}; | |||||
}, | |||||
created () { | |||||
}, | |||||
mounted () { | |||||
}, | |||||
methods: { | |||||
} | |||||
}; |
@@ -0,0 +1,45 @@ | |||||
.popover_main{ | |||||
width: 800px; | |||||
position: absolute; | |||||
left: 50%; | |||||
top: 50%; | |||||
transform: translate(-50% , -50%); | |||||
background-color: rgba(11,36,79,.9); | |||||
z-index: 99; | |||||
padding-bottom: 25px; | |||||
border: 1px solid #0b61b7; | |||||
h1{ | |||||
background: url("./tit_bg.png") no-repeat center; | |||||
background-size: 100% 100%; | |||||
padding: 10px 25px 10px 10px; | |||||
display: flex; | |||||
align-items: center; | |||||
font-size: 18px; | |||||
font-weight: initial; | |||||
i{ | |||||
display: block; | |||||
width: 25px; | |||||
height: 25px; | |||||
background: url("./icon.png") no-repeat center; | |||||
background-size: 200% 200%; | |||||
} | |||||
span{ | |||||
margin-left: auto; | |||||
font-size: 24px; | |||||
} | |||||
} | |||||
div{ | |||||
display: flex; | |||||
justify-content: space-between; | |||||
p{ | |||||
width: 25%; | |||||
padding: 10px 25px; | |||||
&:nth-child(odd){ | |||||
color: #80aacf; | |||||
}; | |||||
&:nth-child(even){ | |||||
color: #01d5f8; | |||||
} | |||||
} | |||||
} | |||||
} |
@@ -0,0 +1,4 @@ | |||||
<template src='./index.html'/> | |||||
<script lang='js' src='./index.js'></script> | |||||
<style lang='scss' src='./index.scss' scoped> | |||||
</style> |
@@ -21,7 +21,7 @@ module.exports = { | |||||
// target: `http://192.168.0.105:8090`, // 公网测试环境 | // target: `http://192.168.0.105:8090`, // 公网测试环境 | ||||
changeOrigin: true, | changeOrigin: true, | ||||
onProxyReq: function (proxyReq, req) { | onProxyReq: function (proxyReq, req) { | ||||
//console.log( | |||||
console.log( | |||||
'[HPM] Origin changed from ' + | '[HPM] Origin changed from ' + | ||||
req.headers.host + | req.headers.host + | ||||
' ~> ' + | ' ~> ' + | ||||
@@ -34,7 +34,7 @@ module.exports = { | |||||
logLevel: 'debug', | logLevel: 'debug', | ||||
changeOrigin: true, | changeOrigin: true, | ||||
onProxyReq: function (proxyReq, req) { | onProxyReq: function (proxyReq, req) { | ||||
//console.log( | |||||
console.log( | |||||
'[HPM] Origin changed from ' + | '[HPM] Origin changed from ' + | ||||
req.headers.host + | req.headers.host + | ||||
' ~> ' + | ' ~> ' + | ||||