wangchengming/YouKeChuanMei_VUE
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

对接行政区域接口

Browse Source
This commit is contained in:
wangchengming 2025-08-10 00:41:39 +08:00
parent 6300effe8c
commit e8fead072a
5 changed files with 186 additions and 150 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
src/api/system/administrativeRegion.js Normal file
View File

@ -0,0 +1,44 @@
import request from '@/utils/request'
// 获取行政区划树列表
export function sysRegionTreeList(query) {
return request({
url: '/admin/sysRegion/treeList',
method: 'post',
data: query
})
}
// 新增行政区划
export function addSysRegion(data) {
return request({
url: '/admin/sysRegion/addSysRegion',
method: 'post',
data: data
})
}
// 修改行政区划
export function updateSysRegion(data) {
return request({
url: '/admin/sysRegion/updateSysRegion',
method: 'post',
data: data
})
}
// 获取行政区划详情
export function getSysRegion(sysRegionId) {
return request({
url: '/admin/sysRegion/getSysRegion/' + sysRegionId,
method: 'post'
})
}
// 删除行政区划
export function deleteSysRegion(sysRegionId) {
return request({
url: '/admin/sysRegion/deleteSysRegion/' + sysRegionId,
method: 'post'
})
}

180
src/views/system/administrativeRegion/index.vue
View File

@ -9,17 +9,17 @@
<el-row :gutter="10" class="my_row">
<el-col :span="24">
<el-button type="primary" class="primaryBtn" @click="handleAdd"
v-hasPermi="['system:administrativeRegion:add']">新增</el-button>
<el-button type="primary" class="primaryBtn" @click="handleAddRootNode"
v-hasPermi="['system:administrativeRegion:add']">新增根节点</el-button>
<el-button type="primary" class="primaryBtn" @click="toggleExpandAll">展开/折叠</el-button>
</el-col>
</el-row>
<el-table v-if="refreshTable" v-loading="loading" height="calc(100vh - 244px)" :data="deptList"
row-key="deptId" :default-expand-all="isExpandAll"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
<el-table-column prop="deptName" label="地区名称"></el-table-column>
<el-table-column prop="orderNum" label="地区标识"></el-table-column>
<el-table v-if="refreshTable" v-loading="loading" height="calc(100vh - 244px)" :data="regionTreeList"
row-key="id" :default-expand-all="isExpandAll" :tree-props="{ children: 'childList' }">
<el-table-column prop="name" label="区域名称"></el-table-column>
<el-table-column prop="code" label="区域编号"></el-table-column>
<el-table-column prop="sortNo" label="排序"></el-table-column>
<el-table-column label="创建时间" align="center" prop="createTime">
<template #default="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
@ -29,9 +29,9 @@
<template #default="scope">
<el-button link type="primary" @click="handleUpdate(scope.row)"
v-hasPermi="['system:administrativeRegion:edit']">修改</el-button>
<el-button link type="primary" @click="handleAdd(scope.row)"
v-hasPermi="['system:administrativeRegion:add']">新增</el-button>
<el-button v-if="scope.row.parentId != 0" link type="primary" @click="handleDelete(scope.row)"
<el-button link type="primary" @click="handleAddChildrenNode(scope.row)"
v-hasPermi="['system:administrativeRegion:add']">新增子节点</el-button>
<el-button link type="primary" @click="handleDelete(scope.row)"
v-hasPermi="['system:administrativeRegion:remove']">删除</el-button>
</template>
</el-table-column>
@ -41,17 +41,15 @@
<!-- 添加或修改部门对话框 -->
<el-dialog :title="title" v-model="open" width="800px" class="my_dialog" align-center :destroy-on-close="true"
:close-on-click-modal="false">
<el-form ref="deptRef" :model="form" :rules="rules" label-width="100px" class="myInsertForm">
<el-form-item label="上级节点" prop="parentId">
<el-tree-select v-model="form.parentId" :data="deptOptions"
:props="{ value: 'deptId', label: 'deptName', children: 'children' }" value-key="deptId"
placeholder="选择上级节点" check-strictly />
<el-form ref="regionRef" :model="form" :rules="rules" label-width="100px" class="myInsertForm">
<el-form-item label="区域名称" prop="name">
<el-input v-model="form.name" placeholder="请输入区域名称" />
</el-form-item>
<el-form-item label="地区名称" prop="deptName">
<el-input v-model="form.deptName" placeholder="请输入地区名称" />
<el-form-item label="区域编号" prop="code">
<el-input v-model="form.code" placeholder="请输入区域编号" />
</el-form-item>
<el-form-item label="地区标识" prop="orderNum">
<el-input-number v-model="form.orderNum" controls-position="right" :min="0" />
<el-form-item label="显示排序" prop="sortNo">
<el-input-number v-model="form.sortNo" controls-position="right" :min="0" style="width: 100%;" />
</el-form-item>
</el-form>
<template #footer>
@ -66,94 +64,43 @@
<script setup name="Dept">
import { onMounted, ref } from 'vue';
import { listDept, getDept, delDept, addDept, updateDept, listDeptExcludeChild } from "@/api/system/dept"
import { sysRegionTreeList, addSysRegion, updateSysRegion, getSysRegion, deleteSysRegion } from "@/api/system/administrativeRegion"
import { useBackgroundStore } from '@/store/modules/background'
import otherbg from '@/assets/images/otherbg.png'
const bgStore = useBackgroundStore()
const { proxy } = getCurrentInstance()
const { sys_normal_disable } = proxy.useDict("sys_normal_disable")
const deptList = ref([])
// 行政区划树列表
const regionTreeList = ref([])
const open = ref(false)
const loading = ref(true)
const showSearch = ref(true)
const title = ref("")
// 上级行政区划集合
const deptOptions = ref([])
const isExpandAll = ref(true)
const refreshTable = ref(true)
const data = reactive({
form: {},
queryParams: {
deptName: undefined,
status: undefined
},
rules: {
parentId: [{ required: true, message: "上级部门不能为空", trigger: "blur" }],
deptName: [{ required: true, message: "部门名称不能为空", trigger: "blur" }],
orderNum: [{ required: true, message: "显示排序不能为空", trigger: "blur" }],
email: [{ type: "email", message: "请输入正确的邮箱地址", trigger: ["blur", "change"] }],
phone: [{ pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "请输入正确的手机号码", trigger: "blur" }]
name: [{ required: true, message: "区域名称不能为空", trigger: "blur" }],
code: [{ required: true, message: "区域编号不能为空", trigger: "blur" }],
sortNo: [{ required: true, message: "显示排序不能为空", trigger: "blur" }],
},
})
const { queryParams, form, rules } = toRefs(data)
const { form, rules } = toRefs(data)
/** 查询部门列表 */
function getList() {
/** 查询行政区域树列表 */
const getsysRegionTreeList = () => {
loading.value = true
listDept(queryParams.value).then(response => {
deptList.value = proxy.handleTree(response.data, "deptId")
sysRegionTreeList().then(res => {
regionTreeList.value = res.data
loading.value = false
})
}
/** 取消按钮 */
function cancel() {
open.value = false
reset()
}
/** 表单重置 */
function reset() {
form.value = {
deptId: undefined,
parentId: undefined,
deptName: undefined,
orderNum: 0,
leader: undefined,
phone: undefined,
email: undefined,
status: "0"
}
proxy.resetForm("deptRef")
}
/** 搜索按钮操作 */
function handleQuery() {
getList()
}
/** 重置按钮操作 */
function resetQuery() {
proxy.resetForm("queryRef")
handleQuery()
}
/** 新增按钮操作 */
function handleAdd(row) {
reset()
listDept().then(response => {
deptOptions.value = proxy.handleTree(response.data, "deptId")
})
if (row != undefined) {
form.value.parentId = row.deptId
}
open.value = true
title.value = "添加地区"
}
/** 展开/折叠操作 */
function toggleExpandAll() {
refreshTable.value = false
@ -163,34 +110,67 @@ function toggleExpandAll() {
})
}
/** 修改按钮操作 */
function handleUpdate(row) {
/** 表单重置 */
const reset = () => {
form.value = {
parentId: undefined,
name: undefined,
code: undefined,
sortNo: 0,
state: "1"
}
proxy.resetForm("regionRef")
}
/** 新增根节点 */
const handleAddRootNode = () => {
reset()
listDeptExcludeChild(row.deptId).then(response => {
deptOptions.value = proxy.handleTree(response.data, "deptId")
})
getDept(row.deptId).then(response => {
form.value.parentId = '0'
open.value = true
title.value = "添加地区"
}
/** 新增子节点 */
const handleAddChildrenNode = (row) => {
console.log(row)
reset()
if (row) {
console.log('进入了这里？')
form.value.parentId = row.id
}
open.value = true
title.value = "添加地区"
}
/** 修改按钮操作 */
const handleUpdate = (row) => {
reset()
getSysRegion(row.id).then(response => {
form.value = response.data
open.value = true
title.value = "修改地区"
})
}
/** 取消按钮 */
const cancel = () => {
open.value = false
reset()
}
/** 提交按钮 */
function submitForm() {
proxy.$refs["deptRef"].validate(valid => {
const submitForm = () => {
proxy.$refs["regionRef"].validate(valid => {
if (valid) {
if (form.value.deptId != undefined) {
updateDept(form.value).then(response => {
if (form.value.id != undefined) {
updateSysRegion(form.value).then(response => {
proxy.$modal.msgSuccess("修改成功")
open.value = false
getList()
getsysRegionTreeList()
})
} else {
addDept(form.value).then(response => {
addSysRegion(form.value).then(response => {
proxy.$modal.msgSuccess("新增成功")
open.value = false
getList()
getsysRegionTreeList()
})
}
}
@ -198,11 +178,11 @@ function submitForm() {
}
/** 删除按钮操作 */
function handleDelete(row) {
proxy.$modal.confirm('是否确认删除名称为"' + row.deptName + '"的数据项?').then(function () {
return delDept(row.deptId)
const handleDelete = (row) => {
proxy.$modal.confirm('是否确认删除名称为"' + row.name + '"的数据项?').then(function () {
return deleteSysRegion(row.id)
}).then(() => {
getList()
getsysRegionTreeList()
proxy.$modal.msgSuccess("删除成功")
}).catch(() => { })
}
@ -210,6 +190,6 @@ function handleDelete(row) {
// 初始化
onMounted(() => {
bgStore.setBgImage(otherbg)
getList()
getsysRegionTreeList()
});
</script>

4
src/views/system/dept/index.vue
View File

@ -64,7 +64,7 @@
:close-on-click-modal="false">
<el-form ref="deptRef" :model="form" :rules="rules" label-width="100px" class="myInsertForm">
<el-row>
<el-col :span="24" v-if="form.parentId !== 0">
<el-col :span="24" v-if="form.parentId !== '0'">
<el-form-item label="上级部门" prop="parentId">
<el-tree-select v-model="form.parentId" :data="deptOptions"
:props="{ value: 'deptId', label: 'deptName', children: 'children' }" value-key="deptId"
@ -78,7 +78,7 @@
</el-col>
<el-col :span="12">
<el-form-item label="显示排序" prop="orderNum">
<el-input-number v-model="form.orderNum" controls-position="right" :min="0" />
<el-input-number v-model="form.orderNum" controls-position="right" :min="0" style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="12">

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

@ -7,8 +7,8 @@
:props="{ value: 'id', label: 'label', children: 'children' }" value-key="id" placeholder="请选择部门"
check-strictly style="min-width: 30px" />
</el-form-item>
<el-form-item label="用户名称:" prop="userName">
<el-input v-model="queryParams.userName" placeholder="请输入用户名称" clearable style="width: 140px"
<el-form-item label="用户姓名:" prop="nickName">
<el-input v-model="queryParams.nickName" placeholder="请输入用户名称" clearable style="width: 140px"
@keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="手机号码:" prop="phonenumber">
@ -54,22 +54,23 @@
<el-table v-loading="loading" height="calc(100vh - 362px)" :data="userList"
@selection-change="handleSelectionChange">
<el-table-column type="selection" width="50" align="center" />
<el-table-column label="用户编号" align="center" key="userId" prop="userId" v-if="columns[0].visible" />
<el-table-column label="用户名称" align="center" key="userName" prop="userName" v-if="columns[1].visible"
<!-- <el-table-column label="用户编号" align="center" key="userId" prop="userId" /> -->
<el-table-column label="用户登录名" align="left" key="userName" prop="userName" :show-overflow-tooltip="true" />
<el-table-column label="用户姓名" align="left" key="nickName" prop="nickName" :show-overflow-tooltip="true" />
<el-table-column label="部门" align="center" key="deptName" prop="dept.deptName" width="150"
:show-overflow-tooltip="true" />
<el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" v-if="columns[2].visible"
:show-overflow-tooltip="true" />
<el-table-column label="部门" align="center" key="deptName" prop="dept.deptName" v-if="columns[3].visible"
:show-overflow-tooltip="true" />
<el-table-column label="手机号码" align="center" key="phonenumber" prop="phonenumber" v-if="columns[4].visible"
width="120" />
<el-table-column label="状态" align="center" key="status" v-if="columns[5].visible">
<el-table-column label="岗位" align="center" key="postName" prop="postName" width="120" />
<el-table-column label="手机号码" align="center" key="phonenumber" prop="phonenumber" width="120" />
<el-table-column label="座机电话" align="center" key="tel" prop="tel" width="120" />
<el-table-column label="QQ" align="center" key="qqNo" prop="qqNo" width="120" />
<el-table-column label="微信" align="center" key="wxNo" prop="wxNo" width="120" />
<el-table-column label="状态" align="center" key="status" width="86">
<template #default="scope">
<el-switch v-model="scope.row.status" active-value="0" inactive-value="1"
@change="handleStatusChange(scope.row)"></el-switch>
</template>
</el-table-column>
<el-table-column label="创建时间" align="center" prop="createTime" v-if="columns[6].visible" width="210">
<el-table-column label="创建时间" align="center" prop="createTime" width="210">
<template #default="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
@ -99,8 +100,8 @@
<el-form :model="form" :rules="rules" ref="userRef" label-width="120px" class="myInsertForm">
<el-row>
<el-col :span="12">
<el-form-item label="用户昵称" prop="nickName">
<el-input v-model="form.nickName" placeholder="请输入用户昵称" maxlength="30" />
<el-form-item label="用户姓名" prop="nickName">
<el-input v-model="form.nickName" placeholder="请输入用户姓名" maxlength="30" />
</el-form-item>
</el-col>
<el-col :span="12">
@ -113,25 +114,52 @@
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="手机号码" prop="phonenumber">
<el-input v-model="form.phonenumber" placeholder="请输入手机号码" maxlength="11" />
<el-form-item v-if="form.userId == undefined" label="用户登录名" prop="userName">
<el-input v-model="form.userName" placeholder="请输入用户登录名" maxlength="30" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="邮箱" prop="email">
<el-input v-model="form.email" placeholder="请输入邮箱" maxlength="50" />
<el-form-item v-if="form.userId == undefined" label="登录密码" prop="password">
<el-input v-model="form.password" placeholder="请输入登录密码" type="password" maxlength="20" show-password />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item v-if="form.userId == undefined" label="用户名称" prop="userName">
<el-input v-model="form.userName" placeholder="请输入用户名称" maxlength="30" />
<el-form-item label="手机号码" prop="phonenumber">
<el-input v-model="form.phonenumber" placeholder="请输入手机号码" maxlength="11" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item v-if="form.userId == undefined" label="用户密码" prop="password">
<el-input v-model="form.password" placeholder="请输入用户密码" type="password" maxlength="20" show-password />
<el-form-item label="座机电话" prop="tel">
<el-input v-model="form.tel" placeholder="请输入座机电话" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="QQ" prop="qqNo">
<el-input v-model="form.qqNo" placeholder="请输入QQ号" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="微信" prop="wxNo">
<el-input v-model="form.wxNo" placeholder="请输入微信号" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="岗位" prop="postIds">
<el-select v-model="form.postIds" placeholder="请选择">
<el-option v-for="item in postOptions" :key="item.postId" :label="item.postName" :value="item.postId"
:disabled="item.status == 1"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="邮箱" prop="email">
<el-input v-model="form.email" placeholder="请输入邮箱" maxlength="50" />
</el-form-item>
</el-col>
</el-row>
@ -154,15 +182,7 @@
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="岗位">
<el-select v-model="form.postIds" multiple placeholder="请选择">
<el-option v-for="item in postOptions" :key="item.postId" :label="item.postName" :value="item.postId"
:disabled="item.status == 1"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-col :span="24">
<el-form-item label="角色">
<el-select v-model="form.roleIds" multiple placeholder="请选择">
<el-option v-for="item in roleOptions" :key="item.roleId" :label="item.roleName" :value="item.roleId"
@ -207,7 +227,7 @@
</template>
</el-upload>
<template #footer>
<div class="dialog-footer">
<div class="dialog-footer">
<el-button class="my-cancel-btn" @click="upload.open = false">取 消</el-button>
<el-button class="my-confirm-btn" type="primary" @click="submitFileForm">确 定</el-button>
</div>
@ -262,33 +282,25 @@ const upload = reactive({
// 上传的地址
url: import.meta.env.VITE_APP_BASE_API + "/system/user/importData"
})
// 列显隐信息
const columns = ref([
{ key: 0, label: `用户编号`, visible: true },
{ key: 1, label: `用户名称`, visible: true },
{ key: 2, label: `用户昵称`, visible: true },
{ key: 3, label: `部门`, visible: true },
{ key: 4, label: `手机号码`, visible: true },
{ key: 5, label: `状态`, visible: true },
{ key: 6, label: `创建时间`, visible: true }
])
const data = reactive({
form: {},
queryParams: {
pageNum: 1,
pageSize: 10,
userName: undefined,
nickName: undefined,
phonenumber: undefined,
status: undefined,
deptId: undefined
},
rules: {
userName: [{ required: true, message: "用户名称不能为空", trigger: "blur" }, { min: 2, max: 20, message: "用户名称长度必须介于 2 和 20 之间", trigger: "blur" }],
nickName: [{ required: true, message: "用户昵称不能为空", trigger: "blur" }],
nickName: [{ required: true, message: "用户姓名不能为空", trigger: "blur" }],
deptId: [{ required: true, message: "归属部门不能为空", trigger: "change" }],
userName: [{ required: true, message: "用户登录名不能为空", trigger: "blur" }, { min: 2, max: 20, message: "用户登录名长度必须介于 2 和 20 之间", trigger: "blur" }],
password: [{ required: true, message: "用户密码不能为空", trigger: "blur" }, { min: 5, max: 20, message: "用户密码长度必须介于 5 和 20 之间", trigger: "blur" }, { pattern: /^[^<>"'|\\]+$/, message: "不能包含非法字符：< > \" ' \\\ |", trigger: "blur" }],
email: [{ type: "email", message: "请输入正确的邮箱地址", trigger: ["blur", "change"] }],
phonenumber: [{ pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "请输入正确的手机号码", trigger: "blur" }]
phonenumber: [{ required: true, message: "手机号码不能为空", trigger: "blur" }, { pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "请输入正确的手机号码", trigger: "blur" }],
tel: [{ pattern: /^(0\d{2,3}-?)?\d{7,8}$/, message: "请输入正确的座机电话", trigger: "blur" }],
email: [{ required: true, message: "邮箱不能为空", trigger: "blur" }, { type: "email", message: "请输入正确的邮箱地址", trigger: ["blur", "change"] }],
}
})

2
vite.config.js
View File

@ -2,7 +2,7 @@ import { defineConfig, loadEnv } from 'vite'
import path from 'path'
import createVitePlugins from './vite/plugins'
const baseUrl = 'http://43.143.229.145:8091/api' // 后端接口
const baseUrl = 'http://43.143.229.145:9001/api' // 后端接口
// https://vitejs.dev/config/
export default defineConfig(({ mode, command }) => {