b25b036d
 wuxw
v1.9 优化日期
|
1
|
<template>
|
|
f92fd6ac
wuxw
开发我的小区下的功能
|
2
3
4
5
6
7
8
|
<div class="car-structure-container">
<el-row :gutter="20">
<el-col :span="4">
<floor-unit-tree ref="floorUnitTree" @switchFloorUnit="switchFloorUnit" />
</el-col>
<el-col :span="20">
<el-card class="box-card margin-bottom car-list-card">
|
|
acfe91a9
wuxw
v1.9 修复客户反馈车位结构图部...
|
9
|
<el-row :gutter="10" class="">
|
|
f92fd6ac
wuxw
开发我的小区下的功能
|
10
|
<el-col v-for="(car, index) in carStructureInfo.cars" :key="index" :span="4"
|
|
acfe91a9
wuxw
v1.9 修复客户反馈车位结构图部...
|
11
|
class="text-center margin-bottom car-card margin-sm" :style="{ 'background-color': getBgColor(car) }"
|
|
f92fd6ac
wuxw
开发我的小区下的功能
|
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
|
@dblclick.native="toSimplifyAcceptance(car)">
<div>{{ car.areaNum }}-{{ car.num }}</div>
<div>{{ car.carNum }}</div>
<div>{{ car.floorNum }}-{{ car.unitNum }}-{{ car.roomNum }}</div>
<div>{{ car.ownerName || $t('carStructure.noOwner') }}</div>
<div>
<span>{{ $t('carStructure.oweAmount') }}</span>：{{ car.oweAmount }}
<span>{{ $t('carStructure.yuan') }}</span>
</div>
</el-col>
</el-row>
</el-card>
</el-col>
</el-row>
</div>
</template>
<script>
import floorUnitTree from '@/components/room/floorUnitTree'
import { listCarStructure } from '@/api/car/carStructureApi'
import { getCommunityId } from '@/api/community/communityApi'
export default {
name: 'CarStructureList',
components: {
floorUnitTree
},
data() {
return {
carStructureInfo: {
cars: []
},
communityId: ''
}
},
created() {
this.communityId = getCommunityId()
|
|
20ddb876
wuxw
优化房屋产权
|
49
50
51
|
setTimeout(() => {
this.$refs.floorUnitTree.selectFirstUnit()
}, 1000)
|
|
f92fd6ac
wuxw
开发我的小区下的功能
|
52
53
54
|
},
methods: {
switchFloorUnit(data) {
|
|
acfe91a9
wuxw
v1.9 修复客户反馈车位结构图部...
|
55
|
this.carStructureInfo.cars = []
|
|
f92fd6ac
wuxw
开发我的小区下的功能
|
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
|
if (!data.unitId) {
return
}
this.loadCars(data.unitId)
},
async loadCars(unitId) {
try {
const params = {
page: 1,
row: 100,
unitId: unitId,
communityId: this.communityId
}
const { data } = await listCarStructure(params)
this.carStructureInfo.cars = data
} catch (error) {
this.$message.error(this.$t('carStructure.fetchError'))
}
},
getBgColor(car) {
if (!car.ownerName) {
return "#1AB394"
}
if (car.oweAmount > 0) {
return "#DC3545"
}
return "#1296db"
},
toSimplifyAcceptance(car) {
|
|
e94f0676
wuxw
跳转到业务受理页面处理完成
|
85
86
|
this.$router.push('/pages/property/simplifyAcceptance?tab=业务受理&searchType=1&searchValue=' + `${car.floorNum}-${car.unitNum}-${car.roomNum}`)
|
|
f92fd6ac
wuxw
开发我的小区下的功能
|
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
|
}
}
}
</script>
<style lang="scss" scoped>
.car-structure-container {
padding: 20px;
.car-list-card {
height: 100%;
min-height: calc(100vh - 120px);
}
.car-card {
color: #fff;
border-radius: 5px;
cursor: pointer;
min-height: 120px;
display: flex;
flex-direction: column;
justify-content: center;
transition: all 0.3s;
&:hover {
transform: scale(1.05);
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
}
.margin-top {
margin-top: 10px;
}
.margin-bottom {
margin-bottom: 20px;
}
.padding {
padding: 10px;
}
.text-center {
text-align: center;
}
}
</style>
|
