zhaoyang/estate
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

完成访客搭建，完善之前审核界面

Browse Source
This commit is contained in:
Zy
2026-04-13 18:10:23 +08:00
parent d957d1a039
commit 7f152c45f5
34 changed files with 1732 additions and 1208 deletions
Download Patch File Download Diff File Expand all files Collapse all files

117
src/views/system/ParkingCost/index.vue
View File

@@ -50,14 +50,16 @@
<dict-tag :options="com_parking_charge" :value="scope.row.chargeItem" />
</template>
</el-table-column>
<el-table-column label="缴纳人姓名" align="center" prop="payerName" />
<el-table-column label="缴纳人" align="center" prop="payerName" />
<el-table-column label="车牌号" align="center" prop="carNum" />
<el-table-column label="停车时长" align="center" width="180">
<template #default="scope">
<span>{{ formatTimeDiff(scope.row.startTime, scope.row.endTime) }}</span>
</template>
</el-table-column>
<el-table-column label="费用/元" align="center" prop="cost" />
<el-table-column label="费用" align="center" prop="cost">
<template #default="scope"> {{ Number(scope.row.cost).toFixed(2) }}元 </template>
</el-table-column>
<el-table-column label="缴纳状态" align="center" prop="payerStatus">
<template #default="scope">
<dict-tag :options="com_parking_payer_status" :value="scope.row.payerStatus" />
@@ -89,57 +91,6 @@
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
</el-card>
<!-- 添加或修改停车缴费管理对话框 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
<el-form ref="parkingCostFormRef" :model="form" :rules="rules" label-width="80px">
<el-form-item label="区域id" prop="areaId">
<el-input v-model="form.areaId" placeholder="请输入区域id" />
</el-form-item>
<el-form-item label="车位id" prop="parkingId">
<el-input v-model="form.parkingId" placeholder="请输入车位id" />
</el-form-item>
<el-form-item label="收费项目 0临时停车" prop="chargeItem">
<el-input v-model="form.chargeItem" placeholder="请输入收费项目 0临时停车" />
</el-form-item>
<el-form-item label="缴纳人姓名" prop="payerName">
<el-input v-model="form.payerName" placeholder="请输入缴纳人姓名" />
</el-form-item>
<el-form-item label="车牌号" prop="carNum">
<el-input v-model="form.carNum" placeholder="请输入车牌号" />
</el-form-item>
<el-form-item label="开始时间" prop="startTime">
<el-date-picker clearable v-model="form.startTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择开始时间">
</el-date-picker>
</el-form-item>
<el-form-item label="结束时间" prop="endTime">
<el-date-picker clearable v-model="form.endTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择结束时间">
</el-date-picker>
</el-form-item>
<el-form-item label="费用/元" prop="cost">
<el-input v-model="form.cost" placeholder="请输入费用/元" />
</el-form-item>
<el-form-item label="缴纳状态 0待缴纳 1已缴纳" prop="payerStatus">
<el-radio-group v-model="form.payerStatus">
<el-radio v-for="dict in com_parking_payer_status" :key="dict.value" :value="dict.value">{{ dict.label }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="支付方式 0微信 1支付宝 2线下缴费" prop="payMethod">
<el-input v-model="form.payMethod" placeholder="请输入支付方式 0微信 1支付宝 2线下缴费" />
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入备注" />
</el-form-item>
<el-form-item label="所属小区id" prop="villageId">
<el-input v-model="form.villageId" placeholder="请输入所属小区id" />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
@@ -172,11 +123,6 @@ const total = ref(0);
const queryFormRef = ref<ElFormInstance>();
const parkingCostFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: ParkingCostForm = {
id: undefined,
areaId: undefined,
@@ -219,40 +165,33 @@ const { queryParams, form, rules } = toRefs(data);
const Arealist = ref([]);
const Parkinglist = ref([]);
/** 查询停车缴费管理列表 */
const getList = async () => {
loading.value = true;
// 车位
const rows = await listParking();
Parkinglist.value = rows.rows;
// 车辆区域
const arealist = await listArea();
Arealist.value = arealist.rows;
console.log(Parkinglist.value);
// 停车缴费
const res = await listParkingCost(queryParams.value);
parkingCostList.value = res.rows;
parkingCostList.value.forEach((parkingCost) => {
const find = Parkinglist.value.find((item) => item.id === parkingCost.parkingId);
const areaFind = Arealist.value.find((item) => item.id === parkingCost.areaId);
parkingCost.areaName = `${areaFind.areaName}(${areaFind.areaCode})`;
parkingCost.parkingName = find.parkingCode;
console.log(find, areaFind);
if (areaFind) {
parkingCost.areaName = `${areaFind.areaName}(${areaFind.areaCode})`;
}
if (find) {
parkingCost.parkingName = find.parkingCode;
}
});
total.value = res.total;
loading.value = false;
};
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
};
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
parkingCostFormRef.value?.resetFields();
};
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1;
@@ -289,23 +228,6 @@ const handleUpdate = async (row?: ParkingCostVO) => {
});
};
/** 提交按钮 */
const submitForm = () => {
parkingCostFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
if (form.value.id) {
await updateParkingCost(form.value).finally(() => (buttonLoading.value = false));
} else {
await addParkingCost(form.value).finally(() => (buttonLoading.value = false));
}
proxy?.$modal.msgSuccess('操作成功');
dialog.visible = false;
await getList();
}
});
};
/** 删除按钮操作 */
const handleDelete = async (row?: ParkingCostVO) => {
const _ids = row?.id || ids.value;
@@ -315,17 +237,6 @@ const handleDelete = async (row?: ParkingCostVO) => {
await getList();
};
/** 导出按钮操作 */
const handleExport = () => {
proxy?.download(
'parkingCost/parkingCost/export',
{
...queryParams.value
},
`parkingCost_${new Date().getTime()}.xlsx`
);
};
onMounted(() => {
getList();
});

60
src/views/system/Repair/addRepair.vue
View File

@@ -95,8 +95,11 @@ import { convertBuildingToTree, hasFormData } from '@/utils/house';
import Holder from '@/components/Holder/index.vue';
import { UploadProps, UploadUserFile } from 'element-plus';
import { addRepair, getRepair, updateRepair, uploadRepairImages } from '@/api/system/Repair';
import { getRepairProject, gettreelistRepairProject } from '@/api/system/RepairProject';
import { gettreelistRepairProject } from '@/api/system/RepairProject';
import { useHouseStore } from '@/store/modules/house';
const houseStore = useHouseStore();
const { treedata } = storeToRefs(houseStore);
const uploadUrl = import.meta.env.VITE_APP_BASE_API + '/repair/uploadImages';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -127,41 +130,32 @@ const rules = ref({
const userid = ref(null);
// 当前小区
const currentviliage = ref();
// 树形结构
const treedata = ref();
// 报修项目 tree 结构
const maintenanceItemTreeData = ref();
function init() {
getCommunitylistAPI().then((res) => {
currentviliage.value = res.rows.find((item) => item.choiceStatus === 0);
getVillageTree(currentviliage.value.villageId).then((res) => {
treedata.value = convertBuildingToTree(res.data.buildings);
});
gettreelistRepairProject().then((res) => {
maintenanceItemTreeData.value = res.data;
if (route.query.id) {
userid.value = route.query.id;
form.value.id = userid.value;
getRepair(userid.value).then((res) => {
form.value = {
...form.value,
...res.data
};
fileList.value = form.value.problemImageUrl
.split(',')
.map((item) => {
if (!item) return undefined;
return {
name: item.split('/').pop(),
url: item
};
})
.filter((item) => item);
console.log(fileList.value);
});
}
});
gettreelistRepairProject().then((res) => {
maintenanceItemTreeData.value = res.data;
if (route.query.id) {
userid.value = route.query.id;
form.value.id = userid.value;
getRepair(userid.value).then((res) => {
form.value = {
...form.value,
...res.data
};
fileList.value = form.value.problemImageUrl
.split(',')
.map((item) => {
if (!item) return undefined;
return {
name: item.split('/').pop(),
url: item
};
})
.filter((item) => item);
console.log(fileList.value);
});
}
});
}
init();

23
src/views/system/Repair/index.vue
View File

@@ -60,27 +60,22 @@
<el-table-column label="维修项目" align="center" prop="maintenanceItemPath" />
<el-table-column label="问题描述" align="center" prop="problem" />
<el-table-column label="报修人" align="center" prop="residentName" />
<el-table-column label="维修状态" align="center" prop="problemStatus">
<template #default="scope">
<dict-tag :options="com_repair_status" :value="scope.row.problemStatus"></dict-tag>
</template>
</el-table-column>
<el-table-column label="预约日期" align="center" prop="orderDate" width="180">
<template #default="scope">
<span>{{ parseTime(scope.row.orderDate, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="维修状态" align="center" prop="problemStatus">
<template #default="scope">
<dict-tag :options="com_repair_status" :value="scope.row.problemStatus || ''"></dict-tag>
</template>
</el-table-column>
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="分配" placement="top">
<el-button link type="primary" icon="Pointer" @click="handleShare(scope.row)"></el-button>
</el-tooltip>
<el-tooltip content="修改" placement="top">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['repair:repair:edit']"></el-button>
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['repair:repair:remove']"></el-button>
</el-tooltip>
<el-button link type="primary" @click="handleShare(scope.row)">{{ scope.row.problemStatus === '0' ? '分配' : '详情' }}</el-button>
<el-button link type="primary" @click="handleUpdate(scope.row)" v-hasPermi="['repair:repair:edit']">修改</el-button>
<el-button link type="primary" @click="handleDelete(scope.row)" v-hasPermi="['repair:repair:remove']">删除</el-button>
</template>
</el-table-column>
</el-table>

156
src/views/system/Repair/repairMain.vue
View File

@@ -1,6 +1,6 @@
<template>
<div class="ResidentMainBox p-2 w-full">
<PageHeader title="车位详情"></PageHeader>
<PageHeader title="报修详情"></PageHeader>
<div class="ResidentMainBody">
<el-row :span="24" :gutter="20">
<el-col :span="16">
@@ -9,8 +9,8 @@
<el-card>
<template #header>
<div class="card-header">
<span>车位信息</span>
<el-button text type="primary">编辑</el-button>
<span>报修房屋</span>
<span class="ml-20px color-blue cursor-pointer" @click="handleEdit">编辑</span>
</div>
</template>
<div class="w-full h-full CarinfoBox">
@@ -18,59 +18,44 @@
<el-col :span="8">
<div class="carinfo_item">
<div class="label">报修房屋</div>
<div class="main">地下停车场A区</div>
<div class="main">{{ form.house }}</div>
</div>
</el-col>
<el-col :span="8">
<div class="carinfo_item">
<div class="label">维修项目</div>
<div class="main">地下停车场A区</div>
</div>
</el-col>
<el-col :span="8">
<div class="carinfo_item">
<div class="label">问题描述</div>
<div class="main">地下停车场A区</div>
<div class="main">{{ form.maintenanceItem }}</div>
</div>
</el-col>
</el-row>
<el-row class="mb-20px">
<el-col :span="8">
<div class="carinfo_item">
<div class="label">报修人</div>
<div class="main">地下停车场A区</div>
<div class="main">{{ form.residentName }}</div>
</div>
</el-col>
<el-col :span="8">
<div class="carinfo_item">
<div class="label">手机号码</div>
<div class="main">地下停车场A区</div>
</div>
</el-col>
<el-col :span="8">
<div class="carinfo_item">
<div class="label">预约日期</div>
<div class="main">地下停车场A区</div>
<div class="main">{{ form.phone }}</div>
</div>
</el-col>
</el-row>
<el-row class="mb-20px">
<el-col :span="8">
<div class="carinfo_item">
<div class="label">提交人</div>
<div class="main">地下停车场A区</div>
</div>
</el-col>
<el-col :span="8">
<div class="carinfo_item">
<div class="label">提交时间</div>
<div class="main">地下停车场A区</div>
</div>
</el-col>
<el-col :span="8">
<el-col>
<div class="carinfo_item">
<div class="label">预约日期</div>
<div class="main">地下停车场A区</div>
<div class="main">{{ form.orderDate }}</div>
</div>
</el-col>
</el-row>
<el-row class="mb-20px">
<el-col>
<div class="carinfo_item">
<div class="label">问题描述</div>
<div class="main">{{ form.problem }}</div>
</div>
</el-col>
</el-row>
@@ -79,7 +64,19 @@
<div class="carinfo_item">
<div class="label">附件</div>
<div class="main fileImagebox">
<el-image class="carinfoImage"></el-image>
<el-image
:preview-teleported="true"
:zoom-rate="1.2"
:max-scale="7"
:min-scale="0.2"
:preview-src-list="form.problemImageUrlList"
show-progress
:initial-index="0"
v-for="(item, index) in form.problemImageUrlList"
:key="index"
:src="item"
class="carinfoImage"
></el-image>
</div>
</div>
</el-col>
@@ -100,8 +97,7 @@
<repairUser :userid="userid"></repairUser>
</div>
<div class="actions mt-5">
<el-button type="primary">审核通过</el-button>
<el-button type="danger">审核不通过</el-button>
<el-button type="primary">确定派单</el-button>
<el-button>返回</el-button>
</div>
</div>
@@ -109,7 +105,7 @@
</el-card>
</el-col>
<el-col :span="8">
<el-card style="position: relative">
<el-card style="position: relative; height: 100%">
<template #header>
<div class="asideCardHeader w-full">
<div class="cardSubtitle">
@@ -118,7 +114,7 @@
</div>
</div>
</template>
<div class="w-full h-50%">
<div class="h-full w-full">
<el-steps space="108px" direction="vertical" :active="activeStop">
<el-step>
<template #title>
@@ -156,14 +152,94 @@
import { ref } from 'vue';
import repairUser from '@/components/Holder/repairUser.vue';
import PageHeader from '@/components/Pageheader/index.vue';
import { getRepair } from '@/api/system/Repair';
import { getCommunitylistAPI } from '@/api/system/community';
import { getVillageTree } from '@/api/system/house';
import { convertBuildingToTree, getHousePathById } from '@/utils/house';
import { listRepairProject } from '@/api/system/RepairProject';
import { listResident } from '@/api/system/resident';
import { RepairVO } from '@/api/system/Repair/type';
import { useHouseStore } from '@/store/modules/house';
const houseStore = useHouseStore();
const { treedata } = storeToRefs(houseStore);
const route = useRoute();
const router = useRouter();
const active = ref(6);
const activeStop = ref(4);
interface formType extends RepairVO {
maintenanceItem?: string;
residentName?: string;
problemImageUrlList?: string[];
house?: string;
}
const form = ref<formType>({
'id': null,
'houseId': null,
'maintenanceItemId': null,
'problem': '',
'residentId': null,
'phone': null,
'orderDate': '',
'problemImageUrl': '',
'problemStatus': '0',
'repairDes': '',
'repairImageUrl': '',
'repairId': null
});
const userid = ref();
// 维修项目
const projectlist = ref([]);
// 住户
const residentList = ref([]);
// ! 房屋 ====================================================================================================
async function init() {
// 项目
const projectres = await listRepairProject();
projectlist.value = projectres.rows;
// 住户
const residentlistres = await listResident();
residentList.value = residentlistres.rows;
// 报修详情
const res = await getRepair(userid.value);
form.value = res.data;
const find = projectlist.value.find((item) => item.id === form.value.maintenanceItemId);
if (find) {
if (find.parentId) {
const find2 = projectlist.value.find((item) => item.id === find.parentId);
form.value.maintenanceItem = find2.projectName + ' - ' + find.projectName;
} else {
form.value.maintenanceItem = find.projectName;
}
}
const houseinfo = getHousePathById(treedata.value, form.value.houseId, 'label');
console.log(treedata.value);
form.value.house = houseinfo.join(' - ');
const residentinfo = residentList.value.find((item) => item.id === form.value.residentId);
form.value.residentName = residentinfo.name;
form.value.problemImageUrlList = form.value.problemImageUrl.split(',').filter((item) => item);
}
if (route.query.id) {
userid.value = route.query.id;
init();
}
function handleEdit() {
router.push({
path: '/repair/addRepair',
query: {
id: form.value.id
}
});
}
</script>
@@ -173,6 +249,7 @@ if (route.query.id) {
flex-direction: column;
.ResidentMainBody {
margin-top: 20px;
flex: 1;
.CarinfoBox {
&.gridbox {
display: grid;
@@ -192,8 +269,9 @@ if (route.query.id) {
padding-right: 10px;
}
.carinfoImage {
margin: 10px;
width: 200px;
height: 100px;
height: 150px;
}
}
}

4
src/views/system/Repair/repairlist.vue
View File

@@ -81,12 +81,12 @@
<el-table-column label="维修类名" align="center" prop="projectName" />
<el-table-column label="项目类型" align="center" prop="projectType">
<template #default="scope">
<dict-tag :options="com_repair_project_types" :value="scope.row.projectType"></dict-tag>
<dict-tag :options="com_repair_project_types" :value="scope.row.projectType || ''"></dict-tag>
</template>
</el-table-column>
<el-table-column label="状态" align="center" prop="status">
<template #default="scope">
<dict-tag :options="com_repair_project_status" :value="scope.row.status"></dict-tag>
<dict-tag :options="com_repair_project_status" :value="scope.row.status || ''"></dict-tag>
</template>
</el-table-column>
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">

163
src/views/system/Visitor/index.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="p-2">
<div class="p-2 h-full flex flex-col">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
<div v-show="showSearch" class="mb-[10px]">
<el-card shadow="hover">
@@ -19,32 +19,17 @@
</div>
</transition>
<el-card shadow="never">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['visitor:visitor:add']">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['visitor:visitor:edit']"
>修改</el-button
>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['visitor:visitor:remove']"
>删除</el-button
>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
</template>
<el-card class="flex-1" shadow="never">
<el-table v-loading="loading" border :data="visitorList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="访问房屋" align="center" prop="houseId" />
<el-table-column label="访客姓名" align="center" prop="visitorName" />
<el-table-column label="访客状态 0等待来访 1已到访" align="center" prop="status" />
<el-table-column label="访客性别 0男 1女 3未知" align="center" prop="visitorGender">
<el-table-column label="访客状态" align="center" prop="status">
<template #default="scope">
<dict-tag :options="com_visitor_status" :value="scope.row.status" />
</template>
</el-table-column>
<el-table-column label="访客性别" align="center" prop="visitorGender">
<template #default="scope">
<dict-tag :options="sys_user_sex" :value="scope.row.visitorGender" />
</template>
@@ -57,62 +42,13 @@
</el-table-column>
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="修改" placement="top">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['visitor:visitor:edit']"></el-button>
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['visitor:visitor:remove']"></el-button>
</el-tooltip>
<el-button link type="primary" @click="handleMain(scope.row)" v-hasPermi="['visitor:visitor:remove']">访客详情</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
</el-card>
<!-- 添加或修改访客管理对话框 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
<el-form ref="visitorFormRef" :model="form" :rules="rules" label-width="80px">
<el-form-item label="访问房屋id" prop="houseId">
<el-input v-model="form.houseId" placeholder="请输入访问房屋id" />
</el-form-item>
<el-form-item label="访客姓名" prop="visitorName">
<el-input v-model="form.visitorName" placeholder="请输入访客姓名" />
</el-form-item>
<el-form-item label="访客性别 0男 1女 3未知" prop="visitorGender">
<el-input v-model="form.visitorGender" placeholder="请输入访客性别 0男 1女 3未知" />
</el-form-item>
<el-form-item label="访客联系方式" prop="visitorPhone">
<el-input v-model="form.visitorPhone" placeholder="请输入访客联系方式" />
</el-form-item>
<el-form-item label="车牌号" prop="carNum">
<el-input v-model="form.carNum" placeholder="请输入车牌号" />
</el-form-item>
<el-form-item label="随行人数" prop="visitorNum">
<el-input v-model="form.visitorNum" placeholder="请输入随行人数" />
</el-form-item>
<el-form-item label="来访时间" prop="startTime">
<el-date-picker clearable v-model="form.startTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择来访时间">
</el-date-picker>
</el-form-item>
<el-form-item label="离开时间" prop="endTime">
<el-date-picker clearable v-model="form.endTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择离开时间">
</el-date-picker>
</el-form-item>
<el-form-item label="创建时间" prop="createTime">
<el-date-picker clearable v-model="form.createTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择创建时间">
</el-date-picker>
</el-form-item>
<el-form-item label="创建者(住户id)" prop="createId">
<el-input v-model="form.createId" placeholder="请输入创建者(住户id)" />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
@@ -121,7 +57,9 @@ import { listVisitor, getVisitor, delVisitor, addVisitor, updateVisitor } from '
import { VisitorVO, VisitorQuery, VisitorForm } from '@/api/system/Visitor/type';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { sys_user_sex } = toRefs<any>(proxy?.useDict('sys_user_sex'));
const { com_visitor_status } = toRefs<any>(proxy?.useDict('com_visitor_status'));
const router = useRouter();
// com_visitor_status
const visitorList = ref<VisitorVO[]>([]);
@@ -132,15 +70,9 @@ const ids = ref<Array<string | number>>([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const queryFormRef = ref<ElFormInstance>();
const visitorFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: VisitorForm = {
id: undefined,
houseId: undefined,
@@ -189,18 +121,6 @@ const getList = async () => {
loading.value = false;
};
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
};
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
visitorFormRef.value?.resetFields();
};
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1;
@@ -220,61 +140,22 @@ const handleSelectionChange = (selection: VisitorVO[]) => {
multiple.value = !selection.length;
};
/** 新增按钮操作 */
const handleAdd = () => {
reset();
dialog.visible = true;
dialog.title = '添加访客管理';
};
/** 修改按钮操作 */
const handleUpdate = async (row?: VisitorVO) => {
reset();
const _id = row?.id || ids.value[0];
const res = await getVisitor(_id);
Object.assign(form.value, res.data);
dialog.visible = true;
dialog.title = '修改访客管理';
};
/** 提交按钮 */
const submitForm = () => {
visitorFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
if (form.value.id) {
await updateVisitor(form.value).finally(() => (buttonLoading.value = false));
} else {
await addVisitor(form.value).finally(() => (buttonLoading.value = false));
}
proxy?.$modal.msgSuccess('操作成功');
dialog.visible = false;
await getList();
/** 删除按钮操作 */
const handleMain = async (row?: VisitorVO) => {
router.push({
path: '/repair/visitorMain',
query: {
id: row.id
}
});
};
/** 删除按钮操作 */
const handleDelete = async (row?: VisitorVO) => {
const _ids = row?.id || ids.value;
await proxy?.$modal.confirm('是否确认删除访客管理编号为"' + _ids + '"的数据项？').finally(() => (loading.value = false));
await delVisitor(_ids);
proxy?.$modal.msgSuccess('删除成功');
await getList();
};
/** 导出按钮操作 */
const handleExport = () => {
proxy?.download(
'visitor/visitor/export',
{
...queryParams.value
},
`visitor_${new Date().getTime()}.xlsx`
);
};
onMounted(() => {
getList();
});
</script>
<style lang="scss" scoped>
.el-table {
height: calc(100% - 100px);
}
</style>

156
src/views/system/Visitor/visitorMain.vue Normal file
View File

@@ -0,0 +1,156 @@
<template>
<div class="ResidentMainBox p-2 w-full h-full">
<PageHeader title="访客信息"></PageHeader>
<div class="ResidentMainBody">
<el-card>
<template #header>
<div class="card-header">
<span>车位信息</span>
</div>
</template>
<el-row>
<el-col :span="12">
<div class="grid grid-cols-3 grid-rows-3">
<div class="carinfo_item">
<div class="label">访问房屋:</div>
<div class="main">北境碧桂园小区A栋2单元402</div>
</div>
<div class="carinfo_item">
<div class="label">访客姓名:</div>
<div class="main">李淑一</div>
</div>
<div class="carinfo_item">
<div class="label">访客性别:</div>
<div class="main">男</div>
</div>
<div class="carinfo_item">
<div class="label">手机号码:</div>
<div class="main">15020360831</div>
</div>
<div class="carinfo_item">
<div class="label">访问日期:</div>
<div class="main">2024/05/08</div>
</div>
<div class="carinfo_item">
<div class="label">访问时长:</div>
<div class="main">3h</div>
</div>
<div class="carinfo_item">
<div class="label">访问业主:</div>
<div class="main flex align-items-center">
<div>去丽丽</div>
<div class="ml-20px color-blue cursor-pointer">住户详情</div>
</div>
</div>
<div class="carinfo_item">
<div class="label">提交时间:</div>
<div class="main">2024/09/15 22：48</div>
</div>
</div>
</el-col>
<el-col :span="5"></el-col>
<el-col :span="6">
<div>
<div>通行证</div>
</div>
</el-col>
</el-row>
<div class="visitorlist">
<h2>访问记录</h2>
</div>
<el-row>
<el-col :span="8">
<el-table :data="tableData" style="width: 100%">
<el-table-column align="center" prop="date" label="开门位置" />
<el-table-column align="center" prop="name" label="开门时间" />
</el-table>
</el-col>
</el-row>
<el-row class="mt-30px">
<el-col :span="12">
<el-button @click="back">返回</el-button>
</el-col>
</el-row>
</el-card>
</div>
</div>
</template>
<script setup lang="ts">
import { ref } from 'vue';
import PageHeader from '@/components/Pageheader/index.vue';
const tableData = [
{
date: '2016-05-03',
name: 'Tom',
address: 'No. 189, Grove St, Los Angeles'
},
{
date: '2016-05-02',
name: 'Tom',
address: 'No. 189, Grove St, Los Angeles'
},
{
date: '2016-05-04',
name: 'Tom',
address: 'No. 189, Grove St, Los Angeles'
},
{
date: '2016-05-01',
name: 'Tom',
address: 'No. 189, Grove St, Los Angeles'
}
];
const router = useRouter();
function back() {
router.push({
path: '/repair/visitorlist'
});
}
</script>
<style scoped lang="scss">
.ResidentMainBox {
display: flex;
flex-direction: column;
.ResidentMainBody {
flex: 1;
margin-top: 20px;
font-size: 15px;
.visitorlist {
margin: 20px 0;
border-bottom: 1px solid #ccc;
}
.carinfo_item {
margin-bottom: 40px;
display: flex;
align-items: center;
.label {
width: 100px;
text-align: right;
font-weight: bolder;
margin-right: 30px;
}
}
&:deep(div.el-step__head.is-process) {
& > div.el-step__line {
width: 0;
border: 1px dashed gray;
background: transparent;
}
}
&:deep(.el-step.is-vertical .el-step__line) {
top: 20px;
}
&:deep(div.el-step__head.is-finish) {
& > div.el-step__line {
width: 0;
border: 1px solid var(--el-color-primary);
background: transparent;
}
}
}
}
</style>

217
src/views/system/cars/addCars.vue
View File

@@ -7,48 +7,86 @@
<el-form class="formBody" label-position="left" ref="formRef" :model="form" :rules="rules" label-width="130px">
<el-row>
<el-col :span="11">
<el-form-item label="车牌号" prop="houseId">
<el-input v-model.trim="form.rentalName" placeholder="请输入车牌号" />
<el-form-item label="车辆区域" prop="areaId">
<el-select @change="changeArealist" v-model="form.areaId" placeholder="请选择车辆区域">
<el-option v-for="item in carArealist" :key="item.id" :label="`${item.areaName}(${item.areaCode})`" :value="item.id" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="2"></el-col>
<el-col :span="11">
<el-form-item label="车辆品牌" prop="rentalName">
<el-input v-model.trim="form.rentalName" placeholder="请输入车辆品牌" />
<el-form-item label="车位号" prop="parkingId">
<el-select v-model="form.parkingId" placeholder="请选择车位号">
<el-option v-for="item in parkinglist" :key="item.id" :label="item.parkingCode" :value="item.id" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label="车辆型号" prop="remark">
<el-input v-model.trim="form.supInfo" placeholder="请输入补充车辆型号" />
<el-form-item label="车牌号" prop="carNum">
<el-input v-model.trim="form.carNum" placeholder="请输入车牌号" />
</el-form-item>
</el-col>
<el-col :span="2"></el-col>
<el-col :span="11">
<el-form-item label="车声颜色" prop="phone">
<el-input v-model.trim="form.phone" placeholder="请输入车声颜色" />
<el-form-item label="车辆品牌" prop="carBrand">
<el-input v-model.trim="form.carBrand" placeholder="请输入车辆品牌" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="车辆照片" prop="email"> </el-form-item>
<el-col :span="11">
<el-form-item label="车辆型号" prop="carModel">
<el-input v-model.trim="form.carModel" placeholder="请输入补充车辆型号" />
</el-form-item>
</el-col>
<el-col :span="2"></el-col>
<el-col :span="11">
<el-form-item label="车身颜色" prop="carColor">
<el-input v-model.trim="form.carColor" placeholder="请输入车身颜色" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="车辆照片">
<el-upload
class="avatar-uploader"
ref="uploadRef"
accept=".png, .jpg"
:action="uploadUrl"
name="file"
:headers="headerToken()"
:show-file-list="false"
:on-success="handleAvatarSuccess"
:before-upload="beforeAvatarUpload"
>
<img v-if="form.carImageUrl" :src="form.carImageUrl" class="avatar" />
<el-icon v-else class="avatar-uploader-icon"><Plus /></el-icon>
<template #tip>
<span>支持jpg, png等格式文件上传，文件大小不超过10MB，可上传多张 </span>
</template>
</el-upload>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="持有人">
<!-- 公共组件 持有人 -->
<Holder @change="handleChange"></Holder>
<Holder :userid="String(form.residentId)" @change="handleChange"></Holder>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="备注" prop="email">
<el-input type="textarea" :rows="5" v-model.trim="form.email" placeholder="请输入" />
<el-form-item label="备注" prop="remark">
<el-input type="textarea" :rows="5" v-model.trim="form.remark" placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
@@ -66,45 +104,130 @@
import { ref } from 'vue';
import Holder from '@/components/Holder/index.vue';
import PageHeader from '@/components/Pageheader/index.vue';
import { listArea } from '@/api/system/carArea';
import { listParking } from '@/api/system/parking';
import { UploadFiles, UploadProps, UploadRawFile, UploadUserFile } from 'element-plus';
import { addCar, getCar, updateCar, uploadCar } from '@/api/system/cars';
import { useUserStore } from '@/store/modules/user';
import { validator } from '@/utils/Reg';
const uploadUrl = import.meta.env.VITE_APP_BASE_API + '/car/uploadImage';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const router = useRouter();
const route = useRoute();
const formRef = ref();
const form = ref({
id: null,
houseId: null,
rentalName: '', // 租户姓名
rent: null, // 租金
houseFace: '', // 房屋朝向
rentalType: 0, // 整租合租
phone: null, //手机号
houseArea: null, // 房屋面积
floorNo: null, //楼层号
inTime: '', //入住时间
facilities: '', //房屋设施
houseImageUrl: '', //房屋图片
supInfo: '', //补充租房信息
vx: '', //微信
houseUse: 0, //房屋用途
rentalStatus: 0, //租赁状态
email: '' //邮箱
areaId: null, // 区域id
residentId: null, // 车位id
parkingId: null, // 持有人id
carNum: '', //车牌号
carBrand: '', //车辆品牌
carModel: '', //车辆型号
carColor: '', //车身颜色
remark: '', //备注
carImageUrl: '' //车辆图片url
});
const rules = ref({
houseId: [{ required: true, message: '请选择房屋', trigger: 'blur' }],
rentalName: [{ required: true, message: '请输入名称', trigger: 'blur' }]
areaId: [{ required: true, message: '请选择区域', trigger: 'blur' }],
residentId: [{ required: true, message: '请选择', trigger: 'blur' }],
carNum: [
{ required: true, message: '请输入车牌号', trigger: 'blur' },
{
validator: (_, value) => validator(value, 'PlateNumber'),
message: '请请输入车牌号',
trigger: 'blur'
}
],
carBrand: [{ required: true, message: '请输入车辆品牌', trigger: 'blur' }]
});
const userid = ref(null);
function headerToken() {
const useStore = useUserStore();
return {
Authorization: 'Bearer ' + useStore.token
};
}
const userid = ref('');
const beforeAvatarUpload: UploadProps['beforeUpload'] = (rawFile: UploadRawFile) => {
const type = rawFile.type.split('/').pop();
if (['png', 'jpg'].includes(type)) {
if (rawFile.size / 1024 / 1024 <= 10) {
return true;
} else {
ElMessage.warning('图片大小超过10M,请重新上传');
return false;
}
} else {
ElMessage.warning('图片格式不是 png/jpg 格式, 请重新上传');
return false;
}
};
const handleAvatarSuccess: UploadProps['onSuccess'] = (response: any, uploadFile: UploadFile, uploadFiles: UploadFiles) => {
form.value.carImageUrl = response.data.url;
};
// 车辆区域
const carArealist = ref([]);
// 根据车辆区域 动态选择 车位
const parkinglist = ref([]);
function init() {
listArea().then((res) => {
console.log(res);
carArealist.value = res.rows;
});
}
init();
if (route.query.id) {
userid.value = route.query.id as string;
form.value.id = userid.value;
getCar(userid.value).then((res) => {
form.value = {
...form.value,
...res.data
};
});
}
function changeArealist(val: string) {
console.log(val, typeof val);
listParking({
areaId: val,
pageSize: 9999999,
pageNum: 1
}).then((res) => {
console.log(res);
parkinglist.value = res.rows;
});
}
// !== 提交 =============================================================================
// 提交
const submitForm = () => {
formRef.value?.validate(async (valid: boolean) => {
if (valid) {
console.log(form.value);
if (userid.value.trim() !== '') {
console.log('edit');
updateCar(form.value).then((res) => {
ElMessage.success('编辑成功');
cancelForm();
});
} else {
console.log('add');
addCar(form.value).then((res) => {
console.log(res);
ElMessage.success('添加成功');
cancelForm();
});
}
}
});
};
// 推出
const cancelForm = () => {
router.push({
@@ -115,9 +238,37 @@ const cancelForm = () => {
// 选择住户
function handleChange(pop) {
console.log(pop);
form.value.residentId = pop;
}
</script>
<style scoped>
.avatar-uploader .avatar {
width: 178px;
height: 178px;
display: block;
}
.avatar-uploader:deep(.el-upload) {
border: 1px dashed #ccc;
margin-right: 20px;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
transition: var(--el-transition-duration-fast);
}
.avatar-uploader .el-upload:hover {
border-color: var(--el-color-primary);
}
.el-icon.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 178px;
height: 178px;
text-align: center;
}
</style>
<style scoped lang="scss">
.AddBuildingBox {
padding: 15px;

134
src/views/system/cars/index.vue
View File

@@ -1,15 +1,18 @@
<template>
<div class="p-2">
<Pageheader title="添加房屋租赁"></Pageheader>
<Pageheader title="车辆管理"></Pageheader>
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
<div v-show="showSearch" class="mb-[10px]">
<el-card shadow="hover">
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
<el-form-item label="持有人" prop="residentId">
<el-input v-model="queryParams.residentId" placeholder="请输入持有人id(住户表id)" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="车牌号" prop="carNum">
<el-input v-model="queryParams.carNum" placeholder="请输入车牌号" clearable @keyup.enter="handleQuery" />
<el-input v-model.trim="queryParams.carNum" placeholder="请输入车牌号" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="车辆品牌" prop="carBrand">
<el-input v-model.trim="queryParams.carBrand" placeholder="请输入车辆品牌" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="车身颜色" prop="carColor">
<el-input v-model.trim="queryParams.carColor" placeholder="请输入车身颜色" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
@@ -38,12 +41,14 @@
<el-table v-loading="loading" border :data="carList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="车牌号" align="center" prop="id" v-if="true" />
<el-table-column label="车辆品牌" align="center" prop="areaId" />
<el-table-column label="车辆型号" align="center" prop="parkingId" />
<el-table-column label="车身颜色" align="center" prop="residentId" />
<el-table-column label="持有人" align="center" prop="carNum" />
<el-table-column label="备注" align="center" prop="carBrand" />
<el-table-column label="车牌号" align="center" prop="carNum" />
<el-table-column label="车辆品牌" align="center" prop="carBrand" />
<el-table-column label="车辆型号" align="center" prop="carModel" />
<el-table-column label="车身颜色" align="center" prop="carColor" />
<el-table-column label="持有人" align="center" prop="residentId">
<template #default="scope"> {{ getResidentName(scope.row.residentId) }} </template>
</el-table-column>
<el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="修改" placement="top">
@@ -58,58 +63,6 @@
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
</el-card>
<!-- 添加或修改车辆管理对话框 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
<el-form ref="carFormRef" :model="form" :rules="rules" label-width="80px">
<el-form-item label="区域id" prop="areaId">
<el-input v-model="form.areaId" placeholder="请输入区域id" />
</el-form-item>
<el-form-item label="车位id" prop="parkingId">
<el-input v-model="form.parkingId" placeholder="请输入车位id" />
</el-form-item>
<el-form-item label="持有人id(住户表id)" prop="residentId">
<el-input v-model="form.residentId" placeholder="请输入持有人id(住户表id)" />
</el-form-item>
<el-form-item label="车牌号" prop="carNum">
<el-input v-model="form.carNum" placeholder="请输入车牌号" />
</el-form-item>
<el-form-item label="车辆品牌" prop="carBrand">
<el-input v-model="form.carBrand" placeholder="请输入车辆品牌" />
</el-form-item>
<el-form-item label="车辆型号" prop="carModel">
<el-input v-model="form.carModel" placeholder="请输入车辆型号" />
</el-form-item>
<el-form-item label="车身颜色" prop="carColor">
<el-input v-model="form.carColor" placeholder="请输入车身颜色" />
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入备注" />
</el-form-item>
<el-form-item label="车辆图片url" prop="carImageUrl">
<el-input v-model="form.carImageUrl" type="textarea" placeholder="请输入内容" />
</el-form-item>
<el-form-item label="创建者" prop="createBy">
<el-input v-model="form.createBy" placeholder="请输入创建者" />
</el-form-item>
<el-form-item label="创建时间" prop="createTime">
<el-date-picker clearable v-model="form.createTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择创建时间">
</el-date-picker>
</el-form-item>
<el-form-item label="修改者" prop="updateBy">
<el-input v-model="form.updateBy" placeholder="请输入修改者" />
</el-form-item>
<el-form-item label="修改时间" prop="updateTime">
<el-date-picker clearable v-model="form.updateTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择修改时间">
</el-date-picker>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
@@ -117,6 +70,7 @@
import Pageheader from '@/components/Pageheader/index.vue';
import { listCar, getCar, delCar, addCar, updateCar } from '@/api/system/cars/index';
import { CarVO, CarQuery, CarForm } from '@/api/system/cars/type';
import { listResident } from '@/api/system/resident';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -134,11 +88,6 @@ const total = ref(0);
const queryFormRef = ref<ElFormInstance>();
const carFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: CarForm = {
id: undefined,
areaId: undefined,
@@ -177,27 +126,24 @@ const data = reactive<PageData<CarForm, CarQuery>>({
const { queryParams, form, rules } = toRefs(data);
/** 持有人 */
const ResidentList = ref([]);
const getResidentName = (id: string | number) => {
const find = ResidentList.value.find((item) => item.id === id);
return find.name;
};
/** 查询车辆管理列表 */
const getList = async () => {
loading.value = true;
const res = await listCar(queryParams.value);
const res1 = await listResident();
ResidentList.value = res1.rows;
carList.value = res.rows;
total.value = res.total;
loading.value = false;
};
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
};
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
carFormRef.value?.resetFields();
};
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1;
@@ -234,23 +180,6 @@ const handleUpdate = async (row?: CarVO) => {
});
};
/** 提交按钮 */
const submitForm = () => {
carFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
if (form.value.id) {
await updateCar(form.value).finally(() => (buttonLoading.value = false));
} else {
await addCar(form.value).finally(() => (buttonLoading.value = false));
}
proxy?.$modal.msgSuccess('操作成功');
dialog.visible = false;
await getList();
}
});
};
/** 删除按钮操作 */
const handleDelete = async (row?: CarVO) => {
const _ids = row?.id || ids.value;
@@ -260,17 +189,6 @@ const handleDelete = async (row?: CarVO) => {
await getList();
};
/** 导出按钮操作 */
const handleExport = () => {
proxy?.download(
'car/car/export',
{
...queryParams.value
},
`car_${new Date().getTime()}.xlsx`
);
};
onMounted(() => {
getList();
});

219
src/views/system/house/HouseDetails.vue
View File

@@ -7,19 +7,167 @@
<el-button type="primary" text>编辑</el-button>
</div>
<div class="addBuildingFormBody">
<div style="width: 50%">
<el-descriptions>
<el-descriptions-item label-align="right" label="房号:"> 娜美 </el-descriptions-item>
<el-descriptions-item label-align="right" label="所属小区:">18100000000</el-descriptions-item>
<el-descriptions-item label-align="right" label="楼栋:">2栋</el-descriptions-item>
<el-descriptions-item label-align="right" label="单元:">2单元</el-descriptions-item>
<el-descriptions-item label-align="right" label="楼层:">3楼</el-descriptions-item>
<el-descriptions-item label-align="right" label="建筑面积:">112㎡</el-descriptions-item>
<el-descriptions-item label-align="right" label="公摊面积:">12㎡</el-descriptions-item>
<el-descriptions-item label-align="right" label="套内面积:">100㎡</el-descriptions-item>
<el-descriptions-item label-align="right" label="户型:">3室2厅2卫</el-descriptions-item>
</el-descriptions>
<div class="descriptionsbox">
<div class="label">房号:</div>
<div class="value">娜美</div>
</div>
<div class="descriptionsbox">
<div class="label">所属小区:</div>
<div class="value">18100000000</div>
</div>
<div class="descriptionsbox">
<div class="label">楼栋:</div>
<div class="value">2栋</div>
</div>
<div class="descriptionsbox">
<div class="label">单元:</div>
<div class="value">2单元</div>
</div>
<div class="descriptionsbox">
<div class="label">楼层:</div>
<div class="value">3楼</div>
</div>
<div class="descriptionsbox">
<div class="label">建筑面积:</div>
<div class="value">112㎡</div>
</div>
<div class="descriptionsbox">
<div class="label">公摊面积:</div>
<div class="value">12㎡</div>
</div>
<div class="descriptionsbox">
<div class="label">户型:</div>
<div class="value">3室2厅2卫</div>
</div>
</div>
</div>
<div class="AddBuildingBody">
<div class="title">
<span>储藏室信息 </span>
<el-button type="primary" text>编辑</el-button>
</div>
<div class="addBuildingFormBody">
<div class="descriptionsbox">
<div class="label">房号:</div>
<div class="value">娜美</div>
</div>
<div class="descriptionsbox">
<div class="label">所属小区:</div>
<div class="value">18100000000</div>
</div>
<div class="descriptionsbox">
<div class="label">楼栋:</div>
<div class="value">2栋</div>
</div>
<div class="descriptionsbox">
<div class="label">单元:</div>
<div class="value">2单元</div>
</div>
<div class="descriptionsbox">
<div class="label">楼层:</div>
<div class="value">3楼</div>
</div>
<div class="descriptionsbox">
<div class="label">建筑面积:</div>
<div class="value">112㎡</div>
</div>
<div class="descriptionsbox">
<div class="label">公摊面积:</div>
<div class="value">12㎡</div>
</div>
<div class="descriptionsbox">
<div class="label">户型:</div>
<div class="value">3室2厅2卫</div>
</div>
</div>
</div>
<!-- 车位信息 -->
<div class="AddBuildingBody">
<div class="title">
<span>车位信息</span>
<el-button type="primary" text>编辑</el-button>
</div>
<div class="addBuildingFormBody">
<div class="descriptionsbox">
<div class="label">房号:</div>
<div class="value">娜美</div>
</div>
<div class="descriptionsbox">
<div class="label">所属小区:</div>
<div class="value">18100000000</div>
</div>
<div class="descriptionsbox">
<div class="label">楼栋:</div>
<div class="value">2栋</div>
</div>
<div class="descriptionsbox">
<div class="label">单元:</div>
<div class="value">2单元</div>
</div>
<div class="descriptionsbox">
<div class="label">楼层:</div>
<div class="value">3楼</div>
</div>
<div class="descriptionsbox">
<div class="label">建筑面积:</div>
<div class="value">112㎡</div>
</div>
<div class="descriptionsbox">
<div class="label">公摊面积:</div>
<div class="value">12㎡</div>
</div>
<div class="descriptionsbox">
<div class="label">户型:</div>
<div class="value">3室2厅2卫</div>
</div>
</div>
</div>
<!-- 收费项目 -->
<div class="AddBuildingBody">
<div class="title">
<span>收费项目</span>
</div>
<div>
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="date" label="收费项目" />
<el-table-column prop="name" label="收费标准" />
<el-table-column prop="name" label="开始时间" />
<el-table-column prop="name" label="结束时间" />
<el-table-column prop="name" label="备注" />
<el-table-column prop="address" label="操作" />
</el-table>
</div>
</div>
<!-- 相关住户 -->
<div class="AddBuildingBody">
<div class="title">
<span>相关住户</span>
</div>
<div>
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="date" label="姓名" />
<el-table-column prop="name" label="性别" />
<el-table-column prop="name" label="联系电话" />
<el-table-column prop="name" label="身份" />
<el-table-column prop="name" label="备注" />
<el-table-column prop="address" label="操作" />
</el-table>
</div>
</div>
<!-- 缴费账单 -->
<div class="AddBuildingBody">
<div class="title">
<span>缴费账单</span>
</div>
<div>
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="date" label="姓名" />
<el-table-column prop="name" label="性别" />
<el-table-column prop="name" label="联系电话" />
<el-table-column prop="name" label="身份" />
<el-table-column prop="name" label="备注" />
<el-table-column prop="address" label="操作" />
</el-table>
</div>
</div>
</div>
@@ -28,6 +176,28 @@
<script setup lang="ts">
import { ref } from 'vue';
import PageHeader from '@/components/Pageheader/index.vue';
const tableData = [
{
date: '2016-05-03',
name: 'Tom',
address: 'No. 189, Grove St, Los Angeles'
},
{
date: '2016-05-02',
name: 'Tom',
address: 'No. 189, Grove St, Los Angeles'
},
{
date: '2016-05-04',
name: 'Tom',
address: 'No. 189, Grove St, Los Angeles'
},
{
date: '2016-05-01',
name: 'Tom',
address: 'No. 189, Grove St, Los Angeles'
}
];
</script>
<style scoped lang="scss">
@@ -35,6 +205,7 @@ import PageHeader from '@/components/Pageheader/index.vue';
padding: 15px;
height: 100%;
width: 100%;
overflow-y: auto;
}
.AddBuildingBody {
margin-top: 20px;
@@ -47,14 +218,32 @@ import PageHeader from '@/components/Pageheader/index.vue';
height: 40px;
line-height: 40px;
padding-left: 20px;
font-size: 15px;
background-color: rgba(255, 255, 255, 1);
color: rgba(16, 16, 16, 1);
border-bottom: 1px solid #bbbbbb;
margin-bottom: 60px;
margin-bottom: 20px;
}
.addBuildingFormBody {
font-size: large;
font-weight: bold;
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(3, 1fr);
.descriptionsbox {
display: flex;
align-items: center;
margin: 10px 0;
font-size: 15px;
.label {
width: 100px;
text-align: right;
font-weight: 800;
}
.value {
flex: 1;
margin-left: 20px;
}
}
}
}
</style>

6
src/views/system/house/components/components/table.vue
View File

@@ -57,6 +57,12 @@ function contextMenuFun(val: { type: string; value: string }) {
break;
case 'main':
console.log('你选择了：', val);
router.push({
path: '/house/HouseDetails',
query: {
id: val.value
}
});
break;
case 'delete':
console.log('你选择了：', val);

62
src/views/system/houseRental/addhouseResident.vue
View File

@@ -178,14 +178,15 @@
import { ref } from 'vue';
import PageHeader from '@/components/Pageheader/index.vue';
import { HouseRentalVO } from '@/api/system/houseRental/type';
import { CascaderValue, UploadFiles, UploadInstance, UploadProps, UploadRawFile, UploadUserFile } from 'element-plus';
import { CascaderValue, UploadInstance, UploadProps, UploadUserFile } from 'element-plus';
import { getCommunitylistAPI } from '@/api/system/community';
import { getVillageTree } from '@/api/system/house';
import { convertBuildingToTree, getHousePathById, hasFormData, splitStringUrl } from '@/utils/house';
import { getHousePathById, hasFormData, splitStringUrl } from '@/utils/house';
import { addHouseRental, getHouseRental, updateHouseRental, uploadHouseImage } from '@/api/system/houseRental';
import { validator } from '@/utils/Reg';
import { useHouseStore } from '@/store/modules/house';
const houseStore = useHouseStore();
const { treedata } = storeToRefs(houseStore);
const uploadUrl = import.meta.env.VITE_APP_BASE_API + '/houseRental/uploadImages';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { com_rental_method } = toRefs<any>(proxy?.useDict('com_rental_method'));
@@ -233,32 +234,21 @@ const rules = ref({
// ! 编辑租赁-=================================================================================
const userid = ref(null);
// !== 楼栋房屋 =============================================================================
const treedata = ref([]);
function gettreedata() {
getCommunitylistAPI().then((res) => {
const currentviliage = res.rows.find((item) => item.choiceStatus === 0);
if (currentviliage.villageId) {
getVillageTree(currentviliage.villageId).then((res) => {
treedata.value = convertBuildingToTree(res.data.buildings);
console.log(treedata.value);
// !== 编辑用户 =============================================================================
if (route.query.id) {
userid.value = route.query.id;
getHouseRental(userid.value).then((res) => {
console.log(res);
form.value = {
...form.value,
...res.data
};
const imgurllist = splitStringUrl(form.value.houseImageUrl);
fileList.value = imgurllist;
const arr = getHousePathById(treedata.value, form.value.houseId);
userHousepath.value = arr;
});
}
});
}
});
if (route.query.id) {
userid.value = route.query.id;
getHouseRental(userid.value).then((res) => {
console.log(res);
form.value = {
...form.value,
...res.data
};
const imgurllist = splitStringUrl(form.value.houseImageUrl);
fileList.value = imgurllist;
const arr = getHousePathById(treedata.value, form.value.houseId);
userHousepath.value = arr;
});
}
}
gettreedata();
@@ -284,6 +274,7 @@ const handlePictureCardPreview: UploadProps['onPreview'] = (uploadFile) => {
};
const handleRemove: UploadProps['onRemove'] = (uploadFile, uploadFiles) => {
console.log(uploadFile, uploadFiles);
fileList.value = uploadFiles;
};
// !== 家电 =============================================================================
@@ -321,11 +312,11 @@ const submitForm = () => {
if (item.raw && item.raw instanceof File) {
formdata.append('files', item.raw);
} else {
str += item.url;
str += item.url + ',';
}
});
console.log(formdata);
if (!hasFormData(formdata)) return sendForm();
if (!hasFormData(formdata)) return sendForm(str);
uploadHouseImage(formdata)
.then((res) => {
if (res.data.success.length > 0) {
@@ -343,7 +334,7 @@ const submitForm = () => {
});
ElMessage.error('图片：' + str + ' 上传失败！');
}
sendForm();
sendForm(str);
})
.catch((err) => {
if (err && err.data && err.data.error.length > 0) {
@@ -356,16 +347,16 @@ const submitForm = () => {
});
return;
} else {
sendForm();
sendForm(str);
}
}
});
};
const sendForm = () => {
const sendForm = (val: string) => {
form.value.houseImageUrl = val;
// edit or add
if (userid.value) {
console.log('edit');
console.log(form.value);
updateHouseRental(form.value).then(() => {
ElMessage.success('编辑成功');
cancelForm();
@@ -422,6 +413,7 @@ const cancelForm = () => {
padding: 15px;
height: 100%;
width: 100%;
overflow-y: auto;
}
.AddBuildingBody {
margin-top: 20px;

197
src/views/system/houseRental/houseMain.vue Normal file
View File

@@ -0,0 +1,197 @@
<template>
<div class="AddBuildingBox">
<PageHeader title="房屋租赁管理"></PageHeader>
<div class="AddBuildingBody">
<div class="title">
<span>基础资料 </span>
<span class="ml-20px color-blue cursor-pointer" @click="hanlededit">编辑</span>
</div>
<div class="addBuildingFormBody">
<div class="descriptionsbox">
<div class="label">房屋:</div>
<div class="value">{{ HouseInfo.house }}</div>
</div>
<div class="descriptionsbox">
<div class="label">业主姓名:</div>
<div class="value">{{ HouseInfo.rentalName }}</div>
</div>
<div class="descriptionsbox">
<div class="label">租金:</div>
<div class="value">{{ HouseInfo.rent }}元</div>
</div>
<div class="descriptionsbox">
<div class="label">租赁方式:</div>
<div class="value">
<DictTag :options="com_rental_method" :value="HouseInfo.rentalType"></DictTag>
</div>
</div>
<div class="descriptionsbox">
<div class="label">房屋朝向:</div>
<div class="value">{{ HouseInfo.houseFace }}</div>
</div>
<div class="descriptionsbox">
<div class="label">房屋面积:</div>
<div class="value">{{ HouseInfo.houseArea }}㎡</div>
</div>
<div class="descriptionsbox">
<div class="label">房屋楼层:</div>
<div class="value">{{ HouseInfo.floorNo }}层</div>
</div>
<div class="descriptionsbox">
<div class="label">入住时间:</div>
<div class="value">{{ HouseInfo.inTime }}</div>
</div>
</div>
<div class="descriptionsbox">
<div class="label">房屋设施:</div>
<div class="value">
<DictTag :options="com_house_rental_facilities" :value="HouseInfo.facilities"></DictTag>
</div>
</div>
<el-row>
<el-col :span="10">
<div class="descriptionsbox">
<div class="label">房屋照片:</div>
<div class="value grid grid-cols-4 gap-4">
<el-image v-for="(item, index) in HouseInfo.houseImageUrls" :key="index" :src="item" class="houseImage"></el-image>
</div>
</div>
</el-col>
</el-row>
<div class="descriptionsbox">
<div class="label">租房信息:</div>
<div class="value">{{ HouseInfo.supInfo }}</div>
</div>
<el-row>
<el-col :span="12">
<div class="descriptionsbox">
<div class="label">租房电话:</div>
<div class="value">{{ HouseInfo.phone }}</div>
</div>
</el-col>
<el-col :span="12">
<div class="descriptionsbox">
<div class="label">微信:</div>
<div class="value">{{ HouseInfo.vx }}</div>
</div>
</el-col>
</el-row>
</div>
</div>
</template>
<script setup lang="ts">
import { ref } from 'vue';
import PageHeader from '@/components/Pageheader/index.vue';
import { getHouseRental } from '@/api/system/houseRental';
import { useHouseStore } from '@/store/modules/house';
import { getHousePathById } from '@/utils/house';
const houseStore = useHouseStore();
const { treedata } = storeToRefs(houseStore);
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { com_rental_method } = toRefs<any>(proxy?.useDict('com_rental_method'));
const { com_house_rental_facilities } = toRefs<any>(proxy?.useDict('com_house_rental_facilities'));
const route = useRoute();
const router = useRouter();
const houseRentalid = ref(null);
const HouseInfo = ref({
'id': '',
house: '',
'name': null,
'rentalStatus': null,
'rentalName': '',
'rent': null,
'rentalType': '',
'houseFace': '',
'houseArea': null,
'floorNo': null,
'inTime': '',
'facilities': '',
'houseImageUrl': '',
'supInfo': '',
'phone': null,
'vx': '',
'email': '',
'houseId': null,
'houseUse': '',
'pubBy': null,
'pubTime': '',
houseImageUrls: []
});
function init() {
if (route.query.id) {
houseRentalid.value = route.query.id;
}
getHouseRental(houseRentalid.value).then((res) => {
console.log(res);
HouseInfo.value = res.data;
HouseInfo.value.houseImageUrls = HouseInfo.value.houseImageUrl.split(',').filter((item) => item);
const arr = getHousePathById(treedata.value, HouseInfo.value.houseId, 'label');
HouseInfo.value.house = arr.join(' - ');
});
}
init();
function hanlededit() {
router.push({
path: '/house/addhouseRental',
query: {
id: HouseInfo.value.id
}
});
}
</script>
<style scoped lang="scss">
.AddBuildingBox {
padding: 15px;
height: 100%;
width: 100%;
overflow-y: auto;
}
.AddBuildingBody {
margin-top: 20px;
display: flex;
flex-direction: column;
justify-content: center;
background-color: white;
padding: 15px;
.title {
height: 40px;
line-height: 40px;
padding-left: 20px;
font-size: 15px;
background-color: rgba(255, 255, 255, 1);
color: rgba(16, 16, 16, 1);
border-bottom: 1px solid #bbbbbb;
margin-bottom: 20px;
}
.addBuildingFormBody {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-rows: repeat(4, 1fr);
}
.houseImage {
width: 200px;
height: 100px;
}
.descriptionsbox {
display: flex;
align-items: center;
margin-bottom: 30px;
font-size: 15px;
.label {
width: 100px;
text-align: right;
font-weight: 800;
}
.value {
flex: 1;
margin-left: 20px;
}
}
}
</style>

55
src/views/system/houseRental/index.vue
View File

@@ -46,17 +46,18 @@
<el-table class="h-full" v-loading="loading" border :data="houseRentalList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="房屋信息" align="center" prop="rentalName" />
<el-table-column label="租赁状态" align="center" prop="rent" />
<el-table-column label="发布人" align="center" prop="rentalName" />
<el-table-column label="联系方式" align="center" prop="rent" />
<el-table-column label="发布时间" align="center" prop="pubTime" />
<el-table-column label="房屋用途" align="center" prop="rent">
<el-table-column label="房屋信息" align="center" prop="name" />
<el-table-column label="租赁状态" align="center" prop="rentalStatus">
<template #default="{ row }">
<span v-if="row.houseUse === 0">普通住宅</span>
<span v-else-if="row.houseUse === 1"> 商业用地 </span>
<span v-else-if="row.houseUse === 2">商住两用</span>
<span v-else>其他</span>
<DictTag :options="com_rental_status" :value="row.rentalStatus"></DictTag>
</template>
</el-table-column>
<el-table-column label="发布人" align="center" prop="rentalName" />
<el-table-column label="联系方式" align="center" prop="phone" />
<el-table-column label="发布时间" align="center" prop="pubTime" />
<el-table-column label="房屋用途" align="center" prop="houseUse">
<template #default="{ row }">
<DictTag :options="com_house_use" :value="row.houseUse"></DictTag>
</template>
</el-table-column>
<el-table-column label="租赁方式" align="center" prop="rentalType">
@@ -67,18 +68,9 @@
</el-table-column>
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="修改" placement="top">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['houseRental:houseRental:edit']"></el-button>
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button
link
type="primary"
icon="Delete"
@click="handleDelete(scope.row)"
v-hasPermi="['houseRental:houseRental:remove']"
></el-button>
</el-tooltip>
<el-button link type="primary" @click="handleMain(scope.row)" v-hasPermi="['houseRental:houseRental:edit']">详情</el-button>
<el-button link type="primary" @click="handleUpdate(scope.row)" v-hasPermi="['houseRental:houseRental:edit']">修改</el-button>
<el-button link type="primary" @click="handleDelete(scope.row)" v-hasPermi="['houseRental:houseRental:remove']">删除</el-button>
</template>
</el-table-column>
</el-table>
@@ -90,12 +82,12 @@
<script setup name="HouseRental" lang="ts">
import Pageheader from '@/components/Pageheader/index.vue';
import { listHouseRental, delHouseRental, addHouseRental, updateHouseRental } from '@/api/system/houseRental/index';
import { listHouseRental, delHouseRental } from '@/api/system/houseRental/index';
import { HouseRentalVO, HouseRentalQuery, HouseRentalForm } from '@/api/system/houseRental/type';
import { getDictLabel } from '@/utils/house';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { com_house_use } = toRefs<any>(proxy?.useDict('com_house_use'));
const { com_rental_status } = toRefs<any>(proxy?.useDict('com_rental_status'));
const { com_rental_method } = toRefs<any>(proxy?.useDict('com_rental_method'));
const router = useRouter();
@@ -216,6 +208,15 @@ const handleUpdate = async (row?: HouseRentalVO) => {
}
});
};
/** 详情按钮操作 */
const handleMain = async (row?: HouseRentalVO) => {
router.push({
path: '/house/houseMain',
query: {
id: row.id
}
});
};
/** 删除按钮操作 */
const handleDelete = async (row?: HouseRentalVO) => {
@@ -231,4 +232,8 @@ onMounted(() => {
});
</script>
<style scoped lang="scss"></style>
<style scoped lang="scss">
.el-table {
height: calc(100% - 100px);
}
</style>

362
src/views/system/houseRental/index2.vue
View File

@@ -1,362 +0,0 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
<div v-show="showSearch" class="mb-[10px]">
<el-card shadow="hover">
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
<el-form-item label="房屋id" prop="houseId">
<el-input v-model="queryParams.houseId" placeholder="请输入房屋id" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="租户姓名" prop="rentalName">
<el-input v-model="queryParams.rentalName" placeholder="请输入租户姓名" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="租金 单位元" prop="rent">
<el-input v-model="queryParams.rent" placeholder="请输入租金 单位元" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="租赁状态 0未租 1出租中 2退租" prop="rentalStatus">
<el-select v-model="queryParams.rentalStatus" placeholder="请选择租赁状态 0未租 1出租中 2退租" clearable >
<el-option v-for="dict in com_rental_status" :key="dict.value" :label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item>
<el-form-item label="房屋朝向" prop="houseFace">
<el-input v-model="queryParams.houseFace" placeholder="请输入房屋朝向" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="房屋面积" prop="houseArea">
<el-input v-model="queryParams.houseArea" placeholder="请输入房屋面积" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="楼层号" prop="floorNo">
<el-input v-model="queryParams.floorNo" placeholder="请输入楼层号" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="入住时间" prop="inTime">
<el-date-picker clearable
v-model="queryParams.inTime"
type="date"
value-format="YYYY-MM-DD"
placeholder="请选择入住时间"
/>
</el-form-item>
<el-form-item label="房屋设施" prop="facilities">
<el-input v-model="queryParams.facilities" placeholder="请输入房屋设施" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="房屋照片url( "," 隔开)" prop="houseImageUrl">
<el-input v-model="queryParams.houseImageUrl" placeholder="请输入房屋照片url( "," 隔开)" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="补充租房信息" prop="supInfo">
<el-input v-model="queryParams.supInfo" placeholder="请输入补充租房信息" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="手机号" prop="phone">
<el-input v-model="queryParams.phone" placeholder="请输入手机号" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="微信" prop="vx">
<el-input v-model="queryParams.vx" placeholder="请输入微信" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="邮箱" prop="email">
<el-input v-model="queryParams.email" placeholder="请输入邮箱" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
</el-card>
</div>
</transition>
<el-card shadow="never">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['houseRental:houseRental:add']">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['houseRental:houseRental:edit']">修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['houseRental:houseRental:remove']">删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['houseRental:houseRental:export']">导出</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
</template>
<el-table v-loading="loading" border :data="houseRentalList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="id 房屋租赁表id" align="center" prop="id" v-if="true" />
<el-table-column label="房屋id" align="center" prop="houseId" />
<el-table-column label="租户姓名" align="center" prop="rentalName" />
<el-table-column label="租金 单位元" align="center" prop="rent" />
<el-table-column label="0 整租 1 合租" align="center" prop="rentalType" />
<el-table-column label="租赁状态 0未租 1出租中 2退租" align="center" prop="rentalStatus">
<template #default="scope">
<dict-tag :options="com_rental_status" :value="scope.row.rentalStatus"/>
</template>
</el-table-column>
<el-table-column label="房屋朝向" align="center" prop="houseFace" />
<el-table-column label="房屋面积" align="center" prop="houseArea" />
<el-table-column label="楼层号" align="center" prop="floorNo" />
<el-table-column label="入住时间" align="center" prop="inTime" width="180">
<template #default="scope">
<span>{{ parseTime(scope.row.inTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="房屋设施" align="center" prop="facilities">
<template #default="scope">
<dict-tag :options="com_house_rental_facilities" :value="scope.row.facilities"/>
</template>
</el-table-column>
<el-table-column label="房屋照片url( "," 隔开)" align="center" prop="houseImageUrl" />
<el-table-column label="补充租房信息" align="center" prop="supInfo" />
<el-table-column label="手机号" align="center" prop="phone" />
<el-table-column label="微信" align="center" prop="vx" />
<el-table-column label="邮箱" align="center" prop="email" />
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="修改" placement="top">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['houseRental:houseRental:edit']"></el-button>
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['houseRental:houseRental:remove']"></el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
</el-card>
<!-- 添加或修改房屋租赁管理对话框 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
<el-form ref="houseRentalFormRef" :model="form" :rules="rules" label-width="80px">
<el-form-item label="房屋id" prop="houseId">
<el-input v-model="form.houseId" placeholder="请输入房屋id" />
</el-form-item>
<el-form-item label="租户姓名" prop="rentalName">
<el-input v-model="form.rentalName" placeholder="请输入租户姓名" />
</el-form-item>
<el-form-item label="租金 单位元" prop="rent">
<el-input v-model="form.rent" placeholder="请输入租金 单位元" />
</el-form-item>
<el-form-item label="租赁状态 0未租 1出租中 2退租" prop="rentalStatus">
<el-radio-group v-model="form.rentalStatus">
<el-radio
v-for="dict in com_rental_status"
:key="dict.value"
:value="parseInt(dict.value)"
>{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="房屋朝向" prop="houseFace">
<el-input v-model="form.houseFace" placeholder="请输入房屋朝向" />
</el-form-item>
<el-form-item label="房屋面积" prop="houseArea">
<el-input v-model="form.houseArea" placeholder="请输入房屋面积" />
</el-form-item>
<el-form-item label="楼层号" prop="floorNo">
<el-input v-model="form.floorNo" placeholder="请输入楼层号" />
</el-form-item>
<el-form-item label="入住时间" prop="inTime">
<el-date-picker clearable
v-model="form.inTime"
type="datetime"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择入住时间">
</el-date-picker>
</el-form-item>
<el-form-item label="房屋设施" prop="facilities">
<el-input v-model="form.facilities" placeholder="请输入房屋设施" />
</el-form-item>
<el-form-item label="房屋照片url( "," 隔开)" prop="houseImageUrl">
<el-input v-model="form.houseImageUrl" type="textarea" placeholder="请输入内容" />
</el-form-item>
<el-form-item label="补充租房信息" prop="supInfo">
<el-input v-model="form.supInfo" type="textarea" placeholder="请输入内容" />
</el-form-item>
<el-form-item label="手机号" prop="phone">
<el-input v-model="form.phone" placeholder="请输入手机号" />
</el-form-item>
<el-form-item label="微信" prop="vx">
<el-input v-model="form.vx" placeholder="请输入微信" />
</el-form-item>
<el-form-item label="邮箱" prop="email">
<el-input v-model="form.email" placeholder="请输入邮箱" />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup name="HouseRental" lang="ts">
import { listHouseRental, getHouseRental, delHouseRental, addHouseRental, updateHouseRental } from '@/api/houseRental/houseRental';
import { HouseRentalVO, HouseRentalQuery, HouseRentalForm } from '@/api/houseRental/houseRental/types';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { com_rental_status } = toRefs<any>(proxy?.useDict('com_rental_status'));
const houseRentalList = ref<HouseRentalVO[]>([]);
const buttonLoading = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<string | number>>([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const queryFormRef = ref<ElFormInstance>();
const houseRentalFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: HouseRentalForm = {
id: undefined,
houseId: undefined,
rentalName: undefined,
rent: undefined,
rentalType: undefined,
rentalStatus: undefined,
houseFace: undefined,
houseArea: undefined,
floorNo: undefined,
inTime: undefined,
facilities: undefined,
houseImageUrl: undefined,
supInfo: undefined,
phone: undefined,
vx: undefined,
email: undefined,
}
const data = reactive<PageData<HouseRentalForm, HouseRentalQuery>>({
form: {...initFormData},
queryParams: {
pageNum: 1,
pageSize: 10,
houseId: undefined,
rentalName: undefined,
rent: undefined,
rentalType: undefined,
rentalStatus: undefined,
houseFace: undefined,
houseArea: undefined,
floorNo: undefined,
inTime: undefined,
facilities: undefined,
houseImageUrl: undefined,
supInfo: undefined,
phone: undefined,
vx: undefined,
email: undefined,
params: {
}
},
rules: {
id: [
{ required: true, message: "id 房屋租赁表id不能为空", trigger: "blur" }
],
}
});
const { queryParams, form, rules } = toRefs(data);
/** 查询房屋租赁管理列表 */
const getList = async () => {
loading.value = true;
const res = await listHouseRental(queryParams.value);
houseRentalList.value = res.rows;
total.value = res.total;
loading.value = false;
}
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
}
/** 表单重置 */
const reset = () => {
form.value = {...initFormData};
houseRentalFormRef.value?.resetFields();
}
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1;
getList();
}
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
}
/** 多选框选中数据 */
const handleSelectionChange = (selection: HouseRentalVO[]) => {
ids.value = selection.map(item => item.id);
single.value = selection.length != 1;
multiple.value = !selection.length;
}
/** 新增按钮操作 */
const handleAdd = () => {
reset();
dialog.visible = true;
dialog.title = "添加房屋租赁管理";
}
/** 修改按钮操作 */
const handleUpdate = async (row?: HouseRentalVO) => {
reset();
const _id = row?.id || ids.value[0]
const res = await getHouseRental(_id);
Object.assign(form.value, res.data);
dialog.visible = true;
dialog.title = "修改房屋租赁管理";
}
/** 提交按钮 */
const submitForm = () => {
houseRentalFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
if (form.value.id) {
await updateHouseRental(form.value).finally(() => buttonLoading.value = false);
} else {
await addHouseRental(form.value).finally(() => buttonLoading.value = false);
}
proxy?.$modal.msgSuccess("操作成功");
dialog.visible = false;
await getList();
}
});
}
/** 删除按钮操作 */
const handleDelete = async (row?: HouseRentalVO) => {
const _ids = row?.id || ids.value;
await proxy?.$modal.confirm('是否确认删除房屋租赁管理编号为"' + _ids + '"的数据项？').finally(() => loading.value = false);
await delHouseRental(_ids);
proxy?.$modal.msgSuccess("删除成功");
await getList();
}
/** 导出按钮操作 */
const handleExport = () => {
proxy?.download('houseRental/houseRental/export', {
...queryParams.value
}, `houseRental_${new Date().getTime()}.xlsx`)
}
onMounted(() => {
getList();
});
</script>

13
src/views/system/parking/addParking.vue
View File

@@ -38,7 +38,7 @@
<el-col :span="11">
<el-form-item label="车位类型" prop="type">
<el-radio-group v-model="form.type">
<el-radio v-for="dict in com_parking_type" :key="dict.value" :value="parseInt(dict.value)">{{ dict.label }}</el-radio>
<el-radio v-for="dict in com_parking_type" :key="dict.value" :value="dict.value">{{ dict.label }}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
@@ -55,7 +55,7 @@
<el-col :span="24">
<el-form-item label="持有人" prop="residentId">
<!-- 公共组件 持有人 -->
<Holder @change="handleChange"></Holder>
<Holder :userid="form.resident_id" @change="handleChange"></Holder>
</el-form-item>
</el-col>
</el-row>
@@ -96,9 +96,9 @@ const form = ref({
areaId: null, // 区域id
parkingArea: null, // 车位面积
parkingFloor: null, // 车位楼层
type: 0, // 车位类型
resident_id: null, // 住户id
parkingStatus: null, // 车位状态
type: '0', // 车位类型
residentId: null, // 住户id
parkingStatus: '', // 车位状态
remark: '', // 备注
parkingCode: '' // 车位编码
});
@@ -113,7 +113,6 @@ const userid = ref(null);
if (route.query.id) {
userid.value = route.query.id;
getParking(userid.value).then((res) => {
console.log(res);
form.value = {
...form.value,
...res.data
@@ -143,7 +142,7 @@ function handleChange(pop) {
const submitForm = () => {
formRef.value?.validate(async (valid: boolean) => {
if (valid) {
form.value.resident_id = holderInfo.value;
form.value.residentId = holderInfo.value;
if (userid.value) {
updateParking(form.value).then((res) => {
ElMessage.success('编辑成功');

26
src/views/system/parking/index.vue
View File

@@ -7,7 +7,7 @@
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
<el-form-item label="车位状态" prop="parkingStatus">
<el-select v-model="queryParams.parkingStatus" placeholder="请选择" clearable>
<el-option v-for="dict in com_parking_statuslist" :key="dict.value" :label="dict.label" :value="Number(dict.value)" />
<el-option v-for="dict in com_parking_status" :key="dict.value" :label="dict.label" :value="Number(dict.value)" />
</el-select>
</el-form-item>
@@ -65,19 +65,19 @@
</el-table-column>
<el-table-column label="车位类型" align="center" prop="type">
<template #default="scope">
<dict-tag :options="com_parking_typelist" :value="scope.row.type" />
<dict-tag :options="com_parking_type" :value="scope.row.type" />
</template>
</el-table-column>
<el-table-column label="持有人" align="center" prop="residentName" />
<el-table-column label="审核状态" align="center" prop="checkStatus">
<template #default="scope">
<dict-tag :options="com_reviewlist" :value="scope.row.checkStatus" />
<dict-tag :options="com_review" :value="scope.row.checkStatus" />
</template>
</el-table-column>
<el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
<template #default="scope">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['parking:parking:edit']">审核</el-button>
<el-button link type="primary" icon="Edit" @click="handleMain(scope.row)" v-hasPermi="['parking:parking:edit']">审核</el-button>
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['parking:parking:edit']">修改</el-button>
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['parking:parking:remove']">删除</el-button>
</template>
@@ -100,10 +100,6 @@ const { com_review } = toRefs<any>(proxy?.useDict('com_review'));
const { com_parking_type } = toRefs<any>(proxy?.useDict('com_parking_type'));
const { com_parking_status } = toRefs<any>(proxy?.useDict('com_parking_status'));
const com_reviewlist = computed(() => com_review.value ?? []);
const com_parking_typelist = computed(() => com_parking_type.value ?? []);
const com_parking_statuslist = computed(() => com_parking_status.value ?? []);
const router = useRouter();
const parkingList = ref<ParkingVO[]>([]);
const buttonLoading = ref(false);
@@ -142,16 +138,13 @@ const data = reactive<PageData<ParkingForm, ParkingQuery>>({
areaId: undefined,
parkingCode: undefined,
parkingArea: undefined,
parkingStatus: undefined,
parkingStatus: '',
type: undefined,
residentId: undefined,
addTime: undefined,
addBy: undefined,
checkStatus: undefined,
params: {}
},
rules: {
id: [{ required: true, message: 'id车位管理表不能为空', trigger: 'blur' }]
}
});
@@ -210,6 +203,15 @@ const handleUpdate = async (row?: ParkingVO) => {
}
});
};
/** 审核按钮操作 */
const handleMain = async (row?: ParkingVO) => {
router.push({
path: '/carArea/parkMain',
query: {
id: row.id
}
});
};
/** 删除按钮操作 */
const handleDelete = async (row?: ParkingVO) => {

4
src/views/system/parking/parkMain.vue
View File

@@ -148,7 +148,7 @@
</div>
</template>
<div class="w-full h-50%">
<el-steps space="200px" direction="vertical" :active="activeStop">
<!-- <el-steps space="200px" direction="vertical" :active="activeStop">
<el-step :description="reviewInfo.submitTime">
<template #title>
<span v-if="active === 0">未提交信息</span>
@@ -173,7 +173,7 @@
<span>审核完成</span>
</template>
</el-step>
</el-steps>
</el-steps> -->
</div>
</el-card>
</el-col>

139
src/views/system/resident/ResidentMain.vue
View File

@@ -91,9 +91,9 @@
<div class="preivewBodybox">
<el-input v-model="reviewInfo.propertyReviewFeedback" placeholder="请输入" type="textarea" :rows="5"></el-input>
<div class="actions">
<el-button type="primary">审核通过</el-button>
<el-button type="danger">审核不通过</el-button>
<el-button>返回</el-button>
<el-button type="primary" @click="updatePass('1')">审核通过</el-button>
<el-button type="danger" @click="updatePass('2')">审核不通过</el-button>
<el-button @click="backRoute">返回</el-button>
</div>
</div>
</div>
@@ -114,21 +114,17 @@
<el-steps space="200px" direction="vertical" :active="activeStop">
<el-step :description="reviewInfo.submitTime">
<template #title>
<span v-if="active === 0">未提交信息</span>
<span v-if="active >= 1">已提交信息</span>
<DictTag :options="com_sub_status" :value="reviewInfo.submitStatus || '0'"></DictTag>
</template>
</el-step>
<el-step :description="reviewInfo.propertyTime">
<template #title>
<span v-if="active <= 2">待审核</span>
<span v-if="active === 3">物业审核不通过</span>
<span v-if="active >= 4">物业审核通过</span>
<DictTag :options="com_review" :value="reviewInfo.propertyStatus || '0'"></DictTag>
</template>
</el-step>
<el-step :description="reviewInfo.certificationTime">
<template #title>
<span v-if="active <= 5">未认证</span>
<span v-if="active === 6">已认证</span>
<DictTag :options="com_certification_status" :value="reviewInfo.certificationStatus || '0'"></DictTag>
</template>
</el-step>
<el-step>
@@ -147,9 +143,14 @@
<script setup lang="ts">
import { ref } from 'vue';
import PageHeader from '@/components/Pageheader/index.vue';
import { getResident, getresidentReviewlistAPI } from '@/api/system/resident';
import { getResident, getresidentReviewlistAPI, UpdateResidentReviewAPI } from '@/api/system/resident';
import { ResidentVO } from '@/api/system/resident/type';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { com_review } = toRefs<any>(proxy?.useDict('com_review'));
const { com_sub_status } = toRefs<any>(proxy?.useDict('com_sub_status'));
const { com_certification_status } = toRefs<any>(proxy?.useDict('com_certification_status'));
const userInfo = ref<ResidentVO>({
code: null,
villageId: '',
@@ -171,33 +172,15 @@ const reviewInfo = ref({
'id': null,
'residentId': null,
'submitTime': '',
'submitStatus': 1,
'propertyTime': null,
'propertyStatus': null,
'propertyReviewFeedback': '',
'certificationTime': null,
'certificationStatus': null
'submitStatus': '1',
'propertyTime': '',
'propertyStatus': '0',
'propertyReviewFeedback': '', // 审核意见
'certificationTime': '',
'certificationStatus': '0'
});
/** 住户审核状态 */
enum reviewStatus {
/** 未提交 */
unSubmit = 0,
/** 已提交 */
Submited = 1,
/** 待认证 */
awaitReview = 2,
/** 认证不通过 */
unReviewPass = 3,
/** 认证通过 */
ReviewPass = 4,
/** 未认证 */
uncertification = 5,
/** 已认证 */
Certification = 6
}
type activeType = reviewStatus;
const active = ref<activeType>(6);
const activeStop = ref(4);
const active = ref(0);
const userid = ref(null);
const route = useRoute();
if (route.query.id) {
@@ -205,9 +188,9 @@ if (route.query.id) {
getResident(userid.value).then((res) => {
userInfo.value = res.data;
getresidentReviewlistAPI(userid.value).then((res) => {
console.log(res);
if (res.rows[0]) {
reviewInfo.value = res.rows[0];
console.log(reviewInfo.value);
handleActivestaus(reviewInfo.value);
}
});
@@ -215,31 +198,75 @@ if (route.query.id) {
}
function handleActivestaus(rews) {
if (rews.submitStatus === reviewStatus.unSubmit) {
activeStop.value = 0;
// 提交状态 0未提交 1已提交
if (rews.submitStatus === '0') {
active.value = 0;
} else if (rews.submitStatus === reviewStatus.Submited) {
} else if (rews.submitStatus === '1') {
active.value = 1;
activeStop.value = 1;
// 物业审核状态 0 待审核 1审核通过 2审核未通过
// 待认证
if (rews.propertyStatus === 0) {
active.value = reviewStatus.awaitReview;
} else if (rews.propertyStatus === 1) {
active.value = reviewStatus.unReviewPass;
} else if (rews.propertyStatus === 2) {
active.value = reviewStatus.ReviewPass;
activeStop.value = 2;
if (rews.certificationStatus === 0) {
active.value = reviewStatus.uncertification;
} else if (rews.certificationStatus === 1) {
active.value = reviewStatus.Certification;
activeStop.value = 4;
if (rews.propertyStatus === '0') {
active.value = 2;
} else if (rews.propertyStatus === '2') {
active.value = 3;
} else if (rews.propertyStatus === '1') {
active.value = 4;
// 认证状态 0未认证 1已认证
if (rews.certificationStatus === '0') {
active.value = 5;
} else if (rews.certificationStatus === '1') {
active.value = 6;
} else if (rews.certificationStatus === '2') {
active.value = 5;
}
}
}
}
// TODO 住户审核
const activeStop = computed(() => {
let status = 0;
switch (active.value) {
case 0:
break;
case 1:
status = 1;
break;
case 2:
case 3:
status = 2;
break;
case 4:
case 5:
status = 2;
break;
case 6:
status = 4;
break;
}
return status;
});
console.log(active.value);
// 审核通过
function updatePass(val: '0' | '1' | '2') {
reviewInfo.value = {
...reviewInfo.value,
'propertyTime': new Date().toLocaleString().replaceAll('/', '-'),
'propertyStatus': val
};
update();
}
function update() {
UpdateResidentReviewAPI(reviewInfo.value).then((res) => {
console.log(res);
backRoute();
});
}
const router = useRouter();
function backRoute() {
router.push({
path: '/house/resident'
});
}
</script>

52
src/views/system/resident/addResident.vue
View File

@@ -106,15 +106,16 @@
<script setup lang="ts">
import { ref } from 'vue';
import PageHeader from '@/components/Pageheader/index.vue';
import { getVillageTree } from '@/api/system/house';
import { convertBuildingToTree, getHousePathById, ownerRelationshiplist } from '@/utils/house';
import { getHousePathById, ownerRelationshiplist } from '@/utils/house';
import { ResidentForm } from '@/api/system/resident/type';
import { CascaderValue, UploadFiles, UploadInstance, UploadProps, UploadRawFile } from 'element-plus';
import { genFileId } from 'element-plus';
import { getCommunitylistAPI } from '@/api/system/community';
import { addResident, getResident, updateResident } from '@/api/system/resident';
import { validator } from '@/utils/Reg';
import { useHouseStore } from '@/store/modules/house';
const houseStore = useHouseStore();
const { treedata } = storeToRefs(houseStore);
const uploadUrl = import.meta.env.VITE_APP_BASE_API + '/resident/uploadImage';
const router = useRouter();
@@ -159,29 +160,19 @@ const rules = ref({
// !== 楼栋房屋 =============================================================================
const userid = ref(null);
const treedata = ref([]);
function gettreedata() {
getCommunitylistAPI().then((res) => {
const currentviliage = res.rows.find((item) => item.choiceStatus === 0);
if (currentviliage.villageId) {
getVillageTree(currentviliage.villageId).then((res) => {
treedata.value = convertBuildingToTree(res.data.buildings);
console.log(treedata.value);
// !== 编辑用户 =============================================================================
if (route.query.id) {
userid.value = route.query.id;
getResident(userid.value).then((res) => {
form.value = {
...res.data
};
const arr = getHousePathById(treedata.value, form.value.houseId);
console.log(arr);
userHousepath.value = arr;
});
}
});
}
});
// !== 编辑用户 =============================================================================
if (route.query.id) {
userid.value = route.query.id;
getResident(userid.value).then((res) => {
form.value = {
...res.data
};
const arr = getHousePathById(treedata.value, form.value.houseId);
console.log(arr);
userHousepath.value = arr;
});
}
}
gettreedata();
function handleChange(val: CascaderValue) {
@@ -241,7 +232,6 @@ const submitForm = () => {
if (!form.value.cardImageBack.trim()) {
return ElMessage.error('请上传身份证背面照片');
}
if (userid.value) {
console.log('edit');
updateResident(form.value).then(() => {
@@ -252,6 +242,16 @@ const submitForm = () => {
console.log('add');
addResident(form.value).then(() => {
ElMessage.success('添加成功');
// addResidentReviewProcess({
// 'residentId': 0,
// 'submitTime': new Date().toLocaleString(),
// 'submitStatus': 0,
// 'propertyTime': null,
// 'propertyStatus': null,
// 'propertyReviewFeedback': null,
// 'certificationTime': null,
// 'certificationStatus': null
// });
cancelForm();
});
}

53
src/views/system/resident/index.vue
View File

@@ -64,17 +64,28 @@
<el-table-column label="姓名" min-width="120" align="center" prop="name" />
<el-table-column label="类型" min-width="120" align="center" prop="type">
<template #default="scope">
<el-tag v-if="scope.row.type === 0">业主</el-tag>
<el-tag type="warning" v-else-if="scope.row.type === 1">亲属</el-tag>
<el-tag type="success" v-else-if="scope.row.type === 2">租户</el-tag>
<DictTag :value="scope.row.type" :options="com_resident_relationship"></DictTag>
</template>
</el-table-column>
<el-table-column label="状态" min-width="120" align="center" prop="status">
<template #default="scope">
<DictTag :value="scope.row.status" :options="com_review"></DictTag>
</template>
</el-table-column>
<el-table-column label="证件号" min-width="120" align="center" prop="idCard" />
<el-table-column label="手机号码" min-width="120" align="center" prop="phone" />
<el-table-column label="房间" min-width="120" align="center" prop="houseAddress" />
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
<el-table-column label="操作" align="center" min-width="120" fixed="right" class-name="small-padding fixed-width">
<template #default="scope">
<el-button link type="primary" icon="Edit" @click="handleMain(scope.row)" v-hasPermi="['resident:resident:edit']">审核</el-button>
<el-button
v-if="scope.row.status === '0'"
link
type="primary"
icon="Edit"
@click="handleMain(scope.row)"
v-hasPermi="['resident:resident:edit']"
>审核</el-button
>
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['resident:resident:edit']">修改</el-button>
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['resident:resident:remove']"
>删除
@@ -94,18 +105,19 @@
</el-card>
</div>
</template>
<script setup name="Resident" lang="ts">
import Pageheader from '@/components/Pageheader/index.vue';
import { listResident, getResident, delResident, addResident, updateResident } from '@/api/system/resident/index';
import { listResident, delResident } from '@/api/system/resident/index';
import { ResidentVO, ResidentQuery, ResidentForm } from '@/api/system/resident/type';
import { getVillageTree } from '@/api/system/house/index';
import { getCommunitylistAPI } from '@/api/system/community';
import { convertBuildingToTree, getHousePathById } from '@/utils/house';
import { getHousePathById } from '@/utils/house';
import { useHouseStore } from '@/store/modules/house';
const houseStore = useHouseStore();
const { treedata } = storeToRefs(houseStore);
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { com_house_rental_facilities } = toRefs<any>(proxy?.useDict('com_house_rental_facilities'));
const { com_resident_relationship } = toRefs<any>(proxy?.useDict('com_resident_relationship'));
const { com_review } = toRefs<any>(proxy?.useDict('com_review'));
const router = useRouter();
const residentList = ref<ResidentVO[]>([]);
@@ -238,21 +250,7 @@ const handleNodeClick = (data: Tree, node) => {
};
getList();
};
const treedata = ref<Tree[]>([]);
function gettreedata() {
getCommunitylistAPI().then((res) => {
const currentviliage = res.rows.find((item) => item.choiceStatus === 0);
if (currentviliage.villageId) {
getVillageTree(currentviliage.villageId).then((res) => {
treedata.value = convertBuildingToTree(res.data.buildings);
getList();
});
}
});
}
gettreedata();
const defaultProps = {
children: 'children',
label: 'label'
@@ -274,6 +272,8 @@ const getList = async () => {
loading.value = false;
};
getList();
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1;
@@ -388,8 +388,7 @@ onMounted(() => {
}
.tablebox {
height: calc(100% - 260px);
max-height: calc(100% - 260px);
height: calc(100% - 105px);
/* 空数据也不会无限变宽 */
:deep(.el-table__empty-block) {
width: 100% !important;