135 lines
4.2 KiB
Vue
135 lines
4.2 KiB
Vue
<template>
|
|
<section class="personalAssets">
|
|
<el-form ref="PersonalAssets" :model="form" size="small" label-width="0">
|
|
<ai-edit-card title="车辆信息" :show-btn="permissions('app_appresident_edit')"
|
|
@save="submitCars" @cancel="getCars">
|
|
<template>
|
|
<el-form-item label-width="0">
|
|
<span v-for="car in form.cars" :key="car.id" v-text="car.vehicleNumber+' '"/>
|
|
<ai-empty v-if="form.cars.length==0"/>
|
|
</el-form-item>
|
|
</template>
|
|
<template #edit>
|
|
<el-form-item v-for="(car,i) in form.cars" :key="i" :prop="`cars.${i}.vehicleNumber`"
|
|
:rules="{required: true,message:'请输入车牌号'}">
|
|
<el-input v-model="car.vehicleNumber" clearable placeholder="请输入车牌号">
|
|
<el-button slot="append" type="text" @click="form.cars.splice(i,1)">删除</el-button>
|
|
</el-input>
|
|
</el-form-item>
|
|
<el-button type="text" @click="form.cars.push({})">新增车辆</el-button>
|
|
</template>
|
|
</ai-edit-card>
|
|
<ai-edit-card title="房屋信息" :show-btn="permissions('app_appresident_edit')"
|
|
@save="submitHouses" @cancel="getHouses">
|
|
<template>
|
|
<el-form-item label-width="0">``
|
|
<div v-for="house in form.houses" :key="house.id" v-text="[house.areaName,house.address].join('')"/>
|
|
<ai-empty v-if="form.houses.length==0"/>
|
|
</el-form-item>
|
|
</template>
|
|
<template #edit>
|
|
<div v-for="(house,i) in form.houses" :key="i">
|
|
<el-form-item :prop="`houses.${i}.areaId`" :rules="{required: true,message:'请选择房屋地址'}">
|
|
<ai-area-get v-model="house.areaId" :instance="instance" :root="user.info.areaId"/>
|
|
</el-form-item>
|
|
<el-form-item :prop="`houses.${i}.address`" :rules="{required: true,message:'请输入详情地址'}">
|
|
<el-input v-model="house.address" clearable placeholder="请输入详情地址" size="small"/>
|
|
</el-form-item>
|
|
</div>
|
|
<el-button type="text" @click="form.houses.push({})">新增房屋</el-button>
|
|
</template>
|
|
</ai-edit-card>
|
|
</el-form>
|
|
</section>
|
|
</template>
|
|
|
|
<script>
|
|
import AiEditCard from "./AiEditCard";
|
|
import {mapState} from "vuex";
|
|
|
|
export default {
|
|
name: "personalAssets",
|
|
components: {AiEditCard},
|
|
props: {
|
|
instance: Function,
|
|
dict: Object,
|
|
permissions: Function,
|
|
residentId: {required: true, default: ""}
|
|
},
|
|
computed: {
|
|
...mapState(['user']),
|
|
},
|
|
data() {
|
|
return {
|
|
form: {
|
|
cars: [],
|
|
houses: []
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
getCars() {
|
|
let {residentId} = this
|
|
this.instance.post("/app/appresidentvehicle/list", null, {
|
|
params: {residentId}
|
|
}).then(res => {
|
|
if (res?.data) {
|
|
this.form.cars = res.data.records || []
|
|
}
|
|
})
|
|
},
|
|
submitCars(cb) {
|
|
this.$refs.PersonalAssets.validate(v => {
|
|
if (v) {
|
|
let {residentId, form: {cars: residentVehicleList}} = this
|
|
this.instance.post("/app/appresidentvehicle/update", {
|
|
residentId, residentVehicleList
|
|
}).then(res => {
|
|
if (res?.code == 0) {
|
|
this.$message.success("提交成功")
|
|
this.getCars()
|
|
cb?.()
|
|
}
|
|
})
|
|
}
|
|
})
|
|
},
|
|
getHouses() {
|
|
let {residentId} = this
|
|
this.instance.post("/app/appresidenthouse/list", null, {
|
|
params: {residentId}
|
|
}).then(res => {
|
|
if (res?.data) {
|
|
this.form.houses = res.data.records || []
|
|
}
|
|
})
|
|
},
|
|
submitHouses(cb) {
|
|
this.$refs.PersonalAssets.validate(v => {
|
|
if (v) {
|
|
let {residentId, form: {houses: residentHouseList}} = this
|
|
this.instance.post("/app/appresidenthouse/update", {
|
|
residentId, residentHouseList
|
|
}).then(res => {
|
|
if (res?.code == 0) {
|
|
this.$message.success("提交成功")
|
|
this.getHouses()
|
|
cb?.()
|
|
}
|
|
})
|
|
}
|
|
})
|
|
}
|
|
},
|
|
created() {
|
|
this.getCars()
|
|
this.getHouses()
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.personalAssets {
|
|
}
|
|
</style>
|