fix: 修改外观设置bug

This commit is contained in:
wangdan-fit2cloud 2024-07-23 18:21:46 +08:00
parent 53434f9d24
commit 7465ef6511
10 changed files with 74 additions and 21 deletions

View File

@ -6,8 +6,8 @@ const prefix = '/display'
/** /**
* *
*/ */
const getThemeInfo: () => Promise<Result<any>> = () => { const getThemeInfo: (loading?: Ref<boolean>) => Promise<Result<any>> = (loading) => {
return get(`${prefix}/info`) return get(`${prefix}/info`, undefined, loading)
} }
/** /**

View File

@ -136,11 +136,12 @@
@click="sendChatHandle" @click="sendChatHandle"
> >
<img v-show="isDisabledChart || loading" src="@/assets/icon_send.svg" alt="" /> <img v-show="isDisabledChart || loading" src="@/assets/icon_send.svg" alt="" />
<img <SendIcon v-show="!isDisabledChart && !loading" />
v-show="!isDisabledChart && !loading" <!-- <img
src="@/assets/icon_send_colorful.svg" src="@/assets/icon_send_colorful.svg"
alt="" alt=""
/> /> -->
</el-button> </el-button>
</div> </div>
</div> </div>

View File

@ -21,6 +21,7 @@ import MdEditor from './markdown/MdEditor.vue'
import MdPreview from './markdown/MdPreview.vue' import MdPreview from './markdown/MdPreview.vue'
import LogoFull from './logo/LogoFull.vue' import LogoFull from './logo/LogoFull.vue'
import LogoIcon from './logo/LogoIcon.vue' import LogoIcon from './logo/LogoIcon.vue'
import SendIcon from './logo/SendIcon.vue'
export default { export default {
install(app: App) { install(app: App) {
@ -46,5 +47,6 @@ export default {
app.component(MdEditor.name, MdEditor) app.component(MdEditor.name, MdEditor)
app.component(LogoFull.name, LogoFull) app.component(LogoFull.name, LogoFull)
app.component(LogoIcon.name, LogoIcon) app.component(LogoIcon.name, LogoIcon)
app.component(SendIcon.name, SendIcon)
} }
} }

View File

@ -0,0 +1,44 @@
<template>
<svg
v-if="!isDefaultTheme"
:class="!isDefaultTheme ? 'custom-logo-color' : ''"
width="24"
height="24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M20.1716 1.68834C20.6753 1.53273 21.0458 2.16193 20.6652 2.52691L12.2658 10.5836C11.0058 11.7921 9.32754 12.4668 7.5817 12.4668C5.68044 12.4668 3.8669 11.667 2.58487 10.263L1.45879 9.02985C1.33225 8.90313 1.24137 8.74527 1.19534 8.5722C1.14931 8.39913 1.14974 8.21698 1.19661 8.04413C1.24347 7.87129 1.3351 7.71386 1.46225 7.58775C1.5894 7.46164 1.74757 7.3713 1.92079 7.32585L20.1716 1.68834Z"
fill="currentColor"
/>
<path
d="M12 16.1851C12 14.2766 12.7377 12.4419 14.0588 11.0646L21.4664 3.34177C21.8268 2.96601 22.4499 3.32266 22.3084 3.82374L17.143 22.1182C17.0971 22.291 17.0064 22.4487 16.8801 22.5754C16.7538 22.7021 16.5964 22.7932 16.4237 22.8397C16.251 22.8862 16.0691 22.8864 15.8964 22.8402C15.7236 22.794 15.566 22.7031 15.4395 22.5767L14.4439 21.6791C12.8881 20.2764 12 18.2799 12 16.1851Z"
fill="currentColor"
/>
</svg>
<img v-else src="@/assets/icon_send_colorful.svg" />
</template>
<script setup lang="ts">
import { ref, computed, onMounted } from 'vue'
import useStore from '@/stores'
defineOptions({ name: 'SendIcon' })
defineProps({
height: {
type: String,
default: '36px'
}
})
const { user } = useStore()
const isDefaultTheme = computed(() => {
return user.isDefaultTheme()
})
</script>
<style lang="scss" scoped>
.custom-logo-color {
path {
fill: var(--el-color-primary);
}
}
</style>

View File

@ -1,9 +1,10 @@
import { defineStore } from 'pinia' import { defineStore } from 'pinia'
import { type Ref } from 'vue'
import type { User } from '@/api/type/user' import type { User } from '@/api/type/user'
import UserApi from '@/api/user' import UserApi from '@/api/user'
import ThemeApi from '@/api/theme' import ThemeApi from '@/api/theme'
import { useElementPlusTheme } from 'use-element-plus-theme' import { useElementPlusTheme } from 'use-element-plus-theme'
const { changeTheme } = useElementPlusTheme()
export interface userStateTypes { export interface userStateTypes {
userType: number // 1 系统操作者 2 对话用户 userType: number // 1 系统操作者 2 对话用户
@ -35,6 +36,7 @@ const useUserStore = defineStore({
return !this.themeInfo?.theme || this.themeInfo?.theme === '#3370FF' return !this.themeInfo?.theme || this.themeInfo?.theme === '#3370FF'
}, },
setTheme(data: any) { setTheme(data: any) {
const { changeTheme } = useElementPlusTheme(this.themeInfo?.theme)
changeTheme(data?.['theme']) changeTheme(data?.['theme'])
this.themeInfo = data this.themeInfo = data
}, },
@ -97,8 +99,8 @@ const useUserStore = defineStore({
}) })
}, },
async theme() { async theme(loading?: Ref<boolean>) {
return await ThemeApi.getThemeInfo().then((ok) => { return await ThemeApi.getThemeInfo(loading).then((ok) => {
this.setTheme(ok.data) this.setTheme(ok.data)
window.document.title = this.themeInfo['title'] || 'MaxKB' window.document.title = this.themeInfo['title'] || 'MaxKB'
// const link = document.querySelector('link[rel="icon"]') as any // const link = document.querySelector('link[rel="icon"]') as any

View File

@ -56,7 +56,7 @@
:class="enlarge ? 'enlarge' : ''" :class="enlarge ? 'enlarge' : ''"
v-if="showDebug" v-if="showDebug"
> >
<div class="workflow-debug-header"> <div class="workflow-debug-header" :class="!isDefaultTheme ? 'custom-header' : ''">
<div class="flex-between"> <div class="flex-between">
<h4 class="ml-24"> <h4 class="ml-24">
{{ detail?.name || $t('views.application.applicationForm.form.appName.label') }} {{ detail?.name || $t('views.application.applicationForm.form.appName.label') }}
@ -94,10 +94,13 @@ import { datetimeFormat } from '@/utils/time'
import useStore from '@/stores' import useStore from '@/stores'
import { WorkFlowInstance } from '@/workflow/common/validate' import { WorkFlowInstance } from '@/workflow/common/validate'
const { application } = useStore() const { user, application } = useStore()
const router = useRouter() const router = useRouter()
const route = useRoute() const route = useRoute()
const isDefaultTheme = computed(() => {
return user.isDefaultTheme()
})
const { const {
params: { id } params: { id }
} = route as any } = route as any

View File

@ -20,7 +20,7 @@ const currentTemplate = computed(() => {
if (mode && mode === 'embed') { if (mode && mode === 'embed') {
modeName = 'embed' modeName = 'embed'
} else { } else {
modeName = show_history.value ? 'pc' : 'base' modeName = show_history.value || !user.showXpack() ? 'pc' : 'base'
} }
const name = `/src/views/chat/${modeName}/index.vue` const name = `/src/views/chat/${modeName}/index.vue`

View File

@ -1,5 +1,5 @@
<template> <template>
<login-layout v-loading="loading"> <login-layout v-if="user.isEnterprise() ? user.themeInfo : true" v-loading="loading">
<LoginContainer :subTitle="user.themeInfo?.slogan || '欢迎使用 MaxKB 智能知识库'"> <LoginContainer :subTitle="user.themeInfo?.slogan || '欢迎使用 MaxKB 智能知识库'">
<h2 class="mb-24">{{ loginMode || '普通登录' }}</h2> <h2 class="mb-24">{{ loginMode || '普通登录' }}</h2>
<el-form <el-form
@ -77,7 +77,7 @@
</login-layout> </login-layout>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { onMounted, ref } from 'vue' import { onMounted, ref, onBeforeMount } from 'vue'
import type { LoginRequest } from '@/api/type/user' import type { LoginRequest } from '@/api/type/user'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import type { FormInstance, FormRules } from 'element-plus' import type { FormInstance, FormRules } from 'element-plus'
@ -134,9 +134,6 @@ const login = () => {
} }
onMounted(() => { onMounted(() => {
if (user.isEnterprise()) {
user.theme()
}
user.asyncGetProfile().then((res) => { user.asyncGetProfile().then((res) => {
if (user.showXpack()) { if (user.showXpack()) {
loading.value = true loading.value = true
@ -149,6 +146,11 @@ onMounted(() => {
} }
}) })
}) })
onBeforeMount(() => {
if (user.isEnterprise()) {
user.theme(loading)
}
})
</script> </script>
<style lang="scss" scope> <style lang="scss" scope>
.login-gradient-divider { .login-gradient-divider {

View File

@ -55,11 +55,10 @@
placeholder="请给基础模型设置一个名称" placeholder="请给基础模型设置一个名称"
/> />
</el-form-item> </el-form-item>
<el-form-item prop="model_type" :rules="base_form_data_rule.permission_type"> <el-form-item prop="permission_type" :rules="base_form_data_rule.permission_type">
<template #label> <template #label>
<span>权限</span> <span>权限</span>
</template> </template>
<el-radio-group v-model="base_form_data.permission_type" class="card__radio"> <el-radio-group v-model="base_form_data.permission_type" class="card__radio">
<el-row :gutter="16"> <el-row :gutter="16">
<template v-for="(value, key) of PermissionType" :key="key"> <template v-for="(value, key) of PermissionType" :key="key">
@ -187,7 +186,6 @@ const base_form_data = ref<{
name: string name: string
permission_type: string permission_type: string
model_type: string model_type: string
model_name: string model_name: string
}>({ name: '', model_type: '', model_name: '', permission_type: 'PRIVATE' }) }>({ name: '', model_type: '', model_name: '', permission_type: 'PRIVATE' })
@ -199,7 +197,8 @@ const form_data = computed({
...credential_form_data.value, ...credential_form_data.value,
name: base_form_data.value.name, name: base_form_data.value.name,
model_type: base_form_data.value.model_type, model_type: base_form_data.value.model_type,
model_name: base_form_data.value.model_name model_name: base_form_data.value.model_name,
permission_type: base_form_data.value.permission_type
} }
}, },
set: (event: any) => { set: (event: any) => {

View File

@ -48,7 +48,7 @@
placeholder="请给基础模型设置一个名称" placeholder="请给基础模型设置一个名称"
/> />
</el-form-item> </el-form-item>
<el-form-item prop="model_type" :rules="base_form_data_rule.permission_type"> <el-form-item prop="permission_type" :rules="base_form_data_rule.permission_type">
<template #label> <template #label>
<span>权限</span> <span>权限</span>
</template> </template>