diff --git a/src/icons/svg/fangwu.svg b/src/icons/svg/fangwu.svg new file mode 100644 index 0000000..068f54d --- /dev/null +++ b/src/icons/svg/fangwu.svg @@ -0,0 +1 @@ + diff --git a/src/icons/svg/tudi.svg b/src/icons/svg/tudi.svg new file mode 100644 index 0000000..ac00be0 --- /dev/null +++ b/src/icons/svg/tudi.svg @@ -0,0 +1 @@ + diff --git a/src/icons/svg/zichan.svg b/src/icons/svg/zichan.svg new file mode 100644 index 0000000..503e8c8 --- /dev/null +++ b/src/icons/svg/zichan.svg @@ -0,0 +1 @@ + diff --git a/src/views/component/table.vue b/src/views/component/table.vue index a1817bc..cdd23e5 100644 --- a/src/views/component/table.vue +++ b/src/views/component/table.vue @@ -608,8 +608,13 @@ export default { if (this.firstAdjustTable) { const data = this.$refs['xyTable'].getListData(); if (data.length === 0) return; - this.form.forEach((i) => { - let lengthTemp = data[0][i.field]?.length??0; + this.form.filter(i => i.list_show).forEach((i) => { + let lengthTemp; + let temp = 0; + while (!lengthTemp || temp < data.length) { + lengthTemp = data[temp][i.field]?.length??0; + temp++; + } for (let j = 0;j < data.length;j++) { if (/^-?\d+\.\d+/.test(data[j][i.field])) { this.table.find(a => a.prop === i.field).align = 'right'; diff --git a/src/views/dataShow/index.vue b/src/views/dataShow/index.vue index 7d6be93..d6d0e39 100644 --- a/src/views/dataShow/index.vue +++ b/src/views/dataShow/index.vue @@ -33,6 +33,7 @@ import right1 from "./right1.vue"; import right2 from "./right2.vue"; import btns from "./btns.vue"; import leftBottom from "./leftBottom.vue" +import { index } from '@/api/system/baseForm'; export default { components: { MapComponent, @@ -43,19 +44,44 @@ export default { leftBottom }, mixins: [drawMixin], + provide() { + return { + assets: () => this.assetsData + } + }, data() { return { loading: true, + assetsData: [[],[]], } }, methods: { - + async getData () { + await Promise.all([ + index({ + table_name: "houses", + page: 1, + page_size: 999 + },false), + index({ + table_name: "lands", + page: 1, + page_size: 999 + }) + ]).then(res => { + const [houses,lands] = res; + this.assetsData = [houses.data,lands.data]; + }) + }, }, computed: {}, mounted() { setTimeout(() => { this.loading = false; },500) + }, + created() { + this.getData(); } } diff --git a/src/views/dataShow/leftBottom.vue b/src/views/dataShow/leftBottom.vue index f3d7f25..bbe9703 100644 --- a/src/views/dataShow/leftBottom.vue +++ b/src/views/dataShow/leftBottom.vue @@ -13,15 +13,17 @@

{{ item.text }}

- {{ item.num }} + {{ total(item.tag) }} {{ item.unit }}

- +
+
+
@@ -35,29 +37,57 @@ export default { components: { SvgIcon }, + inject: ["assets"], data() { return { items: [ { text: "资产总量", num: 36650, - unit: "平方" + tag: "total", + unit: "平方", + icon: "zichan" }, { text: "土地资产", num: 99966, - unit: "亩" + unit: "亩", + tag: "land", + icon: "tudi" }, { text: "房屋资产", num: 8888, - unit: "平方" + unit: "平方", + tag: "house", + icon: "fangwu" } ] } }, methods: {}, - computed: {} + computed: { + total () { + return function(tag) { + let total = 0; + const [houses,lands] = this.assets() + switch (tag) { + case "total": + total += houses.reduce((a,b) => a + parseFloat(b.dengjimianji ?? 0),0) + total += lands.reduce((a,b) => a + parseFloat(b.dengjimianji ?? 0),0) + return total.toFixed(2); + case "land": + total += lands.reduce((a,b) => a + parseFloat(b.dengjimianji ?? 0),0) + return total.toFixed(2); + case "house": + total += houses.reduce((a,b) => a + parseFloat(b.dengjimianji ?? 0),0) + return total.toFixed(2); + default: + return total.toFixed(2); + } + } + } + } } @@ -67,12 +97,13 @@ export default { align-items: center; justify-content: space-between; - padding: 20px 30px; + padding: 20px 22px; &__title { line-height: 2; font-size: 22px; font-weight: 600; color: #73f3df; + padding: 6px 0; } &__text { color: #fff; @@ -81,59 +112,100 @@ export default { &--num { font-size: 28px; font-weight: 600; - padding-right: 10px; + padding-right: 6px; } } & > .card-right { z-index: 2; position: relative; + top: 0; & > .img { color: #73f3e0; - width: 60px; - height: 60px; + width: 54px; + height: 54px; z-index: 3; - transform: translateY(-8px); + transform: translate(-19px,-10px); position: relative; } .img-base { width: 100%; - perspective: 100px; + perspective: 200px; z-index: 1; position: absolute; - left: 0; - right: 0; - bottom: 0; + left: -12px; + bottom: -14px; - &::before { - content: ""; - width: 100%; - height: 100%; - background: linear-gradient(to bottom, #00000033 , #61b9ac); - transform: translateY(-96%); - position: absolute; - left: 0%; - top: 0; - } .square1 { - background: linear-gradient(to bottom, #00000033 ,#4fa497); - width: 100%; - height: 34px; + background: linear-gradient(135deg, #00000066 ,#4fa497); + width: 40px; + height: 40px; box-shadow: 0 0 2px 2px #7ddacd; - transform: rotateX(45deg); + transform: rotateX(45deg) rotateZ(45deg)skew(-15deg, -15deg); position: relative; - &::after { content: ""; - width: 120%; - height: 136%; + width: 146%; + height: 146%; + filter: drop-shadow(2px 2px 6px #9ce8de); background: transparent; - border: 2px solid #7ddacd; + border: 3px solid #25aba8; position: absolute; - left: -10%; - top: -18%; + left: -22%; + top: -22%; } } + .square2 { + background: linear-gradient(135deg, #ffffff33 , #1da4a1); + width: 52px; + height: 50px; + transform: rotateX(45deg) rotateZ(45deg)skew(-15deg, -15deg); + box-shadow: 0 0 2px 2px #86bdb5; + position: absolute; + left: -6px; + top: -16px; + } + .square3 { + content: ""; + width: 104px; + height: 46px; + background: linear-gradient(to bottom, #00000022 , #61b9ac66); + filter: drop-shadow(0 2px 6px #9ce8de); + position: absolute; + left: -32px; + bottom: 20px; + } + //&::before { + // content: ""; + // width: 100%; + // height: 100%; + // background: linear-gradient(to bottom, #00000033 , #61b9ac); + // filter: drop-shadow(0 2px 6px #9ce8de); + // transform: translateY(-96%); + // position: absolute; + // left: 0%; + // top: 0; + //} + //.square1 { + // background: linear-gradient(to bottom, #00000033 ,#4fa497); + // width: 100%; + // height: 34px; + // box-shadow: 0 0 2px 2px #7ddacd; + // transform: rotateX(45deg); + // position: relative; + // + // &::after { + // content: ""; + // width: 120%; + // height: 136%; + // filter: drop-shadow(0 4px 6px #9ce8de); + // background: transparent; + // border: 2px solid #7ddacd; + // position: absolute; + // left: -10%; + // top: -18%; + // } + //} } } } diff --git a/src/views/dataShow/map.vue b/src/views/dataShow/map.vue index a3ad6c3..56beb9e 100644 --- a/src/views/dataShow/map.vue +++ b/src/views/dataShow/map.vue @@ -12,6 +12,7 @@ export default { return {} }, methods: { + initMap () { echarts.registerMap("wuxi", WUXI); let chart = echarts.init(document.querySelector("#map")) @@ -41,7 +42,6 @@ export default { emphasis: { // 鼠标 hover 高亮时图形和标签的样式 (当鼠标放上去时 label和itemStyle 的样式) label: { - // TODO label高亮时的配置 show: true // textStyle: { // color: '#fff', // 高亮时标签颜色变为 白色 @@ -49,7 +49,6 @@ export default { // } }, itemStyle: { - // TODO itemStyle高亮时的配置 color: '#587683' // 高亮时地图板块颜色改变 } }, @@ -74,7 +73,7 @@ export default { color: '#fff', // 环境光的颜色。[ default: #fff ] intensity: 0.5 // 环境光的强度。[ default: 0.2 ] } - } + }, }], }) chart.on("click", (params) => { diff --git a/src/views/statics/lease.vue b/src/views/statics/lease.vue new file mode 100644 index 0000000..31395a2 --- /dev/null +++ b/src/views/statics/lease.vue @@ -0,0 +1,291 @@ + + + + +