| | |
| | | </a-button> |
| | | </div> |
| | | </template> |
| | | <script lang="ts"> |
| | | import { defineComponent, unref } from 'vue'; |
| | | <script lang="ts" setup> |
| | | import { unref } from 'vue'; |
| | | |
| | | import { CopyOutlined, RedoOutlined } from '@ant-design/icons-vue'; |
| | | |
| | | import { useAppStore } from '/@/store/modules/app'; |
| | | import { usePermissionStore } from '/@/store/modules/permission'; |
| | | import { useMultipleTabStore } from '/@/store/modules/multipleTab'; |
| | | import { useUserStore } from '/@/store/modules/user'; |
| | | import { useAppStore } from '@/store/modules/app'; |
| | | import { usePermissionStore } from '@/store/modules/permission'; |
| | | import { useMultipleTabStore } from '@/store/modules/multipleTab'; |
| | | import { useUserStore } from '@/store/modules/user'; |
| | | |
| | | import { useDesign } from '/@/hooks/web/useDesign'; |
| | | import { useI18n } from '/@/hooks/web/useI18n'; |
| | | import { useMessage } from '/@/hooks/web/useMessage'; |
| | | import { useCopyToClipboard } from '/@/hooks/web/useCopyToClipboard'; |
| | | import { useDesign } from '@/hooks/web/useDesign'; |
| | | import { useI18n } from '@/hooks/web/useI18n'; |
| | | import { useMessage } from '@/hooks/web/useMessage'; |
| | | import { copyText } from '@/utils/copyTextToClipboard'; |
| | | import { updateColorWeak } from '@/logics/theme/updateColorWeak'; |
| | | import { updateGrayMode } from '@/logics/theme/updateGrayMode'; |
| | | import defaultSetting from '@/settings/projectSetting'; |
| | | import { updateSidebarBgColor } from '@/logics/theme/updateBackground'; |
| | | |
| | | import { updateColorWeak } from '/@/logics/theme/updateColorWeak'; |
| | | import { updateGrayMode } from '/@/logics/theme/updateGrayMode'; |
| | | import defaultSetting from '/@/settings/projectSetting'; |
| | | import { updateSidebarBgColor } from '/@/logics/theme/updateBackground'; |
| | | defineOptions({ name: 'SettingFooter' }); |
| | | |
| | | export default defineComponent({ |
| | | name: 'SettingFooter', |
| | | components: { CopyOutlined, RedoOutlined }, |
| | | setup() { |
| | | const permissionStore = usePermissionStore(); |
| | | const { prefixCls } = useDesign('setting-footer'); |
| | | const { t } = useI18n(); |
| | | const { createSuccessModal, createMessage } = useMessage(); |
| | | const tabStore = useMultipleTabStore(); |
| | | const userStore = useUserStore(); |
| | | const appStore = useAppStore(); |
| | | const permissionStore = usePermissionStore(); |
| | | const { prefixCls } = useDesign('setting-footer'); |
| | | const { t } = useI18n(); |
| | | const { createSuccessModal, createMessage } = useMessage(); |
| | | const tabStore = useMultipleTabStore(); |
| | | const userStore = useUserStore(); |
| | | const appStore = useAppStore(); |
| | | |
| | | function handleCopy() { |
| | | const { isSuccessRef } = useCopyToClipboard( |
| | | JSON.stringify(unref(appStore.getProjectConfig), null, 2), |
| | | ); |
| | | unref(isSuccessRef) && |
| | | createSuccessModal({ |
| | | title: t('layout.setting.operatingTitle'), |
| | | content: t('layout.setting.operatingContent'), |
| | | }); |
| | | } |
| | | function handleResetSetting() { |
| | | try { |
| | | appStore.setProjectConfig(defaultSetting); |
| | | const { colorWeak, grayMode } = defaultSetting; |
| | | updateSidebarBgColor(); |
| | | updateColorWeak(colorWeak); |
| | | updateGrayMode(grayMode); |
| | | createMessage.success(t('layout.setting.resetSuccess')); |
| | | } catch (error: any) { |
| | | createMessage.error(error); |
| | | } |
| | | } |
| | | function handleCopy() { |
| | | copyText(JSON.stringify(unref(appStore.getProjectConfig), null, 2), null).then(() => { |
| | | createSuccessModal({ |
| | | title: t('layout.setting.operatingTitle'), |
| | | content: t('layout.setting.operatingContent'), |
| | | }); |
| | | }); |
| | | } |
| | | |
| | | function handleClearAndRedo() { |
| | | localStorage.clear(); |
| | | appStore.resetAllState(); |
| | | permissionStore.resetState(); |
| | | tabStore.resetState(); |
| | | userStore.resetState(); |
| | | location.reload(); |
| | | } |
| | | return { |
| | | prefixCls, |
| | | t, |
| | | handleCopy, |
| | | handleResetSetting, |
| | | handleClearAndRedo, |
| | | }; |
| | | }, |
| | | }); |
| | | function handleResetSetting() { |
| | | try { |
| | | appStore.setProjectConfig(defaultSetting); |
| | | const { colorWeak, grayMode } = defaultSetting; |
| | | updateSidebarBgColor(); |
| | | updateColorWeak(colorWeak); |
| | | updateGrayMode(grayMode); |
| | | createMessage.success(t('layout.setting.resetSuccess')); |
| | | } catch (error: any) { |
| | | createMessage.error(error); |
| | | } |
| | | } |
| | | |
| | | function handleClearAndRedo() { |
| | | localStorage.clear(); |
| | | appStore.resetAllState(); |
| | | permissionStore.resetState(); |
| | | tabStore.resetState(); |
| | | userStore.resetState(); |
| | | location.reload(); |
| | | } |
| | | </script> |
| | | <style lang="less" scoped> |
| | | @prefix-cls: ~'@{namespace}-setting-footer'; |