Merge branch 'main' of https://github.com/xingyu4j/vue-vben-admin into fix
This commit is contained in:
60
playground/src/views/examples/context-menu/index.vue
Normal file
60
playground/src/views/examples/context-menu/index.vue
Normal file
@@ -0,0 +1,60 @@
|
||||
<script setup lang="ts">
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { VbenContextMenu } from '@vben-core/shadcn-ui';
|
||||
|
||||
import { Button, Card, message } from 'ant-design-vue';
|
||||
|
||||
const needHidden = (role: string) => {
|
||||
return role === 'user';
|
||||
};
|
||||
|
||||
const contextMenus = () => {
|
||||
return [
|
||||
{
|
||||
text: '刷新',
|
||||
key: 'refresh',
|
||||
handler: (data: any) => {
|
||||
message.success('刷新成功', data);
|
||||
},
|
||||
hidden: needHidden('admin'),
|
||||
},
|
||||
{
|
||||
text: '关闭当前',
|
||||
key: 'close-current',
|
||||
handler: (data: any) => {
|
||||
message.success('关闭当前', data);
|
||||
},
|
||||
hidden: needHidden('user'),
|
||||
},
|
||||
{
|
||||
text: '关闭其他',
|
||||
key: 'close-other',
|
||||
handler: (data: any) => {
|
||||
message.success('关闭其他', data);
|
||||
},
|
||||
},
|
||||
{
|
||||
text: '关闭所有',
|
||||
key: 'close-all',
|
||||
handler: (data: any) => {
|
||||
message.success('关闭所有', data);
|
||||
},
|
||||
},
|
||||
];
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Page title="Context Menu 上下文菜单">
|
||||
<Card title="基本使用">
|
||||
<div>一共四个菜单(刷新、关闭当前、关闭其他、关闭所有)</div>
|
||||
<br/>
|
||||
<br/>
|
||||
<VbenContextMenu :menus="contextMenus" :modal="true" item-class="pr-6">
|
||||
<Button> 右键点击我打开上下文菜单(有隐藏项) </Button>
|
||||
</VbenContextMenu>
|
||||
</Card>
|
||||
</Page>
|
||||
</template>
|
||||
@@ -342,6 +342,8 @@ const [BaseForm, baseFormApi] = useVbenForm({
|
||||
customRequest: upload_file,
|
||||
disabled: false,
|
||||
maxCount: 1,
|
||||
// 单位:MB
|
||||
maxSize: 2,
|
||||
multiple: false,
|
||||
showUploadList: true,
|
||||
// 上传列表的内建样式,支持四种基本样式 text, picture, picture-card 和 picture-circle
|
||||
@@ -354,7 +356,7 @@ const [BaseForm, baseFormApi] = useVbenForm({
|
||||
default: () => $t('examples.form.upload-image'),
|
||||
};
|
||||
},
|
||||
rules: 'required',
|
||||
rules: 'selectRequired',
|
||||
},
|
||||
],
|
||||
// 大屏一行显示3个,中屏一行显示2个,小屏一行显示1个
|
||||
|
||||
Reference in New Issue
Block a user