moreShopAdmin/src/App.vue

<script setup lang="ts">
import { useDark, useWindowSize, useThrottleFn } from '@vueuse/core'
import zhCn from 'element-plus/es/locale/lang/zh-cn'
import useAppStore from './stores/modules/app'
import useSettingStore from './stores/modules/setting'
import { ScreenEnum } from './enums/appEnums'
const appStore = useAppStore()
const settingStore = useSettingStore()
// const elConfig = {
//     zIndex: 3000,
//     locale: zhCn
// }
const isDark = useDark()
onMounted(async () => {
    //设置主题色
    settingStore.setTheme(isDark.value)
    // 获取配置
    const data: any = await appStore.getConfig()
    // 设置网站logo
    let favicon: HTMLLinkElement = document.querySelector('link[rel="icon"]')!
    if (favicon) {
        favicon.href = data.web_favicon
        return
    }
    favicon = document.createElement('link')
    favicon.rel = 'icon'
    favicon.href = data.web_favicon
    document.head.appendChild(favicon)
})

const { width } = useWindowSize()
watch(
    width,
    useThrottleFn((value) => {
        if (value > ScreenEnum.SM) {
            appStore.setMobile(false)
            appStore.toggleCollapsed(false)
        } else {
            appStore.setMobile(true)
            appStore.toggleCollapsed(true)
        }
        if (value < ScreenEnum.MD) {
            appStore.toggleCollapsed(true)
        }
    }),
    {
        immediate: true
    }
)
</script>

<template>
    <el-config-provider :locale="zhCn">
        <router-view />
    </el-config-provider>
</template>

<style lang="scss">
/* .el-select__wrapper{
    width: 280px;
} */
.el-select.w-\[280px\] {
    width: 280px;
}

.el-table th.el-table__cell>.cell {
    text-align: center;

}

.el-table td.el-table__cell div {
    text-align: center;
}

.el-card {
    --el-card-border-radius: 20px;
}
</style>