fix: 修复用户新增时,岗位下拉未清空Bug,抽取form-tip组件

This commit is contained in:
AN 2025-04-13 14:43:46 +08:00
parent 375ffa1578
commit c1444346e0
10 changed files with 73 additions and 69 deletions

View File

@ -0,0 +1,26 @@
<script setup lang="ts">
import { NTooltip } from 'naive-ui';
defineOptions({
name: 'FormTip'
});
interface Props {
content: string;
}
defineProps<Props>();
</script>
<template>
<NTooltip trigger="hover">
<template #default>
<span>{{ content }}</span>
</template>
<template #trigger>
<div class="cursor-pointer pr-3px">
<SvgIcon class="text-15px" icon="ep:warning" />
</div>
</template>
</NTooltip>
</template>

View File

@ -4,7 +4,7 @@ import { useLoading } from '@sa/hooks';
import type { TreeOption, TreeSelectProps } from 'naive-ui';
import { fetchGetMenuList } from '@/service/api/system';
import SvgIcon from '@/components/custom/svg-icon.vue';
import { handleMenuTree } from '@/utils/ruoyi';
import { handleTree } from '@/utils/common';
defineOptions({ name: 'MenuTreeSelect' });
@ -29,7 +29,7 @@ async function getMenuList() {
menuId: 0,
menuName: '根目录',
icon: 'material-symbols:home-outline-rounded',
children: handleMenuTree(data, 'menuId')
children: handleTree(data, { idField: 'menuId', filterFn: item => item.menuType !== 'F' })
}
] as Api.System.Menu[];
endLoading();

View File

@ -27,7 +27,10 @@ const roleOptions = ref<CommonType.Option<CommonType.IdType>[]>([]);
watch(
() => props.deptId,
() => {
if (!props.deptId) return;
if (!props.deptId) {
roleOptions.value = [];
return;
}
getRoleOptions();
},
{ immediate: true }

View File

@ -173,7 +173,10 @@ const local: App.I18n.Schema = {
system_dict: 'Dict Management',
system_dict_data: 'DictData MAnagement',
system_dict_type: 'DictType Management',
system_tenant: 'Tenant Management'
system_tenant: 'Tenant Management',
system_config: 'Config Management',
system_dept: 'Dept Management',
system_post: 'Post Management'
},
page: {
login: {

View File

@ -173,7 +173,10 @@ const local: App.I18n.Schema = {
system_dict: '字典管理',
system_dict_data: '字典数据管理',
system_dict_type: '字典类型管理',
system_tenant: '租户管理'
system_tenant: '租户管理',
system_config: '参数设置',
system_dept: '部门管理',
system_post: '岗位管理'
},
page: {
login: {

View File

@ -19,6 +19,7 @@ declare module 'vue' {
DictSelect: typeof import('./../components/custom/dict-select.vue')['default']
DictTag: typeof import('./../components/custom/dict-tag.vue')['default']
ExceptionBase: typeof import('./../components/common/exception-base.vue')['default']
FormTip: typeof import('./../components/custom/form-tip.vue')['default']
FullScreen: typeof import('./../components/common/full-screen.vue')['default']
IconAntDesignEnterOutlined: typeof import('~icons/ant-design/enter-outlined')['default']
IconAntDesignReloadOutlined: typeof import('~icons/ant-design/reload-outlined')['default']

View File

@ -137,6 +137,7 @@ watch(visible, () => {
<NInput v-model:value="model.parentId" placeholder="请输入父部门id" />
</NFormItem>
-->
<NFormItem label="部门名称" path="deptName">
<NInput v-model:value="model.deptName" placeholder="请输入部门名称" />
</NFormItem>
@ -157,10 +158,10 @@ watch(visible, () => {
<NFormItem label="邮箱" path="email">
<NInput v-model:value="model.email" placeholder="请输入邮箱" />
</NFormItem>
<NFormItem label="部门状态0正常 1停用" path="status">
<NFormItem label="部门状态" path="status">
<NSelect
v-model:value="model.status"
placeholder="请选择部门状态0正常 1停用"
placeholder="请选择部门状态"
:options="sysNormalDisableOptions"
clearable
/>

View File

@ -39,10 +39,10 @@ async function search() {
<NFormItemGi span="24 s:12 m:6" label="部门名称" path="deptName" class="pr-24px">
<NInput v-model:value="model.deptName" placeholder="请输入部门名称" />
</NFormItemGi>
<NFormItemGi span="24 s:12 m:6" label="部门状态0正常 1停用" path="status" class="pr-24px">
<NFormItemGi span="24 s:12 m:6" label="部门状态" path="status" class="pr-24px">
<NSelect
v-model:value="model.status"
placeholder="请选择部门状态0正常 1停用"
placeholder="请选择部门状态"
:options="sysNormalDisableOptions"
clearable
/>

View File

@ -1,7 +1,6 @@
<script setup lang="tsx">
import { computed, defineComponent, reactive, ref, watch } from 'vue';
import { computed, reactive, ref, watch } from 'vue';
import type { SelectOption } from 'naive-ui';
import { NTooltip } from 'naive-ui';
import { useFormRules, useNaiveForm } from '@/hooks/common/form';
import { $t } from '@/locales';
import { fetchCreateMenu, fetchUpdateMenu } from '@/service/api/system';
@ -222,30 +221,6 @@ function onCreate() {
value: ''
};
}
const FormTipComponent = defineComponent({
name: 'FormTipComponent',
props: {
content: {
type: String,
default: ''
}
},
setup(tipProps) {
return () => (
<NTooltip trigger="hover">
{{
default: () => <span>{tipProps.content}</span>,
trigger: () => (
<div>
<SvgIcon class="text-15px" icon="ep:warning" />
</div>
)
}}
</NTooltip>
);
}
});
</script>
<template>
@ -284,7 +259,7 @@ const FormTipComponent = defineComponent({
<NFormItemGi v-if="!isBtn" span="24" path="icon">
<template #label>
<div class="flex-center">
<FormTipComponent content="iconify 地址:`https://icones.js.org`" />
<FormTip content="iconify 地址:`https://icones.js.org`" />
<span class="pl-3px">菜单图标</span>
</div>
</template>
@ -302,8 +277,8 @@ const FormTipComponent = defineComponent({
<NFormItemGi v-if="!isBtn" :span="24" path="path">
<template #label>
<div class="flex-center">
<FormTipComponent content="访问的路由地址,如:`/user`,如外网地址需内链访问则以 `http(s)://` 开头" />
<span class="pl-3px">{{ model.isFrame !== '0' ? '路由地址' : '外链地址' }}</span>
<FormTip content="访问的路由地址,如:`/user`,如外网地址需内链访问则以 `http(s)://` 开头" />
<span>{{ model.isFrame !== '0' ? '路由地址' : '外链地址' }}</span>
</div>
</template>
<NInput v-model:value="model.path" placeholder="请输入路由地址" />
@ -311,8 +286,8 @@ const FormTipComponent = defineComponent({
<NFormItemGi v-if="isMenu && model.isFrame === '1'" :span="24" path="component">
<template #label>
<div class="flex-center">
<FormTipComponent content="访问的组件路径,如:`system/user`,默认在`views`目录下" />
<span class="pl-3px">组件路径</span>
<FormTip content="访问的组件路径,如:`system/user`,默认在`views`目录下" />
<span>组件路径</span>
</div>
</template>
<NInputGroup>
@ -362,8 +337,8 @@ const FormTipComponent = defineComponent({
<NFormItemGi :span="24" path="perms">
<template #label>
<div class="flex-center">
<FormTipComponent content="控制器中定义的权限字符,如:@SaCheckPermission('system:user:list')" />
<span class="pl-3px">权限字符</span>
<FormTip content="控制器中定义的权限字符,如:@SaCheckPermission('system:user:list')" />
<span>权限字符</span>
</div>
</template>
<NInput v-model:value="model.perms" placeholder="请输入菜单名称" />
@ -371,8 +346,8 @@ const FormTipComponent = defineComponent({
<NFormItemGi v-if="!isBtn" :span="12" path="isFrame">
<template #label>
<div class="flex-center">
<FormTipComponent content="选择是外链则路由地址需要以`http(s)://`开头" />
<span class="pl-3px">是否外链</span>
<FormTip content="选择是外链则路由地址需要以`http(s)://`开头" />
<span>是否外链</span>
</div>
</template>
<NRadioGroup v-model:value="model.isFrame">
@ -389,8 +364,8 @@ const FormTipComponent = defineComponent({
<NFormItemGi v-if="isMenu" :span="12" path="isCache">
<template #label>
<div class="flex-center">
<FormTipComponent content="选择是则会被`keep-alive`缓存,需要匹配组件的`name`和地址保持一致" />
<span class="pl-3px">是否缓存</span>
<FormTip content="选择是则会被`keep-alive`缓存,需要匹配组件的`name`和地址保持一致" />
<span>是否缓存</span>
</div>
</template>
<NRadioGroup v-model:value="model.isCache">
@ -403,8 +378,8 @@ const FormTipComponent = defineComponent({
<NFormItemGi v-if="!isBtn" :span="12" label="显示状态" path="visible">
<template #label>
<div class="flex-center">
<FormTipComponent content="选择隐藏则路由将不会出现在侧边栏,但仍然可以访问" />
<span class="pl-3px">显示状态</span>
<FormTip content="选择隐藏则路由将不会出现在侧边栏,但仍然可以访问" />
<span>显示状态</span>
</div>
</template>
<DictRadio v-model:value="model.visible" dict-code="sys_show_hide" />
@ -412,8 +387,8 @@ const FormTipComponent = defineComponent({
<NFormItemGi :span="12" path="status">
<template #label>
<div class="flex-center">
<FormTipComponent content="选择停用则路由将不会出现在侧边栏,也不能被访问" />
<span class="pl-3px">菜单状态</span>
<FormTip content="选择停用则路由将不会出现在侧边栏,也不能被访问" />
<span>菜单状态</span>
</div>
</template>
<DictRadio v-model:value="model.status" dict-code="sys_normal_disable" />

View File

@ -263,29 +263,21 @@ watch(visible, () => {
</NFormItem>
<NFormItem label="用户数量" path="accountCount">
<template #label>
<span class="flex-y-center">
用户数量
<NTooltip :show-arrow="false" trigger="hover">
<template #trigger>
<icon-mingcute:question-line class="ml-4px cursor-pointer text-14px" />
</template>
-1不限制用户数量
</NTooltip>
</span>
<div class="flex-center">
<FormTip content="-1不限制用户数量" />
<span>用户数量</span>
</div>
</template>
<NInputNumber v-model:value="model.accountCount" placeholder="请输入用户数量" min="-1" class="w-full" />
</NFormItem>
<NFormItem label="绑定域名" path="domain">
<template #label>
<span class="flex-y-center">
绑定域名
<NTooltip :show-arrow="false" trigger="hover">
<template #trigger>
<icon-mingcute:question-line class="ml-4px cursor-pointer text-14px" />
</template>
可填写域名/端口 填写域名如: www.test.com 或者 www.test.com:8080 填写ip:端口如: 127.0.0.1:8080
</NTooltip>
</span>
<div class="flex-center">
<FormTip
content="可填写域名/端口 填写域名如: www.test.com 或者 www.test.com:8080 填写ip:端口如: 127.0.0.1:8080"
/>
<span>绑定域名</span>
</div>
</template>
<NInputGroup>
<NInputGroupLabel>http(s)://</NInputGroupLabel>
@ -320,4 +312,4 @@ watch(visible, () => {
</template>
<style scoped></style>
@/service/api/system/tenant-package
@/service/api/system/tenant-package