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(() => {
return other.globalComponentSize();
return themeConfig.value.globalComponentSize;
});
// 获取全局 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>
</div>
<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>
<el-badge :is-dot="hasUnreadNotice">
<el-icon :title="$t('message.user.title4')">
@ -243,7 +243,6 @@ const onComponentSizeChange = (size: string) => {
themeConfig.value.globalComponentSize = size;
Local.set('themeConfig', themeConfig.value);
initI18nOrSize('globalComponentSize', 'disabledSize');
window.location.reload();
};
// 语言切换

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

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

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

@ -2,6 +2,9 @@
/* Button 按钮
------------------------------- */
.el-button {
font-family: var(--el-font-family);
}
// 第三方字体图标大小
.el-button:not(.is-circle) i.el-icon,
.el-button i.iconfont,
@ -341,6 +344,7 @@
margin-right: 0;
padding: 8px;
background: var(--el-color-primary);
border-radius: var(--el-dialog-border-radius) var(--el-dialog-border-radius) 0 0;
}
.el-dialog__footer {
padding: 15px;
@ -359,6 +363,42 @@
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 卡片
------------------------------- */
.el-card__header {

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

@ -10,4 +10,7 @@ declare module 'axios' {
type?: string;
[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 'splitpanes';
declare module 'js-cookie';
declare module '@wangeditor/editor-for-vue';
declare module 'js-table2excel';
declare module 'qs';
declare module 'sortablejs';
// declare module '@wangeditor/editor-for-vue';
// declare module 'js-table2excel';
// declare module 'qs';
// declare module 'sortablejs';
declare module 'vue-plugin-hiprint';
declare module 'vcrontab-3';
declare module 'vue-signature-pad';
declare module 'vform3-builds';
declare module 'jwchat';
declare module 'crypto-js';
declare module '@liveqing/liveplayer-v3';
// 声明一个模块，防止引入文件时报错
declare module '*.json';
@ -34,7 +35,7 @@ declare module '*.vue' {
// 声明全局组件
declare module 'vue' {
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 要比较的对象二
* @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;
let aProps = Object.getOwnPropertyNames(a);
let bProps = Object.getOwnPropertyNames(b);
@ -44,18 +44,23 @@ export function isObjectValueEqual<T>(a: T, b: T): boolean {
/**
* 数组、数组对象去重
* 支持普通数组和对象数组去重，类型安全，且兼容原有所有调用方式
* @param arr 数组内容
* @param attr 需要去重的键值（数组对象）
* @returns
*/
export function removeDuplicate(arr: EmptyArrayType, attr?: string) {
if (!Object.keys(arr).length) {
export function removeDuplicate<T>(arr: T[], attr?: string): T[] {
if (!arr.length) {
return arr;
} else {
if (attr) {
const obj: EmptyObjectType = {};
return arr.reduce((cur: EmptyArrayType[], item: EmptyArrayType) => {
obj[item[attr]] ? '' : (obj[item[attr]] = true && item[attr] && cur.push(item));
const obj: Record<string, boolean> = {};
return arr.reduce((cur: T[], item: T) => {
const key = (item as any)[attr];
if (key && !obj[key]) {
obj[key] = true;
cur.push(item);
}
return cur;
}, []);
} else {

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

@ -1,6 +1,6 @@
import { useUserInfo } from '/@/stores/userInfo';
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 * as svg from '@element-plus/icons-vue';
// import 本地样式类名数组
import { iconfonntClassList } from '/@/theme/iconfont/font_2298093_rnp72ifj3ba.ts';
import { fontAwesomeClassList } from '/@/theme/font-awesome/font-awesome.ts';
import { iconfonntClassList } from '/@/theme/iconfont/font_2298093_rnp72ifj3ba';
import { fontAwesomeClassList } from '/@/theme/font-awesome/font-awesome';
// 获取阿里字体图标
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 => {
const stores = useThemeConfig(pinia);
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 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-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="name" label="名称" 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 label="选择模板" name="template" style="height: 700px">
<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="describe" label="描述" show-overflow-tooltip />
</el-table>

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

@ -2,7 +2,7 @@
<div class="sys-jobCluster-container">
<el-drawer v-model="state.isVisible" title="作业集群" size="65%">
<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="status" label="状态" align="center" show-overflow-tooltip>
<template #default="scope">

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

@ -57,7 +57,7 @@
</el-text>
</template>
<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="realName" label="姓名" />
</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-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="transactionId" label="支付订单号" width="220"></el-table-column>
<el-table-column prop="description" label="描述" width="180"></el-table-column>
@ -127,7 +127,7 @@
</div>
</template>
<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="transactionId" label="支付订单号" width="220"></el-table-column>
<el-table-column prop="refund" label="金额(分)" width="70"></el-table-column>