|
|
@@ -52,6 +52,27 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-row>
|
|
|
+
|
|
|
+ <el-row class="sdline3">
|
|
|
+ <div
|
|
|
+ class="basicItem"
|
|
|
+ v-for="(item, index) in line3Array"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <div style="padding: 0.03rem 0; text-align: center">
|
|
|
+ <span style="display: block">
|
|
|
+ <Strong
|
|
|
+ style="color: #4FE261;font-weight: 600;font-size: .225rem"
|
|
|
+ >
|
|
|
+ <CountTo :startVal="0" :endVal="item.count || 0" :duration="3000" v-if="!isNaN(item.count)">{{ item.count || 0 }}</CountTo>
|
|
|
+ <span v-if="isNaN(item.count)" style="fontSize: 0.2rem !important">{{ item.count || 0 }}</span>
|
|
|
+ </Strong>
|
|
|
+ {{ item.unit }}
|
|
|
+ </span>
|
|
|
+ <span class="nameBox" style="font-size:12px">{{ item.name }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-row>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
@@ -883,6 +904,80 @@ export default {
|
|
|
|
|
|
],
|
|
|
arrayData:[],
|
|
|
+ line3Array:[
|
|
|
+ {
|
|
|
+ "name": "大型综合体",
|
|
|
+ "count": 4,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "name": "重点单位",
|
|
|
+ "count": 14,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "name": "酒店/宾馆",
|
|
|
+ "count": 11,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "name": "高层建筑",
|
|
|
+ "count": 14,
|
|
|
+ },{
|
|
|
+ "name": "厂房/仓库",
|
|
|
+ "count": 11,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "name": "商市场",
|
|
|
+ "count": 11,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "name": "公共娱乐场所",
|
|
|
+ "count": 11,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "name": "医疗机构",
|
|
|
+ "count": 103,
|
|
|
+ },{
|
|
|
+ "name": "养老机构",
|
|
|
+ "count": 11,
|
|
|
+ },
|
|
|
+
|
|
|
+ {
|
|
|
+ "name": "规模租赁",
|
|
|
+ "count": 103,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "name": "办公楼宇",
|
|
|
+ "count": 103,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "name": "在建工地",
|
|
|
+ "count": 11,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "name": "居民小区",
|
|
|
+ "count": 4,
|
|
|
+ },{
|
|
|
+ "name": "沿街门面",
|
|
|
+ "count": 20,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "name": "宗教场所",
|
|
|
+ "count": 4,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "name": "学校",
|
|
|
+ "count": 20,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "name": "加油（汽）站",
|
|
|
+ "count": 20,
|
|
|
+ },{
|
|
|
+ "name": "地铁站",
|
|
|
+ "count": 11,
|
|
|
+ },{
|
|
|
+ "name": "社会消费组织（微站/专职队）",
|
|
|
+ "count": 11,
|
|
|
+ }
|
|
|
+ ],
|
|
|
staticData:{
|
|
|
array:[],
|
|
|
total:0,
|
|
|
@@ -1280,13 +1375,16 @@ export default {
|
|
|
methods: {
|
|
|
|
|
|
getStaticData(type){
|
|
|
- this.$axios.get(
|
|
|
- this.$api.water.baseGgpFacilityStatistic +
|
|
|
- "?" +
|
|
|
- this.$qs.stringify({
|
|
|
- facilityType: type,
|
|
|
- })
|
|
|
- ).then(res=>{
|
|
|
+ // this.$axios.post(
|
|
|
+ // this.$api.water.baseGgpFacilityStatistic +
|
|
|
+ // "?" +
|
|
|
+ // this.$qs.stringify({
|
|
|
+ // facilityType: type,
|
|
|
+ // })
|
|
|
+ // ).then(res=>{
|
|
|
+ this.$axios.post(this.$api.water.baseGgpFacilityStatistic,{
|
|
|
+ "facilityType": [type ]
|
|
|
+ }).then((res) => {
|
|
|
this.staticData.array=res.data;
|
|
|
var colorArr=['#00C8B8','#068DFF','#FF843A','#7DD807'];
|
|
|
this.staticData.array.forEach((item, index) => {
|
|
|
@@ -2409,6 +2507,32 @@ export default {
|
|
|
}
|
|
|
|
|
|
}
|
|
|
+ .sdline3 {
|
|
|
+ margin-top:.25rem;
|
|
|
+
|
|
|
+ .basicItem{
|
|
|
+ width:14.28%; margin: 0px 0; box-sizing: border-box;
|
|
|
+ position:relative;
|
|
|
+ }
|
|
|
+ // .basicItem::after {
|
|
|
+ // position: absolute; /*绝对定位*/
|
|
|
+ // top: 50%; /*Y轴方向偏移自身高度的50%*/
|
|
|
+ // transform: translatey(-40%); /*Y轴方向偏移微调*/
|
|
|
+ // right: 0; /*紧靠容器左边缘*/
|
|
|
+ // content: ''; /*伪元素需要有内容才能显示*/
|
|
|
+ // width: 1px; /*伪元素宽度*/
|
|
|
+ // height: 40px; /*伪元素高度*/
|
|
|
+ // background-color: rgba(168, 164, 164,.4); /*伪元素颜色*/
|
|
|
+ // }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+ .sdline3 .basicItem:last-child{
|
|
|
+ width:auto
|
|
|
+ }
|
|
|
|
|
|
.el-row {
|
|
|
> div {
|
ming