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-05-08 11:30:28 +08:00
parent a8bb4e66ad
commit 1b738c0f4d
118 changed files with 2891 additions and 979 deletions
Download Patch File Download Diff File Expand all files Collapse all files

289
src/views/system/user/addUser.vue Normal file
View File

@@ -0,0 +1,289 @@
<template>
<div class="AddBuildingBox">
<PageHeader></PageHeader>
<div class="AddBuildingBody">
<div class="title">基本信息</div>
<div class="addBuildingFormBody">
<el-form class="formBody" label-position="right" ref="formRef" :model="form" :rules="rules" label-width="130px">
<el-form-item label="员工姓名" prop="nickName">
<el-input v-model.trim="form.nickName" placeholder="请输入员工姓名" />
</el-form-item>
<el-form-item label="登录账号" prop="userName">
<el-input v-model.trim="form.userName" placeholder="请输入登录账号" />
</el-form-item>
<el-form-item label="登录密码" prop="password">
<el-input v-model.trim="form.password" placeholder="请输入" />
</el-form-item>
<el-form-item label="员工头像" prop="chargeScope"></el-form-item>
<el-form-item label="员工性别" prop="chargeScope">
<el-select v-model="form.sex" placeholder="请选择">
<el-option v-for="dict in sys_user_sex" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="员工角色" prop="roleIds">
<el-select v-model="form.roleIds" multiple>
<el-option v-for="(item, index) in roleOptions" :key="index" :value="item.roleId" :label="item.roleName"></el-option>
</el-select>
</el-form-item>
<el-form-item label="管理小区" prop="checkvillage">
<el-select v-model="checkvillage" multiple @change="handleChangeVillage">
<el-option v-for="(item, index) in vilageList" :key="index" :value="item.villageId" :label="item.villageName"></el-option>
</el-select>
</el-form-item>
<el-form-item label="手机号" prop="phonenumber">
<el-input v-model.trim="form.phonenumber" placeholder="请输入" />
</el-form-item>
<el-form-item label="邮箱" prop="email">
<el-input v-model.trim="form.email" placeholder="请输入" />
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input type="textarea" :rows="5" v-model.trim="form.remark" placeholder="请输入" />
</el-form-item>
<el-form-item style="margin-top: 30px">
<el-button type="primary" @click="submitForm">提交</el-button>
<el-button @click="cancelForm">返回</el-button>
</el-form-item>
</el-form>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import api from '@/api/system/user';
import { ref } from 'vue';
import PageHeader from '@/components/Pageheader/index.vue';
import { getCommunitylistAPI } from '@/api/system/community';
import { validator } from '@/utils/Reg';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { com_bill_charge_period } = toRefs<any>(proxy?.useDict('com_bill_charge_period'));
const { sys_user_sex } = toRefs<any>(proxy?.useDict('sys_user_sex'));
const router = useRouter();
const route = useRoute();
const formRef = ref();
const userid = ref(null);
const form = ref({
'userId': null,
'userName': '', // >= 0 && <= 30 账号
'nickName': '', // >= 0 && <= 30 昵称
// 'userType': '', // 用户类型（sys_user系统用户）
'villageIds': '', // 管理小区id串
'email': '', // >= 0 && <= 50
'phonenumber': '', // 手机号码
'sex': '', // 0男 1女 2未知
'status': '0', // （0正常 1停用）
'password': '', // 密码
'roleIds': [], // 角色组
'remark': ''
});
const rules = ref({
// 员工姓名：必填，长度限制
nickName: [
{ required: true, message: '请输入员工姓名', trigger: 'blur' },
{ min: 1, max: 30, message: '长度在 1 到 30 个字符', trigger: 'blur' }
],
// 登录账号：必填，长度限制，通常建议增加唯一性校验（需后端配合或异步校验）
userName: [
{ required: true, message: '请输入登录账号', trigger: 'blur' },
{ min: 1, max: 30, message: '长度在 1 到 30 个字符', trigger: 'blur' }
],
// 登录密码：必填，新增时必填，编辑时可选（通常逻辑），这里暂按必填处理，建议长度限制
password: [{ min: 5, max: 20, message: '长度在 5 到 20 个字符', trigger: 'blur' }],
roleIds: [{ required: true, message: '请选择员工角色', trigger: 'change' }],
phonenumber: [
{
validator: (_, val) => validator(val, 'phone'),
message: '请输入正确的手机号码',
trigger: 'blur'
}
],
email: [{ type: 'email', message: '请输入正确的邮箱地址', trigger: 'blur' }]
});
// 选择小区
const checkvillage = ref([]);
// 角色列表
const roleOptions = ref([]);
async function init() {
if (route.query.id) {
userid.value = route.query.id;
api.getUser(userid.value).then((res) => {
form.value = {
'userId': res.data.user.userId,
'userName': res.data.user.userName, // >= 0 && <= 30 账号
'nickName': res.data.user.nickName, // >= 0 && <= 30 昵称
'villageIds': res.data.user.villageIds, // 管理小区id串
'status': res.data.user.status, // 0启用 1停用
'email': res.data.user.email, // >= 0 && <= 50
'phonenumber': res.data.user.phonenumber, // 手机号码
'sex': res.data.user.sex, // 0男 1女 2未知
'password': '', // 密码
'roleIds': res.data.roleIds ?? [], // 角色组
'remark': ''
};
roleOptions.value = [];
roleOptions.value = Array.from(new Map([...res.data.roles, ...res.data.user.roles].map((role) => [role.roleId, role])).values());
checkvillage.value = res.data.user.villageIds.split(',').filter((item) => item);
});
} else {
const { data } = await api.getUser();
roleOptions.value = data.roles;
}
}
// 小区列表
const vilageList = ref([]);
/** 查询小区列表 */
const getViliageList = async () => {
const res = await getCommunitylistAPI();
vilageList.value = res.rows;
console.log(vilageList.value);
};
onMounted(() => {
getViliageList();
init();
});
function handleChangeVillage(value: string[]) {
console.log(value);
form.value.villageIds = value.join(',');
}
// !== 提交 =============================================================================
const submitForm = () => {
formRef.value?.validate(async (valid: boolean) => {
if (valid) {
if (userid.value) {
api.updateUser(form.value).then(() => {
ElMessage.success('编辑成功');
cancelForm();
});
} else {
api.addUser(form.value).then(() => {
ElMessage.success('添加成功');
cancelForm();
});
}
}
});
};
// 推出
const cancelForm = () => {
router.back();
};
</script>
<style scoped lang="scss">
.AddBuildingBox {
padding: 15px;
height: 100%;
width: 100%;
}
.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;
background-color: rgba(255, 255, 255, 1);
color: rgba(16, 16, 16, 1);
border-bottom: 1px solid #bbbbbb;
margin-bottom: 60px;
}
.formBody {
width: 550px;
margin: 0 auto;
.residentBox {
max-height: 400px;
overflow-y: auto;
padding: 10px 5px;
}
.checkoutSideUsesbox {
// display: grid;
// grid-template-columns: repeat(3, 1fr);
// gap: 5px;
display: flex;
flex-wrap: wrap;
align-content: flex-start;
justify-content: space-between;
padding: 10px 5px;
li {
margin-right: 10px;
margin-bottom: 10px;
display: flex;
align-items: center;
justify-content: space-between;
min-width: 240px;
height: 35px;
padding: 0 10px;
line-height: 35px;
background-color: #f3f9ff;
border: 1px solid #8fc0f1;
margin-bottom: 10px;
@media (max-width: 2000px) {
font-size: 12px;
}
@media (max-width: 1650px) {
font-size: 10px;
}
@media (max-width: 1650px) {
font-size: 8px;
}
.el-icon {
margin-left: 20px;
cursor: pointer;
&:hover {
color: red;
}
}
&.add {
cursor: pointer;
justify-content: center;
color: #409eff;
border: 1px dashed #409eff;
background-color: transparent;
&:hover {
background-color: #40a0ff10;
}
span {
margin-left: 10px;
}
}
}
}
&:deep(.el-form-item__content, .el-select, .el-input) {
width: 350px !important;
margin-right: 10px;
.el-cascader {
width: 100%;
}
}
.el-form-item {
margin-bottom: 20px;
align-items: center;
}
.el-button {
width: 80px;
height: 35px;
margin-right: 20px;
}
}
}
</style>

46
src/views/system/user/index.vue
View File

@@ -4,7 +4,7 @@
<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 ref="queryFormRef" :model="queryParams" @submit.prevent="handleQuery" :inline="true">
<el-form-item label="员工姓名" prop="nickName">
<el-input v-model="queryParams.nickName" placeholder="请输入员工姓名" clearable @keyup.enter="handleQuery" />
</el-form-item>
@@ -20,8 +20,8 @@
</el-select>
</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-button type="primary" @click="handleQuery">搜索</el-button>
<el-button @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
</el-card>
@@ -31,7 +31,7 @@
<el-card class="flex-1" shadow="hover">
<template #header>
<el-row :gutter="10">
<el-col :span="1.5">
<!-- <el-col :span="1.5">
<el-button v-has-permi="['system:user:add']" type="primary" plain icon="Plus" @click="handleAdd()">新增</el-button>
</el-col>
<el-col :span="1.5">
@@ -53,14 +53,23 @@
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item icon="Download" @click="importTemplate">下载模板</el-dropdown-item>
<!-- 注意 由于el-dropdown-item标签是延迟加载的 所以v-has-permi自定义标签不生效 需要使用v-if调用方法执行 -->
注意 由于el-dropdown-item标签是延迟加载的 所以v-has-permi自定义标签不生效 需要使用v-if调用方法执行
<el-dropdown-item v-if="checkPermi(['system:user:import'])" icon="Top" @click="handleImport">导入数据</el-dropdown-item>
<el-dropdown-item v-if="checkPermi(['system:user:export'])" icon="Download" @click="handleExport">导出数据</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</el-col>
<right-toolbar v-model:show-search="showSearch" :columns="columns" :search="true" @query-table="getList"></right-toolbar>
</el-col> -->
<right-toolbar more-title="更多" v-model:show-search="showSearch" :columns="columns" :search="true" @query-table="getList">
<template #dropdown>
<el-dropdown-item @click="handleUpdate()">修改</el-dropdown-item>
<el-dropdown-item @click="handleDelete()">删除</el-dropdown-item>
<el-dropdown-item @click="importTemplate">下载模板</el-dropdown-item>
<!-- 注意 由于el-dropdown-item标签是延迟加载的 所以v-has-permi自定义标签不生效 需要使用v-if调用方法执行 -->
<el-dropdown-item v-if="checkPermi(['system:user:import'])" @click="handleImport">导入数据</el-dropdown-item>
<el-dropdown-item v-if="checkPermi(['system:user:export'])" @click="handleExport">导出数据</el-dropdown-item>
</template>
</right-toolbar>
</el-row>
</template>
@@ -72,14 +81,7 @@
<el-table-column v-if="columns[4].visible" key="phonenumber" label="手机号码" align="center" prop="phonenumber" width="120" />
<el-table-column v-if="columns[5].visible" key="status" label="状态" align="center">
<template #default="scope">
<el-switch
v-model="scope.row.status"
active-text="启用"
active-value="0"
inactive-value="1"
inactive-text="停用"
@change="handleStatusChange(scope.row)"
></el-switch>
<el-switch v-model="scope.row.status" active-value="0" inactive-value="1" @change="handleStatusChange(scope.row)"></el-switch>
</template>
</el-table-column>
@@ -251,6 +253,7 @@ import { communitylist_rows_type } from '@/api/system/community/type';
const router = useRouter();
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { sys_normal_disable, sys_user_sex } = toRefs<any>(proxy?.useDict('sys_normal_disable', 'sys_user_sex'));
const userList = ref<UserVO[]>();
const loading = ref(true);
const showSearch = ref(true);
@@ -515,6 +518,10 @@ const cancel = () => {
/** 新增按钮操作 */
const handleAdd = async () => {
router.push({
path: '/system/addUser'
});
return;
reset();
const { data } = await api.getUser();
dialog.visible = true;
@@ -526,8 +533,15 @@ const handleAdd = async () => {
/** 修改按钮操作 */
const handleUpdate = async (row?: UserForm) => {
reset();
const userId = row?.userId || ids.value[0];
router.push({
path: '/system/editUser',
query: {
id: userId
}
});
return;
reset();
const { data } = await api.getUser(userId);
dialog.visible = true;
dialog.title = '修改员工';

3
src/views/system/user/profile/index.vue
View File

@@ -1,6 +1,7 @@
<template>
<div class="p-2">
<el-row :gutter="20">
<Pageheader></Pageheader>
<el-row :gutter="20" class="mt-20px">
<el-col :span="6" :xs="24">
<el-card class="box-card">
<template #header>