|
|
|
@ -72,6 +72,9 @@
|
|
|
|
|
<el-tooltip content="删除" placement="top">
|
|
|
|
|
<el-button v-hasPermi="['system:menu:remove']" link type="primary" icon="Delete" @click="handleDelete(scope.row)" />
|
|
|
|
|
</el-tooltip>
|
|
|
|
|
<el-tooltip content="复制" placement="top">
|
|
|
|
|
<el-button v-hasPermi="['system:menu:add']" link type="primary" icon="CopyDocument" @click="handleCopy(scope.row)" />
|
|
|
|
|
</el-tooltip>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
@ -257,11 +260,39 @@
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
<!-- 复制菜单对话框 -->
|
|
|
|
|
<el-dialog v-model="copyDialog.visible" title="复制菜单" destroy-on-close append-to-body width="500px">
|
|
|
|
|
<el-form ref="copyFormRef" :model="copyForm" :rules="copyRules" label-width="100px">
|
|
|
|
|
<el-form-item label="上级菜单">
|
|
|
|
|
<el-tree-select
|
|
|
|
|
v-model="copyForm.parentId"
|
|
|
|
|
:data="menuOptions"
|
|
|
|
|
:props="{ value: 'menuId', label: 'menuName', children: 'children' }"
|
|
|
|
|
value-key="menuId"
|
|
|
|
|
placeholder="选择上级菜单"
|
|
|
|
|
check-strictly
|
|
|
|
|
/>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="新菜单名称" prop="menuName">
|
|
|
|
|
<el-input v-model="copyForm.menuName" placeholder="请输入新菜单名称" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="显示排序" prop="orderNum">
|
|
|
|
|
<el-input-number v-model="copyForm.orderNum" controls-position="right" :min="0" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
<template #footer>
|
|
|
|
|
<div class="dialog-footer">
|
|
|
|
|
<el-button type="primary" @click="submitCopyForm">确 定</el-button>
|
|
|
|
|
<el-button @click="cancelCopy">取 消</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script setup name="Menu" lang="ts">
|
|
|
|
|
import { addMenu, delMenu, getMenu, listMenu, updateMenu } from '@/api/system/menu';
|
|
|
|
|
import { addMenu, delMenu, getMenu, listMenu, updateMenu, copyMenu } from '@/api/system/menu';
|
|
|
|
|
import { MenuForm, MenuQuery, MenuVO } from '@/api/system/menu/types';
|
|
|
|
|
import { MenuTypeEnum } from '@/enums/MenuTypeEnum';
|
|
|
|
|
|
|
|
|
@ -285,8 +316,14 @@ const dialog = reactive<DialogOption>({
|
|
|
|
|
title: ''
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
const copyDialog = reactive<DialogOption>({
|
|
|
|
|
visible: false,
|
|
|
|
|
title: '复制菜单'
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
const queryFormRef = ref<ElFormInstance>();
|
|
|
|
|
const menuFormRef = ref<ElFormInstance>();
|
|
|
|
|
const copyFormRef = ref<ElFormInstance>();
|
|
|
|
|
const initFormData = {
|
|
|
|
|
path: '',
|
|
|
|
|
menuId: undefined,
|
|
|
|
@ -313,6 +350,19 @@ const data = reactive<PageData<MenuForm, MenuQuery>>({
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
const copyForm = reactive({
|
|
|
|
|
menuName: '',
|
|
|
|
|
sourceMenuId: undefined as string | number | undefined,
|
|
|
|
|
parentId: 0,
|
|
|
|
|
orderNum: 0
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
const copyRules = {
|
|
|
|
|
menuName: [{ required: true, message: '菜单名称不能为空', trigger: 'blur' }],
|
|
|
|
|
parentId: [{ required: true, message: '上级菜单不能为空', trigger: 'change' }],
|
|
|
|
|
orderNum: [{ required: true, message: '显示排序不能为空', trigger: 'blur' }]
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
const menuTableRef = ref<ElTableInstance>();
|
|
|
|
|
|
|
|
|
|
const { queryParams, form, rules } = toRefs<PageData<MenuForm, MenuQuery>>(data);
|
|
|
|
@ -404,6 +454,39 @@ const handleDelete = async (row: MenuVO) => {
|
|
|
|
|
proxy?.$modal.msgSuccess('删除成功');
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
/** 复制按钮操作 */
|
|
|
|
|
const handleCopy = (row: MenuVO) => {
|
|
|
|
|
copyForm.menuName = row.menuName + ' - 复制';
|
|
|
|
|
copyForm.sourceMenuId = row.menuId;
|
|
|
|
|
copyForm.parentId = row.parentId;
|
|
|
|
|
copyForm.orderNum = row.orderNum;
|
|
|
|
|
getTreeselect();
|
|
|
|
|
copyDialog.visible = true;
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
/** 取消复制 */
|
|
|
|
|
const cancelCopy = () => {
|
|
|
|
|
copyForm.menuName = '';
|
|
|
|
|
copyForm.sourceMenuId = undefined;
|
|
|
|
|
copyDialog.visible = false;
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
/** 提交复制表单 */
|
|
|
|
|
const submitCopyForm = () => {
|
|
|
|
|
copyFormRef.value?.validate(async (valid: boolean) => {
|
|
|
|
|
if (valid && copyForm.sourceMenuId) {
|
|
|
|
|
await copyMenu(copyForm.sourceMenuId, {
|
|
|
|
|
menuName: copyForm.menuName,
|
|
|
|
|
parentId: copyForm.parentId,
|
|
|
|
|
orderNum: copyForm.orderNum
|
|
|
|
|
});
|
|
|
|
|
proxy?.$modal.msgSuccess('复制成功');
|
|
|
|
|
copyDialog.visible = false;
|
|
|
|
|
await getList();
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
onMounted(() => {
|
|
|
|
|
getList();
|
|
|
|
|
});
|
|
|
|
|