mirror of
https://github.com/m-xlsea/ruoyi-plus-soybean.git
synced 2025-09-24 07:49:47 +08:00
feat(projects): 引入soybean-admin-tab、去除vite-plugin-svg-icons,用unplugin-icons实现自定义svg的iconify写法、代码优化
This commit is contained in:
39
src/components/common/DarkModeSwitch.vue
Normal file
39
src/components/common/DarkModeSwitch.vue
Normal file
@ -0,0 +1,39 @@
|
||||
<template>
|
||||
<div class="flex-center text-18px hover:text-primary cursor-pointer" @click="handleSwitch">
|
||||
<icon-mdi-moon-waning-crescent v-if="darkMode" />
|
||||
<icon-mdi-white-balance-sunny v-else />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed } from 'vue';
|
||||
|
||||
interface Props {
|
||||
/** 暗黑模式 */
|
||||
dark?: boolean;
|
||||
}
|
||||
|
||||
interface Emits {
|
||||
(e: 'update:dark', darkMode: boolean): void;
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
dark: false
|
||||
});
|
||||
|
||||
const emit = defineEmits<Emits>();
|
||||
|
||||
const darkMode = computed({
|
||||
get() {
|
||||
return props.dark;
|
||||
},
|
||||
set(newValue: boolean) {
|
||||
emit('update:dark', newValue);
|
||||
}
|
||||
});
|
||||
|
||||
function handleSwitch() {
|
||||
darkMode.value = !darkMode.value;
|
||||
}
|
||||
</script>
|
||||
<style scoped></style>
|
Reference in New Issue
Block a user