gaoxing/UNIVPLMDataIntegration
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

😎页面优化

Browse Source
This commit is contained in:
zuohuaijun 2025-08-28 20:55:23 +08:00
parent 329eead3fc
commit 9be596dbfd
15 changed files with 126 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
Web/src/App.vue
View File

@ -47,7 +47,7 @@ const setLockScreen = computed(() => {
// 获取全局组件大小 // 获取全局组件大小
const getGlobalComponentSize = computed(() => { const getGlobalComponentSize = computed(() => {
return other.globalComponentSize(); return themeConfig.value.globalComponentSize;
}); });
// 获取全局 i18n // 获取全局 i18n

3
Web/src/layout/navBars/topBar/user.vue
View File

@ -45,7 +45,7 @@
<i class="icon-skin iconfont" :title="$t('message.user.title3')"></i> <i class="icon-skin iconfont" :title="$t('message.user.title3')"></i>
</div> </div>
<div class="layout-navbars-breadcrumb-user-icon"> <div class="layout-navbars-breadcrumb-user-icon">
<el-popover placement="bottom" trigger="hover" transition="el-zoom-in-top" :width="300" :persistent="false"> <el-popover placement="bottom" trigger="hover" transition="el-zoom-in-top" :width="400" :persistent="false">
<template #reference> <template #reference>
<el-badge :is-dot="hasUnreadNotice"> <el-badge :is-dot="hasUnreadNotice">
<el-icon :title="$t('message.user.title4')"> <el-icon :title="$t('message.user.title4')">
@ -243,7 +243,6 @@ const onComponentSizeChange = (size: string) => {
themeConfig.value.globalComponentSize = size; themeConfig.value.globalComponentSize = size;
Local.set('themeConfig', themeConfig.value); Local.set('themeConfig', themeConfig.value);
initI18nOrSize('globalComponentSize', 'disabledSize'); initI18nOrSize('globalComponentSize', 'disabledSize');
window.location.reload();
}; };
// 语言切换 // 语言切换

74
Web/src/layout/navBars/topBar/userNews.vue
View File

@ -9,14 +9,20 @@
<div class="notice-box"> <div class="notice-box">
<template v-if="noticeList.length > 0"> <template v-if="noticeList.length > 0">
<div class="notice-item" v-for="(v, k) in noticeList" :key="k" @click="viewNoticeDetail(v)" v-show="v.readStatus == 1 ? false : true"> <div class="notice-item" v-for="(v, k) in noticeList" :key="k" @click="viewNoticeDetail(v)" v-show="v.readStatus == 1 ? false : true">
<div class="notice-title">{{ v.type == 1 ? '【' + $t('message.list.notice') + '】' : '【' + $t('message.list.announcement') + '】' }}{{ v.title }}</div> <div class="notice-item-icon">
<div class="notice-content">{{ removeHtmlSub(v.content) }}</div> <el-icon size="24" color="var(--el-color-primary)">
<ele-Notification v-if="v.type == 1" />
<div class="notice-time">{{ v.publicTime }}</div> <ele-Message v-else />
<el-divider border-style="dashed" style="margin: 10px 0" /> </el-icon>
</div>
<div>
<div class="notice-title">{{ v.title }}</div>
<div class="notice-content">{{ removeHtmlSub(v.content) }}</div>
<div class="notice-time">{{ v.publicTime }}</div>
</div>
</div> </div>
</template> </template>
<el-empty :description="$t('message.list.empty')" v-else></el-empty> <el-empty v-else :description="$t('message.list.empty')" style="height: 85%"></el-empty>
</div> </div>
<div class="notice-foot" @click="goToNotice" v-if="noticeList.length > 0">{{ $t('message.list.goToNotice') }}</div> <div class="notice-foot" @click="goToNotice" v-if="noticeList.length > 0">{{ $t('message.list.goToNotice') }}</div>
</el-tab-pane> </el-tab-pane>
@ -26,8 +32,8 @@
<el-icon><ele-Position /></el-icon> <el-icon><ele-Position /></el-icon>
<span style="margin-left: 5px">{{ $t('message.list.my') }}</span> <span style="margin-left: 5px">{{ $t('message.list.my') }}</span>
</template> </template>
<div style="height: 400px; overflow-y: auto; padding-right: 10px"> <div class="notice-box" style="height: 435px">
<el-empty :description="$t('message.list.empty')"></el-empty> <el-empty :description="$t('message.list.empty')" style="height: 85%"></el-empty>
</div> </div>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
@ -88,24 +94,43 @@ const viewNoticeDetail = async (notice: any) => {
font-size: 12px; font-size: 12px;
.notice-box { .notice-box {
height: 400px; height: 400px;
padding-right: 10px; // padding-right: 10px;
margin-bottom: 35px; // margin-bottom: 35px;
&:hover { // &:hover {
overflow-y: scroll; // overflow-y: scroll;
} // }
padding: 0 5px;
overflow-y: auto;
} }
.notice-item { .notice-item {
display: flex;
padding: 10px 0;
border-bottom: 1px dashed var(--el-border-color);
&-icon {
margin: 0 15px;
display: inline-flex;
justify-content: center;
align-items: center;
}
&:hover { &:hover {
background-color: rgba(#b8b8b8, 0.1); background-color: var(--el-color-primary-light-9);
cursor: pointer;
}
.notice-title {
font-size: 14px;
font-weight: 600;
//color: var(--el-color-primary);
} }
// .notice-title { // .notice-title {
// color: var(--el-color-primary); // color: var(--el-color-primary);
// } // }
.notice-content { .notice-content {
color: var(--el-text-color-secondary); color: var(--el-text-color-secondary);
margin-top: 3px; margin: 10px 0;
margin-bottom: 3px;
} }
.notice-time { .notice-time {
color: var(--el-text-color-secondary); color: var(--el-text-color-secondary);
@ -119,15 +144,24 @@ const viewNoticeDetail = async (notice: any) => {
color: var(--el-color-primary); color: var(--el-color-primary);
font-size: 14px; font-size: 14px;
cursor: pointer; cursor: pointer;
position: absolute; // position: absolute;
bottom: 0px; // bottom: 0px;
background-color: #fff; background-color: #fff;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
border-top: 1px solid #eee;
padding-top: 9px;
} }
} }
:deep(.el-dialog__body) { .el-tabs {
min-height: 700px !important; :deep(.el-tabs__header) {
margin: 0;
}
.el-tab-pane {
display: flex;
flex-direction: column;
}
} }
</style> </style>

40
Web/src/theme/element.scss
View File

@ -2,6 +2,9 @@
/* Button 按钮 /* Button 按钮
------------------------------- */ ------------------------------- */
.el-button {
font-family: var(--el-font-family);
}
// 第三方字体图标大小 // 第三方字体图标大小
.el-button:not(.is-circle) i.el-icon, .el-button:not(.is-circle) i.el-icon,
.el-button i.iconfont, .el-button i.iconfont,
@ -341,6 +344,7 @@
margin-right: 0; margin-right: 0;
padding: 8px; padding: 8px;
background: var(--el-color-primary); background: var(--el-color-primary);
border-radius: var(--el-dialog-border-radius) var(--el-dialog-border-radius) 0 0;
} }
.el-dialog__footer { .el-dialog__footer {
padding: 15px; padding: 15px;
@ -359,6 +363,42 @@
color: var(--el-color-danger) !important; color: var(--el-color-danger) !important;
} }
.el-tree {
--el-tree-node-content-height: 30px;
}
.el-table .el-table__cell {
&:has(.cell .el-button, .el-tag, .el-switch, .el-avatar) {
padding: 0;
.cell { text-overflow: clip; }
}
.el-button.is-text {
height: 20px;
}
.el-text--large {
font-size: var(--el-font-size-base);;
}
.el-button--large {
--el-button-size: 32px;
}
.el-tag--large {
height: 28px;
}
.el-button--default {
height: 28px;
}
.el-button [class*=el-icon]+span{
margin-left: 0;
}
}
.el-table [class*=el-table__row--level] .el-table__expand-icon {
height: 14px;
line-height: 14px;
width: 14px;
}
/* Card 卡片 /* Card 卡片
------------------------------- */ ------------------------------- */
.el-card__header { .el-card__header {

3
Web/src/types/axios.d.ts vendored
View File

@ -10,4 +10,7 @@ declare module 'axios' {
type?: string; type?: string;
[key: string]: T; [key: string]: T;
} }
export interface AxiosRequestConfig {
customCatch?: boolean;
}
} }

11
Web/src/types/global.d.ts vendored
View File

@ -5,16 +5,17 @@ declare module 'vue-grid-layout';
declare module 'qrcodejs2-fixes'; declare module 'qrcodejs2-fixes';
declare module 'splitpanes'; declare module 'splitpanes';
declare module 'js-cookie'; declare module 'js-cookie';
declare module '@wangeditor/editor-for-vue'; // declare module '@wangeditor/editor-for-vue';
declare module 'js-table2excel'; // declare module 'js-table2excel';
declare module 'qs'; // declare module 'qs';
declare module 'sortablejs'; // declare module 'sortablejs';
declare module 'vue-plugin-hiprint'; declare module 'vue-plugin-hiprint';
declare module 'vcrontab-3'; declare module 'vcrontab-3';
declare module 'vue-signature-pad'; declare module 'vue-signature-pad';
declare module 'vform3-builds'; declare module 'vform3-builds';
declare module 'jwchat'; declare module 'jwchat';
declare module 'crypto-js'; declare module 'crypto-js';
declare module '@liveqing/liveplayer-v3';
// 声明一个模块，防止引入文件时报错 // 声明一个模块，防止引入文件时报错
declare module '*.json'; declare module '*.json';
@ -34,7 +35,7 @@ declare module '*.vue' {
// 声明全局组件 // 声明全局组件
declare module 'vue' { declare module 'vue' {
export interface GlobalComponents { export interface GlobalComponents {
GSysDict: typeof sysDict GSysDict: typeof sysDict;
} }
} }

17
Web/src/utils/arrayOperation.ts
View File

@ -23,7 +23,7 @@ export function judgementSameArr(newArr: unknown[] | string[], oldArr: string[])
* @param b 要比较的对象二 * @param b 要比较的对象二
* @returns 相同返回 true，反之则反 * @returns 相同返回 true，反之则反
*/ */
export function isObjectValueEqual<T>(a: T, b: T): boolean { export function isObjectValueEqual<T extends Record<string, any>>(a: T, b: T): boolean {
if (!a || !b) return false; if (!a || !b) return false;
let aProps = Object.getOwnPropertyNames(a); let aProps = Object.getOwnPropertyNames(a);
let bProps = Object.getOwnPropertyNames(b); let bProps = Object.getOwnPropertyNames(b);
@ -44,18 +44,23 @@ export function isObjectValueEqual<T>(a: T, b: T): boolean {
/** /**
* 数组、数组对象去重 * 数组、数组对象去重
* 支持普通数组和对象数组去重，类型安全，且兼容原有所有调用方式
* @param arr 数组内容 * @param arr 数组内容
* @param attr 需要去重的键值（数组对象） * @param attr 需要去重的键值（数组对象）
* @returns * @returns
*/ */
export function removeDuplicate(arr: EmptyArrayType, attr?: string) { export function removeDuplicate<T>(arr: T[], attr?: string): T[] {
if (!Object.keys(arr).length) { if (!arr.length) {
return arr; return arr;
} else { } else {
if (attr) { if (attr) {
const obj: EmptyObjectType = {}; const obj: Record<string, boolean> = {};
return arr.reduce((cur: EmptyArrayType[], item: EmptyArrayType) => { return arr.reduce((cur: T[], item: T) => {
obj[item[attr]] ? '' : (obj[item[attr]] = true && item[attr] && cur.push(item)); const key = (item as any)[attr];
if (key && !obj[key]) {
obj[key] = true;
cur.push(item);
}
return cur; return cur;
}, []); }, []);
} else { } else {

2
Web/src/utils/authFunction.ts
View File

@ -1,6 +1,6 @@
import { useUserInfo } from '/@/stores/userInfo'; import { useUserInfo } from '/@/stores/userInfo';
import { judgementSameArr } from '/@/utils/arrayOperation'; import { judgementSameArr } from '/@/utils/arrayOperation';
import { resolveDirective, withDirectives } from 'vue'; import { resolveDirective, withDirectives, VNode } from 'vue';
/** /**
* 单个权限验证 * 单个权限验证

4
Web/src/utils/getStyleSheets.ts
View File

@ -1,8 +1,8 @@
import { nextTick } from 'vue'; import { nextTick } from 'vue';
import * as svg from '@element-plus/icons-vue'; import * as svg from '@element-plus/icons-vue';
// import 本地样式类名数组 // import 本地样式类名数组
import { iconfonntClassList } from '/@/theme/iconfont/font_2298093_rnp72ifj3ba.ts'; import { iconfonntClassList } from '/@/theme/iconfont/font_2298093_rnp72ifj3ba';
import { fontAwesomeClassList } from '/@/theme/font-awesome/font-awesome.ts'; import { fontAwesomeClassList } from '/@/theme/font-awesome/font-awesome';
// 获取阿里字体图标 // 获取阿里字体图标
const getAlicdnIconfont = () => { const getAlicdnIconfont = () => {

2
Web/src/utils/other.ts
View File

@ -102,7 +102,7 @@ export const lazyImg = (el: string, arr: EmptyArrayType) => {
export const globalComponentSize = (): string => { export const globalComponentSize = (): string => {
const stores = useThemeConfig(pinia); const stores = useThemeConfig(pinia);
const { themeConfig } = storeToRefs(stores); const { themeConfig } = storeToRefs(stores);
return Local.get('themeConfig')?.globalComponentSize || themeConfig.value?.globalComponentSize; return themeConfig.value.globalComponentSize;
}; };
/** /**

2
Web/src/views/approvalFlow/index.vue
View File

@ -39,7 +39,7 @@
</el-card> </el-card>
<el-card class="full-table" shadow="hover" style="margin-top: 5px"> <el-card class="full-table" shadow="hover" style="margin-top: 5px">
<el-table :data="state.tableData" style="width: 100%" v-loading="state.loading" row-key="id" border> <el-table :data="state.tableData" style="width: 100%" v-loading="state.loading" row-key="id" border>
<el-table-column type="index" label="序号" width="55" align="center" /> <el-table-column type="index" label="序号" width="65" align="center" />
<el-table-column prop="code" label="编号" width="140" show-overflow-tooltip /> <el-table-column prop="code" label="编号" width="140" show-overflow-tooltip />
<el-table-column prop="name" label="名称" show-overflow-tooltip /> <el-table-column prop="name" label="名称" show-overflow-tooltip />
<el-table-column prop="formJson" label="表单" align="center" show-overflow-tooltip> <el-table-column prop="formJson" label="表单" align="center" show-overflow-tooltip>

2
Web/src/views/system/codeGen/component/editCodeGenDialog.vue
View File

@ -333,7 +333,7 @@
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="选择模板" name="template" style="height: 700px"> <el-tab-pane label="选择模板" name="template" style="height: 700px">
<el-table ref="templateTableRef" :data="templateTableData" @selection-change="handleSelectionChange" style="width: 100%"> <el-table ref="templateTableRef" :data="templateTableData" @selection-change="handleSelectionChange" style="width: 100%">
<el-table-column type="selection" width="55" /> <el-table-column type="selection" width="65" />
<el-table-column property="name" label="模板文件名" width="280" /> <el-table-column property="name" label="模板文件名" width="280" />
<el-table-column property="describe" label="描述" show-overflow-tooltip /> <el-table-column property="describe" label="描述" show-overflow-tooltip />
</el-table> </el-table>

2
Web/src/views/system/job/component/jobCluster.vue
View File

@ -2,7 +2,7 @@
<div class="sys-jobCluster-container"> <div class="sys-jobCluster-container">
<el-drawer v-model="state.isVisible" title="作业集群" size="65%"> <el-drawer v-model="state.isVisible" title="作业集群" size="65%">
<el-table :data="state.jobClusterList" style="width: 100%" v-loading="state.loading" border> <el-table :data="state.jobClusterList" style="width: 100%" v-loading="state.loading" border>
<el-table-column type="index" label="序号" width="55" align="center" /> <el-table-column type="index" label="序号" width="65" align="center" />
<el-table-column prop="clusterId" label="集群编号" header-align="center" show-overflow-tooltip /> <el-table-column prop="clusterId" label="集群编号" header-align="center" show-overflow-tooltip />
<el-table-column prop="status" label="状态" align="center" show-overflow-tooltip> <el-table-column prop="status" label="状态" align="center" show-overflow-tooltip>
<template #default="scope"> <template #default="scope">

2
Web/src/views/system/pos/index.vue
View File

@ -57,7 +57,7 @@
</el-text> </el-text>
</template> </template>
<el-table :data="row.userList" stripe border> <el-table :data="row.userList" stripe border>
<el-table-column type="index" label="序号" width="55" align="center" /> <el-table-column type="index" label="序号" width="65" align="center" />
<el-table-column prop="account" label="账号" /> <el-table-column prop="account" label="账号" />
<el-table-column prop="realName" label="姓名" /> <el-table-column prop="realName" label="姓名" />
</el-table> </el-table>

4
Web/src/views/system/weChatPay/index.vue
View File

@ -31,7 +31,7 @@
<el-card class="full-table" shadow="hover" style="margin-top: 5px"> <el-card class="full-table" shadow="hover" style="margin-top: 5px">
<el-table :data="state.tableData" style="width: 100%" v-loading="state.loading" border> <el-table :data="state.tableData" style="width: 100%" v-loading="state.loading" border>
<el-table-column type="index" label="序号" width="55" align="center" /> <el-table-column type="index" label="序号" width="65" align="center" />
<el-table-column prop="outTradeNumber" label="商户订单号" width="180"></el-table-column> <el-table-column prop="outTradeNumber" label="商户订单号" width="180"></el-table-column>
<el-table-column prop="transactionId" label="支付订单号" width="220"></el-table-column> <el-table-column prop="transactionId" label="支付订单号" width="220"></el-table-column>
<el-table-column prop="description" label="描述" width="180"></el-table-column> <el-table-column prop="description" label="描述" width="180"></el-table-column>
@ -127,7 +127,7 @@
</div> </div>
</template> </template>
<el-table :data="subTableData" style="width: 100%" tooltip-effect="light" row-key="id" border> <el-table :data="subTableData" style="width: 100%" tooltip-effect="light" row-key="id" border>
<el-table-column type="index" label="序号" width="55" align="center" /> <el-table-column type="index" label="序号" width="65" align="center" />
<el-table-column prop="outRefundNumber" label="商户退款号" width="210"></el-table-column> <el-table-column prop="outRefundNumber" label="商户退款号" width="210"></el-table-column>
<el-table-column prop="transactionId" label="支付订单号" width="220"></el-table-column> <el-table-column prop="transactionId" label="支付订单号" width="220"></el-table-column>
<el-table-column prop="refund" label="金额(分)" width="70"></el-table-column> <el-table-column prop="refund" label="金额(分)" width="70"></el-table-column>