You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
117 lines
2.7 KiB
117 lines
2.7 KiB
<template>
|
|
<div>
|
|
<div class="ranking bg-color-black">
|
|
<div class="title d-flex align-center">
|
|
<span>
|
|
<SvgIcon icon-class="tudi" class="text-icon"></SvgIcon>
|
|
</span>
|
|
<span class="fs-xl text">{{ title }}</span>
|
|
</div>
|
|
|
|
<dv-scroll-board v-show="type === 3" :config="config" class="dv-scr-board mt-1" />
|
|
<dv-scroll-ranking-board v-show="type !== 3" class="dv-scr-rank-board mt-1" :config="ranking" />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import SvgIcon from "@/components/SvgIcon"
|
|
export default {
|
|
components: {
|
|
SvgIcon
|
|
},
|
|
data() {
|
|
return {
|
|
}
|
|
},
|
|
methods: {},
|
|
computed: {
|
|
config () {
|
|
return {
|
|
header: ['年度', '月度', '计划名称'],
|
|
data: this.$store.state.bigdata.safetyPlan.map(i => [i.niandu, i.yuedu, i.jihuamingcheng])
|
|
}
|
|
},
|
|
title () {
|
|
switch (this.type) {
|
|
case 1:
|
|
return '土地资产'
|
|
case 2:
|
|
return '合约中'
|
|
case 3:
|
|
return '安全检查计划'
|
|
default:
|
|
return '土地资产'
|
|
}
|
|
},
|
|
type () {
|
|
return this.$store.state.bigdata.type
|
|
},
|
|
ranking () {
|
|
if (this.type === 1) {
|
|
if (this.$store.state.bigdata.assets[1]) {
|
|
return {
|
|
data: this.$store.state.bigdata.assets[1].map(item => ({
|
|
name: item?.name?.length > 16 ? (item.name.slice(0, 14) + '...') : item.name,
|
|
value: (item.dengjimianji || item.shijimianji) ?? 0
|
|
})),
|
|
carousel: 'single',
|
|
unit: '平方',
|
|
waitTime: 4000,
|
|
rowNum: 3
|
|
}
|
|
}
|
|
} else if (this.type === 2) {
|
|
if (this.$store.state.bigdata.leases) {
|
|
return {
|
|
data: this.$store.state.bigdata.leases.map(item => ({
|
|
name: [...item.land,...item.houses].map(i => i.name)?.toString()?.slice(0, 15),
|
|
value: item.id_leases_to_assets_lease_id_relation?.reduce((pre, cur) => pre + Number(cur.chuzumianji),0)
|
|
})),
|
|
carousel: 'single',
|
|
unit: '平方',
|
|
waitTime: 4000,
|
|
rowNum: 3
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.text-icon {
|
|
width: 24px;
|
|
height: 24px;
|
|
color: #1da4a1;
|
|
}
|
|
.ranking {
|
|
padding: 20px 10px;
|
|
width: 100%;
|
|
.dv-scr-board {
|
|
width: 346px;
|
|
height: 180px;
|
|
padding: 10px;
|
|
}
|
|
.dv-scr-rank-board {
|
|
height: 180px;
|
|
padding: 10px 20px;
|
|
}
|
|
.title {
|
|
display: flex;
|
|
color: #fff;
|
|
padding: 0 20px;
|
|
align-items: center;
|
|
.text {
|
|
padding: 0 8px;
|
|
}
|
|
}
|
|
}
|
|
|
|
::v-deep .dv-scroll-ranking-board .ranking-column .inside-column {
|
|
background: linear-gradient(to left,#7ddacd,#1da4a1);
|
|
}
|
|
</style>
|