Skip to content

Commit 5ce9897

Browse files
shaohuzhang1wangdan-fit2cloud
shaohuzhang1
and
wangdan-fit2cloud
authored
perf: Optimize some styles (#3907)
* perf: Optimize packaging * perf: Optimize some styles --------- Co-authored-by: wangdan-fit2cloud <[email protected]>
1 parent a77da52 commit 5ce9897

File tree

19 files changed

+177
-133
lines changed

19 files changed

+177
-133
lines changed

‎ui/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@
4444
"screenfull": "^6.0.2",
4545
"sortablejs": "^1.15.6",
4646
"use-element-plus-theme": "^0.0.5",
47+
"vite-plugin-compression": "^0.5.1",
4748
"vite-plugin-html": "^3.2.2",
4849
"vue": "^3.5.13",
4950
"vue-clipboard3": "^2.0.0",

‎ui/src/components/folder-tree/index.vue‎

Lines changed: 14 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -8,19 +8,21 @@
88
class="p-8"
99
/>
1010
<div class="tree-height" :style="treeStyle">
11-
<div
12-
@click="handleSharedNodeClick"
13-
v-if="showShared && hasPermission(EditionConst.IS_EE, 'OR')"
14-
class="shared-button flex cursor border-b"
15-
:class="currentNodeKey === 'share' && 'active'"
16-
>
17-
<AppIcon
18-
iconName="app-shared-active"
19-
style="font-size: 18px"
20-
class="color-primary"
21-
></AppIcon>
22-
<span class="ml-8 lighter">{{ shareTitle }}</span>
11+
<div v-if="showShared && hasPermission(EditionConst.IS_EE, 'OR')" class="border-b mb-4">
12+
<div
13+
@click="handleSharedNodeClick"
14+
class="shared-button flex cursor"
15+
:class="currentNodeKey === 'share' && 'active'"
16+
>
17+
<AppIcon
18+
iconName="app-shared-active"
19+
style="font-size: 18px"
20+
class="color-primary"
21+
></AppIcon>
22+
<span class="ml-8 lighter">{{ shareTitle }}</span>
23+
</div>
2324
</div>
25+
2426
<el-scrollbar>
2527
<el-tree
2628
ref="treeRef"

‎ui/src/styles/app.scss‎

Lines changed: 5 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -468,12 +468,12 @@ h5 {
468468
}
469469
.success-tag {
470470
background: var(--tag-success-bg);
471-
color: var(--el-color-success);
471+
color: var(--tag-success-color);
472472
border: none;
473473
}
474474
.warning-tag {
475475
background: var(--tag-warning-bg);
476-
color: var(--el-color-warning);
476+
color: var(--tag-warning-color);
477477
border: none;
478478
}
479479

@@ -483,16 +483,10 @@ h5 {
483483
border: none;
484484
}
485485

486-
.purple-tag {
487-
background: #f2ebfe;
488-
color: #7f3bf5;
489-
border-color: #e0d7f0;
490-
}
491-
492486
.blue-tag {
493-
background: #ebf1ff;
494-
color: #3370ff;
495-
border-color: #d6e2ff;
487+
background: var(--tag-default-bg);
488+
color: var(--tag-default-color);
489+
border: none;
496490
}
497491

498492
// 蓝色提示框

‎ui/src/styles/element-plus.scss‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -280,7 +280,9 @@
280280

281281
// el-tag
282282
.el-tag {
283-
padding: 0 6px;
283+
padding: 0 4px;
284+
height: 20px;
285+
font-weight: 400;
284286
}
285287

286288
// el-input

‎ui/src/views/application-workflow/component/NodeContent.vue‎

Lines changed: 45 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,38 @@
11
<template>
2-
<el-input v-model.trim="filterText" :placeholder="$t('common.search')" prefix-icon="Search"
3-
clearable
4-
style="padding: 12px 12px 0 12px;"/>
2+
<el-input
3+
v-model.trim="filterText"
4+
:placeholder="$t('common.search')"
5+
prefix-icon="Search"
6+
clearable
7+
style="padding: 12px 12px 0 12px"
8+
/>
59
<div class="list flex-wrap">
610
<template v-if="filterList.length">
7-
<el-popover v-for="item in filterList" :key="item.id" placement="right" :width="280"
8-
:show-after="500">
11+
<el-popover
12+
v-for="item in filterList"
13+
:key="item.id"
14+
placement="right"
15+
:width="280"
16+
:show-after="500"
17+
>
918
<template #reference>
10-
<div class="list-item flex align-center border border-r-6 p-8-12 cursor"
11-
style="width: calc(50% - 6px)"
12-
@click.stop="emit('clickNodes', item)" @mousedown.stop="emit('onmousedown', item)">
19+
<div
20+
class="list-item flex align-center border border-r-6 p-8-12 cursor"
21+
style="width: calc(50% - 6px)"
22+
@click.stop="emit('clickNodes', item)"
23+
@mousedown.stop="emit('onmousedown', item)"
24+
>
1325
<!-- <LogoIcon v-if="item.resource_type === 'application'" height="32px" />-->
14-
<el-avatar v-if="isAppIcon(item?.icon)" shape="square" :size="32"
15-
style="background: none">
16-
<img :src="resetUrl(item?.icon,resetUrl('./favicon.ico'))" alt=""/>
26+
<el-avatar
27+
v-if="isAppIcon(item?.icon)"
28+
shape="square"
29+
:size="32"
30+
style="background: none"
31+
>
32+
<img :src="resetUrl(item?.icon, resetUrl('./favicon.ico'))" alt="" />
1733
</el-avatar>
1834
<el-avatar v-else class="avatar-green" shape="square" :size="32">
19-
<img src="@/assets/workflow/icon_tool.svg" style="width: 58%" alt=""/>
35+
<img src="@/assets/workflow/icon_tool.svg" style="width: 58%" alt="" />
2036
</el-avatar>
2137
<span class="ml-8 ellipsis" :title="item.name">{{ item.name }}</span>
2238
</div>
@@ -26,20 +42,24 @@
2642
<div class="flex-between">
2743
<div class="flex align-center">
2844
<!-- <LogoIcon v-if="item.resource_type === 'application'" height="32px"/>-->
29-
<el-avatar v-if="isAppIcon(item?.icon)" shape="square" :size="32"
30-
style="background: none">
31-
<img :src="resetUrl(item?.icon,resetUrl('./favicon.ico'))" alt=""/>
45+
<el-avatar
46+
v-if="isAppIcon(item?.icon)"
47+
shape="square"
48+
:size="32"
49+
style="background: none"
50+
>
51+
<img :src="resetUrl(item?.icon, resetUrl('./favicon.ico'))" alt="" />
3252
</el-avatar>
3353
<el-avatar v-else class="avatar-green" shape="square" :size="32">
34-
<img src="@/assets/workflow/icon_tool.svg" style="width: 58%" alt=""/>
54+
<img src="@/assets/workflow/icon_tool.svg" style="width: 58%" alt="" />
3555
</el-avatar>
3656
<span class="font-medium ml-8 break-all" :title="item.name">{{ item.name }}</span>
3757
</div>
3858
<div v-if="item.type" class="status-tag" style="margin-left: auto">
39-
<el-tag type="warning" v-if="isWorkFlow(item.type)" style="height: 22px">
59+
<el-tag class="warning-tag" v-if="isWorkFlow(item.type)">
4060
{{ $t('views.application.workflow') }}
4161
</el-tag>
42-
<el-tag class="blue-tag" v-else style="height: 22px">
62+
<el-tag class="blue-tag" v-else>
4363
{{ $t('views.application.simple') }}
4464
</el-tag>
4565
</div>
@@ -48,23 +68,23 @@
4868
</template>
4969
</el-popover>
5070
</template>
51-
<el-empty v-else :description="$t('common.noData')"/>
71+
<el-empty v-else :description="$t('common.noData')" />
5272
</div>
5373
</template>
5474

5575
<script setup lang="ts">
56-
import {watch, ref} from 'vue'
57-
import {isAppIcon, resetUrl} from '@/utils/common'
58-
import {isWorkFlow} from '@/utils/application'
76+
import { watch, ref } from 'vue'
77+
import { isAppIcon, resetUrl } from '@/utils/common'
78+
import { isWorkFlow } from '@/utils/application'
5979
6080
const props = defineProps<{
6181
list: any[]
6282
}>()
6383
6484
const emit = defineEmits<{
65-
(e: 'clickNodes', item: any): void;
66-
(e: 'onmousedown', item: any): void;
67-
}>();
85+
(e: 'clickNodes', item: any): void
86+
(e: 'onmousedown', item: any): void
87+
}>()
6888
6989
const filterText = ref('')
7090
const filterList = ref<any[]>([])

‎ui/src/views/application-workflow/component/PublishHistory.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@
1515
<template #default="{ row, index }">
1616
<div class="flex-between">
1717
<div style="max-width: 80%">
18-
<h5 :class="index === 0 ? 'primary' : ''" class="flex">
18+
<h5 :class="index === 0 ? 'primary' : ''" class="flex align-center">
1919
<ReadWrite
2020
@change="editName($event, row)"
2121
:data="row.name || datetimeFormat(row.update_time)"
@@ -27,7 +27,7 @@
2727
$t('views.applicationWorkflow.setting.latestRelease')
2828
}}</el-tag>
2929
</h5>
30-
<el-text type="info" class="color-secondary flex mt-8">
30+
<el-text type="info" class="color-secondary flex align-center mt-8">
3131
<el-avatar :size="20" class="avatar-grey mr-4">
3232
<el-icon><UserFilled /></el-icon>
3333
</el-avatar>

‎ui/src/views/application/index.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -133,10 +133,10 @@
133133
</el-text>
134134
</template>
135135
<template #tag>
136-
<el-tag type="warning" v-if="isWorkFlow(item.type)" style="height: 22px">
136+
<el-tag v-if="isWorkFlow(item.type)" class="warning-tag">
137137
{{ $t('views.application.workflow') }}
138138
</el-tag>
139-
<el-tag class="blue-tag" v-else style="height: 22px">
139+
<el-tag class="blue-tag" v-else>
140140
{{ $t('views.application.simple') }}
141141
</el-tag>
142142
</template>

‎ui/src/views/document/UploadDocument.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<template>
22
<div class="upload-document p-12-24">
33
<div class="flex align-center mb-16">
4-
<back-button to="-1" style="margin-left: -4px"></back-button>
4+
<back-button @click="back" style="margin-left: -4px"></back-button>
55
<h3 style="display: inline-block">{{ $t('views.document.uploadDocument') }}</h3>
66
</div>
77
<el-card style="--el-card-padding: 0">

‎ui/src/views/document/index.vue‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -108,7 +108,7 @@
108108
</div>
109109
<app-table
110110
ref="multipleTableRef"
111-
class="mt-16"
111+
class="mt-16 document-table"
112112
:data="documentData"
113113
:pagination-config="paginationConfig"
114114
:quick-create="
@@ -1206,5 +1206,10 @@ onBeforeUnmount(() => {
12061206
z-index: 22;
12071207
box-shadow: 0px -2px 4px 0px rgba(31, 35, 41, 0.08);
12081208
}
1209+
.document-table {
1210+
:deep(.el-table__row) {
1211+
cursor: pointer;
1212+
}
1213+
}
12091214
}
12101215
</style>

‎ui/src/views/system-chat-user/authentication/component/LDAP.vue‎

Lines changed: 34 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -66,18 +66,26 @@
6666
</el-form>
6767

6868
<div>
69-
<el-button @click="submit(authFormRef, 'test')" :disabled="loading">
70-
{{ $t('views.system.test') }}</el-button
71-
>
72-
<el-button @click="submit(authFormRef)" type="primary" :disabled="loading"
69+
<span
7370
v-hasPermission="
74-
new ComplexPermission(
75-
[RoleConst.ADMIN],
76-
[PermissionConst.CHAT_USER_AUTH_EDIT],
77-
[],'OR',)"
71+
new ComplexPermission(
72+
[RoleConst.ADMIN],
73+
[PermissionConst.CHAT_USER_AUTH_EDIT],
74+
[],
75+
'OR',
76+
)
77+
"
78+
class="mr-12"
7879
>
79-
{{ $t('common.save') }}
80-
</el-button>
80+
<el-button @click="submit(authFormRef)" type="primary" :disabled="loading">
81+
{{ $t('common.save') }}
82+
</el-button>
83+
</span>
84+
<span>
85+
<el-button @click="submit(authFormRef, 'test')" :disabled="loading">
86+
{{ $t('views.system.test') }}
87+
</el-button>
88+
</span>
8189
</div>
8290
</div>
8391
</el-scrollbar>
@@ -101,9 +109,9 @@ const form = ref<any>({
101109
password: '',
102110
ou: '',
103111
ldap_filter: '',
104-
ldap_mapping: ''
112+
ldap_mapping: '',
105113
},
106-
is_active: true
114+
is_active: true,
107115
})
108116
109117
const authFormRef = ref()
@@ -115,44 +123,44 @@ const rules = reactive<FormRules<any>>({
115123
{
116124
required: true,
117125
message: t('views.system.authentication.ldap.serverPlaceholder'),
118-
trigger: 'blur'
119-
}
126+
trigger: 'blur',
127+
},
120128
],
121129
'config.base_dn': [
122130
{
123131
required: true,
124132
message: t('views.system.authentication.ldap.bindDNPlaceholder'),
125-
trigger: 'blur'
126-
}
133+
trigger: 'blur',
134+
},
127135
],
128136
'config.password': [
129137
{
130138
required: true,
131139
message: t('views.login.loginForm.password.placeholder'),
132-
trigger: 'blur'
133-
}
140+
trigger: 'blur',
141+
},
134142
],
135143
'config.ou': [
136144
{
137145
required: true,
138146
message: t('views.system.authentication.ldap.ouPlaceholder'),
139-
trigger: 'blur'
140-
}
147+
trigger: 'blur',
148+
},
141149
],
142150
'config.ldap_filter': [
143151
{
144152
required: true,
145153
message: t('views.system.authentication.ldap.ldap_filterPlaceholder'),
146-
trigger: 'blur'
147-
}
154+
trigger: 'blur',
155+
},
148156
],
149157
'config.ldap_mapping': [
150158
{
151159
required: true,
152160
message: t('views.system.authentication.ldap.ldap_mappingPlaceholder'),
153-
trigger: 'blur'
154-
}
155-
]
161+
trigger: 'blur',
162+
},
163+
],
156164
})
157165
158166
const submit = async (formEl: FormInstance | undefined, test?: string) => {
@@ -177,9 +185,7 @@ function getDetail() {
177185
if (res.data && JSON.stringify(res.data) !== '{}') {
178186
form.value = res.data
179187
if (res.data.config.ldap_mapping) {
180-
form.value.config.ldap_mapping = JSON.stringify(
181-
JSON.parse(res.data.config.ldap_mapping)
182-
)
188+
form.value.config.ldap_mapping = JSON.stringify(JSON.parse(res.data.config.ldap_mapping))
183189
}
184190
}
185191
})

0 commit comments

Comments
 (0)