kubbo/dvcp_v2_webapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

目录代码整合

Browse Source
This commit is contained in:
aixianling
2022-05-10 20:02:37 +08:00
parent 71049f7f65
commit 036ee91533
324 changed files with 4 additions and 8321 deletions
Download Patch File Download Diff File Expand all files Collapse all files

750
packages/grid/AppBuildManage/components/BuildMsg.vue Normal file
View File

@@ -0,0 +1,750 @@
<template>
<ai-list class="BuildMsg">
<!-- 标题 -->
<template #title>
<ai-title :title="params.communityName + '-' + params.buildingNumber + '号楼房屋信息'" isShowBack isShowBottomBorder
@onBackClick="cancel(false)"></ai-title>
</template>
<template #content>
<!-- 性别下拉选择框 -->
<ai-search-bar>
<template #left>
<ai-select v-model="search.livingStatus" placeholder="房屋状态" clearable @change=";(page.current = 1), getList()"
:selectList="dict.getDict('houselivingStatus')"></ai-select>
<ai-select v-model="search.existFlow" placeholder="有无流动人口" clearable @change=";(page.current = 1), getList()"
:selectList="dict.getDict('yesOrNo')"></ai-select>
</template>
<template #right>
<el-input v-model="search.houseCode" size="small" placeholder="请输入户号/户主" clearable
v-throttle="() => {page.current = 1, getList()}"
@clear=";(page.current = 1), (search.houseCode = ''), getList()" suffix-icon="iconfont iconSearch"/>
</template>
</ai-search-bar>
<ai-search-bar>
<template #left>
<div style="height: 32px"/>
</template>
<template #right>
<ai-import :instance="instance" :dict="dict" type="appcommunityhouseinfo" :importParams="houseImpParam" name="房屋信息"
@success="getList()">
<el-button icon="iconfont iconImport">导入房屋信息</el-button>
</ai-import>
<ai-download :instance="instance" url="/app/appcommunityhouseinfo/listExport" :params="houseExpParam"
fileName="房屋信息" style="margin-right: 10px">
<el-button icon="iconfont iconExported">导出房屋信息</el-button>
</ai-download>
<ai-import :instance="instance" :dict="dict" type="appcommunityhouseresident" :importParams="houseImpParam" name="人口信息"
@success="getList()">
<el-button icon="iconfont iconImport">导入人口信息</el-button>
</ai-import>
<ai-download :instance="instance" url="/app/appcommunityhouseresident/listExport" :params="houseExpParam"
fileName="人口信息">
<el-button icon="iconfont iconExported">导出人口信息</el-button>
</ai-download>
</template>
</ai-search-bar>
<ai-table :tableData="tableData" :col-configs="colConfigs" :total="total" ref="aitableex"
:current.sync="page.current" :size.sync="page.size" @getList="getList"
@selection-change="(v) => (ids = v.map((e) => e.id))">
<el-table-column slot="owner" label="房主" align="center">
<template slot-scope="{ row }">
<span v-for="(item, i) in row.owner" :key="i" v-if="item.name">
<span v-if="i < 2" style="margin-right: 5px;">
{{ item.name }}
</span>
</span>
</template>
</el-table-column>
<el-table-column slot="owner" label="联系方式" align="center">
<template slot-scope="{ row }">
<span v-for="(item, i) in row.owner" :key="i" v-if="item.phone">
<span v-if="i < 1">
{{ item.phone }}
</span>
</span>
</template>
</el-table-column>
<el-table-column slot="livingStatus" label="房屋状态" align="center">
<template slot-scope="{ row }">
{{ dict.getLabel('houselivingStatus', row.livingStatus) }}
</template>
</el-table-column>
<el-table-column slot="owner" label="流动人口" align="center">
<template slot-scope="{ row }">
<span>{{ row.existFlow == 1 ? '有' : '无' }}</span>
</template>
</el-table-column>
<el-table-column slot="options" label="操作" align="center" fixed="right" width="140">
<div class="table-options" slot-scope="{ row }">
<el-button type="text" @click="toEdit(row.id, 'edit')">编辑</el-button>
<el-button type="text" @click="toEdit(row.id, 'detail')">详情</el-button>
</div>
</el-table-column>
</ai-table>
<ai-dialog :title="isEdit ? '编辑居民户' : '居民户详情'" :visible.sync="dialogVisible" width="800px" customFooter>
<ai-wrapper label>
<div class="bulidmsg">
<span class="icon"></span>
<span class="bulidtext">房屋信息</span>
</div>
<ai-info-item label="所属社区">
{{ forms.areaName }}
</ai-info-item>
<ai-info-item label="房屋地址">
{{ forms.createAddress }}
</ai-info-item>
<ai-info-item label="房屋类型">
{{ dict.getLabel('communityBuildingType', forms.buildingType) }}
</ai-info-item>
<template v-if="!isEdit">
<ai-info-item label="房屋面积" prop="houseArea" class="line">
<span>{{ forms.houseArea }}</span
>&nbsp;<span v-if="forms.houseArea">m²</span>
</ai-info-item>
<ai-info-item label="居住现状" prop="livingStatus">
<span>{{ dict.getLabel('houselivingStatus', forms.livingStatus) }}</span>
</ai-info-item>
<ai-info-item label="房屋用途" prop="houseUse">
<span>{{ dict.getLabel('houseUseStatus', forms.houseUse) }}</span>
</ai-info-item>
<ai-info-item label="承租情况" prop="leaseSituation">
<span>{{ dict.getLabel('houseLeaseSituation', forms.leaseSituation) }}</span>
</ai-info-item>
<ai-info-item label="起租日期" prop="startDate">
{{ $dateFormat(forms.startDate) }}
</ai-info-item>
<ai-info-item label="备案证明" prop="isFilingCertificate">
<span>{{ dict.getLabel('isFilingCertificateStatus', forms.isFilingCertificate) }}</span>
</ai-info-item>
</template>
</ai-wrapper>
<el-form v-if="isEdit" :model="forms" ref="ruleForm" label-width="100px" label-suffix="：" align-items="center"
size="small">
<template>
<el-form-item label="房屋面积" prop="houseArea" class="house">
<el-input v-model="forms.houseArea" type="text" size="small" placeholder="请输入" suffix="m²">
<template slot="suffix">m²</template>
</el-input>
</el-form-item>
<div class="family-hose">
<el-form-item label="居住现状">
<el-radio-group v-model="forms.livingStatus">
<el-radio label="0">自用</el-radio>
<el-radio label="1">出租</el-radio>
<el-radio label="2">闲置</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="房屋用途">
<el-radio-group v-model="forms.houseUse">
<el-radio label="0">居住</el-radio>
<el-radio label="1">闲置</el-radio>
<el-radio label="2">经营</el-radio>
</el-radio-group>
</el-form-item>
</div>
<div class="family-hose">
<el-form-item label="承租情况" prop="leaseSituation">
<ai-select v-model="forms.leaseSituation" placeholder="请选择" clearable
@change=";(page.current = 1), getList()" :selectList="dict.getDict('houseLeaseSituation')"
size="small"></ai-select>
</el-form-item>
<el-form-item label="起租日期" prop="startDate">
<el-date-picker v-model="forms.startDate" type="date" placeholder="选择日期" size="small"
value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
</el-form-item>
</div>
<el-form-item label="备案证明" prop="isFilingCertificate">
<el-radio-group v-model="forms.isFilingCertificate">
<el-radio label="0">有租赁房备案证明</el-radio>
<el-radio label="1">无租赁房备案证明</el-radio>
</el-radio-group>
</el-form-item>
</template>
</el-form>
<!-- 房主信息 -->
<div class="table">
<div class="msg">
<b class="house-msg">
<span class="icon"></span>
<span class="msg">房主信息</span>
</b>
<div class="button">
<ai-person-select :instance="instance" @selectPerson="getOwners" ref="getOwner" :chooseUserList="owners"
:isMultiple="true" v-if="isEdit"/>
</div>
</div>
<ai-table :tableData="owners" :col-configs="owner" ref="aitableex">
<el-table-column slot="owner" label="居民类型" align="center">
<template slot-scope="{ row }">
{{ dict.getLabel('BulidResidentType', row.residentType) }}
</template>
</el-table-column>
<el-table-column slot="owner" label="特殊人群" align="center" v-if="!isEdit">
<template slot-scope="{ row }">
{{ row.tips }}
</template>
</el-table-column>
<el-table-column slot="owner" label="与户主关系" align="center" v-if="isEdit">
<template slot-scope="{ row }">
<ai-select v-model="row.relation" placeholder="与户主关系" clearable
:selectList="$dict.getDict('householdRelation')"></ai-select>
</template>
</el-table-column>
<el-table-column slot="owner" label="与户主关系" align="center" v-if="!isEdit">
<template slot-scope="{ row }">
{{ dict.getLabel('householdRelation', row.relation) }}
</template>
</el-table-column>
<el-table-column slot="options" label="操作" align="center" v-if="isEdit">
<template slot-scope="scope">
<el-button type="text" @click="remove(scope.$index, 'owners')">删除</el-button>
</template>
</el-table-column>
</ai-table>
</div>
<!-- 承租人信息 -->
<div class="table">
<div class="msg">
<b class="house-msg">
<span class="icon"></span>
<span class="msg">承租人信息</span>
</b>
<div class="button">
<ai-person-select :instance="instance" @selectPerson="getRenters" :chooseUserList="renters"
:isMultiple="true" v-if="isEdit"/>
</div>
</div>
<ai-table :tableData="renters" :col-configs="renter" ref="aitableex">
<el-table-column slot="renters" label="居民类型" align="center">
<template slot-scope="{ row }">
{{ dict.getLabel('BulidResidentType', row.residentType) }}
</template>
</el-table-column>
<el-table-column slot="renters" label="特殊人群" align="center" v-if="!isEdit">
<template slot-scope="{ row }">
{{ row.tips }}
</template>
</el-table-column>
<el-table-column slot="renters" label="与户主关系" align="center" v-if="isEdit">
<template slot-scope="{ row }">
<ai-select v-model="row.relation" placeholder="与户主关系" clearable
:selectList="$dict.getDict('householdRelation')"></ai-select>
</template>
</el-table-column>
<el-table-column slot="renters" label="与户主关系" align="center" v-if="!isEdit">
<template slot-scope="{ row }">
{{ dict.getLabel('householdRelation', row.relation) }}
</template>
</el-table-column>
<el-table-column slot="options" label="操作" align="center" v-if="isEdit">
<template slot-scope="scope">
<el-button type="text" @click="remove(scope.$index, 'renters')">删除</el-button>
</template>
</el-table-column>
</ai-table>
</div>
<!-- 实际居住人员 -->
<div class="table">
<div class="msg">
<b class="house-msg">
<span class="icon"></span>
<span class="msg">实际居住人员</span>
</b>
<div class="button" v-if="isEdit">
<ai-person-select :instance="instance" @selectPerson="getLives" :isMultiple="true"
:chooseUserList="lives"/>
</div>
</div>
<ai-table :tableData="lives" :col-configs="live" ref="aitableex">
<el-table-column slot="lives" label="居民类型" align="center">
<template slot-scope="{ row }">
{{ dict.getLabel('BulidResidentType', row.residentType) }}
</template>
</el-table-column>
<el-table-column slot="lives" label="特殊人群" align="center" v-if="!isEdit">
<template slot-scope="{ row }">
{{ row.tips }}
</template>
</el-table-column>
<el-table-column slot="lives" label="与户主关系" align="center" v-if="isEdit">
<template slot-scope="{ row }">
<ai-select v-model="row.relation" placeholder="与户主关系" clearable
:selectList="$dict.getDict('householdRelation')"></ai-select>
</template>
</el-table-column>
<el-table-column slot="lives" label="与户主关系" align="center" v-if="!isEdit">
<template slot-scope="{ row }">
{{ dict.getLabel('householdRelation', row.relation) }}
</template>
</el-table-column>
<el-table-column slot="options" label="操作" align="center" v-if="isEdit">
<template slot-scope="scope">
<el-button type="text" @click="remove(scope.$index, 'lives')">删除</el-button>
</template>
</el-table-column>
</ai-table>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">{{ isEdit ? '取消' : '关闭' }}</el-button>
<el-button type="primary" @click="report" v-if="isEdit">确认</el-button>
</span>
</ai-dialog>
</template>
</ai-list>
</template>
<script>
export default {
name: 'BuildMsg',
components: {},
props: {
dict: Object,
params: Object,
instance: Function,
},
data() {
return {
id: '',
page: {
current: 1,
size: 10,
},
total: 0,
search: {
livingStatus: '',
houseCode: '',
},
colConfigs: [
{prop: 'unitNumber', label: '单元', align: 'center'},
{prop: 'houseCode', label: '户号', align: 'center'},
{prop: 'livingNumber', label: '住户数', align: 'center'},
{slot: 'owner', label: '户主', align: 'center'},
{slot: 'livingStatus', align: 'center'},
{slot: 'options', label: '操作', align: 'center'},
],
tableData: [],
dialogVisible: false,
forms: {
houseArea: '',
livingStatus: 0,
houseUse: 0,
leaseSituation: '',
isFilingCertificate: '',
},
owners: [],
owner: [
{prop: 'name', label: '姓名', align: 'center'},
{prop: 'idNumber', label: '身份证号', align: 'center'},
{prop: 'phone', label: '联系方式', align: 'center'},
{slot: 'owner', align: 'center'},
{
slot: 'relation',
align: 'center',
},
{slot: 'options', label: '操作', align: 'center'},
],
renters: [],
renter: [
{prop: 'name', label: '姓名', align: 'center'},
{prop: 'idNumber', label: '身份证号', align: 'center'},
{prop: 'phone', label: '联系方式', align: 'center'},
{
slot: 'relation',
align: 'center',
},
{slot: 'renters', align: 'center'},
{slot: 'options', label: '操作', align: 'center'},
],
lives: [],
live: [
{prop: 'name', label: '姓名', align: 'center'},
{prop: 'idNumber', label: '身份证号', align: 'center'},
{prop: 'phone', label: '联系方式', align: 'center'},
{
slot: 'relation',
align: 'center',
},
{slot: 'lives', align: 'center'},
{slot: 'options', label: '操作', align: 'center'},
],
type: '',
ids: '',
buildingId: '',
}
},
computed: {
houseImpParam() {
return {
buildingId: this.params.id,
}
},
houseExpParam() {
return {
buildingId: this.params.id,
}
},
isEdit() {
return this.type == 'edit'
},
},
watch: {},
created() {
this.dict.load('yesOrNo', 'houselivingStatus', 'houseLeaseSituation', 'isFilingCertificateStatus', 'houseUseStatus', 'BulidResidentType', 'communityBuildingType', 'householdRelation').then(() => {
this.getList()
})
},
mounted() {
},
methods: {
getList() {
this.instance
.post(`/app/appcommunityhouseinfo/list`, null, {
params: {
...this.page,
...this.search,
buildingId: this.params.id,
},
})
.then((res) => {
if (res.code == 0) {
this.tableData = res.data.records
this.total = res.data.total
}
})
},
// 返回按钮
cancel(isRefresh) {
this.$emit('change', {
type: 'list',
isRefresh: !!isRefresh,
})
},
// 确认增加和编辑
report() {
this.instance
.post(`/app/appcommunityhouseinfo/update`, {
...this.forms,
id: this.id,
owner: this.owners,
renter: this.renters,
live: this.lives,
})
.then((res) => {
if (res.code == 0) {
this.$message.success('提交成功')
this.dialogVisible = false
this.getList()
}
})
},
// 详情 和 编辑
toEdit(id, type) {
this.id = id
this.type = type
this.instance.post(`/app/appcommunityhouseinfo/queryDetailById?&id=${id}`).then((res) => {
if (res.code == 0) {
this.forms = res.data
this.owners = this.forms.owner
this.renters = this.forms.renter
this.lives = this.forms.live
}
})
this.dialogVisible = true
},
// 删除
remove(index, source) {
this.$confirm('确定删除该数据？').then(() => {
this[source].splice(index, 1)
})
},
// 选择人员
getOwners(val) {
let listNew = []
let newName = []
for (var i = 0; i < val.length; i++) {
if (newName.indexOf(val[i].name) == -1) {
newName.push(val[i].name)
listNew.push(val[i])
}
}
this.owners = listNew
},
getRenters(val) {
let listNew = []
let newName = []
for (var i = 0; i < val.length; i++) {
if (newName.indexOf(val[i].name) == -1) {
newName.push(val[i].name)
listNew.push(val[i])
}
}
this.renters = listNew
},
getLives(val) {
let listNew = []
let newName = []
for (var i = 0; i < val.length; i++) {
if (newName.indexOf(val[i].name) == -1) {
newName.push(val[i].name)
listNew.push(val[i])
}
}
this.lives = listNew
},
},
}
</script>
<style lang="scss" scoped>
.BuildMsg {
::v-deep .ai-list__title {
background-color: #fff;
margin: 0 !important;
padding-left: 20px;
}
::v-deep .ai-list__content {
.ai-list__content--right {
.ai-list__content--right-wrapper {
.search-select {
display: flex;
justify-content: space-between;
border-bottom: 1px solid #eee;
padding-bottom: 10px;
.left {
width: 30%;
.ai-select {
display: inline-block;
}
.ai-select:first-child {
margin-right: 15px;
}
}
.right {
width: 20%;
}
}
.bar {
display: flex;
justify-content: space-between;
margin-top: 10px;
.export {
.ai-import {
display: inline-block;
margin-right: 10px;
}
.ai-download {
display: inline-block;
}
}
.import {
.ai-import {
display: inline-block;
margin-right: 10px;
}
.ai-download {
display: inline-block;
}
}
}
.ai-dialog__wrapper {
background-color: #fff;
.el-dialog__wrapper {
.el-dialog__body {
.ai-dialog__content {
.ai-dialog__content--wrapper {
.ai-wrapper {
padding-left: 0 !important;
.bulidmsg {
height: 32px;
line-height: 32px;
width: 100%;
margin: 0 0 15px 20px;
.icon {
border-left: 2px solid #2266ff;
}
.bulidtext {
display: inline-block;
margin-left: 9px;
color: #222;
font-size: 15px;
font-weight: 800;
}
}
.create {
width: 100% !important;
.ai-info-item__left {
width: 78px;
margin-right: 22px;
}
}
.Address {
.ai-info-item__left {
width: 78px;
margin-right: 22px;
}
}
.building {
padding-left: 40px;
.ai-info-item__left {
width: 78px;
margin-right: 22px;
}
}
}
.el-form {
padding: 20px 0 0 0;
.house {
width: 50%;
.el-form-item__content {
width: 63%;
}
}
.family-hose {
display: flex;
justify-content: space-between;
}
.line {
width: 50% !important;
padding-right: 40px;
.el-form-item__content {
.el-input {
.el-input__suffix {
color: #666;
margin-right: 5px;
}
}
}
}
}
.table {
padding: 20px 20px 0 20px;
.msg {
display: flex;
justify-content: space-between;
.house-msg {
height: 32px;
line-height: 32px;
.icon {
border-left: 2px solid #2266ff;
}
.msg {
display: inline-block;
color: #222;
font-size: 15px;
font-weight: 800;
margin-left: 9px;
}
}
// .button {
// }
}
.ai-table {
margin-top: 10px;
// .el-table {
// }
.pagination {
display: none;
}
}
}
}
}
}
}
}
}
}
}
}
</style>