xiaobei
/
xmf_saas_web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

住户

Browse Source
main
bibi 3 years ago
parent a63c3369e0
commit 73b4da2eaf
2 changed files with 275 additions and 230 deletions
Show Stats Download Patch File Download Diff File

36
src/views/Basic/EstateInfo/_houseHoldInfo/depend/config.js
Unescape View File

@ -6,17 +6,14 @@ export const columns = [
{ {
title: "住户姓名", title: "住户姓名",
dataIndex: "name", dataIndex: "name",
width: "8%",
}, },
{ {
title: "住户手机号", title: "住户手机号",
dataIndex: "tel", dataIndex: "tel",
width: "10%",
}, },
{ {
title: "住户性别", title: "住户性别",
dataIndex: "sex", dataIndex: "sex",
width: "7%",
customRender:function(sex){ customRender:function(sex){
switch (sex) { switch (sex) {
case 1: case 1:
@ -33,24 +30,45 @@ export const columns = [
{ {
title: "住户身份证号", title: "住户身份证号",
dataIndex: "idCard", dataIndex: "idCard",
width: "14%",
}, },
{
title: "操作",
dataIndex: "action",
key: "action",
width: "180",
fixed: "right",
scopedSlots: { customRender: "action" },
},
]
export const columns_house = [
{ {
title: "房屋名称", title: "房屋名称",
dataIndex: "manageBuildingName", dataIndex: "manageBuildingName",
scopedSlots: { customRender: "name" }, scopedSlots: { customRender: "name" },
width: "25%", width: "44%",
}, },
{ {
title: "房屋类型", title: "房屋类型",
dataIndex: "manageEstateTypeName", dataIndex: "manageEstateTypeName",
width: "10%", width: "20%",
}, },
{ {
title: "用户身份", title: "住户身份",
key: "tags",
dataIndex: "identity", dataIndex: "identity",
scopedSlots: { customRender: "tags" }, customRender:function(identity){
switch (identity) {
case 1:
return '业主'
case 2:
return '业主亲属'
case 3:
return '租户'
case 4:
return '租户亲属'
default:
break;
}
},width: "20%",
}, },
{ {
title: "操作", title: "操作",

467
src/views/Basic/EstateInfo/_houseHoldInfo/index.vue
Unescape View File

@ -5,14 +5,22 @@
<a-row> <a-row>
<a-col :span="20"> <a-col :span="20">
<a-space size="large"> <a-space size="large">
<a-select v-model='searchForm.sex' style="width: 200px" placeholder="请选择性别" > <a-select
v-model="searchForm.sex"
style="width: 200px"
placeholder="请选择性别"
>
<a-select-option value="1">男</a-select-option> <a-select-option value="1">男</a-select-option>
<a-select-option value="2">女</a-select-option> <a-select-option value="2">女</a-select-option>
<a-select-option value="3">保密</a-select-option> <a-select-option value="3">保密</a-select-option>
</a-select> </a-select>
<a-input v-model='searchForm.keyword' style="width: 200px" placeholder="请输入关键字（姓名/手机号）" /> <a-input
<a-button type="primary" @click='getData'>查 询</a-button> v-model="searchForm.keyword"
<a-button @click='reset'>重 置</a-button> style="width: 200px"
placeholder="请输入关键字（姓名/手机号）"
/>
<a-button type="primary" @click="getData">查 询</a-button>
<a-button @click="reset">重 置</a-button>
</a-space> </a-space>
</a-col> </a-col>
<a-col :span="4"> <a-col :span="4">
@ -21,35 +29,13 @@
</a-row> </a-row>
</div> </div>
<div class="main"> <div class="main">
<div style="margin-bottom: 16px">
<!-- 批量操作 -->
<a-select
type="primary"
v-model="activeAction"
:disabled="!hasSelected"
:loading="loading"
style="width: 120px"
@change="Actions"
placeholder="请选择操作"
>
批量
<a-select-option v-for="item in ActionsList" :key="item.value">
{{ item.label }}
</a-select-option>
</a-select>
<span style="margin-left: 8px">
<template v-if="hasSelected">
{{ `已选择 ${selectedRowKeys.length} 条` }}
</template>
</span>
</div>
<!-- 表格 --> <!-- 表格 -->
<a-table <a-table
:columns="columns" :columns="columns"
:data-source="tableData" :data-source="tableData"
:pagination="pagination" :pagination="pagination"
:scroll="{ x: 1400 }" :scroll="{ x: 1400 }"
@change="handleTableChange" @change="handleTableChange"
:row-selection="{ :row-selection="{
selectedRowKeys: selectedRowKeys, selectedRowKeys: selectedRowKeys,
onChange: selectionChoosed, onChange: selectionChoosed,
@ -60,274 +46,315 @@
} }
" "
> >
<span slot="name" slot-scope="text, row">
<a-select style="width :100%" @change='changeHouse' placeholder='请选择房屋'>
<a-select-option v-for="item,index in row.residentListEstateVoList" :key='index' :value="item.id" @click="chooseHouse(row)">
{{
item.manageBuildingName +
"栋/" +
item.manageUnitName +
"单元/" +
item.floorLocation +
"层-" +
item.manageEstateName +
"室"
}}
</a-select-option>
</a-select>
</span>
<span slot="action" slot-scope="text, row"> <span slot="action" slot-scope="text, row">
<a-space> <a-space>
<a class="ant-dropdown-link" @click="edit(row)">编辑</a> <a class="ant-dropdown-link" @click="houseManage(row)">房屋管理</a>
<a class="ant-dropdown-link" @click="show.in=true,inform.residentId = row.id">迁入</a> <a class="ant-dropdown-link" @click="edit(row)">编辑</a>
<a class="ant-dropdown-link" @click="out(row)">迁出</a> <a
</a-space> class="ant-dropdown-link"
</span> @click="(show.in = true), (inform.residentId = row.id)"
<span slot="tags" slot-scope="tag"> >迁入</a
<a-tag >
:color="tag === 1 ? 'volcano' : tag === 2 ? 'geekblue' : tag === 3 ? 'geekblue' : 'red'" </a-space>
>
{{ tag === 1 ? "业主" : tag === 2 ? "业主亲属" :tag === 3 ? "租户":tag === 4 ? "租户亲属":'-' }}
</a-tag>
</span> </span>
</a-table> </a-table>
</div> </div>
<add-form :show="show.add" :editId="editId" @close='close' @success='success'></add-form> <!-- 新增住户 -->
<a-modal <add-form
title="迁入" :show="show.add"
:visible="show.in" :editId="editId"
@ok="insubmit" @close="close"
@cancel="inclose" @success="success"
> ></add-form>
<!-- 迁入提交 -->
<a-modal title="迁入" :visible="show.in" @ok="insubmit" @cancel="inclose">
<div> <div>
<a-form-model <a-form-model
ref="ruleForm" ref="ruleForm"
:model="inform" :model="inform"
:rules="rules" :rules="rules"
layout="vertical" layout="vertical"
> >
<a-form-model-item label="关联房屋" prop="estateId"> <a-form-model-item label="关联房屋" prop="estateId">
<a-cascader <a-cascader
:options="estateData" :options="estateData"
v-model="estateArr" v-model="estateArr"
:field-names="{ label: 'name', value: 'id', children: 'childList' }" :field-names="{
placeholder="楼栋/单元/房间号" label: 'name',
@change="onChange" value: 'id',
style="width: 90%" children: 'childList',
/> }"
</a-form-model-item> placeholder="楼栋/单元/房间号"
<a-form-model-item label="住户身份" prop="identity"> @change="onChange"
<a-select v-model="inform.identity" placeholder="请选择住户身份" style="width: 90%"> style="width: 90%"
<a-select-option v-for="item in options.identity" :key="item.id" :value="item.id">{{item.name}}</a-select-option> />
</a-select> </a-form-model-item>
</a-form-model-item> <a-form-model-item label="住户身份" prop="identity">
<a-form-model-item label="房屋租户" prop="linkUserId" v-if="inform.identity===4"> <a-select
<a-select v-model="inform.linkUserId" placeholder="请选择住户身份" style="width: 90%"> v-model="inform.identity"
<a-select-option v-for="item in options.tenant" :key="item.id" :value="item.id">{{item.name}}</a-select-option> placeholder="请选择住户身份"
</a-select> style="width: 90%"
</a-form-model-item> >
</a-form-model> <a-select-option
</div> v-for="item in options.identity"
:key="item.id"
:value="item.id"
>{{ item.name }}</a-select-option
>
</a-select>
</a-form-model-item>
<a-form-model-item
label="房屋租户"
prop="linkUserId"
v-if="inform.identity === 4"
>
<a-select
v-model="inform.linkUserId"
placeholder="请选择住户身份"
style="width: 90%"
>
<a-select-option
v-for="item in options.tenant"
:key="item.id"
:value="item.id"
>{{ item.name }}</a-select-option
>
</a-select>
</a-form-model-item>
</a-form-model>
</div>
</a-modal> </a-modal>
<!-- 住户房屋管理 -->
<a-drawer
title="查看房屋"
:width="1000"
:visible="show.detail"
:body-style="{ paddingBottom: '80px' }"
@close="onClose"
>
<div class="drawer-content">
房屋信息
<a-divider></a-divider>
<a-table
:columns="columns_house"
:data-source="table_house"
:pagination="false"
:row-key="
(record, index) => {
return index;
}
"
>
<span slot="name" slot-scope="text, row">
{{
row.manageBuildingName +
"栋/" +
row.manageUnitName +
"单元/" +
row.floorLocation +
"层-" +
row.name +
"室"
}}
</span>
<span slot="action" slot-scope="text, row">
<a-space>
<a class="ant-dropdown-link" @click="out(row)">迁出</a>
</a-space>
</span>
</a-table>
</div>
<div class="drawer-footer">
<a-button :style="{ marginRight: '8px' }" @click="onClose">
关闭
</a-button>
</div>
</a-drawer>
</div> </div>
</template> </template>
<script> <script>
import { columns,pagination,searchForm, rules } from './depend/config.js' import {
import { estate } from '@/api/basic/estate' columns,
import { residentList, moveIn, moveOut, findTenantByEstateId } from '@/api/basic/resident' pagination,
import addForm from './depend/addForm.vue' searchForm,
rules,
columns_house,
} from "./depend/config.js";
import { estate } from "@/api/basic/estate";
import {
residentList,
moveIn,
moveOut,
findTenantByEstateId,
} from "@/api/basic/resident";
import addForm from "./depend/addForm.vue";
export default { export default {
components:{ components: {
addForm addForm,
}, },
data() { data() {
return { return {
editId:null, columns_house,
form: { editId: null,
identity: 2 inform: {
}, estateId: undefined,
inform:{ residentId: undefined,
estateId:undefined, identity: undefined,
residentId:undefined, linkUserId: undefined,
identity:undefined,
linkUserId:undefined,
}, },
estateArr:[], estateArr: [],
estateData:[], estateData: [],
rules, rules,
show: { show: {
add: false, add: false,
in:false, in: false,
detail:{} detail: false,
}, },
table_row:{},
changeId:null,
loading: false,
pagination, pagination,
searchForm, searchForm,
activeAction: undefined,
// 选择的index
selectedRowKeys: [], selectedRowKeys: [],
// 分页 // 分页
// 列 // 列
columns, columns,
newData:[], holderInfo: {},
// 数据 // 数据
tableData:[], tableData: [],
options:{ table_house: [],
identity:[ options: {
{ id:1, name:'业主' }, identity: [
{ id:2, name:'业主亲属' }, { id: 1, name: "业主" },
{ id:3, name:'租户' }, { id: 2, name: "业主亲属" },
{ id:4, name:'租户亲属' }, { id: 3, name: "租户" },
{ id: 4, name: "租户亲属" },
], ],
tenant:[] tenant: [],
}, },
ActionsList: [
// {
// label: "批量删除",
// value: 1,
// },
// {
// label: "批量导出",
// value: 2,
// },
],
}; };
}, },
mounted(){ mounted() {
this.getData() this.getData();
this.getEstate() this.getEstate();
}, },
methods: { methods: {
async getData() { async getData() {
const res = await residentList({ const res = await residentList({
pageNum: this.pagination.current, pageNum: this.pagination.current,
size :this.pagination.pageSize, size: this.pagination.pageSize,
...this.searchForm ...this.searchForm,
}) });
this.tableData = res.data.rows this.tableData = res.data.rows;
this.pagination.total = res.data.total this.pagination.total = res.data.total;
},
houseManage(data) {
console.log(data);
this.holderInfo = data;
this.table_house = data.residentListEstateVoList;
this.show.detail = true;
}, },
// 所有房屋 // 所有房屋
async getEstate(){ async getEstate() {
let res = await estate() let res = await estate();
this.estateData = res.data this.estateData = res.data;
this.estateDisable(this.estateData) this.estateDisable(this.estateData);
}, },
estateDisable(arr){ estateDisable(arr) {
arr.forEach((item,index)=>{ arr.forEach((item, index) => {
if(!item.manageEstateTypeName && item.childList.length === 0){ if (!item.manageEstateTypeName && item.childList.length === 0) {
arr[index].disabled = true arr[index].disabled = true;
}else if(item.manageEstateTypeName || item.childList.length > 0){ } else if (item.manageEstateTypeName || item.childList.length > 0) {
arr[index].disabled = false arr[index].disabled = false;
}else{ } else {
this.estateDisable(item.childList) this.estateDisable(item.childList);
} }
}) });
}, },
// 重置 // 重置
reset(){ reset() {
this.searchForm = { this.searchForm = {
keyword: "", keyword: "",
sex: undefined, sex: undefined,
} };
this.getData() this.getData();
}, },
// 编辑住户 // 编辑住户
edit(data){ edit(data) {
this.editId = data.id this.editId = data.id;
this.show.add = true; this.show.add = true;
}, },
// form提交成功的回调 // form提交成功的回调
close(){ close() {
this.show.add = false; this.show.add = false;
this.editId = null this.editId = null;
}, },
// form提交成功的回调 // form提交成功的回调
success(){ success() {
this.getData() this.getData();
},
// 表格行切换房屋
changeHouse(value){
// 选中的行
this.tableData.forEach((item,index)=>{
if(item.id === this.table_row.id) {
item.residentListEstateVoList.forEach((items)=>{
if(items.id === value){
this.$set(this.tableData[index],'identity' ,items.identity )
this.$set(this.tableData[index],'manageEstateTypeName' ,items.manageEstateTypeName )
this.$set(this.tableData[index],'houseId' ,items.id )
}
})
}
})
},
chooseHouse(row){
this.table_row = row
}, },
handleTableChange(pagination) { handleTableChange(pagination) {
const pager = { ...this.pagination }; const pager = { ...this.pagination };
pager.current = pagination.current; pager.current = pagination.current;
pager.pageSize = pagination.pageSize; pager.pageSize = pagination.pageSize;
this.pagination = pager; this.pagination = pager;
this.getData() this.getData();
},
Actions(data) {
console.log(data);
this.activeAction = undefined;
}, },
selectionChoosed(data) { selectionChoosed(data) {
this.selectedRowKeys = data; this.selectedRowKeys = data;
}, },
async insubmit(){// 迁入提交 async insubmit() {
// 迁入提交
console.log(this.inform); console.log(this.inform);
this.$refs.ruleForm.validate(async valid => { this.$refs.ruleForm.validate(async (valid) => {
if(valid){let res = await moveIn(this.inform) if (valid) {
if(res.code === 200){ let res = await moveIn(this.inform);
this.$message.success(res.msg) if (res.code === 200) {
this.getData() this.$message.success(res.msg);
this.inclose() this.getData();
}else{ this.inclose();
this.$message.error(res.msg) } else {
}} this.$message.error(res.msg);
}) }
}
});
},
onClose() {
this.show.detail = false;
}, },
inclose(){ inclose() {
this.$refs.ruleForm.resetFields(); this.$refs.ruleForm.resetFields();
this.estateArr = [] this.estateArr = [];
this.show.in = false this.show.in = false;
}, },
out(data) {// 迁出 out(data) {
if(!data.houseId) { console.log(data);
this.$message.error('请先选择房屋') // 迁出
return
}
this.$confirm({ this.$confirm({
title: "是否迁出", title: "是否迁出",
// okText:'删除', // okText:'删除',
// cancelText:'取消', // cancelText:'取消',
icon: "logout", icon: "logout",
onOk:async ()=> { onOk: async () => {
let res = await moveOut({estateId:data.houseId,residentId:data.id}) let res = await moveOut({
if(res.code === 200){ estateId: data.id,
this.$message.success(res.msg) residentId: this.holderInfo.id,
this.getData() });
}else{ if (res.code === 200) {
this.$message.error(res.msg) this.$message.success(res.msg);
this.getData();
this.onClose();
} else {
this.$message.error(res.msg);
} }
}, },
}); });
}, },
onChange(value, selectedOptions){ onChange(value, selectedOptions) {
if(value.length > 0){ if (value.length > 0) {
this.inform.estateId = value[value.length - 1]; this.inform.estateId = value[value.length - 1];
findTenantByEstateId({estateId:this.inform.estateId}).then(res =>{ findTenantByEstateId({ estateId: this.inform.estateId }).then((res) => {
this.options.tenant = res.data this.options.tenant = res.data;
}) });
}else{ } else {
this.inform.estateId = undefined; this.inform.estateId = undefined;
} }
}, },
@ -342,7 +369,7 @@ export default {
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
/deep/.ant-upload.ant-upload-select-picture-card{ /deep/.ant-upload.ant-upload-select-picture-card {
width: 240px; width: 240px;
height: 160px; height: 160px;
} }

Write Preview
Loading…
Cancel
Save