fix: bug#10847 修复菜单管理部分bug
This commit is contained in:
parent
11cf92b90e
commit
0ec07a4d73
|
@ -258,7 +258,6 @@
|
|||
|
||||
<script setup lang="ts">
|
||||
import PermissionButton from '@/components/PermissionButton/index.vue';
|
||||
|
||||
import { FormInstance, message } from 'ant-design-vue';
|
||||
import ChooseIconDialog from '../components/ChooseIconDialog.vue';
|
||||
import PermissChoose from '../components/PermissChoose.vue';
|
||||
|
|
|
@ -63,26 +63,29 @@
|
|||
|
||||
<script setup lang="ts">
|
||||
import PermissionButton from '@/components/PermissionButton/index.vue';
|
||||
|
||||
import ButtonAddDialog from '../components/ButtonAddDialog.vue';
|
||||
|
||||
import { getMenuInfo_api, saveMenuInfo_api } from '@/api/system/menu';
|
||||
import { message } from 'jetlinks-ui-components';
|
||||
|
||||
const permission = 'system/Menu';
|
||||
// 路由
|
||||
const route = useRoute();
|
||||
const routeParams = {
|
||||
const routeParams = reactive({
|
||||
id: route.params.id === ':id' ? '' : (route.params.id as string),
|
||||
...route.query,
|
||||
};
|
||||
});
|
||||
const paramsId = ref('');
|
||||
|
||||
// 弹窗相关
|
||||
const selectItem = ref<any>({});
|
||||
const dialogVisible = ref(false);
|
||||
const dialogTitle = ref<'查看' | '新增' | '编辑'>('新增');
|
||||
const openDialog = (mode: '查看' | '新增' | '编辑', row: object) => {
|
||||
if (!routeParams.id) return message.warning('请先新增菜单基本信息');
|
||||
if (!routeParams.id && !paramsId.value) {
|
||||
return message.warning('请先新增菜单基本信息');
|
||||
}
|
||||
console.log(3);
|
||||
|
||||
selectItem.value = { ...row };
|
||||
dialogTitle.value = mode;
|
||||
dialogVisible.value = true;
|
||||
|
@ -147,6 +150,15 @@ type tableDataItem = {
|
|||
description?: string;
|
||||
permissions: object[];
|
||||
};
|
||||
|
||||
watch(
|
||||
() => route.params.id,
|
||||
(value) => {
|
||||
if (!!value) {
|
||||
paramsId.value = value;
|
||||
}
|
||||
},
|
||||
);
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
|
|
|
@ -10,6 +10,7 @@
|
|||
<j-radio-button
|
||||
v-for="typeStr in iconKeys"
|
||||
:value="typeStr"
|
||||
:key="typeStr"
|
||||
:class="{ active: selected === typeStr }"
|
||||
>
|
||||
<AIcon :type="typeStr" />
|
||||
|
@ -19,6 +20,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import iconKeys from './fields';
|
||||
const emits = defineEmits(['confirm', 'update:visible']);
|
||||
const props = defineProps<{
|
||||
visible: boolean;
|
||||
|
@ -28,38 +30,6 @@ const confirm = () => {
|
|||
emits('confirm', selected.value);
|
||||
emits('update:visible', false);
|
||||
};
|
||||
const iconKeys = [
|
||||
'EyeOutlined',
|
||||
'EditOutlined',
|
||||
'PlusOutlined',
|
||||
'DeleteOutlined',
|
||||
'CheckCircleOutlined',
|
||||
'StopOutlined',
|
||||
'CheckOutlined',
|
||||
'CloseOutlined',
|
||||
'DownOutlined',
|
||||
'ImportOutlined',
|
||||
'ExportOutlined',
|
||||
'SyncOutlined',
|
||||
'ExclamationCircleOutlined',
|
||||
'UploadOutlined',
|
||||
'LoadingOutlined',
|
||||
'PlusCircleOutlined',
|
||||
'QuestionCircleOutlined',
|
||||
'DisconnectOutlined',
|
||||
'LinkOutlined',
|
||||
'PoweroffOutlined',
|
||||
'SwapOutlined',
|
||||
'BugOutlined',
|
||||
'BarsOutlined',
|
||||
'ArrowDownOutlined',
|
||||
'SmallDashOutlined',
|
||||
'TeamOutlined',
|
||||
'MenuUnfoldOutlined',
|
||||
'MenuFoldOutlined',
|
||||
'InfoCircleOutlined',
|
||||
'SearchOutlined',
|
||||
];
|
||||
|
||||
const selected = ref<string>('');
|
||||
</script>
|
||||
|
|
|
@ -0,0 +1,246 @@
|
|||
const direction = [
|
||||
'StepBackward',
|
||||
'StepForward',
|
||||
'FastBackward',
|
||||
'FastForward',
|
||||
'Shrink',
|
||||
'ArrowsAlt',
|
||||
'Down',
|
||||
'Up',
|
||||
'Left',
|
||||
'Right',
|
||||
'CaretUp',
|
||||
'CaretDown',
|
||||
'CaretLeft',
|
||||
'CaretRight',
|
||||
'UpCircle',
|
||||
'DownCircle',
|
||||
'LeftCircle',
|
||||
'RightCircle',
|
||||
'DoubleRight',
|
||||
'DoubleLeft',
|
||||
'VerticalLeft',
|
||||
'VerticalRight',
|
||||
'VerticalAlignTop',
|
||||
'VerticalAlignMiddle',
|
||||
'VerticalAlignBottom',
|
||||
'Forward',
|
||||
'Backward',
|
||||
'Rollback',
|
||||
'Enter',
|
||||
'Retweet',
|
||||
'Swap',
|
||||
'SwapLeft',
|
||||
'SwapRight',
|
||||
'ArrowUp',
|
||||
'ArrowDown',
|
||||
'ArrowLeft',
|
||||
'ArrowRight',
|
||||
'PlayCircle',
|
||||
'UpSquare',
|
||||
'DownSquare',
|
||||
'LeftSquare',
|
||||
'RightSquare',
|
||||
'Login',
|
||||
'Logout',
|
||||
'MenuFold',
|
||||
'MenuUnfold',
|
||||
'BorderBottom',
|
||||
'BorderHorizontal',
|
||||
'BorderInner',
|
||||
'BorderOuter',
|
||||
'BorderLeft',
|
||||
'BorderRight',
|
||||
'BorderTop',
|
||||
'BorderVerticle',
|
||||
'PicCenter',
|
||||
'PicLeft',
|
||||
'PicRight',
|
||||
'RadiusBottomleft',
|
||||
'RadiusBottomright',
|
||||
'RadiusUpleft',
|
||||
'RadiusUpright',
|
||||
'Fullscreen',
|
||||
'FullscreenExit',
|
||||
];
|
||||
|
||||
const suggestion = [
|
||||
'Question',
|
||||
'QuestionCircle',
|
||||
'Plus',
|
||||
'PlusCircle',
|
||||
'Pause',
|
||||
'PauseCircle',
|
||||
'Minus',
|
||||
'MinusCircle',
|
||||
'PlusSquare',
|
||||
'MinusSquare',
|
||||
'Info',
|
||||
'InfoCircle',
|
||||
'Exclamation',
|
||||
'ExclamationCircle',
|
||||
'Close',
|
||||
'CloseCircle',
|
||||
'CloseSquare',
|
||||
'Check',
|
||||
'CheckCircle',
|
||||
'CheckSquare',
|
||||
'ClockCircle',
|
||||
'Warning',
|
||||
'IssuesClose',
|
||||
'Stop',
|
||||
];
|
||||
|
||||
const editor = [
|
||||
'Edit',
|
||||
'Form',
|
||||
'Copy',
|
||||
'Scissor',
|
||||
'Delete',
|
||||
'Snippets',
|
||||
'Diff',
|
||||
'Highlight',
|
||||
'AlignCenter',
|
||||
'AlignLeft',
|
||||
'AlignRight',
|
||||
'BgColors',
|
||||
'Bold',
|
||||
'Italic',
|
||||
'Underline',
|
||||
'Strikethrough',
|
||||
'Redo',
|
||||
'Undo',
|
||||
'ZoomIn',
|
||||
'ZoomOut',
|
||||
'FontColors',
|
||||
'FontSize',
|
||||
'LineHeight',
|
||||
'Dash',
|
||||
'SmallDash',
|
||||
'SortAscending',
|
||||
'SortDescending',
|
||||
'Drag',
|
||||
'OrderedList',
|
||||
'UnorderedList',
|
||||
'RadiusSetting',
|
||||
'ColumnWidth',
|
||||
'ColumnHeight',
|
||||
];
|
||||
|
||||
const data = [
|
||||
'AreaChart',
|
||||
'PieChart',
|
||||
'BarChart',
|
||||
'DotChart',
|
||||
'LineChart',
|
||||
'RadarChart',
|
||||
'HeatMap',
|
||||
'Fall',
|
||||
'Rise',
|
||||
'Stock',
|
||||
'BoxPlot',
|
||||
'Fund',
|
||||
'Sliders',
|
||||
];
|
||||
|
||||
// const logo = [
|
||||
// 'Android',
|
||||
// 'Apple',
|
||||
// 'Windows',
|
||||
// 'Ie',
|
||||
// 'Chrome',
|
||||
// 'Github',
|
||||
// 'Aliwangwang',
|
||||
// 'Dingding',
|
||||
// 'WeiboSquare',
|
||||
// 'WeiboCircle',
|
||||
// 'TaobaoCircle',
|
||||
// 'Html5',
|
||||
// 'Weibo',
|
||||
// 'Twitter',
|
||||
// 'Wechat',
|
||||
// 'Youtube',
|
||||
// 'AlipayCircle',
|
||||
// 'Taobao',
|
||||
// 'Skype',
|
||||
// 'Qq',
|
||||
// 'MediumWorkmark',
|
||||
// 'Gitlab',
|
||||
// 'Medium',
|
||||
// 'Linkedin',
|
||||
// 'GooglePlus',
|
||||
// 'Dropbox',
|
||||
// 'Facebook',
|
||||
// 'Codepen',
|
||||
// 'CodeSandbox',
|
||||
// 'CodeSandboxCircle',
|
||||
// 'Amazon',
|
||||
// 'Google',
|
||||
// 'CodepenCircle',
|
||||
// 'Alipay',
|
||||
// 'AntDesign',
|
||||
// 'AntCloud',
|
||||
// 'Aliyun',
|
||||
// 'Zhihu',
|
||||
// 'Slack',
|
||||
// 'SlackSquare',
|
||||
// 'Behance',
|
||||
// 'BehanceSquare',
|
||||
// 'Dribbble',
|
||||
// 'DribbbleSquare',
|
||||
// 'Instagram',
|
||||
// 'Yuque',
|
||||
// 'Alibaba',
|
||||
// 'Yahoo',
|
||||
// 'Reddit',
|
||||
// 'Sketch',
|
||||
// ];
|
||||
|
||||
// 不显示,需要过滤
|
||||
// const filter = [
|
||||
// 'AlipaySquare',
|
||||
// 'AmazonCircle',
|
||||
// 'AmazonSquare',
|
||||
// 'BehanceCircle',
|
||||
// 'CodeSandboxSquare',
|
||||
// 'CodeSandboxSquare',
|
||||
// 'CodepenSquare',
|
||||
// 'DingtalkCircle',
|
||||
// 'DingtalkSquare',
|
||||
// 'DribbbleCircle',
|
||||
// 'DropboxCircle',
|
||||
// 'DropboxSquare',
|
||||
// 'Golden',
|
||||
// 'GoogleCircle',
|
||||
// 'GoogleSquare',
|
||||
// 'GooglePlusCircle',
|
||||
// 'GooglePlusSquare',
|
||||
// 'GooglePlusSquare',
|
||||
// 'IeCircle',
|
||||
// 'IeSquare',
|
||||
// 'MediumCircle',
|
||||
// 'MediumSquare',
|
||||
// 'QqCircle',
|
||||
// 'QqSquare',
|
||||
// 'RedditCircle',
|
||||
// 'RedditSquare',
|
||||
// 'Signal',
|
||||
// 'SketchCircle',
|
||||
// 'SketchSquare',
|
||||
// 'SlackCircle',
|
||||
// 'TaobaoSquare',
|
||||
// 'TwitterCircle',
|
||||
// 'TwitterSquare',
|
||||
// 'ZhihuCircle',
|
||||
// 'ZhihuSquare',
|
||||
// 'createFromIconfontCN',
|
||||
// 'default',
|
||||
// 'getTwoToneColor',
|
||||
// 'setTwoToneColor',
|
||||
// ];
|
||||
|
||||
const datum = [...direction, ...suggestion, ...editor, ...data];
|
||||
|
||||
const iconKeys = datum.map((item) => item + 'Outlined');
|
||||
|
||||
export default iconKeys;
|
|
@ -25,6 +25,7 @@
|
|||
<AIcon type="PlusOutlined" />新增
|
||||
</PermissionButton>
|
||||
<j-button
|
||||
v-if="admin"
|
||||
style="margin-left: 12px"
|
||||
@click="router.push('/system/Menu/Setting')"
|
||||
>菜单配置</j-button
|
||||
|
@ -79,10 +80,12 @@
|
|||
|
||||
<script setup lang="ts" name="Menu">
|
||||
import PermissionButton from '@/components/PermissionButton/index.vue';
|
||||
|
||||
import { getMenuTree_api, delMenuInfo_api } from '@/api/system/menu';
|
||||
import { message } from 'jetlinks-ui-components';
|
||||
import dayjs from 'dayjs';
|
||||
import { useUserInfo } from '@/store/userInfo';
|
||||
|
||||
const admin = useUserInfo().userInfos?.type.id === 'admin';
|
||||
|
||||
const permission = 'system/Menu';
|
||||
|
||||
|
@ -108,7 +111,7 @@ const columns = [
|
|||
search: {
|
||||
type: 'string',
|
||||
},
|
||||
width: 220,
|
||||
// width: 220,
|
||||
},
|
||||
{
|
||||
title: '页面地址',
|
||||
|
@ -133,7 +136,8 @@ const columns = [
|
|||
title: '说明',
|
||||
dataIndex: 'describe',
|
||||
key: 'describe',
|
||||
width: 200,
|
||||
ellipsis: true,
|
||||
// width: 200,
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
|
@ -150,8 +154,9 @@ const columns = [
|
|||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
key: 'action',
|
||||
fixed: 'right',
|
||||
scopedSlots: true,
|
||||
width: 140,
|
||||
width: 200,
|
||||
},
|
||||
];
|
||||
const queryParams = ref({ terms: [] });
|
||||
|
@ -246,6 +251,7 @@ const table = reactive({
|
|||
|
||||
<style lang="less" scoped>
|
||||
.menu-container {
|
||||
width: 100%;
|
||||
:deep(.ant-table-cell) {
|
||||
.ant-btn-link {
|
||||
padding: 0;
|
||||
|
|
Loading…
Reference in New Issue