fix: update

This commit is contained in:
xiaoxian521 2022-07-27 21:10:36 +08:00
parent c7955bcc19
commit 0d4fe313b4
9 changed files with 175 additions and 169 deletions

View File

@ -7,7 +7,7 @@ import avatars from "/@/assets/avatars.jpg";
import Breadcrumb from "./sidebar/breadCrumb.vue"; import Breadcrumb from "./sidebar/breadCrumb.vue";
import { deviceDetection } from "@pureadmin/utils"; import { deviceDetection } from "@pureadmin/utils";
import screenfull from "../components/screenfull/index.vue"; import screenfull from "../components/screenfull/index.vue";
import useTranslationLang from "../hooks/useTranslationLang"; import { useTranslationLang } from "../hooks/useTranslationLang";
import globalization from "/@/assets/svg/globalization.svg?component"; import globalization from "/@/assets/svg/globalization.svg?component";
const { const {

View File

@ -1,6 +1,6 @@
<script lang="ts" setup> <script lang="ts" setup>
import { SearchModal } from "./components"; import { SearchModal } from "./components";
import useBoolean from "../../hooks/useBoolean"; import { useBoolean } from "../../hooks/useBoolean";
const { bool: show, toggle } = useBoolean(); const { bool: show, toggle } = useBoolean();
function handleSearch() { function handleSearch() {
toggle(); toggle();

View File

@ -15,9 +15,8 @@ import { emitter } from "/@/utils/mitt";
import { templateRef } from "@vueuse/core"; import { templateRef } from "@vueuse/core";
import { routerArrays } from "/@/layout/types"; import { routerArrays } from "/@/layout/types";
import { useAppStoreHook } from "/@/store/modules/app"; import { useAppStoreHook } from "/@/store/modules/app";
import { useEpThemeStoreHook } from "/@/store/modules/epTheme";
import { useMultiTagsStoreHook } from "/@/store/modules/multiTags"; import { useMultiTagsStoreHook } from "/@/store/modules/multiTags";
import useDataThemeChange from "/@/layout/hooks/useDataThemeChange"; import { useDataThemeChange } from "/@/layout/hooks/useDataThemeChange";
import { import {
useDark, useDark,
debounce, debounce,
@ -44,6 +43,7 @@ const {
layoutTheme, layoutTheme,
themeColors, themeColors,
dataThemeChange, dataThemeChange,
setEpThemeColor,
setLayoutThemeColor setLayoutThemeColor
} = useDataThemeChange(); } = useDataThemeChange();
@ -130,7 +130,7 @@ function onReset() {
router.push("/login"); router.push("/login");
const { Grey, Weak, MultiTagsCache, EpThemeColor, Layout } = getConfig(); const { Grey, Weak, MultiTagsCache, EpThemeColor, Layout } = getConfig();
useAppStoreHook().setLayout(Layout); useAppStoreHook().setLayout(Layout);
useEpThemeStoreHook().setEpThemeColor(EpThemeColor); setEpThemeColor(EpThemeColor);
useMultiTagsStoreHook().multiTagsCacheChange(MultiTagsCache); useMultiTagsStoreHook().multiTagsCacheChange(MultiTagsCache);
toggleClass(Grey, "html-grey", document.querySelector("html")); toggleClass(Grey, "html-grey", document.querySelector("html"));
toggleClass(Weak, "html-weakness", document.querySelector("html")); toggleClass(Weak, "html-weakness", document.querySelector("html"));

View File

@ -1,6 +1,6 @@
import { ref } from "vue"; import { ref } from "vue";
export default function useBoolean(initValue = false) { export function useBoolean(initValue = false) {
const bool = ref(initValue); const bool = ref(initValue);
function setBool(value: boolean) { function setBool(value: boolean) {

View File

@ -1,6 +1,6 @@
import { getConfig } from "/@/config"; import { getConfig } from "/@/config";
import { find } from "lodash-unified"; import { find } from "lodash-unified";
import useLayout from "./useLayout"; import { useLayout } from "./useLayout";
import { themeColorsType } from "../types"; import { themeColorsType } from "../types";
import { TinyColor } from "@ctrl/tinycolor"; import { TinyColor } from "@ctrl/tinycolor";
import { ref, getCurrentInstance } from "vue"; import { ref, getCurrentInstance } from "vue";
@ -12,7 +12,7 @@ import {
toggleTheme toggleTheme
} from "@pureadmin/theme/dist/browser-utils"; } from "@pureadmin/theme/dist/browser-utils";
export default function useDataThemeChange() { export function useDataThemeChange() {
const { layoutTheme } = useLayout(); const { layoutTheme } = useLayout();
const themeColors = ref<Array<themeColorsType>>([ const themeColors = ref<Array<themeColorsType>>([
/* 道奇蓝(默认) */ /* 道奇蓝(默认) */

View File

@ -1,9 +1,9 @@
import { computed, getCurrentInstance } from "vue";
import { useI18n } from "vue-i18n"; import { useI18n } from "vue-i18n";
import { routerArrays } from "../types"; import { routerArrays } from "../types";
import { computed, getCurrentInstance } from "vue";
import { useMultiTagsStore } from "/@/store/modules/multiTags"; import { useMultiTagsStore } from "/@/store/modules/multiTags";
export default function useLayout() { export function useLayout() {
const instance = getCurrentInstance().appContext.app.config.globalProperties; const instance = getCurrentInstance().appContext.app.config.globalProperties;
const initStorage = () => { const initStorage = () => {

View File

@ -3,7 +3,7 @@ import { useI18n } from "vue-i18n";
import { useRoute } from "vue-router"; import { useRoute } from "vue-router";
import { watch, getCurrentInstance } from "vue"; import { watch, getCurrentInstance } from "vue";
export default function useTranslationLang() { export function useTranslationLang() {
const { changeTitle, changeWangeditorLanguage } = useNav(); const { changeTitle, changeWangeditorLanguage } = useNav();
const { locale, t } = useI18n(); const { locale, t } = useI18n();
const route = useRoute(); const route = useRoute();

View File

@ -1,6 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { setType } from "./types"; import { setType } from "./types";
import { emitter } from "/@/utils/mitt"; import { emitter } from "/@/utils/mitt";
import { useLayout } from "./hooks/useLayout";
import { useAppStoreHook } from "/@/store/modules/app"; import { useAppStoreHook } from "/@/store/modules/app";
import { deviceDetection, useDark } from "@pureadmin/utils"; import { deviceDetection, useDark } from "@pureadmin/utils";
import { useSettingStoreHook } from "/@/store/modules/settings"; import { useSettingStoreHook } from "/@/store/modules/settings";
@ -10,7 +11,6 @@ import backTop from "/@/assets/svg/back_top.svg?component";
import fullScreen from "/@/assets/svg/full_screen.svg?component"; import fullScreen from "/@/assets/svg/full_screen.svg?component";
import exitScreen from "/@/assets/svg/exit_screen.svg?component"; import exitScreen from "/@/assets/svg/exit_screen.svg?component";
import useLayout from "./hooks/useLayout";
import navbar from "./components/navbar.vue"; import navbar from "./components/navbar.vue";
import tag from "./components/tag/index.vue"; import tag from "./components/tag/index.vue";
import appMain from "./components/appMain.vue"; import appMain from "./components/appMain.vue";

View File

@ -10,15 +10,15 @@ import { initRouter } from "/@/router/utils";
import { useNav } from "/@/layout/hooks/nav"; import { useNav } from "/@/layout/hooks/nav";
import { message } from "@pureadmin/components"; import { message } from "@pureadmin/components";
import type { FormInstance } from "element-plus"; import type { FormInstance } from "element-plus";
import useLayout from "/@/layout/hooks/useLayout";
import { storageSession } from "@pureadmin/utils"; import { storageSession } from "@pureadmin/utils";
import { operates, thirdParty } from "./utils/enums"; import { operates, thirdParty } from "./utils/enums";
import { useLayout } from "/@/layout/hooks/useLayout";
import { useUserStoreHook } from "/@/store/modules/user"; import { useUserStoreHook } from "/@/store/modules/user";
import { bg, avatar, currentWeek } from "./utils/static"; import { bg, avatar, currentWeek } from "./utils/static";
import { ReImageVerify } from "/@/components/ReImageVerify"; import { ReImageVerify } from "/@/components/ReImageVerify";
import { useRenderIcon } from "/@/components/ReIcon/src/hooks"; import { useRenderIcon } from "/@/components/ReIcon/src/hooks";
import useDataThemeChange from "/@/layout/hooks/useDataThemeChange"; import { useTranslationLang } from "/@/layout/hooks/useTranslationLang";
import useTranslationLang from "/@/layout/hooks/useTranslationLang"; import { useDataThemeChange } from "/@/layout/hooks/useDataThemeChange";
import { ref, reactive, watch, computed, getCurrentInstance } from "vue"; import { ref, reactive, watch, computed, getCurrentInstance } from "vue";
import dayIcon from "/@/assets/svg/day.svg?component"; import dayIcon from "/@/assets/svg/day.svg?component";
@ -82,10 +82,14 @@ function onHandle(value) {
watch(imgCode, value => { watch(imgCode, value => {
useUserStoreHook().SET_VERIFYCODE(value); useUserStoreHook().SET_VERIFYCODE(value);
}); });
dataThemeChange();
</script> </script>
<template> <template>
<div class="flex-c absolute right-5"> <div class="wh-full select-none">
<img :src="bg" class="wave" />
<div class="flex-c absolute right-5 top-3">
<!-- 主题 --> <!-- 主题 -->
<el-switch <el-switch
v-model="dataTheme" v-model="dataTheme"
@ -96,7 +100,9 @@ watch(imgCode, value => {
/> />
<!-- 国际化 --> <!-- 国际化 -->
<el-dropdown trigger="click"> <el-dropdown trigger="click">
<globalization class="w-40px h-48px p-11px cursor-pointer outline-none" /> <globalization
class="hover:color-primary !hover:bg-transparent w-20px h-20px ml-1.5 cursor-pointer outline-none duration-300"
/>
<template #dropdown> <template #dropdown>
<el-dropdown-menu class="translation"> <el-dropdown-menu class="translation">
<el-dropdown-item <el-dropdown-item
@ -125,7 +131,6 @@ watch(imgCode, value => {
</template> </template>
</el-dropdown> </el-dropdown>
</div> </div>
<img :src="bg" class="wave" />
<div class="login-container"> <div class="login-container">
<div class="img"> <div class="img">
<component :is="currentWeek" /> <component :is="currentWeek" />
@ -134,7 +139,7 @@ watch(imgCode, value => {
<div class="login-form"> <div class="login-form">
<avatar class="avatar" /> <avatar class="avatar" />
<Motion> <Motion>
<h2>{{ title }}</h2> <h2 class="outline-none">{{ title }}</h2>
</Motion> </Motion>
<el-form <el-form
@ -257,6 +262,7 @@ watch(imgCode, value => {
</div> </div>
</div> </div>
</div> </div>
</div>
</template> </template>
<style scoped> <style scoped>