页面调整

This commit is contained in:
2024-10-16 15:33:14 +08:00
parent 062a8f259f
commit 7c7e5c5f78
7 changed files with 57 additions and 46 deletions

View File

@@ -9,3 +9,6 @@ VITE_OPEN=true
# 打包后是否生成包分析文件
VITE_REPORT=false
# 浏览器是否显示vue的告警信息
VUE_APP_SILENCE_WARNINGS=true

View File

@@ -1,22 +1,22 @@
import { computed } from "vue";
import { useRoute } from "vue-router";
import { useAuthStore } from "@/stores/modules/auth";
import { computed } from 'vue'
import { useRoute } from 'vue-router'
import { useAuthStore } from '@/stores/modules/auth'
/**
* @description 页面按钮权限
* */
export const useAuthButtons = () => {
const route = useRoute();
const authStore = useAuthStore();
const authButtons = authStore.authButtonListGet[route.name as string] || [];
const route = useRoute()
const authStore = useAuthStore()
const authButtons = authStore.authButtonListGet[route.name as string] || []
const BUTTONS = computed(() => {
let currentPageAuthButton: { [key: string]: boolean } = {}
authButtons.forEach(item => (currentPageAuthButton[item] = true))
// currentPageAuthButton.status = true
return currentPageAuthButton
})
const BUTTONS = computed(() => {
let currentPageAuthButton: { [key: string]: boolean } = {};
authButtons.forEach(item => (currentPageAuthButton[item] = true));
return currentPageAuthButton;
});
return {
BUTTONS
};
};
return {
BUTTONS,
}
}

View File

@@ -9,7 +9,7 @@
src="@/assets/images/cn_pms9100_logo.png"
alt="logo"
/>
<span class="logo-text">{{ title }}</span>
<span class="logo-text">{{ title }} </span>
</div>
<el-menu v-if="showMenuFlag" trigger="click" mode="horizontal" :router="false" :default-active="activeMenu">
<!-- 不能直接使用 SubMenu 组件无法触发 el-menu 隐藏省略功能 -->

View File

@@ -2,7 +2,7 @@
<el-dropdown trigger="click">
<div class="userInfo">
<div class="icon">
<Icon><Avatar /></Icon>
<Avatar />
</div>
<div class="username">
{{ username }}

View File

@@ -35,8 +35,14 @@ import errorHandler from "@/utils/errorHandler";
import registerGlobComp from '@/components'
const app = createApp(App);
// 自定义警告处理程序,忽略所有警告
if (import.meta.env.VUE_APP_SILENCE_WARNINGS === true) {
app.config.warnHandler = () => {};
}
app.config.errorHandler = errorHandler;
// register the element Icons component

View File

@@ -16,6 +16,7 @@ declare type Recordable<T = any> = Record<string, T>;
declare interface ViteEnv {
VITE_USER_NODE_ENV: 'development' | 'production' | 'test';
VITE_GLOB_APP_TITLE: string;
VUE_APP_SILENCE_WARNINGS: boolean;
VITE_PORT: number;
VITE_OPEN: boolean;
VITE_REPORT: boolean;

View File

@@ -1,9 +1,9 @@
<template>
<div class='table-box'>
<ProTable
ref='proTable'
:columns='columns'
:data='userData'
ref='proTable'
:columns='columns'
:data='userData'
>
<!-- 表格 header 按钮 -->
<template #tableHeader='scope'>
@@ -17,7 +17,7 @@
</template>
<!-- 表格操作 -->
<template #operation='scope'>
<el-button v-if='scope.row.status === 1' type='primary' link :icon='View'
<el-button type='primary' link :icon='View'
@click="openDrawer('查看', scope.row)">查看
</el-button>
<el-button type='primary' link :icon='EditPen' @click="openDrawer('编辑', scope.row)">编辑</el-button>
@@ -89,8 +89,9 @@ const columns = reactive<ColumnProps<User.ResUserList>[]>([
{ type: 'index', fixed: 'left', width: 70, label: '序号' },
{
prop: 'username',
label: '用户姓名',
search: { el: 'input', tooltip: '我是搜索提示' },
label: '姓名',
width: 120,
search: { el: 'input'},
},
{
prop: 'gender',
@@ -107,39 +108,39 @@ const columns = reactive<ColumnProps<User.ResUserList>[]>([
// 自定义 search 显示内容
render: ({ searchParam }) => {
return (
<div class='flx-center'>
<el-input vModel_trim={searchParam.minAge} placeholder='最小年龄' />
<span class='mr10 ml10'>-</span>
<el-input vModel_trim={searchParam.maxAge} placeholder='最大年龄' />
</div>
<div class='flx-center'>
<el-input vModel_trim={searchParam.minAge} placeholder='最小年龄' />
<span class='mr10 ml10'>-</span>
<el-input vModel_trim={searchParam.maxAge} placeholder='最大年龄' />
</div>
)
},
},
},
{ prop: 'idCard', label: '身份证号', search: { el: 'input' } },
{ prop: 'email', label: '邮箱' },
{ prop: 'address', label: '居住地址' },
{ prop: 'address', label: '居住地址', width: 120 },
{
prop: 'status',
label: '用户状态',
label: '状态',
enum: dictStore.getDictData('status'),
search: { el: 'tree-select', props: { filterable: true } },
fieldNames: { label: 'userLabel', value: 'userStatus' },
render: scope => {
return (
<>
{BUTTONS.value.status ? (
<el-switch
model-value={scope.row.status}
active-text={scope.row.status ? '启用' : '禁用'}
active-value={1}
inactive-value={0}
onClick={() => changeStatus(scope.row)}
/>
) : (
<el-tag type={scope.row.status ? 'success' : 'danger'}>{scope.row.status ? '启用' : '禁用'}</el-tag>
)}
</>
<>
{BUTTONS.value.status ? (
<el-switch
model-value={scope.row.status}
active-text={scope.row.status ? '启用' : '禁用'}
active-value={1}
inactive-value={0}
onClick={() => changeStatus(scope.row)}
/>
) : (
<el-tag type={scope.row.status ? 'success' : 'danger'}>{scope.row.status ? '启用' : '禁用'}</el-tag>
)}
</>
)
},
},
@@ -150,7 +151,7 @@ const columns = reactive<ColumnProps<User.ResUserList>[]>([
search: {
el: 'date-picker',
span: 1,
props: { type: 'daterange', valueFormat: 'YYYY-MM-DD'},
props: { type: 'daterange', valueFormat: 'YYYY-MM-DD' },
defaultValue: ['2024-11-12', '2024-12-12'],
},
},
@@ -188,7 +189,7 @@ const changeStatus = async (row: User.ResUserList) => {
// 导出用户列表
const downloadFile = async () => {
ElMessageBox.confirm('确认导出用户数据?', '温馨提示', { type: 'warning' }).then(() =>
useDownload(exportUserInfo, '用户列表', proTable.value?.searchParam),
useDownload(exportUserInfo, '用户列表', proTable.value?.searchParam),
)
}