Skip to content

Commit e753d2c

Browse files
committed
fix(Appearance Settings): The ratio of the sample image is inconsistent with the actual login logo ratio
1 parent 79f7630 commit e753d2c

File tree

9 files changed

+93
-42
lines changed

9 files changed

+93
-42
lines changed

frontend/embedded.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<html lang="en">
33
<head>
44
<meta charset="UTF-8" />
5-
<link rel="icon" type="image/svg+xml" href="/vite-sqlbot.svg" />
5+
<link rel="icon" type="image/svg+xml"/>
66
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
77
<title>SQLBot</title>
88
</head>

frontend/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<html lang="en">
33
<head>
44
<meta charset="UTF-8" />
5-
<link rel="icon" type="image/svg+xml" href="/vite-sqlbot.svg" />
5+
<link rel="icon" type="image/svg+xml" />
66
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
77
<title>SQLBot</title>
88
</head>
Lines changed: 2 additions & 2 deletions
Loading

frontend/src/components/layout/LayoutDsl.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,7 @@ const showSysmenu = computed(() => {
7070
:class="collapse && 'collapse'"
7171
@click="toWorkspace"
7272
>
73-
<el-icon size="16">
73+
<el-icon size="18">
7474
<icon_moments_categories_outlined></icon_moments_categories_outlined>
7575
</el-icon>
7676
{{ collapse ? '' : $t('workspace.return_to_workspace') }}

frontend/src/style.less

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -185,6 +185,16 @@ body {
185185
}
186186
}
187187

188+
.form-content_error_a {
189+
.ed-form-item--default {
190+
margin-bottom: 8px;
191+
192+
&.is-error {
193+
margin-bottom: 12px;
194+
}
195+
}
196+
}
197+
188198
.ed-dialog {
189199
border-radius: 12px !important;
190200
}

frontend/src/utils/utils.ts

Lines changed: 48 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -107,10 +107,54 @@ export const setTitle = (title?: string) => {
107107
document.title = title || 'SQLBot'
108108
}
109109

110-
export const setCurrentColor = (
111-
currentColor: any,
112-
element: HTMLElement = document.documentElement
113-
) => {
110+
function rgbToHex(r: any, g: any, b: any) {
111+
// 确保数值在0-255范围内
112+
r = Math.max(0, Math.min(255, r))
113+
g = Math.max(0, Math.min(255, g))
114+
b = Math.max(0, Math.min(255, b))
115+
116+
// 转换为16进制并补零
117+
const hexR = r.toString(16).padStart(2, '0')
118+
const hexG = g.toString(16).padStart(2, '0')
119+
const hexB = b.toString(16).padStart(2, '0')
120+
121+
return `#${hexR}${hexG}${hexB}`.toUpperCase()
122+
}
123+
function rgbaToHex(r: any, g: any, b: any, a: any) {
124+
// 处理RGB部分
125+
const hexR = Math.max(0, Math.min(255, r)).toString(16).padStart(2, '0')
126+
const hexG = Math.max(0, Math.min(255, g)).toString(16).padStart(2, '0')
127+
const hexB = Math.max(0, Math.min(255, b)).toString(16).padStart(2, '0')
128+
129+
// 处理透明度(可选)
130+
const hexA =
131+
a !== undefined
132+
? Math.round(Math.max(0, Math.min(1, a)) * 255)
133+
.toString(16)
134+
.padStart(2, '0')
135+
: ''
136+
137+
return `#${hexR}${hexG}${hexB}${hexA}`.toUpperCase()
138+
}
139+
140+
export function colorStringToHex(colorStr: any) {
141+
if (colorStr.startsWith('#')) return colorStr
142+
// 提取颜色值
143+
const rgbRegex =
144+
/^(rgb|rgba)\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*(?:,\s*(\d+(?:\.\d+)?)\s*)?\)$/
145+
const match = colorStr.match(rgbRegex)
146+
if (!match) return null
147+
148+
const r = parseInt(match[2])
149+
const g = parseInt(match[3])
150+
const b = parseInt(match[4])
151+
const a = match[5] ? parseFloat(match[5]) : undefined
152+
153+
return a !== undefined ? rgbaToHex(r, g, b, a) : rgbToHex(r, g, b)
154+
}
155+
156+
export const setCurrentColor = (color: any, element: HTMLElement = document.documentElement) => {
157+
const currentColor = colorStringToHex(color) as any
114158
element.style.setProperty('--ed-color-primary', currentColor)
115159
element.style.setProperty('--van-blue', currentColor)
116160
element.style.setProperty(

frontend/src/views/login/index.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
</div>
66
<div class="login-content">
77
<div class="login-right">
8-
<img width="227" height="52" :src="loginBg" alt="" />
8+
<img width="auto" height="52" :src="loginBg" alt="" />
99
<div class="welcome">
1010
{{ appearanceStore.slogan || $t('common.intelligent_questioning_platform') }}
1111
</div>

frontend/src/views/system/appearance/index.vue

Lines changed: 28 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -88,7 +88,7 @@
8888
:show-file-list="false"
8989
class="upload-demo"
9090
accept=".jpeg,.jpg,.png,.gif,.svg"
91-
:before-upload="(e: any) => beforeUpload(e, ele.type)"
91+
:before-upload="(e: any) => beforeUpload(e, ele)"
9292
:http-request="uploadImg"
9393
>
9494
<el-button secondary>{{ t('system.replace_image') }}</el-button>
@@ -103,17 +103,22 @@
103103
:rules="rules"
104104
require-asterisk-position="right"
105105
label-width="120px"
106-
class="page-Form"
106+
class="page-Form form-content_error_a"
107107
>
108108
<el-form-item :label="t('system.website_name')" prop="name">
109-
<el-input v-model="loginForm.name" maxlength="20" />
109+
<el-input
110+
v-model="loginForm.name"
111+
:placeholder="
112+
$t('datasource.please_enter') +
113+
$t('common.empty') +
114+
$t('system.website_name')
115+
"
116+
maxlength="20"
117+
/>
110118
<div class="form-tips">{{ t('system.on_webpage_tabs') }}</div>
111119
</el-form-item>
112120
<el-form-item :label="$t('system.welcome_message')" prop="slogan">
113121
<el-input v-model="loginForm.slogan" maxlength="50" />
114-
<div class="form-tips">
115-
{{ t('system.the_product_logo') }}
116-
</div>
117122
</el-form-item>
118123
<!-- <el-form-item :label="t('system.footer')" prop="foot">
119124
<el-switch v-model="loginForm.foot" active-value="true" inactive-value="false" />
@@ -234,8 +239,7 @@ import icon_side_fold_outlined from '@/assets/svg/icon_side-fold_outlined.svg'
234239
import { useAppearanceStoreWithOut } from '@/stores/appearance'
235240
import LoginPreview from './LoginPreview.vue'
236241
import Person from './Person.vue'
237-
import colorFunctions from 'less/lib/less/functions/color.js'
238-
import colorTree from 'less/lib/less/tree/color.js'
242+
import { setCurrentColor } from '@/utils/utils'
239243
// import TinymceEditor from '@/components/rich-text/TinymceEditor.vue'
240244
import { cloneDeep } from 'lodash-es'
241245
const appearanceStore = useAppearanceStoreWithOut()
@@ -288,7 +292,13 @@ const defaultLoginForm = reactive<LoginForm>({
288292
const loginForm = reactive<LoginForm>(cloneDeep(defaultLoginForm))
289293
290294
const rules = reactive<FormRules>({
291-
name: [{ required: true, message: t('system.the_website_name'), trigger: 'blur' }],
295+
name: [
296+
{
297+
required: true,
298+
message: t('datasource.please_enter') + t('common.empty') + t('system.website_name'),
299+
trigger: 'blur',
300+
},
301+
],
292302
foot: [
293303
{
294304
required: true,
@@ -318,16 +328,19 @@ const configList = [
318328
logo: t('system.website_logo'),
319329
type: 'web',
320330
tips: t('system.larger_than_200kb'),
331+
size: 200 * 1024,
321332
},
322333
{
323334
logo: t('system.login_logo'),
324335
type: 'login',
325336
tips: t('system.larger_than_200kb_de'),
337+
size: 200 * 1024,
326338
},
327339
{
328340
logo: t('system.login_background_image'),
329341
type: 'bg',
330342
tips: t('system.larger_than_5mb'),
343+
size: 1024 * 1024 * 5,
331344
},
332345
]
333346
@@ -477,25 +490,7 @@ const customColorChange = (val: any) => {
477490
}
478491
const setPageCustomColor = (val: any) => {
479492
const ele = document.getElementsByClassName('appearance-table__content')[0] as HTMLElement
480-
481-
ele.style.setProperty('--ed-color-primary', val)
482-
ele.style.setProperty('--van-blue', val)
483-
ele.style.setProperty(
484-
'--ed-color-primary-light-5',
485-
colorFunctions.mix(new colorTree('ffffff'), new colorTree(val.substr(1)), { value: 40 }).toRGB()
486-
)
487-
ele.style.setProperty(
488-
'--ed-color-primary-light-3',
489-
colorFunctions.mix(new colorTree('ffffff'), new colorTree(val.substr(1)), { value: 15 }).toRGB()
490-
)
491-
ele.style.setProperty('--ed-color-primary-1a', `${val}1a`)
492-
ele.style.setProperty('--ed-color-primary-14', `${val}14`)
493-
ele.style.setProperty('--ed-color-primary-33', `${val}33`)
494-
ele.style.setProperty('--ed-color-primary-99', `${val}99`)
495-
ele.style.setProperty(
496-
'--ed-color-primary-dark-2',
497-
colorFunctions.mix(new colorTree('000000'), new colorTree(val.substr(1)), { value: 15 }).toRGB()
498-
)
493+
setCurrentColor(val, ele)
499494
}
500495
const resetLoginForm = (reset2Default?: boolean) => {
501496
for (const key in loginForm) {
@@ -549,7 +544,11 @@ const uploadImg = (options: any) => {
549544
mobileLoginBg.value = URL.createObjectURL(file)
550545
}
551546
}
552-
const beforeUpload = (file: any, type: any) => {
547+
const beforeUpload = (file: any, { type, size, tips }: any) => {
548+
if (file.size > size) {
549+
ElMessage.error(tips)
550+
return false
551+
}
553552
addChangeArray(type, file.uid, 'file')
554553
let len = fileList.value?.length
555554
let match = false
@@ -876,9 +875,6 @@ onUnmounted(() => {
876875
color: #8f959e;
877876
}
878877
879-
.ed-form-item {
880-
margin-bottom: 8px;
881-
}
882878
.appearance-radio-item {
883879
:deep(.ed-form-item__content) {
884880
line-height: 22px;

frontend/src/views/system/professional/index.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -540,6 +540,7 @@ const deleteHandlerItem = (idx: number) => {
540540
<el-icon
541541
class="hover-icon_with_bg"
542542
size="16"
543+
style="color: #646a73"
543544
@click.stop="deleteHandlerItem(index)"
544545
>
545546
<IconOpeDelete></IconOpeDelete>

0 commit comments

Comments
 (0)