You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
195 lines
5.2 KiB
195 lines
5.2 KiB
<template>
|
|
<div>
|
|
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
|
|
<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="graduateTelphone">
|
|
<el-input
|
|
v-model="queryParams.graduateTelphone"
|
|
placeholder="请输入手机号"
|
|
clearable
|
|
@keyup.enter.native="handleQuery"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="身份证号" prop="graduateIdCard">
|
|
<el-input
|
|
v-model="queryParams.graduateIdCard"
|
|
placeholder="请输入身份证号"
|
|
clearable
|
|
@keyup.enter.native="handleQuery"
|
|
/>
|
|
</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-row>
|
|
<el-table
|
|
:data="tableData"
|
|
border
|
|
style="width: 100%"
|
|
:header-cell-style="{ backgroundColor: '#F5F7FA' }"
|
|
:cell-style="{ color: '#303133' }"
|
|
>
|
|
<el-table-column
|
|
prop="checkOutDate"
|
|
label="退房时间"
|
|
:show-overflow-tooltip="true"
|
|
align="center"
|
|
></el-table-column>
|
|
<el-table-column
|
|
prop="roomNamePath"
|
|
label="入住房间"
|
|
:show-overflow-tooltip="true"
|
|
align="center"
|
|
></el-table-column>
|
|
<el-table-column
|
|
prop="graduateName"
|
|
label="姓名"
|
|
:show-overflow-tooltip="true"
|
|
align="center"
|
|
></el-table-column>
|
|
<el-table-column
|
|
prop="genderName"
|
|
label="性别"
|
|
align="center"
|
|
width="50"
|
|
></el-table-column>
|
|
<el-table-column
|
|
prop="telephone"
|
|
label="手机号码"
|
|
:show-overflow-tooltip="true"
|
|
align="center"
|
|
></el-table-column>
|
|
<el-table-column
|
|
prop="idCard"
|
|
label="身份证号"
|
|
align="center"
|
|
:show-overflow-tooltip="true"
|
|
></el-table-column>
|
|
<el-table-column
|
|
prop=""
|
|
label="资格核验"
|
|
align="center"
|
|
:show-overflow-tooltip="true"
|
|
></el-table-column>
|
|
|
|
<el-table-column prop="status" label="状态" align="center">
|
|
<template slot-scope="scope">
|
|
<!-- 办理完成(待释放房源) -->
|
|
<el-button
|
|
type="text"
|
|
v-if="scope.row.status === '办理完成'"
|
|
style="color: #83d098"
|
|
>
|
|
办理完成
|
|
</el-button>
|
|
<!-- 办理中(待退还保证金) -->
|
|
<el-button type="text" v-if="scope.row.status === '办理中'">
|
|
办理中
|
|
</el-button>
|
|
<!-- 待办理(3天) -->
|
|
<el-button
|
|
type="text"
|
|
v-if="scope.row.status === '待办理'"
|
|
style="color: #ee952f"
|
|
>
|
|
待办理
|
|
</el-button>
|
|
<!-- 已超期 -->
|
|
<el-button
|
|
type="text"
|
|
v-if="scope.row.status === '已超期'"
|
|
style="color: #ff2c03"
|
|
>
|
|
已超期
|
|
</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="操作 " align="center">
|
|
<template slot-scope="scope">
|
|
<el-button
|
|
type="primary"
|
|
size="mini"
|
|
@click="handleAction(action, scope.row)"
|
|
>
|
|
退房办理
|
|
</el-button>
|
|
<!-- 释放房源 -->
|
|
<el-button
|
|
type="primary"
|
|
size="mini"
|
|
v-if="scope.row.status === '办理完成'"
|
|
@click="handleAction(action, scope.row)"
|
|
>
|
|
释放房源
|
|
</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-row>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { listCheckoutAlert } from "@/api/residence/checkout";
|
|
export default {
|
|
name: "CommonReminder",
|
|
props: {},
|
|
data() {
|
|
return {
|
|
queryParams: {
|
|
pageNum: 1,
|
|
pageSize: 10,
|
|
graduateName: "",
|
|
graduateTelphone: "",
|
|
graduateIdCard: "",
|
|
},
|
|
tableData: [],
|
|
total: 0,
|
|
};
|
|
},
|
|
created() {},
|
|
mounted() {
|
|
this.getList();
|
|
},
|
|
methods: {
|
|
async getList() {
|
|
try {
|
|
const response = await listCheckoutAlert(this.queryParams);
|
|
if (response.code === 200) {
|
|
this.tableData = response.rows;
|
|
this.total = response.total;
|
|
}
|
|
} catch (error) {
|
|
console.error("Error fetching data:", error);
|
|
}
|
|
},
|
|
handleQuery() {
|
|
this.getList();
|
|
},
|
|
// 跳转办理入住
|
|
handleAction(action, row) {},
|
|
},
|
|
};
|
|
</script>
|
|
|