完善位置部分

This commit is contained in:
XiuHe 2026-03-09 16:28:46 +08:00
parent 04c2aaf512
commit 8b32bf5ede
5 changed files with 191 additions and 213 deletions

31
admin/src/api/location.ts Normal file
View File

@ -0,0 +1,31 @@
import request from '@/utils/request'
// 获取所有位置
export function getLocationList() {
return request.get({ url: '/location/list' })
}
// 添加位置
export function addLocation(params?: any) {
return request.post({ url: '/location/add', params })
}
// 修改位置
export function updateLocation(params?: any) {
return request.post({ url: '/location/update', params })
}
// 获取指定位置
export function getLocation(params?: any) {
return request.get({ url: '/location/detail', params })
}
// 删除位置
export function deleteLocation(params?: any) {
return request.post({ url: '/location/del', params })
}
// 返回指定位置的所有子位置
export function getSubLocations(params?: any) {
return request.get({ url: '/location/children', params })
}

View File

@ -47,14 +47,27 @@ export function useDictOptions<T = any>(options: Options) {
}
}
export function useDictData<T = any>(id: number) {
export function useDictData<T = Record<string, any>>(ids: number | number[]) {
const dictIds = Array.isArray(ids) ? ids : [ids]
const dictData: any = reactive({})
const refresh = async () => {
const data = await getDictList({
type_id: id
})
Object.assign(dictData, data.lists)
// 初始化单个字典
const initDict = async (id: number) => {
const data = await getDictList({ type_id: id })
dictData[id] = {}
Object.assign(dictData[id], data.lists) // 保持原有数据结构
}
// 刷新字典支持指定ID不传则刷新所有
const refresh = async (targetIds?: number | number[]) => {
const targetDictIds = targetIds
? Array.isArray(targetIds) ? targetIds : [targetIds]
: dictIds
// 并行加载指定字典
await Promise.all(targetDictIds.map(initDict))
}
// 初始化所有字典
const initPromise = refresh()
return {

View File

@ -9,17 +9,10 @@
@close="handleClose"
>
<el-form ref="formRef" :model="formData" label-width="80px" :rules="formRules">
<el-form-item label="菜单类型" prop="type" required>
<el-radio-group v-model="formData.type">
<el-radio :label="MenuEnum.CATALOGUE">目录</el-radio>
<el-radio :label="MenuEnum.MENU">菜单</el-radio>
<el-radio :label="MenuEnum.BUTTON">按钮</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="父级菜单" prop="pid">
<el-form-item label="父级位置" prop="pid">
<el-tree-select
class="flex-1"
v-model="formData.pid"
v-model="formData.parentId"
:data="menuOptions"
clearable
node-key="id"
@ -27,135 +20,53 @@
label: 'name'
}"
:default-expand-all="true"
placeholder="请选择父级菜单"
placeholder="请选择父级位置"
check-strictly
/>
</el-form-item>
<el-form-item label="菜单名称" prop="name">
<el-input v-model="formData.name" placeholder="请输入菜单名称" clearable />
<el-form-item label="位置名称" prop="name">
<el-input v-model="formData.name" placeholder="请输入位置名称" clearable />
</el-form-item>
<el-form-item v-if="formData.type != MenuEnum.BUTTON" label="菜单图标" prop="icon">
<icon-picker class="flex-1" v-model="formData.icon" />
</el-form-item>
<el-form-item v-if="formData.type != MenuEnum.BUTTON" label="路由路径" prop="paths">
<div class="flex-1">
<el-input v-model="formData.paths" placeholder="请输入路由路径" clearable />
<div class="form-tips">
访问的路由地址`user`如外网地址需内链访问则以`http(s)://`开头
</div>
</div>
</el-form-item>
<el-form-item
v-if="formData.type == MenuEnum.MENU"
label="组件路径"
prop="component"
>
<div class="flex-1">
<el-autocomplete
class="w-full"
v-model="formData.component"
:fetch-suggestions="querySearch"
clearable
placeholder="请输入组件路径"
<el-form-item label="位置类型" prop="type" required>
<el-select
v-model="formData.type"
class="w-[280px]"
clearable
>
<el-option
v-for="(item, index) in dictData[9]"
:key="index"
:label="item.name"
:value="item.value"
/>
<div class="form-tips">
访问的组件路径`user/setting`默认在`views`目录下
</div>
</div>
</el-select>
</el-form-item>
<el-form-item
label="选中菜单"
prop="selected"
v-if="formData.type == MenuEnum.MENU"
label="位置状态"
prop="status"
required
>
<div class="flex-1">
<el-input
v-model="formData.selected"
placeholder="请输入路由路径"
clearable
<el-select
v-model="formData.type"
class="w-[280px]"
clearable
>
<el-option
v-for="(item, index) in dictData[10]"
:key="index"
:label="item.name"
:value="item.value"
/>
<div class="form-tips">
访问详情页面编辑页面时菜单高亮显示`/consumer/lists`
</div>
</div>
</el-select>
</el-form-item>
<el-form-item
v-if="formData.type != MenuEnum.CATALOGUE"
label="权限字符"
prop="perms"
>
<div class="flex-1">
<el-input v-model="formData.perms" placeholder="请输入权限字符" clearable />
<div class="form-tips">
将作为server端API验权使用`auth.admin/user`请谨慎修改
</div>
</div>
<el-form-item label="面积(m²)" prop="area">
<el-input v-model="formData.area" placeholder="请输入面积" clearable />
</el-form-item>
<el-form-item v-if="formData.type == MenuEnum.MENU" label="路由参数" prop="params">
<div>
<div class="flex-1">
<el-input
v-model="formData.params"
placeholder="请输入路由参数"
clearable
/>
</div>
<div class="form-tips">
访问路由的默认传递参数`{"id": 1, "name":
"admin"}``id=1&name=admin`
</div>
</div>
<el-form-item label="可容纳人数" prop="capacity">
<el-input v-model="formData.capacity" placeholder="请输入可容纳人数" clearable />
</el-form-item>
<el-form-item
v-if="formData.type == MenuEnum.MENU"
label="是否缓存"
prop="isCache"
required
>
<div>
<el-radio-group v-model="formData.isCache">
<el-radio :label="1">缓存</el-radio>
<el-radio :label="0">不缓存</el-radio>
</el-radio-group>
<div class="form-tips">选择缓存则会被`keep-alive`缓存</div>
</div>
</el-form-item>
<el-form-item
v-if="formData.type != MenuEnum.BUTTON"
label="是否显示"
prop="isShow"
required
>
<div>
<el-radio-group v-model="formData.isShow">
<el-radio :label="1">显示</el-radio>
<el-radio :label="0">隐藏</el-radio>
</el-radio-group>
<div class="form-tips">
选择隐藏则路由将不会出现在侧边栏但仍然可以访问
</div>
</div>
</el-form-item>
<el-form-item
v-if="formData.type != MenuEnum.BUTTON"
label="菜单状态"
prop="isDisable"
required
>
<div>
<el-radio-group v-model="formData.isDisable">
<el-radio :label="0">正常</el-radio>
<el-radio :label="1">停用</el-radio>
</el-radio-group>
<div class="form-tips">选择停用则路由将不会出现在侧边栏也不能被访问</div>
</div>
</el-form-item>
<el-form-item label="菜单排序" prop="sort">
<div>
<el-input-number v-model="formData.sort" :min="0" :max="9999" />
<div class="form-tips">数值越大越排前</div>
</div>
<el-form-item label="楼层号" prop="floorNumber">
<el-input v-model="formData.floorNumber" placeholder="请输入楼层号" clearable />
</el-form-item>
</el-form>
</popup>
@ -164,9 +75,9 @@
<script lang="ts" setup>
import type { FormInstance } from 'element-plus'
import { menuAdd, menuDetail, menuEdit, menuLists } from '@/api/perms/menu'
import { getLocationList, addLocation, getLocation, getSubLocations, updateLocation } from '@/api/location'
import Popup from '@/components/popup/index.vue'
import { MenuEnum } from '@/enums/appEnums'
import { useDictData } from '@/hooks/useDictOptions'
import { getModulesKey } from '@/router'
import { snakeToCamel } from '@/utils/format'
import { arrayToTree, treeToArray } from '@/utils/util'
@ -176,9 +87,11 @@ const formRef = shallowRef<FormInstance>()
const popupRef = shallowRef<InstanceType<typeof Popup>>()
const mode = ref('add')
const popupTitle = computed(() => {
return mode.value == 'edit' ? '编辑菜单' : '新增菜单'
return mode.value == 'edit' ? '编辑位置' : '新增位置'
})
const { dictData } = useDictData<Array<{name: string, value: any}>>([9,10])
const componentsOptions = ref(getModulesKey())
const querySearch = (queryString: string, cb: any) => {
const results = queryString
@ -191,77 +104,58 @@ const querySearch = (queryString: string, cb: any) => {
const formData = reactive({
id: '',
//id
pid: 0,
parentId: 0,
//
type: MenuEnum.CATALOGUE,
//
icon: '',
type: '',
//
area: 0,
//
name: '',
//
sort: 0,
//
paths: '',
//
perms: '',
//
component: '',
//
selected: '',
//
params: '',
// 0= 1=
isCache: 1,
// 0= 1=
isShow: 1,
// 0= 1=
isDisable: 0
//
capacity: 0,
//
floorNumber: 0,
//
status: 0
})
const formRules = {
pid: [
parentId: [
{
required: true,
message: '请选择父级菜单',
message: '请选择父级位置',
trigger: ['blur', 'change']
}
],
name: [
{
required: true,
message: '请输入菜单名称',
message: '请输入位置名称',
trigger: 'blur'
}
],
paths: [
type: [
{
required: true,
message: '请输入路由地址',
trigger: 'blur'
}
],
component: [
{
required: true,
message: '请输入组件地址',
trigger: 'blur'
message: '请选择位置类型',
trigger: ['blur', 'change']
}
]
}
const menuOptions = ref<any[]>([])
const getMenu = async () => {
const data: any = await menuLists({ page_type: 0 })
const data: any = await getLocationList()
const menu: any = { id: 0, name: '顶级', children: [] }
menu.children = arrayToTree(
treeToArray(data.lists).filter((item) => item.type != MenuEnum.BUTTON)
treeToArray(data.childLocation).filter((item) => item.type != "ER")
)
menuOptions.value.push(menu)
}
const handleSubmit = async () => {
await formRef.value?.validate()
mode.value == 'edit' ? await menuEdit(formData) : await menuAdd(formData)
mode.value == 'edit' ? await updateLocation(formData) : await addLocation(formData)
popupRef.value?.close()
emit('success')
}
@ -282,9 +176,7 @@ const setFormData = (data: Record<any, any>) => {
}
const getDetail = async (row: Record<string, any>) => {
const data = await menuDetail({
id: row.id
})
const data = await getLocation({ id: row.id })
setFormData(data)
}

View File

@ -17,7 +17,7 @@
v-loading="pager.loading"
:data="pager.lists"
row-key="id"
:tree-props="{ children: 'children' }"
:tree-props="{ children: 'childLocation' }"
>
<el-table-column
label="位置名称"
@ -25,47 +25,55 @@
min-width="150"
show-overflow-tooltip
/>
<el-table-column label="位置类型" prop="type" min-width="80">
<el-table-column
label="位置类型"
min-width="80"
show-overflow-tooltip
>
<template #default="{ row }">
<div>
{{ dictData.find(item => item.value === row.type)?.name || '-' }}
</div>
{{ getTypeName(row.type) }}
</template>
</el-table-column>
<el-table-column
label="面积(平方米)"
prop="area"
min-width="80"
label="面积"
min-width="60"
show-overflow-tooltip
/>
<el-table-column
label="可容纳人数"
prop="capacity"
min-width="150"
show-overflow-tooltip
/>
<el-table-column
label="楼层号"
prop="floorNumber"
min-width="150"
show-overflow-tooltip
/>
<el-table-column label="状态" prop="is_disable" min-width="100">
>
<template #default="{ row }">
<el-tag v-if="row.is_disable == 0">正常</el-tag>
<el-tag v-else type="danger">停用</el-tag>
{{ row.area === 0 || row.area === '' || row.area === undefined ? '/' : row.area }}
</template>
</el-table-column>
<el-table-column
label="可容纳人数"
min-width="80"
show-overflow-tooltip
>
<template #default="{ row }">
{{ row.capacity === 0 || row.capacity === '' || row.capacity === undefined ? '/' : row.capacity }}
</template>
</el-table-column>
<el-table-column
label="楼层号"
min-width="80"
show-overflow-tooltip
>
<template #default="{ row }">
{{ row.floorNumber === 0 || row.floorNumber === '' || row.floorNumber === undefined ? '/' : row.floorNumber }}
</template>
</el-table-column>
<el-table-column label="状态" prop="status" min-width="100">
<template #default="{ row }">
{{ getStatusName(row.status) }}
</template>
</el-table-column>
<el-table-column label="排序" prop="sort" min-width="100" />
<el-table-column
label="更新时间"
prop="update_time"
prop="updateTime"
min-width="180"
></el-table-column>
<el-table-column label="操作" width="160" fixed="right">
<template #default="{ row }">
<el-button
v-if="row.type !== MenuEnum.BUTTON"
v-perms="['auth.menu/add']"
type="primary"
link
@ -99,26 +107,60 @@
<script lang="ts" setup name="permission-menu">
import type { ElTable } from 'element-plus'
import { menuDelete, menuLists } from '@/api/perms/menu'
import { getLocationList, addLocation, deleteLocation, getSubLocations } from '@/api/location'
import { MenuEnum } from '@/enums/appEnums'
import { useDictData } from '@/hooks/useDictOptions'
import { usePaging } from '@/hooks/usePaging'
import feedback from '@/utils/feedback'
import EditPopup from './edit.vue'
import element from '@/install/plugins/element'
const tableRef = shallowRef<InstanceType<typeof ElTable>>()
const editRef = shallowRef<InstanceType<typeof EditPopup>>()
let isExpand = false
const showEdit = ref(false)
const { pager, getLists } = usePaging({
fetchFun: menuLists,
params: {
page_type: 0
fetchFun: async () => {
const response = await getLocationList()
return {
lists: response.childLocation || [],
total: response.childLocation?.length || 0
}
}
})
const { dictData } = useDictData<Array<{ name: string; value: string | number }>>(9)
const { dictData } = useDictData<Array<{ name: string; value: string | number }>>([9,10])
const typeMap = computed(() => {
const map: Record<string, string> = {}
if (dictData[9] && typeof dictData[9] === 'object') {
Object.values(dictData[9]).forEach((item: any) => {
map[item.value] = item.name
})
}
return map
})
const statusMap = computed(() => {
const map: Record<string, string> = {}
if (dictData[10] && typeof dictData[10] === 'object') {
Object.values(dictData[10]).forEach((item: any) => {
map[item.value] = item.name
})
}
return map
})
const getTypeName = (value: string | number | undefined) => {
if (!value) return '-'
return typeMap.value[value] || value
}
const getStatusName = (value: string | number | undefined) => {
if (!value) return '-'
return statusMap.value[value] || value
}
const handleAdd = async (id?: number) => {
showEdit.value = true
@ -134,14 +176,14 @@ const handleAdd = async (id?: number) => {
const handleEdit = async (data: any) => {
showEdit.value = true
await nextTick()
console.log(data.children)
console.log(data.childLocation)
editRef.value?.open('edit')
editRef.value?.getDetail(data)
}
const handleDelete = async (id: number) => {
await feedback.confirm('确定要删除?')
await menuDelete({ id })
await deleteLocation({ id })
getLists()
}
@ -153,8 +195,8 @@ const handleExpand = () => {
const toggleExpand = (children: any[], unfold = true) => {
for (const key in children) {
tableRef.value?.toggleRowExpansion(children[key], unfold)
if (children[key].children) {
toggleExpand(children[key].children!, unfold)
if (children[key].childLocation) {
toggleExpand(children[key].childLocation!, unfold)
}
}
}

View File

@ -19,7 +19,7 @@
>
<el-option label="全部" value="" />
<el-option
v-for="(item, index) in dictData"
v-for="(item, index) in dictData[7]"
:key="index"
:label="item.name"
:value="item.value"