外链加载时遮罩信息提示

RuoYi

2025-04-30 c88c3d6c69abfad8f6efd23024fc9ce6783b31fc

 src/layout/components/Settings/index.vue

@@ -38,7 +38,7 @@
    <div class="drawer-item">

      <span>开启 TopNav</span>

      <span class="comp-style">

        <el-switch v-model="settingsStore.topNav" class="drawer-switch" />

        <el-switch v-model="settingsStore.topNav" @change="topNavChange" class="drawer-switch" />

      </span>

    </div>



@@ -88,26 +88,36 @@
import usePermissionStore from '@/store/modules/permission'

import { handleThemeStyle } from '@/utils/theme'



const { proxy } = getCurrentInstance();

const { proxy } = getCurrentInstance()

const appStore = useAppStore()

const settingsStore = useSettingsStore()

const permissionStore = usePermissionStore()

const showSettings = ref(false);

const theme = ref(settingsStore.theme);

const sideTheme = ref(settingsStore.sideTheme);

const storeSettings = computed(() => settingsStore);

const predefineColors = ref(["#409EFF", "#ff4500", "#ff8c00", "#ffd700", "#90ee90", "#00ced1", "#1e90ff", "#c71585"]);

const showSettings = ref(false)

const theme = ref(settingsStore.theme)

const sideTheme = ref(settingsStore.sideTheme)

const storeSettings = computed(() => settingsStore)

const predefineColors = ref(["#409EFF", "#ff4500", "#ff8c00", "#ffd700", "#90ee90", "#00ced1", "#1e90ff", "#c71585"])



/** 是否需要topnav */

function topNavChange(val) {

  if (!val) {

    appStore.toggleSideBarHide(false)

    permissionStore.setSidebarRouters(permissionStore.defaultRoutes)

  }

}



function themeChange(val) {

  settingsStore.theme = val;

  handleThemeStyle(val);

  settingsStore.theme = val

  handleThemeStyle(val)

}



function handleTheme(val) {

  settingsStore.sideTheme = val;

  sideTheme.value = val;

  settingsStore.sideTheme = val

  sideTheme.value = val

}



function saveSetting() {

  proxy.$modal.loading("正在保存到本地，请稍候...");

  proxy.$modal.loading("正在保存到本地，请稍候...")

  let layoutSetting = {

    "topNav": storeSettings.value.topNav,

    "tagsView": storeSettings.value.tagsView,

@@ -116,34 +126,38 @@
    "dynamicTitle": storeSettings.value.dynamicTitle,

    "sideTheme": storeSettings.value.sideTheme,

    "theme": storeSettings.value.theme

  };

  localStorage.setItem("layout-setting", JSON.stringify(layoutSetting));

  }

  localStorage.setItem("layout-setting", JSON.stringify(layoutSetting))

  setTimeout(proxy.$modal.closeLoading(), 1000)

}



function resetSetting() {

  proxy.$modal.loading("正在清除设置缓存并刷新，请稍候...");

  proxy.$modal.loading("正在清除设置缓存并刷新，请稍候...")

  localStorage.removeItem("layout-setting")

  setTimeout("window.location.reload()", 1000)

}



function openSetting() {

  showSettings.value = true;

  showSettings.value = true

}



defineExpose({

  openSetting,

  openSetting

})

</script>



<style lang='scss' scoped>

.setting-drawer-title {

  margin-bottom: 12px;

  color: rgba(0, 0, 0, 0.85);

  color: var(--el-text-color-primary, rgba(0, 0, 0, 0.85));

  line-height: 22px;

  font-weight: bold;



  .drawer-title {

    font-size: 14px;

  }

}



.setting-drawer-block-checbox {

  display: flex;

  justify-content: flex-start;

@@ -162,13 +176,6 @@
      height: 48px;

    }



    .custom-img {

      width: 48px;

      height: 38px;

      border-radius: 5px;

      box-shadow: 1px 1px 2px #898484;

    }



    .setting-drawer-block-checbox-selectIcon {

      position: absolute;

      top: 0;

@@ -185,7 +192,7 @@
}



.drawer-item {

  color: rgba(0, 0, 0, 0.65);

  color: var(--el-text-color-regular, rgba(0, 0, 0, 0.65));

  padding: 12px 0;

  font-size: 14px;