fix: 背景图支持还原默认

src/store/modules/app.ts

@@ -78,8 +78,8 @@ const useAppStore = defineStore('app', {
      */
     getLoginBackground(state) {
       const path = state.loginBackground;
-      if (!path) {
-        return '';
+      if (!path || path === '#') {
+        return '#';
       }
       if (validHttp(path)) {
         return path;

src/views/login.vue

@@ -89,7 +89,7 @@ function fnGetCaptcha() {
 // 判断是否有背景地址
 const calcBG = computed(() => {
   const bgURL = appStore.getLoginBackground;
-  if (bgURL) {
+  if (bgURL && bgURL !== '#') {
     return {
       backgroundImage: `url(${bgURL})`,
       backgroundPosition: 'center',
@@ -101,9 +101,6 @@ const calcBG = computed(() => {
 
 onMounted(() => {
   fnGetCaptcha();
-  const container = document.getElementsByClassName('container').item(0);
-  if (container) {
-  }
 });
 
 /**改变多语言 */

src/views/system/setting/components/change-login-bg.vue

@@ -76,7 +76,7 @@ function fnUpload(up: UploadRequestOption) {
 function fnEdit(v: boolean) {
   state.edite = v;
   if (!v) {
-    state.filePath = '';
+    state.filePath = '#';
     state.flag = appStore.getLoginBackground;
   }
 }
@@ -107,8 +107,35 @@ function fnSave() {
   });
 }
 
+/**还原初始背景 */
+function fnRevert() {
+  Modal.confirm({
+    title: '提示',
+    content: `确认要将背景图还原到系统初始默认的背景吗?`,
+    onOk() {
+      // 发送请求
+      const hide = message.loading('请稍等...', 0);
+      state.loading = true;
+      state.filePath = '#';
+      changeValue({ key: 'sys.loginBackground', value: state.filePath }).then(
+        res => {
+          state.loading = false;
+          hide();
+          if (res.code === RESULT_CODE_SUCCESS) {
+            message.success('还原成功', 3);
+            appStore.loginBackground = state.filePath;
+            fnEdit(false);
+          } else {
+            message.error(res.msg, 3);
+          }
+        }
+      );
+    },
+  });
+}
+
 onMounted(() => {
-  state.filePath = '';
+  state.filePath = appStore.getLoginBackground;
   state.flag = appStore.getLoginBackground;
 });
 </script>
@@ -117,7 +144,8 @@ onMounted(() => {
   <a-row :gutter="16">
     <a-col :lg="12" :md="12" :xs="24" style="margin-bottom: 30px">
       <div class="sys-login-bg">
-        <a-image :src="state.flag" />
+        <span v-if="state.flag === '#'">暂无背景图</span>
+        <a-image :src="state.flag" v-else />
       </div>
 
       <a-form layout="vertical" v-if="state.edite">
@@ -152,14 +180,18 @@ onMounted(() => {
       </a-form>
 
       <template v-else>
-        <a-button type="dashed" @click="fnEdit(true)"> 编辑 </a-button>
+        <a-button type="default" @click="fnEdit(true)"> 编辑 </a-button>
+        <a-button type="text" danger style="margin-left: 10px" @click="fnRevert">
+          还原
+        </a-button>
       </template>
     </a-col>
     <a-col :lg="12" :md="12" :xs="24">
       <a-typography>
         <a-typography-paragraph>
-          系统登录界面背景样式如预览区域所示<br />
-          请将选择合适的图片进行进行上传。
+          系统登录界面背景样式如预览区域所示，请以实际显示为准<br />
+          请将选择合适的图片进行进行上传。<br />
+          通过点击《还原》按钮，将背景图还原到系统初始默认的背景。
         </a-typography-paragraph>
       </a-typography>
     </a-col>
@@ -169,7 +201,9 @@ onMounted(() => {
 <style lang="less" scoped>
 .sys-login-bg {
   width: 300px;
+  min-height: 150px;
   border: 1px var(--ant-primary-color) solid;
   margin-bottom: 24px;
+  text-align: center;
 }
 </style>