perf: Optimize some styles (#3907)

* perf: Optimize packaging

* perf: Optimize some styles

---------

Co-authored-by: wangdan-fit2cloud <dan.wang@fit2cloud.com>
v3.2
shaohuzhang1 2025-08-21 15:40:22 +08:00 committed by GitHub
parent a77da52ad4
commit 5ce9897bca
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
19 changed files with 177 additions and 133 deletions

View File

@ -44,6 +44,7 @@
"screenfull": "^6.0.2", "screenfull": "^6.0.2",
"sortablejs": "^1.15.6", "sortablejs": "^1.15.6",
"use-element-plus-theme": "^0.0.5", "use-element-plus-theme": "^0.0.5",
"vite-plugin-compression": "^0.5.1",
"vite-plugin-html": "^3.2.2", "vite-plugin-html": "^3.2.2",
"vue": "^3.5.13", "vue": "^3.5.13",
"vue-clipboard3": "^2.0.0", "vue-clipboard3": "^2.0.0",

View File

@ -8,19 +8,21 @@
class="p-8" class="p-8"
/> />
<div class="tree-height" :style="treeStyle"> <div class="tree-height" :style="treeStyle">
<div <div v-if="showShared && hasPermission(EditionConst.IS_EE, 'OR')" class="border-b mb-4">
@click="handleSharedNodeClick" <div
v-if="showShared && hasPermission(EditionConst.IS_EE, 'OR')" @click="handleSharedNodeClick"
class="shared-button flex cursor border-b" class="shared-button flex cursor"
:class="currentNodeKey === 'share' && 'active'" :class="currentNodeKey === 'share' && 'active'"
> >
<AppIcon <AppIcon
iconName="app-shared-active" iconName="app-shared-active"
style="font-size: 18px" style="font-size: 18px"
class="color-primary" class="color-primary"
></AppIcon> ></AppIcon>
<span class="ml-8 lighter">{{ shareTitle }}</span> <span class="ml-8 lighter">{{ shareTitle }}</span>
</div>
</div> </div>
<el-scrollbar> <el-scrollbar>
<el-tree <el-tree
ref="treeRef" ref="treeRef"

View File

@ -468,12 +468,12 @@ h5 {
} }
.success-tag { .success-tag {
background: var(--tag-success-bg); background: var(--tag-success-bg);
color: var(--el-color-success); color: var(--tag-success-color);
border: none; border: none;
} }
.warning-tag { .warning-tag {
background: var(--tag-warning-bg); background: var(--tag-warning-bg);
color: var(--el-color-warning); color: var(--tag-warning-color);
border: none; border: none;
} }
@ -483,16 +483,10 @@ h5 {
border: none; border: none;
} }
.purple-tag {
background: #f2ebfe;
color: #7f3bf5;
border-color: #e0d7f0;
}
.blue-tag { .blue-tag {
background: #ebf1ff; background: var(--tag-default-bg);
color: #3370ff; color: var(--tag-default-color);
border-color: #d6e2ff; border: none;
} }
// //

View File

@ -280,7 +280,9 @@
// el-tag // el-tag
.el-tag { .el-tag {
padding: 0 6px; padding: 0 4px;
height: 20px;
font-weight: 400;
} }
// el-input // el-input

View File

@ -1,22 +1,38 @@
<template> <template>
<el-input v-model.trim="filterText" :placeholder="$t('common.search')" prefix-icon="Search" <el-input
clearable v-model.trim="filterText"
style="padding: 12px 12px 0 12px;"/> :placeholder="$t('common.search')"
prefix-icon="Search"
clearable
style="padding: 12px 12px 0 12px"
/>
<div class="list flex-wrap"> <div class="list flex-wrap">
<template v-if="filterList.length"> <template v-if="filterList.length">
<el-popover v-for="item in filterList" :key="item.id" placement="right" :width="280" <el-popover
:show-after="500"> v-for="item in filterList"
:key="item.id"
placement="right"
:width="280"
:show-after="500"
>
<template #reference> <template #reference>
<div class="list-item flex align-center border border-r-6 p-8-12 cursor" <div
style="width: calc(50% - 6px)" class="list-item flex align-center border border-r-6 p-8-12 cursor"
@click.stop="emit('clickNodes', item)" @mousedown.stop="emit('onmousedown', item)"> style="width: calc(50% - 6px)"
@click.stop="emit('clickNodes', item)"
@mousedown.stop="emit('onmousedown', item)"
>
<!-- <LogoIcon v-if="item.resource_type === 'application'" height="32px" />--> <!-- <LogoIcon v-if="item.resource_type === 'application'" height="32px" />-->
<el-avatar v-if="isAppIcon(item?.icon)" shape="square" :size="32" <el-avatar
style="background: none"> v-if="isAppIcon(item?.icon)"
<img :src="resetUrl(item?.icon,resetUrl('./favicon.ico'))" alt=""/> shape="square"
:size="32"
style="background: none"
>
<img :src="resetUrl(item?.icon, resetUrl('./favicon.ico'))" alt="" />
</el-avatar> </el-avatar>
<el-avatar v-else class="avatar-green" shape="square" :size="32"> <el-avatar v-else class="avatar-green" shape="square" :size="32">
<img src="@/assets/workflow/icon_tool.svg" style="width: 58%" alt=""/> <img src="@/assets/workflow/icon_tool.svg" style="width: 58%" alt="" />
</el-avatar> </el-avatar>
<span class="ml-8 ellipsis" :title="item.name">{{ item.name }}</span> <span class="ml-8 ellipsis" :title="item.name">{{ item.name }}</span>
</div> </div>
@ -26,20 +42,24 @@
<div class="flex-between"> <div class="flex-between">
<div class="flex align-center"> <div class="flex align-center">
<!-- <LogoIcon v-if="item.resource_type === 'application'" height="32px"/>--> <!-- <LogoIcon v-if="item.resource_type === 'application'" height="32px"/>-->
<el-avatar v-if="isAppIcon(item?.icon)" shape="square" :size="32" <el-avatar
style="background: none"> v-if="isAppIcon(item?.icon)"
<img :src="resetUrl(item?.icon,resetUrl('./favicon.ico'))" alt=""/> shape="square"
:size="32"
style="background: none"
>
<img :src="resetUrl(item?.icon, resetUrl('./favicon.ico'))" alt="" />
</el-avatar> </el-avatar>
<el-avatar v-else class="avatar-green" shape="square" :size="32"> <el-avatar v-else class="avatar-green" shape="square" :size="32">
<img src="@/assets/workflow/icon_tool.svg" style="width: 58%" alt=""/> <img src="@/assets/workflow/icon_tool.svg" style="width: 58%" alt="" />
</el-avatar> </el-avatar>
<span class="font-medium ml-8 break-all" :title="item.name">{{ item.name }}</span> <span class="font-medium ml-8 break-all" :title="item.name">{{ item.name }}</span>
</div> </div>
<div v-if="item.type" class="status-tag" style="margin-left: auto"> <div v-if="item.type" class="status-tag" style="margin-left: auto">
<el-tag type="warning" v-if="isWorkFlow(item.type)" style="height: 22px"> <el-tag class="warning-tag" v-if="isWorkFlow(item.type)">
{{ $t('views.application.workflow') }} {{ $t('views.application.workflow') }}
</el-tag> </el-tag>
<el-tag class="blue-tag" v-else style="height: 22px"> <el-tag class="blue-tag" v-else>
{{ $t('views.application.simple') }} {{ $t('views.application.simple') }}
</el-tag> </el-tag>
</div> </div>
@ -48,23 +68,23 @@
</template> </template>
</el-popover> </el-popover>
</template> </template>
<el-empty v-else :description="$t('common.noData')"/> <el-empty v-else :description="$t('common.noData')" />
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import {watch, ref} from 'vue' import { watch, ref } from 'vue'
import {isAppIcon, resetUrl} from '@/utils/common' import { isAppIcon, resetUrl } from '@/utils/common'
import {isWorkFlow} from '@/utils/application' import { isWorkFlow } from '@/utils/application'
const props = defineProps<{ const props = defineProps<{
list: any[] list: any[]
}>() }>()
const emit = defineEmits<{ const emit = defineEmits<{
(e: 'clickNodes', item: any): void; (e: 'clickNodes', item: any): void
(e: 'onmousedown', item: any): void; (e: 'onmousedown', item: any): void
}>(); }>()
const filterText = ref('') const filterText = ref('')
const filterList = ref<any[]>([]) const filterList = ref<any[]>([])

View File

@ -15,7 +15,7 @@
<template #default="{ row, index }"> <template #default="{ row, index }">
<div class="flex-between"> <div class="flex-between">
<div style="max-width: 80%"> <div style="max-width: 80%">
<h5 :class="index === 0 ? 'primary' : ''" class="flex"> <h5 :class="index === 0 ? 'primary' : ''" class="flex align-center">
<ReadWrite <ReadWrite
@change="editName($event, row)" @change="editName($event, row)"
:data="row.name || datetimeFormat(row.update_time)" :data="row.name || datetimeFormat(row.update_time)"
@ -27,7 +27,7 @@
$t('views.applicationWorkflow.setting.latestRelease') $t('views.applicationWorkflow.setting.latestRelease')
}}</el-tag> }}</el-tag>
</h5> </h5>
<el-text type="info" class="color-secondary flex mt-8"> <el-text type="info" class="color-secondary flex align-center mt-8">
<el-avatar :size="20" class="avatar-grey mr-4"> <el-avatar :size="20" class="avatar-grey mr-4">
<el-icon><UserFilled /></el-icon> <el-icon><UserFilled /></el-icon>
</el-avatar> </el-avatar>

View File

@ -133,10 +133,10 @@
</el-text> </el-text>
</template> </template>
<template #tag> <template #tag>
<el-tag type="warning" v-if="isWorkFlow(item.type)" style="height: 22px"> <el-tag v-if="isWorkFlow(item.type)" class="warning-tag">
{{ $t('views.application.workflow') }} {{ $t('views.application.workflow') }}
</el-tag> </el-tag>
<el-tag class="blue-tag" v-else style="height: 22px"> <el-tag class="blue-tag" v-else>
{{ $t('views.application.simple') }} {{ $t('views.application.simple') }}
</el-tag> </el-tag>
</template> </template>

View File

@ -1,7 +1,7 @@
<template> <template>
<div class="upload-document p-12-24"> <div class="upload-document p-12-24">
<div class="flex align-center mb-16"> <div class="flex align-center mb-16">
<back-button to="-1" style="margin-left: -4px"></back-button> <back-button @click="back" style="margin-left: -4px"></back-button>
<h3 style="display: inline-block">{{ $t('views.document.uploadDocument') }}</h3> <h3 style="display: inline-block">{{ $t('views.document.uploadDocument') }}</h3>
</div> </div>
<el-card style="--el-card-padding: 0"> <el-card style="--el-card-padding: 0">

View File

@ -108,7 +108,7 @@
</div> </div>
<app-table <app-table
ref="multipleTableRef" ref="multipleTableRef"
class="mt-16" class="mt-16 document-table"
:data="documentData" :data="documentData"
:pagination-config="paginationConfig" :pagination-config="paginationConfig"
:quick-create=" :quick-create="
@ -1206,5 +1206,10 @@ onBeforeUnmount(() => {
z-index: 22; z-index: 22;
box-shadow: 0px -2px 4px 0px rgba(31, 35, 41, 0.08); box-shadow: 0px -2px 4px 0px rgba(31, 35, 41, 0.08);
} }
.document-table {
:deep(.el-table__row) {
cursor: pointer;
}
}
} }
</style> </style>

View File

@ -66,18 +66,26 @@
</el-form> </el-form>
<div> <div>
<el-button @click="submit(authFormRef, 'test')" :disabled="loading"> <span
{{ $t('views.system.test') }}</el-button
>
<el-button @click="submit(authFormRef)" type="primary" :disabled="loading"
v-hasPermission=" v-hasPermission="
new ComplexPermission( new ComplexPermission(
[RoleConst.ADMIN], [RoleConst.ADMIN],
[PermissionConst.CHAT_USER_AUTH_EDIT], [PermissionConst.CHAT_USER_AUTH_EDIT],
[],'OR',)" [],
'OR',
)
"
class="mr-12"
> >
{{ $t('common.save') }} <el-button @click="submit(authFormRef)" type="primary" :disabled="loading">
</el-button> {{ $t('common.save') }}
</el-button>
</span>
<span>
<el-button @click="submit(authFormRef, 'test')" :disabled="loading">
{{ $t('views.system.test') }}
</el-button>
</span>
</div> </div>
</div> </div>
</el-scrollbar> </el-scrollbar>
@ -101,9 +109,9 @@ const form = ref<any>({
password: '', password: '',
ou: '', ou: '',
ldap_filter: '', ldap_filter: '',
ldap_mapping: '' ldap_mapping: '',
}, },
is_active: true is_active: true,
}) })
const authFormRef = ref() const authFormRef = ref()
@ -115,44 +123,44 @@ const rules = reactive<FormRules<any>>({
{ {
required: true, required: true,
message: t('views.system.authentication.ldap.serverPlaceholder'), message: t('views.system.authentication.ldap.serverPlaceholder'),
trigger: 'blur' trigger: 'blur',
} },
], ],
'config.base_dn': [ 'config.base_dn': [
{ {
required: true, required: true,
message: t('views.system.authentication.ldap.bindDNPlaceholder'), message: t('views.system.authentication.ldap.bindDNPlaceholder'),
trigger: 'blur' trigger: 'blur',
} },
], ],
'config.password': [ 'config.password': [
{ {
required: true, required: true,
message: t('views.login.loginForm.password.placeholder'), message: t('views.login.loginForm.password.placeholder'),
trigger: 'blur' trigger: 'blur',
} },
], ],
'config.ou': [ 'config.ou': [
{ {
required: true, required: true,
message: t('views.system.authentication.ldap.ouPlaceholder'), message: t('views.system.authentication.ldap.ouPlaceholder'),
trigger: 'blur' trigger: 'blur',
} },
], ],
'config.ldap_filter': [ 'config.ldap_filter': [
{ {
required: true, required: true,
message: t('views.system.authentication.ldap.ldap_filterPlaceholder'), message: t('views.system.authentication.ldap.ldap_filterPlaceholder'),
trigger: 'blur' trigger: 'blur',
} },
], ],
'config.ldap_mapping': [ 'config.ldap_mapping': [
{ {
required: true, required: true,
message: t('views.system.authentication.ldap.ldap_mappingPlaceholder'), message: t('views.system.authentication.ldap.ldap_mappingPlaceholder'),
trigger: 'blur' trigger: 'blur',
} },
] ],
}) })
const submit = async (formEl: FormInstance | undefined, test?: string) => { const submit = async (formEl: FormInstance | undefined, test?: string) => {
@ -177,9 +185,7 @@ function getDetail() {
if (res.data && JSON.stringify(res.data) !== '{}') { if (res.data && JSON.stringify(res.data) !== '{}') {
form.value = res.data form.value = res.data
if (res.data.config.ldap_mapping) { if (res.data.config.ldap_mapping) {
form.value.config.ldap_mapping = JSON.stringify( form.value.config.ldap_mapping = JSON.stringify(JSON.parse(res.data.config.ldap_mapping))
JSON.parse(res.data.config.ldap_mapping)
)
} }
} }
}) })

View File

@ -34,7 +34,7 @@
<div v-if="item.isValid" class="border-t mt-16"> <div v-if="item.isValid" class="border-t mt-16">
<el-row :gutter="12" class="mt-16"> <el-row :gutter="12" class="mt-16">
<el-col v-for="(value, key) in item.config" :key="key" :span="12"> <el-col v-for="(value, key) in item.config" :key="key" :span="12">
<el-text type="info" class="lighter">{{ formatFieldName(key, item) }}</el-text> <el-text class="color-secondary lighter">{{ formatFieldName(key, item) }}</el-text>
<div class="mt-4 mb-16 flex align-center"> <div class="mt-4 mb-16 flex align-center">
<span <span
v-if="key !== 'app_secret'" v-if="key !== 'app_secret'"

View File

@ -67,10 +67,10 @@
width="160" width="160"
> >
<template #default="scope"> <template #default="scope">
<el-tag type="warning" v-if="isWorkFlow(scope.row.type)" style="height: 22px"> <el-tag class="warning-tag" v-if="isWorkFlow(scope.row.type)">
{{ $t('views.application.workflow') }} {{ $t('views.application.workflow') }}
</el-tag> </el-tag>
<el-tag class="blue-tag" v-else style="height: 22px"> <el-tag class="blue-tag" v-else>
{{ $t('views.application.simple') }} {{ $t('views.application.simple') }}
</el-tag> </el-tag>
</template> </template>
@ -255,7 +255,7 @@
</span> </span>
</el-tooltip> </el-tooltip>
<el-dropdown trigger="click" v-if="MoreFilledPermission()"> <el-dropdown trigger="click" v-if="MoreFilledPermission()">
<el-button text @click.stop> <el-button text @click.stop type="primary">
<AppIcon iconName="app-more"></AppIcon> <AppIcon iconName="app-more"></AppIcon>
</el-button> </el-button>
<template #dropdown> <template #dropdown>

View File

@ -186,7 +186,7 @@
</span> </span>
</el-tooltip> </el-tooltip>
<el-dropdown trigger="click" v-if="MoreFilledPermission()"> <el-dropdown trigger="click" v-if="MoreFilledPermission()">
<el-button text @click.stop> <el-button text @click.stop type="primary">
<AppIcon iconName="app-more"></AppIcon> <AppIcon iconName="app-more"></AppIcon>
</el-button> </el-button>
<template #dropdown> <template #dropdown>

View File

@ -239,7 +239,7 @@
</span> </span>
</el-tooltip> </el-tooltip>
<el-dropdown trigger="click" v-if="MoreFilledPermission(row)"> <el-dropdown trigger="click" v-if="MoreFilledPermission(row)">
<el-button text @click.stop> <el-button text @click.stop type="primary">
<AppIcon iconName="app-more"></AppIcon> <AppIcon iconName="app-more"></AppIcon>
</el-button> </el-button>
<template #dropdown> <template #dropdown>

View File

@ -66,18 +66,21 @@
</el-form> </el-form>
<div> <div>
<el-button @click="submit(authFormRef, 'test')" :disabled="loading"> <span
{{ $t('views.system.test') }}</el-button
>
<el-button @click="submit(authFormRef)" type="primary" :disabled="loading"
v-hasPermission=" v-hasPermission="
new ComplexPermission( new ComplexPermission([RoleConst.ADMIN], [PermissionConst.LOGIN_AUTH_EDIT], [], 'OR')
[RoleConst.ADMIN], "
[PermissionConst.LOGIN_AUTH_EDIT], class="mr-12"
[],'OR',)"
> >
{{ $t('common.save') }} <el-button @click="submit(authFormRef)" type="primary" :disabled="loading">
</el-button> {{ $t('common.save') }}
</el-button>
</span>
<span>
<el-button @click="submit(authFormRef, 'test')" :disabled="loading">
{{ $t('views.system.test') }}</el-button
>
</span>
</div> </div>
</div> </div>
</el-scrollbar> </el-scrollbar>
@ -101,9 +104,9 @@ const form = ref<any>({
password: '', password: '',
ou: '', ou: '',
ldap_filter: '', ldap_filter: '',
ldap_mapping: '' ldap_mapping: '',
}, },
is_active: true is_active: true,
}) })
const authFormRef = ref() const authFormRef = ref()
@ -115,44 +118,44 @@ const rules = reactive<FormRules<any>>({
{ {
required: true, required: true,
message: t('views.system.authentication.ldap.serverPlaceholder'), message: t('views.system.authentication.ldap.serverPlaceholder'),
trigger: 'blur' trigger: 'blur',
} },
], ],
'config.base_dn': [ 'config.base_dn': [
{ {
required: true, required: true,
message: t('views.system.authentication.ldap.bindDNPlaceholder'), message: t('views.system.authentication.ldap.bindDNPlaceholder'),
trigger: 'blur' trigger: 'blur',
} },
], ],
'config.password': [ 'config.password': [
{ {
required: true, required: true,
message: t('views.login.loginForm.password.placeholder'), message: t('views.login.loginForm.password.placeholder'),
trigger: 'blur' trigger: 'blur',
} },
], ],
'config.ou': [ 'config.ou': [
{ {
required: true, required: true,
message: t('views.system.authentication.ldap.ouPlaceholder'), message: t('views.system.authentication.ldap.ouPlaceholder'),
trigger: 'blur' trigger: 'blur',
} },
], ],
'config.ldap_filter': [ 'config.ldap_filter': [
{ {
required: true, required: true,
message: t('views.system.authentication.ldap.ldap_filterPlaceholder'), message: t('views.system.authentication.ldap.ldap_filterPlaceholder'),
trigger: 'blur' trigger: 'blur',
} },
], ],
'config.ldap_mapping': [ 'config.ldap_mapping': [
{ {
required: true, required: true,
message: t('views.system.authentication.ldap.ldap_mappingPlaceholder'), message: t('views.system.authentication.ldap.ldap_mappingPlaceholder'),
trigger: 'blur' trigger: 'blur',
} },
] ],
}) })
const submit = async (formEl: FormInstance | undefined, test?: string) => { const submit = async (formEl: FormInstance | undefined, test?: string) => {
@ -177,9 +180,7 @@ function getDetail() {
if (res.data && JSON.stringify(res.data) !== '{}') { if (res.data && JSON.stringify(res.data) !== '{}') {
form.value = res.data form.value = res.data
if (res.data.config.ldap_mapping) { if (res.data.config.ldap_mapping) {
form.value.config.ldap_mapping = JSON.stringify( form.value.config.ldap_mapping = JSON.stringify(JSON.parse(res.data.config.ldap_mapping))
JSON.parse(res.data.config.ldap_mapping)
)
} }
} }
}) })

View File

@ -45,7 +45,7 @@
<div v-if="item.isValid" class="border-t mt-16"> <div v-if="item.isValid" class="border-t mt-16">
<el-row :gutter="12" class="mt-16"> <el-row :gutter="12" class="mt-16">
<el-col v-for="(value, key) in item.config" :key="key" :span="12"> <el-col v-for="(value, key) in item.config" :key="key" :span="12">
<el-text type="info">{{ formatFieldName(key, item) }}</el-text> <el-text class="color-secondary lighter">{{ formatFieldName(key, item) }}</el-text>
<div class="mt-4 mb-16 flex align-center"> <div class="mt-4 mb-16 flex align-center">
<span <span
v-if="key !== 'app_secret'" v-if="key !== 'app_secret'"
@ -221,9 +221,11 @@ function getPlatformInfo() {
function validateConnection(currentPlatform: Platform) { function validateConnection(currentPlatform: Platform) {
platformApi.validateConnection(currentPlatform, loading).then((res: any) => { platformApi.validateConnection(currentPlatform, loading).then((res: any) => {
res.data if (res.data) {
? MsgSuccess(t('views.system.authentication.scanTheQRCode.validateSuccess')) MsgSuccess(t('views.system.authentication.scanTheQRCode.validateSuccess'))
: MsgError(t('views.system.authentication.scanTheQRCode.validateFailed')) } else {
MsgError(t('views.system.authentication.scanTheQRCode.validateFailed'))
}
}) })
} }

View File

@ -57,10 +57,7 @@
>{{ $t('views.system.email.enableTLS') }} >{{ $t('views.system.email.enableTLS') }}
</el-checkbox> </el-checkbox>
</el-form-item> </el-form-item>
<el-button <span
@click="submit(emailFormRef)"
type="primary"
:disabled="loading"
v-hasPermission=" v-hasPermission="
new ComplexPermission( new ComplexPermission(
[RoleConst.ADMIN], [RoleConst.ADMIN],
@ -69,12 +66,17 @@
'OR', 'OR',
) )
" "
class="mr-12"
> >
{{ $t('common.save') }} <el-button @click="submit(emailFormRef)" type="primary" :disabled="loading">
</el-button> {{ $t('common.save') }}
<el-button @click="submit(emailFormRef, 'test')" :disabled="loading"> </el-button>
{{ $t('views.system.test') }} </span>
</el-button> <span>
<el-button @click="submit(emailFormRef, 'test')" :disabled="loading">
{{ $t('views.system.test') }}
</el-button>
</span>
</el-form> </el-form>
</div> </div>
</el-scrollbar> </el-scrollbar>

View File

@ -7,7 +7,7 @@
{{ $t('views.tool.toolStore.title') }} {{ $t('views.tool.toolStore.title') }}
</h4> </h4>
<el-tag class="store-type default-tag">{{t('views.tool.toolStore.internal')}}</el-tag> <!-- <el-tag class="store-type default-tag">{{t('views.tool.toolStore.internal')}}</el-tag> -->
<div class="flex align-center" style="margin-right: 28px;"> <div class="flex align-center" style="margin-right: 28px;">
<el-input v-model="searchValue" :placeholder="$t('common.search')" prefix-icon="Search" class="w-240 mr-8" <el-input v-model="searchValue" :placeholder="$t('common.search')" prefix-icon="Search" class="w-240 mr-8"
@ -33,7 +33,7 @@
{{ category.title }} {{ category.title }}
</h4> </h4>
<el-row :gutter="16"> <el-row :gutter="16">
<el-col v-for="tool in category.tools" :key="tool.id" :span="8" class="mb-16"> <el-col v-for="tool in category.tools" :key="tool.id" :span="12" class="mb-16">
<ToolCard :tool="tool" :addLoading="addLoading" :get-sub-title="getSubTitle" <ToolCard :tool="tool" :addLoading="addLoading" :get-sub-title="getSubTitle"
@handleAdd="handleOpenAdd(tool)" @handleDetail="handleDetail(tool)" /> @handleAdd="handleOpenAdd(tool)" @handleDetail="handleDetail(tool)" />
</el-col> </el-col>
@ -46,7 +46,7 @@
{{ t('views.tool.toolStore.searchResult', { count: filterList.length }) }} {{ t('views.tool.toolStore.searchResult', { count: filterList.length }) }}
</h4> </h4>
<el-row :gutter="16" v-if="filterList.length"> <el-row :gutter="16" v-if="filterList.length">
<el-col v-for="tool in filterList" :key="tool.id" :span="8" class="mb-16"> <el-col v-for="tool in filterList" :key="tool.id" :span="12" class="mb-16">
<ToolCard :tool="tool" :addLoading="addLoading" :get-sub-title="getSubTitle" <ToolCard :tool="tool" :addLoading="addLoading" :get-sub-title="getSubTitle"
@handleAdd="handleOpenAdd(tool)" @handleDetail="handleDetail(tool)" /> @handleAdd="handleOpenAdd(tool)" @handleDetail="handleDetail(tool)" />
</el-col> </el-col>

View File

@ -6,6 +6,7 @@ import vueJsx from '@vitejs/plugin-vue-jsx'
import DefineOptions from 'unplugin-vue-define-options/vite' import DefineOptions from 'unplugin-vue-define-options/vite'
import path from 'path' import path from 'path'
import { createHtmlPlugin } from 'vite-plugin-html' import { createHtmlPlugin } from 'vite-plugin-html'
import viteCompression from 'vite-plugin-compression'
import fs from 'fs' import fs from 'fs'
// import vueDevTools from 'vite-plugin-vue-devtools' // import vueDevTools from 'vite-plugin-vue-devtools'
const envDir = './env' const envDir = './env'
@ -87,6 +88,14 @@ export default defineConfig((conf: any) => {
DefineOptions(), DefineOptions(),
createHtmlPlugin({ template: ENV.VITE_ENTRY }), createHtmlPlugin({ template: ENV.VITE_ENTRY }),
renameHtmlPlugin(`dist${ENV.VITE_BASE_PATH}`, ENV.VITE_ENTRY), renameHtmlPlugin(`dist${ENV.VITE_BASE_PATH}`, ENV.VITE_ENTRY),
viteCompression({
// gzip静态资源压缩配置
verbose: true, // 是否在控制台输出压缩结果
disable: false, // 是否禁用压缩
threshold: 10240, // 启用压缩的文件大小限制
algorithm: 'gzip', // 采用的压缩算法
ext: '.gz', // 生成的压缩包后缀
}),
], ],
server: { server: {
cors: true, cors: true,