elink-star
/
epmet-apartment-pc
12
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

退房办理同步

wyx
wangyx 3 months ago
parent
ab5376131e
commit
57d64418d4
3 changed files with 727 additions and 30 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 69
      src/api/mz/rec.js
  2. 8
      src/views/records/live/index.vue
  3. 680
      src/views/records/renewal/index.vue

69
src/api/mz/rec.js
View File

@ -1,56 +1,73 @@
import request from '@/utils/request'
import request from "@/utils/request";
// 查询选房记录列表
export function listRecselect(data) {
return request({
url: '/apartment/manager/chooseRoomRecs',
method: 'post',
data
})
url: "/apartment/manager/chooseRoomRecs",
method: "post",
data,
});
}
// 查询选房记录详细
export function getRecSelectInfo(id) {
return request({
url: '/apartment/manager/chooseRoomRecDetail?chooseRoomRecId=' + id,
method: 'get'
})
url: "/apartment/manager/chooseRoomRecDetail?chooseRoomRecId=" + id,
method: "get",
});
}
// 查询入住记录列表
export function listRecCheckin(data) {
return request({
url: '/apartment/manager/listCheckInRecs',
method: 'post',
data
})
url: "/apartment/manager/listCheckInRecs",
method: "post",
data,
});
}
// 查询选房记录详细
export function getRecCheckinInfo(id) {
return request({
url: '/apartment/manager/checkInRecDetail?checkInRecId=' + id,
method: 'get'
})
url: "/apartment/manager/checkInRecDetail?checkInRecId=" + id,
method: "get",
});
}
// 查询退房记录列表
export function listCheckOutRec(data) {
return request({
url: '/apartment/manager/listCheckOutRec',
method: 'post',
data
})
url: "/apartment/manager/listCheckOutRec",
method: "post",
data,
});
}
// 查询退房记录详细
export function getRecCheckOutInfo(id) {
return request({
url: '/apartment/manager/checkOutRecDetail?checkOutRecId=' + id,
method: 'get'
})
url: "/apartment/manager/checkOutRecDetail?checkOutRecId=" + id,
method: "get",
});
}
// 房屋三级联动
export function queryDeptDropdownList(query) {
return request({
url: '/system/dept/queryDeptDropdownList',
method: 'get',
params: query
})
url: "/system/dept/queryDeptDropdownList",
method: "get",
params: query,
});
}
// 续期记录
export function listRenewRec(query) {
return request({
url: "/mz/renewal/queryRenewalRecord",
method: "get",
params: query,
});
}
// 续期办理
export function handleRenewal(data) {
return request({
url: "/mz/renewal/handleRenewal",
method: "post",
data: data,
});
}

8
src/views/records/live/index.vue
View File

@ -153,7 +153,7 @@
width="160"
/>
<!-- 居住状态 -->
<el-table-column label="当前状态" prop="state">
<el-table-column label="居住状态" prop="state">
<template slot-scope="scope">
<span
:style="{
@ -244,7 +244,7 @@
>办理入住时间：{{ info.handleCheckInDate }}</el-col
>
<el-col :span="8" class="mb-10"
>当前状态：
>居住状态：
<span
:style="{
color:
@ -318,8 +318,8 @@ export default {
unitOptions: [],
open: false,
statusOptions: [
{ value: "1", label: "已入住" },
{ value: "5", label: "已退房" },
{ value: 1, label: "已入住" },
{ value: 5, label: "已退房" },
],
};
},

680
src/views/records/renewal/index.vue
View File

@ -0,0 +1,680 @@
<template>
<div class="app-container">
<!--入住记录数据-->
<el-form
:model="queryParams"
ref="queryForm"
size="small"
:inline="true"
label-width="100px"
>
<el-form-item label="所在区域" prop="districtId">
<treeselect
v-model="queryParams.districtId"
:options="deptOptions"
:show-count="true"
:normalizer="normalizer"
placeholder="请选择所在区域"
style="width: 220px"
@select="handleTreeSelect"
:disable-branch-nodes="true"
/>
</el-form-item>
<!-- 公寓 -->
<el-form-item label="小区公寓" prop="apartmentId">
<el-select
v-model="queryParams.apartmentId"
placeholder="请选择小区"
@change="handleChangeapartment"
>
<el-option
v-for="item in apartmentOptions"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="楼栋" prop="building">
<el-select
v-model="queryParams.buildingId"
placeholder="请选择楼栋"
@change="handleChangeBuildingId"
>
<el-option
v-for="item in buildingOptions"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<!-- 单元 -->
<el-form-item label="单元" prop="unit">
<el-select
v-model="queryParams.unitId"
placeholder="请选择单元"
@change="handleChangeUnitId"
>
<el-option
v-for="item in unitOptions"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<!-- 门牌号 -->
<el-form-item label="房屋" prop="house">
<el-select
v-model="queryParams.houseId"
placeholder="请选择房屋"
@change="handleChangeHouseId"
>
<el-option
v-for="item in houseOptions"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<!-- 房间 -->
<el-form-item label="房间" prop="houseName">
<el-input
v-model="queryParams.roomTypeName"
placeholder="请输入房间名称"
clearable
style="width: 220px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="姓名" prop="graduateName">
<el-input
v-model="queryParams.graduateName"
placeholder="请输入姓名"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="手机号" prop="graduateTelephone">
<el-input
v-model="queryParams.telephone"
placeholder="请输入手机号码"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<!-- 身份证 -->
<el-form-item label="身份证" prop="graduateIdCard">
<el-input
v-model="queryParams.idCard"
placeholder="请输入身份证号码"
clearable
style="width: 220px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<!-- 状态 -->
<el-form-item label="工作状态" prop="state">
<el-select
v-model="queryParams.employState"
placeholder="请选择工作状态"
style="width: 220px"
@keyup.enter.native="handleQuery"
>
<el-option
v-for="item in statusOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button
type="primary"
icon="el-icon-search"
size="mini"
@click="handleQuery"
>搜索</el-button
>
</el-form-item>
</el-form>
<el-table v-loading="loading" :data="list">
<!-- <el-table-column type="selection" width="50" align="center" /> -->
<el-table-column label="序号" align="center" key="buildId" type="index" />
<!-- 所在区域 -->
<el-table-column label="所在区域" align="center">
<template slot-scope="scope">
{{ scope.row.cityName }}/{{ scope.row.districtName }}
</template>
</el-table-column>
<el-table-column
label="小区/公寓"
align="center"
prop="apartmentName"
:show-overflow-tooltip="true"
/>
<!-- 楼号 -->
<el-table-column label="楼号" align="center" prop="buildingName" />
<!-- 单元 -->
<el-table-column label="单元" align="center" prop="unitName" />
<!-- 门牌号 -->
<el-table-column label="房屋" align="center" prop="houseName" />
<!-- 房间 -->
<el-table-column label="房间" align="center" prop="roomTypeName" />
<!-- 入住人 -->
<el-table-column label="居住人" align="center" prop="graduateName" />
<!-- 性别 -->
<el-table-column label="性别" align="center">
<template slot-scope="scope">
{{ scope.row.gender === 1 ? "男" : "女" }}
</template>
</el-table-column>
<el-table-column
label="手机号"
align="center"
prop="telephone"
width="160"
/>
<!-- 入住时间 -->
<el-table-column
label="续期申请时间"
align="center"
prop="renewalApplyTime"
width="160"
/>
<el-table-column
label="新续期至"
align="center"
prop="renewalEndDate"
width="160"
/>
<!-- 居住状态 -->
<el-table-column label="工作状态">
<template slot-scope="scope">
<span>
{{
scope.row.employState === "0"
? "求职中"
: scope.row.employState === "1"
? "已就业"
: scope.row.employState === "2"
? "已创业"
: "未知"
}}
</span>
</template>
</el-table-column>
<!-- 入住评价 -->
<el-table-column
label="续住/更换房间"
align="center"
prop="renewalRoom"
/>
<el-table-column label="办理状态" prop="state">
<template slot-scope="scope">
<span
:style="
scope.row.state === '0'
? 'color: #F7BA2A'
: scope.row.state === '1'
? 'color: #08b3b3'
: ''
"
>
{{
scope.row.state === "0"
? "待办理"
: scope.row.state === "1"
? "已完成续期"
: ""
}}
</span>
</template>
</el-table-column>
<el-table-column
label="操作"
align="center"
width="160"
class-name="small-padding fixed-width"
fixed="right"
>
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-view"
@click="handleView(scope.row)"
v-hasPermi="['rec:renewal:view']"
>查看</el-button
>
<!-- 续期办理 -->
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleRenew(scope.row)"
v-hasPermi="['rec:renewal:handle']"
>续期办理</el-button
>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<el-dialog title="详情" :visible.sync="open" width="55%">
<el-row :gutter="20">
<el-col :span="8" class="mb-10"
>所在区域：{{ renewInfo.cityName }}/{{
renewInfo.districtName
}}</el-col
>
<el-col :span="8" class="mb-10"
>小区/公寓：{{ renewInfo.apartmentName }}</el-col
>
<el-col :span="8" class="mb-10"
>楼号：{{ renewInfo.buildingName }}</el-col
>
<el-col :span="8" class="mb-10">单元：{{ renewInfo.unitName }}</el-col>
<el-col :span="8" class="mb-10">房屋：{{ renewInfo.houseName }}</el-col>
<el-col :span="8" class="mb-10"
>房间：{{ renewInfo.roomTypeName }}</el-col
>
<el-col :span="24">
<div class="line"></div>
</el-col>
<el-col :span="8" class="mb-10"
>居住人：{{ renewInfo.graduateName }}</el-col
>
<el-col :span="8" class="mb-10"
>性别：{{ renewInfo.gender == 1 ? "男" : "女" }}</el-col
>
<el-col :span="8" class="mb-10"
>手机号：{{ renewInfo.telephone }}</el-col
>
<el-col :span="8" class="mb-10"
>身份证号：{{ renewInfo.idCard }}</el-col
>
<el-col :span="8" class="mb-10"
>工作状态：{{
renewInfo.employState === "0"
? "求职中"
: renewInfo.employState === "1"
? "已就业"
: renewInfo.employState === "2"
? "已创业"
: "未知"
}}</el-col
>
<el-col :span="8" class="mb-10"
>入住日期：{{ renewInfo.checkInDate }}</el-col
>
<el-col :span="8" class="mb-10"
>退房日期：{{ renewInfo.checkOutDate }}</el-col
>
<el-col :span="8" class="mb-10">
申请续住房间：{{ renewInfo.renewalRoom }}
</el-col>
<el-col :span="8" class="mb-10">
续住日期至：{{ renewInfo.renewalEndDate }}
</el-col>
<el-col :span="8" class="mb-10"
>合同：{{ renewInfo.contract }}
<el-button @click="handleDownload" type="text"
><i class="el-icon-download"></i>下载</el-button
></el-col
>
</el-row>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="open = false">确 定</el-button>
</span>
</el-dialog>
<!-- 续期办理弹框 -->
<el-dialog title="续期办理" :visible.sync="openRenew" width="55%">
<el-form :model="renewForm" ref="renewForm" label-width="100px">
<el-row :gutter="20">
<el-col :span="8" class="mb-10"
>姓名{{ renewInfo.graduateName }}</el-col
>
<el-col :span="8" class="mb-10"
>性别：{{ renewInfo.gender == 1 ? "男" : "女" }}</el-col
>
<el-col :span="8" class="mb-10"
>手机号：{{ renewInfo.telephone }}</el-col
>
<el-col :span="8" class="mb-10"
>身份证：{{ renewInfo.idCard }}</el-col
>
<el-col :span="8" class="mb-10"
>当前入住房间：{{ renewInfo.renewalRoom }}</el-col
>
<el-col :span="24">
<div class="line"></div>
</el-col>
<el-col :span="8" class="mb-10"
>申请续期时间：{{ renewInfo.renewalApplyTime }}</el-col
>
<el-col :span="8" class="mb-10"
>申请续期至：{{ renewInfo.renewalEndDate }}</el-col
>
<el-col :span="8" class="mb-10"
>工作状态：{{
renewInfo.employState === "0"
? "求职中"
: renewInfo.employState === "1"
? "已就业"
: renewInfo.employState === "2"
? "已创业"
: "未知"
}}</el-col
>
<el-col :span="8" class="mb-10"
>续期房间：{{ renewInfo.renewalRoom }}</el-col
>
<el-col :span="16" class="mb-10">
签订续期合同：
<span
:class="{
'waiting-sign': renewInfo.employState == '1',
signed: renewInfo.employState != '1',
}"
>
{{
renewInfo.employState == "1"
? "等待签订(需毕业生从微信小程序短确认签订)"
: "已签订"
}}
</span>
</el-col>
<!-- 备注说明 -->
<el-col :span="24" class="mb-10">
<el-form-item label="备注说明" prop="remark">
<el-input
type="textarea"
v-model="renewForm.remark"
placeholder="请输入备注说明"
style="width: 100%"
/>
</el-form-item>
</el-col>
<el-col :span="8" class="mb-10"></el-col>
</el-row>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="handleRenewSubmit">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import {
listRenewRec,
getRecSelectInfo,
handleRenewal,
queryDeptDropdownList,
} from "@/api/mz/rec";
import { listDept } from "@/api/system/dept";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
name: "RoomSelection",
dicts: ["sys_normal_disable", "sys_user_sex"],
components: { Treeselect },
data() {
return {
// 遮罩层
loading: true,
// 总条数
total: 0,
// 公寓表格数据
list: null,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
deptId: null,
cityId: null,
cityName: null,
districtId: null,
districtName: null,
apartmentId: null,
apartmentName: null,
buildingId: null,
buildingName: null,
unitId: null,
unitName: null,
houseId: null,
houseName: null,
roomTypeId: null,
roomTypeName: null,
graduateName: null,
gender: null,
telephone: null,
idCard: null,
renewalApplyTime: null,
checkInDate: null,
checkOutDate: null,
renewalEndDate: null,
employState: null,
renewalRoom: null,
state: null,
},
info: {},
deptOptions: [],
apartmentOptions: [],
buildingOptions: [],
unitOptions: [],
houseOptions: [],
open: false,
openRenew: false,
statusOptions: [
{ value: "0", label: "求职中" },
{ value: "1", label: "已就业" },
{ value: "2", label: "已创业" },
],
renewForm: {
remark: "",
},
renewInfo: {},
};
},
watch: {
"queryParams.deptId": {
handler(newVal, oldVal) {
console.log("newVal", newVal);
if (!newVal) this.queryParams.apartmentId = null;
this.queryParams.buildingId = null;
this.queryParams.unitId = null;
this.queryParams.houseId = null;
this.apartmentOptions = [];
this.buildingOptions = [];
this.unitOptions = [];
this.houseOptions = [];
},
deep: true,
immediate: true,
},
},
created() {
this.getList();
this.getDeptTree();
},
computed: {},
methods: {
async handleTreeSelect(value) {
this.queryParams.deptId = value.deptId;
this.queryParams.apartmentId = "";
this.queryParams.buildingId = "";
this.queryParams.unitId = "";
this.queryParams.houseId = "";
this.buildingOptions = [];
this.unitOptions = [];
this.houseOptions = [];
this.apartmentOptions = await this.getListByParentId("1", value.deptId);
},
async handleChangeapartment(val) {
this.queryParams.apartmentId = val;
this.queryParams.buildingId = null;
this.queryParams.unitId = null;
this.queryParams.houseId = null;
this.houseOptions = [];
this.buildingOptions = await this.getListByParentId("2", val);
},
// 三级联动
async handleChangeBuildingId(val) {
this.queryParams.buildingId = val;
this.queryParams.unitId = null;
this.queryParams.houseId = null;
this.houseOptions = [];
this.unitOptions = await this.getListByParentId("3", val);
},
async handleChangeUnitId(val) {
this.queryParams.unitId = val;
this.queryParams.houseId = null;
this.houseOptions = await this.getListByParentId("4", val);
},
handleChangeHouseId(val) {
this.queryParams.houseId = val;
},
// 三级联动通用接口
getListByParentId(type, id) {
return new Promise((resolve, reject) => {
queryDeptDropdownList({ type, id }).then((res) => {
resolve(res.data);
});
});
},
stateComp(val) {
return this.statusOptions.find((item) => item.value == val)?.label;
},
/** 转换公寓数据结构 */
normalizer(node) {
if (node.children && !node.children.length) {
delete node.children;
}
return {
id: node.deptId,
label: node.deptName,
children: node.children,
};
},
/** 查询公寓列表 */
getList() {
this.loading = true;
listRenewRec(this.queryParams)
.then((response) => {
this.list = response.rows;
this.total = response.total;
this.loading = false;
})
.catch((err) => {
this.loading = false;
});
},
/** 查询公寓下拉树结构 */
getDeptTree() {
listDept().then((response) => {
this.deptOptions = this.handleTree(
response.data,
"deptId",
"parentId",
"children",
2
);
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.queryParams.deptId = undefined;
this.$refs.tree.setCurrentKey(null);
this.handleQuery();
},
handleDownload() {
const contract =
"http://192.168.1.144:9000/mzjzf/%E6%88%BF%E5%B1%8B%E7%A7%9F%E8%B5%81%E5%90%88%E5%90%8C%E6%9B%B4%E6%94%B9%E5%90%8E.pdf";
if (contract) {
window.open(contract, "_blank");
} else {
this.$message.warning("没有可下载的文件地址");
}
},
handleView(row) {
this.renewInfo = row;
this.open = true;
},
handleRenew(row) {
this.renewInfo = row;
this.renewForm.renewalId = row.renewalId;
this.openRenew = true;
},
handleRenewSubmit() {
handleRenewal(this.renewForm)
.then((res) => {
console.log("res", res);
this.$message({
message: "续期办理成功",
type: "success",
});
this.openRenew = false;
this.getList();
})
.catch((err) => {
this.$message.error(err.message || "操作失败");
});
},
},
};
</script>
<style scoped lang="scss">
.line {
margin: 30px 0;
height: 2px;
border-top: 1px solid transparent;
background: linear-gradient(white, white) padding-box,
repeating-linear-gradient(-45deg, #ccc 0, #ccc 3px, white 0, white 5px);
}
.waiting-sign {
color: #fa9e0a;
}
.signed {
color: #08b3b3;
}
</style>
Write Preview
Loading…
Cancel
Save