|
|
<template>
|
|
|
<!-- 基于 Element UI 新增和修改弹窗 -->
|
|
|
<el-dialog
|
|
|
:title="!dataForm.id ? '新增祈愿' : '修改祈愿'"
|
|
|
:close-on-click-modal="false"
|
|
|
:visible.sync="visible"
|
|
|
width="80%">
|
|
|
<!-- 新增和修改表单 -->
|
|
|
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataSubmit()" label-width="100px">
|
|
|
<!-- 第一行：业主类型、祈愿人、房屋名称 -->
|
|
|
<el-row :gutter="20">
|
|
|
<el-col :span="8">
|
|
|
<el-form-item label="业主类型" prop="ownerType">
|
|
|
<el-select v-model="dataForm.ownerType" placeholder="请选择业主类型" clearable style="width: 100%"
|
|
|
@change="handleOwnerTypeChange" filterable>
|
|
|
<el-option
|
|
|
v-for="dict in dict.type.owner_type"
|
|
|
:key="dict.value"
|
|
|
:label="dict.label"
|
|
|
:value="dict.value"
|
|
|
/>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item :label="dataForm.ownerType === '1' ? '祈愿人' : '祈愿人'" prop="ownerId">
|
|
|
<el-select v-if="dataForm.ownerType === '1'" v-model="dataForm.ownerId" placeholder="请选择业主" clearable
|
|
|
style="width: 100%" @change="handleOwnerChange" filterable>
|
|
|
<el-option
|
|
|
v-for="item in ownerList"
|
|
|
:key="item.id"
|
|
|
:label="item.ownerName"
|
|
|
:value="item.id"
|
|
|
/>
|
|
|
</el-select>
|
|
|
<el-select v-else-if="dataForm.ownerType === '2'" v-model="dataForm.ownerId" placeholder="请选择租户" clearable
|
|
|
style="width: 100%" @change="handleOwnerChange" filterable>
|
|
|
<el-option
|
|
|
v-for="item in tenantList"
|
|
|
:key="item.id"
|
|
|
:label="item.tenantName"
|
|
|
:value="item.id"
|
|
|
/>
|
|
|
</el-select>
|
|
|
<el-select v-else v-model="dataForm.ownerId" placeholder="请先选择业主类型" clearable disabled style="width: 100%"></el-select>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item label="房屋名称" prop="houseId">
|
|
|
<el-select v-model="dataForm.houseId" placeholder="选择房屋" clearable style="width: 100%"
|
|
|
@change="handleHouseChange" filterable>
|
|
|
<el-option
|
|
|
v-for="item in ownerHouseList"
|
|
|
:key="item.id"
|
|
|
:label="`${item.unitNo}单元 ${item.floorNo}层 ${item.houseNo}室`"
|
|
|
:value="item.id"
|
|
|
/>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
|
|
|
<!-- 第二行：提交渠道、联系方式 -->
|
|
|
<el-row :gutter="20">
|
|
|
<el-col :span="8">
|
|
|
<el-form-item label="提交渠道" prop="submitChannel">
|
|
|
<el-select v-model="dataForm.submitChannel" placeholder="请选择提交渠道" clearable style="width: 100%" filterable>
|
|
|
<el-option
|
|
|
v-for="dict in dict.type.submit_channel"
|
|
|
:key="dict.value"
|
|
|
:label="dict.label"
|
|
|
:value="dict.value"
|
|
|
/>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item label="联系方式" prop="phone">
|
|
|
<el-input v-model="dataForm.phone" placeholder="联系方式"></el-input>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item label="类型" prop="csType" style="display: none;">
|
|
|
<el-input v-model="dataForm.csType" placeholder="类型" readonly></el-input>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
|
|
|
<!-- 第三行：提交时间 -->
|
|
|
<el-row :gutter="20">
|
|
|
<el-col :span="8">
|
|
|
<el-form-item label="提交时间" prop="submitTime">
|
|
|
<el-date-picker v-model="dataForm.submitTime" type="datetime" placeholder="选择提交时间" style="width: 100%"></el-date-picker>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
|
|
|
<!-- 内容 -->
|
|
|
<el-row :gutter="20">
|
|
|
<el-col :span="24">
|
|
|
<el-form-item label="祈愿内容" prop="csContent">
|
|
|
<el-input v-model="dataForm.csContent" placeholder="请输入祈愿内容" type="textarea" :rows="4"></el-input>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
|
|
|
<!-- 隐藏的字段 -->
|
|
|
<el-form-item label="房屋业主id" prop="houseOwnerId" v-show="false">
|
|
|
<el-input v-model="dataForm.houseOwnerId" placeholder="房屋业主id" readonly></el-input>
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-form>
|
|
|
<span slot="footer" class="dialog-footer">
|
|
|
<el-button @click="visible = false">取消</el-button>
|
|
|
<el-button type="primary" @click="dataSubmit()">确定</el-button>
|
|
|
</span>
|
|
|
</el-dialog>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import * as api from '@/api/pmcomplaintsuggestion.js'
|
|
|
import * as ownerApi from '@/api/pmowner.js'
|
|
|
import * as tenantApi from '@/api/pmtenant.js'
|
|
|
import * as tenantHouseApi from '@/api/pmtenanthouse.js'
|
|
|
import * as houseApi from '@/api/pmhouse.js'
|
|
|
import * as ownerHouseRelApi from '@/api/pmownerhouserel.js'
|
|
|
import * as tenantHouseRelApi from '@/api/pmtenanthouserel.js'
|
|
|
export default {
|
|
|
dicts: ['owner_type', 'submit_channel', 'suggestion_status'],
|
|
|
data () {
|
|
|
return {
|
|
|
visible: false,
|
|
|
ownerList: [],
|
|
|
tenantList: [],
|
|
|
ownerHouseList: [], // 所选祈愿人的房屋列表
|
|
|
dataForm: {
|
|
|
id: 0,
|
|
|
csType: '' ,
|
|
|
status: '1' ,
|
|
|
csContent: '' ,
|
|
|
submitChannel: '' ,
|
|
|
submitTime: '' ,
|
|
|
phone: '' ,
|
|
|
ownerType: '' ,
|
|
|
ownerId: '' ,
|
|
|
houseId: '' ,
|
|
|
houseOwnerId: ''
|
|
|
},
|
|
|
dataRule: {
|
|
|
ownerType: [
|
|
|
{ required: true, message: '业主类型为必填项', trigger: 'blur' }
|
|
|
],
|
|
|
ownerId: [
|
|
|
{ required: true, message: '祈愿人为必填项', trigger: 'blur' }
|
|
|
],
|
|
|
houseId: [
|
|
|
{ required: true, message: '房屋为必填项', trigger: 'blur' }
|
|
|
],
|
|
|
csContent: [
|
|
|
{ required: true, message: '祈愿内容为必填项', trigger: 'blur' }
|
|
|
]
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
mounted() {
|
|
|
this.handleGetOwnerList()
|
|
|
this.handleGetTenantList()
|
|
|
},
|
|
|
methods: {
|
|
|
// 获取业主列表
|
|
|
handleGetOwnerList() {
|
|
|
ownerApi.pmownerListApi({page: 1, limit: 9999}).then(res => {
|
|
|
this.ownerList = res.list || []
|
|
|
})
|
|
|
},
|
|
|
// 获取租户列表
|
|
|
handleGetTenantList() {
|
|
|
tenantApi.pmtenantListApi({page: 1, limit: 9999}).then(res => {
|
|
|
this.tenantList = res.list || []
|
|
|
})
|
|
|
},
|
|
|
|
|
|
// 处理业主类型变化
|
|
|
handleOwnerTypeChange(ownerType) {
|
|
|
// 清空名称ID和房屋ID
|
|
|
this.dataForm.ownerId = ''
|
|
|
this.dataForm.houseId = ''
|
|
|
this.dataForm.houseOwnerId = ''
|
|
|
this.ownerHouseList = []
|
|
|
},
|
|
|
|
|
|
// 处理业主选择变化
|
|
|
handleOwnerChange(ownerId, callback) {
|
|
|
// 获取关联房屋
|
|
|
if (ownerId) {
|
|
|
if (this.dataForm.ownerType === '1') {
|
|
|
// 业主类型，查询业主的房屋
|
|
|
ownerHouseRelApi.pmownerhouserelListApi({ ownerId: ownerId, page: 1, limit: 9999 }).then(res => {
|
|
|
const relList = res.list || []
|
|
|
// 获取房屋ID列表
|
|
|
const houseIds = relList.map(item => item.houseId)
|
|
|
// 从房屋列表中筛选出关联的房屋
|
|
|
this.ownerHouseList = this.houseList.filter(house => houseIds.includes(house.id))
|
|
|
// 清空房屋选择，让用户手动选择
|
|
|
this.dataForm.houseId = ''
|
|
|
this.dataForm.houseOwnerId = ''
|
|
|
// 设置所属部门
|
|
|
const owner = this.ownerList.find(item => item.id === ownerId)
|
|
|
if (owner && owner.deptId) {
|
|
|
this.dataForm.ownerCompany = owner.deptId
|
|
|
this.dataForm.ownerCompanyName = owner.deptName || ''
|
|
|
}
|
|
|
// 调用回调
|
|
|
if (callback) {
|
|
|
callback()
|
|
|
}
|
|
|
})
|
|
|
} else if (this.dataForm.ownerType === '2') {
|
|
|
// 租户类型，先查询PmTenantHouse，tenantId对应的是Long rentId，可能对应多个记录
|
|
|
tenantHouseApi.pmtenanthouseListApi({ rentId: ownerId, page: 1, limit: 9999 }).then(res => {
|
|
|
const tenantHouses = res.list || []
|
|
|
if (tenantHouses.length > 0) {
|
|
|
// 收集所有房屋ID
|
|
|
const allHouseIds = []
|
|
|
// 遍历所有的PmTenantHouse记录，收集所有房屋ID
|
|
|
const promises = tenantHouses.map(tenantHouse => {
|
|
|
// 用pm_tenant_house中的id查询PmTenantHouseRel
|
|
|
return tenantHouseRelApi.pmtenanthouserelListApi({ tenantHouseId: tenantHouse.id, page: 1, limit: 9999 }).then(relRes => {
|
|
|
const relList = relRes.list || []
|
|
|
if (relList.length > 0) {
|
|
|
const houseIds = relList.map(item => item.houseId)
|
|
|
return houseIds
|
|
|
}
|
|
|
return []
|
|
|
})
|
|
|
})
|
|
|
|
|
|
Promise.all(promises).then(results => {
|
|
|
// 合并所有房屋ID
|
|
|
results.forEach(houseIds => {
|
|
|
allHouseIds.push(...houseIds)
|
|
|
})
|
|
|
|
|
|
// 从房屋列表中筛选出关联的房屋
|
|
|
this.ownerHouseList = this.houseList.filter(house => allHouseIds.includes(house.id))
|
|
|
// 清空房屋选择，让用户手动选择
|
|
|
this.dataForm.houseId = ''
|
|
|
this.dataForm.houseOwnerId = ''
|
|
|
// 设置租户所属部门
|
|
|
const tenant = this.tenantList.find(item => item.id === ownerId)
|
|
|
if (tenant && tenant.deptId) {
|
|
|
this.dataForm.ownerCompany = tenant.deptId
|
|
|
this.dataForm.ownerCompanyName = tenant.deptName || ''
|
|
|
}
|
|
|
// 调用回调
|
|
|
if (callback) {
|
|
|
callback()
|
|
|
}
|
|
|
})
|
|
|
} else {
|
|
|
// 没有找到租户房屋记录
|
|
|
this.ownerHouseList = []
|
|
|
this.dataForm.houseId = ''
|
|
|
this.dataForm.houseOwnerId = ''
|
|
|
// 设置租户所属部门
|
|
|
const tenant = this.tenantList.find(item => item.id === ownerId)
|
|
|
if (tenant && tenant.deptId) {
|
|
|
this.dataForm.ownerCompany = tenant.deptId
|
|
|
this.dataForm.ownerCompanyName = tenant.deptName || ''
|
|
|
}
|
|
|
// 调用回调
|
|
|
if (callback) {
|
|
|
callback()
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
} else {
|
|
|
this.ownerHouseList = []
|
|
|
this.dataForm.houseId = ''
|
|
|
this.dataForm.houseOwnerId = ''
|
|
|
// 清空部门信息
|
|
|
this.dataForm.ownerCompany = ''
|
|
|
this.dataForm.ownerCompanyName = ''
|
|
|
// 调用回调
|
|
|
if (callback) {
|
|
|
callback()
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
// 处理房屋选择变化
|
|
|
handleHouseChange(houseId) {
|
|
|
if (houseId) {
|
|
|
// 设置房屋业主ID为当前选择的业主ID
|
|
|
this.dataForm.houseOwnerId = this.dataForm.ownerId
|
|
|
} else {
|
|
|
// 清空房屋业主ID
|
|
|
this.dataForm.houseOwnerId = ''
|
|
|
}
|
|
|
},
|
|
|
// 更新问题凭证文件列表
|
|
|
updateBeforeProcessFiles(files) {
|
|
|
this.beforeProcessFiles = files
|
|
|
// 将文件保存到dataForm.beforeProcessFiles中
|
|
|
if (files && files.length > 0) {
|
|
|
// 将FileUploadVO返回的文件格式转换为后端SystemAttachment需要的格式
|
|
|
this.dataForm.beforeProcessFiles = files.map(file => {
|
|
|
// 处理文件路径，确保符合后端要求的格式
|
|
|
let attDir = file.attDir || file.attachFileUrl || ''
|
|
|
// 如果路径以/file/public/开头，去掉这个前缀，因为后端存储格式不需要
|
|
|
if (attDir.startsWith('/file/public/')) {
|
|
|
attDir = attDir.replace('/file/public/', '')
|
|
|
} else if (attDir.startsWith('/file/')) {
|
|
|
attDir = attDir.replace('/file/', '')
|
|
|
}
|
|
|
|
|
|
return {
|
|
|
// 严格按照SystemAttachment的字段要求设置
|
|
|
attId: file.id || file.attId || '', // 确保转换为字符串
|
|
|
name: file.name || file.oldName || '', // 附件名称
|
|
|
attDir: attDir, // 附件路径
|
|
|
attSize: file.attSize || '', // 附件大小
|
|
|
attType: 'before_process', // 问题凭证类型
|
|
|
// 保留原有字段以保持兼容性
|
|
|
fileName: file.name || file.oldName || '',
|
|
|
filePath: attDir,
|
|
|
url: attDir,
|
|
|
createTime: null,
|
|
|
createdBy: null,
|
|
|
createTimeStr: null,
|
|
|
delFlag: '0',
|
|
|
updateBy: null,
|
|
|
updateTime: null,
|
|
|
i18nCode: '',
|
|
|
i18nLanguage: '',
|
|
|
originalFileName: file.name || file.oldName || '',
|
|
|
position: 0,
|
|
|
remark: file.remark || '',
|
|
|
sort: 0,
|
|
|
status: ''
|
|
|
}
|
|
|
})
|
|
|
} else {
|
|
|
this.dataForm.beforeProcessFiles = []
|
|
|
}
|
|
|
},
|
|
|
// 更新处理凭证文件列表
|
|
|
updateAfterProcessFiles(files) {
|
|
|
this.afterProcessFiles = files
|
|
|
// 将文件保存到dataForm.afterProcessFiles中
|
|
|
if (files && files.length > 0) {
|
|
|
// 将FileUploadVO返回的文件格式转换为后端SystemAttachment需要的格式
|
|
|
this.dataForm.afterProcessFiles = files.map(file => {
|
|
|
// 处理文件路径，确保符合后端要求的格式
|
|
|
let attDir = file.attDir || file.attachFileUrl || ''
|
|
|
// 如果路径以/file/public/开头，去掉这个前缀，因为后端存储格式不需要
|
|
|
if (attDir.startsWith('/file/public/')) {
|
|
|
attDir = attDir.replace('/file/public/', '')
|
|
|
} else if (attDir.startsWith('/file/')) {
|
|
|
attDir = attDir.replace('/file/', '')
|
|
|
}
|
|
|
|
|
|
return {
|
|
|
// 严格按照SystemAttachment的字段要求设置
|
|
|
attId: file.id || file.attId || '', // 确保转换为字符串
|
|
|
name: file.name || file.oldName || '', // 附件名称
|
|
|
attDir: attDir, // 附件路径
|
|
|
attSize: file.attSize || '', // 附件大小
|
|
|
attType: 'after_process', // 处理凭证类型
|
|
|
// 保留原有字段以保持兼容性
|
|
|
fileName: file.name || file.oldName || '',
|
|
|
filePath: attDir,
|
|
|
url: attDir,
|
|
|
createTime: null,
|
|
|
createdBy: null,
|
|
|
createTimeStr: null,
|
|
|
delFlag: '0',
|
|
|
updateBy: null,
|
|
|
updateTime: null,
|
|
|
i18nCode: '',
|
|
|
i18nLanguage: '',
|
|
|
originalFileName: file.name || file.oldName || '',
|
|
|
position: 0,
|
|
|
remark: file.remark || '',
|
|
|
sort: 0,
|
|
|
status: ''
|
|
|
}
|
|
|
})
|
|
|
} else {
|
|
|
this.dataForm.afterProcessFiles = []
|
|
|
}
|
|
|
},
|
|
|
init (id) { // 初始化表单验证规则
|
|
|
this.dataForm.id = id || 0
|
|
|
this.visible = true
|
|
|
this.beforeProcessFiles = [] // 清空问题凭证文件列表
|
|
|
this.afterProcessFiles = [] // 清空处理凭证文件列表
|
|
|
this.$nextTick(function() {
|
|
|
this.$refs['dataForm'].resetFields()
|
|
|
// 新增祈愿时，默认设置csType为99
|
|
|
if (!this.dataForm.id) {
|
|
|
this.dataForm.csType = '99'
|
|
|
}
|
|
|
if (this.dataForm.id) {
|
|
|
api.pmcomplaintsuggestionDetailApi(id).then(function(res) {
|
|
|
// 处理日期字段，转换为 Date 对象
|
|
|
const data = res;
|
|
|
if (data.submitTime) {
|
|
|
data.submitTime = new Date(data.submitTime)
|
|
|
}
|
|
|
this.dataForm = data;
|
|
|
// 保存房屋ID
|
|
|
const houseId = data.houseId;
|
|
|
// 触发业主选择变化，加载房屋列表
|
|
|
this.handleOwnerChange(data.ownerId, () => {
|
|
|
// 重新设置房屋ID
|
|
|
this.$nextTick(() => {
|
|
|
this.dataForm.houseId = houseId;
|
|
|
// 触发房屋选择变化，设置房屋业主ID
|
|
|
this.handleHouseChange(houseId);
|
|
|
});
|
|
|
});
|
|
|
}.bind(this))
|
|
|
}
|
|
|
}.bind(this))
|
|
|
},
|
|
|
// 表单数据提交
|
|
|
dataSubmit () {
|
|
|
this.$refs['dataForm'].validate((valid) => {
|
|
|
if (valid) {
|
|
|
// 格式化日期时间
|
|
|
const submitData = { ...this.dataForm }
|
|
|
if (submitData.submitTime) {
|
|
|
submitData.submitTime = this.formatDate(submitData.submitTime)
|
|
|
}
|
|
|
if (submitData.handlerDate) {
|
|
|
submitData.handlerDate = this.formatDate(submitData.handlerDate)
|
|
|
}
|
|
|
|
|
|
if (this.dataForm.id) {
|
|
|
api.pmcomplaintsuggestionUpdateApi(submitData).then(function(res) {
|
|
|
this.$message.success('保存成功')
|
|
|
this.visible = false
|
|
|
this.$emit('refreshDataList')
|
|
|
}.bind(this));
|
|
|
} else {
|
|
|
api.pmcomplaintsuggestionCreateApi(submitData).then(function(res) {
|
|
|
this.$message.success('新增成功')
|
|
|
this.visible = false
|
|
|
this.$emit('refreshDataList')
|
|
|
}.bind(this));
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
|
|
|
// 格式化日期时间为 YYYY-MM-DD HH:mm:ss
|
|
|
formatDate(date) {
|
|
|
if (!date) return ''
|
|
|
const d = new Date(date)
|
|
|
const year = d.getFullYear()
|
|
|
const month = String(d.getMonth() + 1).padStart(2, '0')
|
|
|
const day = String(d.getDate()).padStart(2, '0')
|
|
|
const hours = String(d.getHours()).padStart(2, '0')
|
|
|
const minutes = String(d.getMinutes()).padStart(2, '0')
|
|
|
const seconds = String(d.getSeconds()).padStart(2, '0')
|
|
|
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</script>
|
