pref：优化登录页背景图重复

@@ -7,12 +7,18 @@
 </template>
 </template>
 
 
 <script lang="ts" setup>
 <script lang="ts" setup>
-  import { ConfigProvider } from 'ant-design-vue';
-  import { AppProvider } from '/@/components/Application';
-  import { useTitle } from '/@/hooks/web/useTitle';
-  import { useLocale } from '/@/locales/useLocale';
-  // support Multi-language
-  const { getAntdLocale } = useLocale();
+import { ConfigProvider } from 'ant-design-vue';
+import { AppProvider } from '/@/components/Application';
+import { useTitle } from '/@/hooks/web/useTitle';
+import { useLocale } from '/@/locales/useLocale';
+// support Multi-language
+const { getAntdLocale } = useLocale();
 
 
-  useTitle();
+useTitle();
 </script>
 </script>
+
+<style lang="less">
+/deep/.ant-message-notice-content {
+  max-width: 600px !important;
+}
+</style>

@@ -30,7 +30,7 @@
             :actions="[
             :actions="[
               {
               {
                 label: '编辑',
                 label: '编辑',
-                auth: 'api:yt:alarmContact:update',
+                auth: 'api:yt:alarmContact:update:update',
                 icon: 'clarity:note-edit-line',
                 icon: 'clarity:note-edit-line',
                 onClick: handleCreateOrEdit.bind(null, record),
                 onClick: handleCreateOrEdit.bind(null, record),
               },
               },

 <template>
 <template>
-  <div
-    :style="{ backgroundImage: 'url(' + (logoUrl !== undefined ? logoUrl : '') + ')' }"
-    :class="prefixCls"
-    class="relative w-full h-full px-4"
-  >
-    <AppLocalePicker
-      class="absolute text-white top-4 right-4 enter-x xl:text-gray-600"
-      :showText="false"
-      v-if="!sessionTimeout && showLocale"
-    />
+  <div :style="{ backgroundImage: 'url(' + (logoUrl !== undefined ? logoUrl : '') + ')',backgroundSize:'100% 100%;' }"
+    :class="prefixCls" class="relative w-full h-full px-4">
+    <AppLocalePicker class="absolute text-white top-4 right-4 enter-x xl:text-gray-600" :showText="false"
+      v-if="!sessionTimeout && showLocale" />
     <AppDarkModeToggle class="absolute top-3 right-7 enter-x" v-if="!sessionTimeout" />
     <AppDarkModeToggle class="absolute top-3 right-7 enter-x" v-if="!sessionTimeout" />
 
 
     <span class="-enter-x xl:hidden">
     <span class="-enter-x xl:hidden">
@@ -20,31 +14,20 @@
         <div class="hidden min-h-full pl-4 mr-4 xl:flex xl:flex-col xl:w-6/12">
         <div class="hidden min-h-full pl-4 mr-4 xl:flex xl:flex-col xl:w-6/12">
           <!-- <AppLogo class="-enter-x" /> -->
           <!-- <AppLogo class="-enter-x" /> -->
           <div style="display: flex; margin-top: 10px">
           <div style="display: flex; margin-top: 10px">
-            <img
-              v-if="defaultLogo || getLogo"
-              :src="defaultLogo || getLogo"
-              style="width: 48px; height: 48px"
-            />
+            <img v-if="defaultLogo || getLogo" :src="defaultLogo || getLogo" style="width: 48px; height: 48px" />
             <img style="width: 48px; height: 48px" v-else src="/src/assets/images/logo.png" />
             <img style="width: 48px; height: 48px" v-else src="/src/assets/images/logo.png" />
-            <div
-              class="ml-2 truncate md:opacity-100"
-              style="
+            <div class="ml-2 truncate md:opacity-100" style="
                 line-height: 45px;
                 line-height: 45px;
                 margin-left: 5px;
                 margin-left: 5px;
                 font-size: 24px;
                 font-size: 24px;
                 color: #fff;
                 color: #fff;
                 font-weight: 700;
                 font-weight: 700;
-              "
-            >
+              ">
               {{ defaultTitle || getTitle }}
               {{ defaultTitle || getTitle }}
             </div>
             </div>
           </div>
           </div>
           <div v-if="ifCustom" class="my-auto">
           <div v-if="ifCustom" class="my-auto">
-            <img
-              :alt="title"
-              src="../../../assets/svg/thingskit-login-background.svg"
-              class="w-1/2 -mt-16 -enter-x"
-            />
+            <img :alt="title" src="../../../assets/svg/thingskit-login-background.svg" class="w-1/2 -mt-16 -enter-x" />
             <div class="mt-10 font-medium text-white -enter-x">
             <div class="mt-10 font-medium text-white -enter-x">
               <span class="inline-block mt-4 text-3xl"> {{ t('sys.login.signInTitle') }}</span>
               <span class="inline-block mt-4 text-3xl"> {{ t('sys.login.signInTitle') }}</span>
             </div>
             </div>
@@ -54,10 +37,8 @@
           </div>
           </div>
         </div>
         </div>
         <div class="flex w-full h-full py-5 xl:h-auto xl:py-0 xl:my-0 xl:w-6/12">
         <div class="flex w-full h-full py-5 xl:h-auto xl:py-0 xl:my-0 xl:w-6/12">
-          <div
-            :class="`${prefixCls}-form`"
-            class="relative w-full px-5 py-8 mx-auto my-auto rounded-md shadow-md xl:ml-16 xl:bg-transparent sm:px-8 xl:p-4 xl:shadow-none sm:w-3/4 lg:w-2/4 xl:w-auto enter-x"
-          >
+          <div :class="`${prefixCls}-form`"
+            class="relative w-full px-5 py-8 mx-auto my-auto rounded-md shadow-md xl:ml-16 xl:bg-transparent sm:px-8 xl:p-4 xl:shadow-none sm:w-3/4 lg:w-2/4 xl:w-auto enter-x">
             <LoginForm />
             <LoginForm />
             <ForgetPasswordForm />
             <ForgetPasswordForm />
             <RegisterForm />
             <RegisterForm />
@@ -69,213 +50,213 @@
   </div>
   </div>
 </template>
 </template>
 <script lang="ts" setup>
 <script lang="ts" setup>
-  import { computed, ref, onMounted } from 'vue';
-  // import { AppLogo } from '/@/components/Application';
-  import { AppLocalePicker, AppDarkModeToggle } from '/@/components/Application';
-  import LoginForm from './LoginForm.vue';
-  import ForgetPasswordForm from './ForgetPasswordForm.vue';
-  import RegisterForm from './RegisterForm.vue';
-  import MobileForm from './MobileForm.vue';
-  import { useGlobSetting } from '/@/hooks/setting';
-  import { useI18n } from '/@/hooks/web/useI18n';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { useLocaleStore } from '/@/store/modules/locale';
-  import { useUserStore } from '/@/store/modules/user';
-  import { getPlatForm } from '/@/api/oem/index';
-
-  defineProps({
-    sessionTimeout: {
-      type: Boolean,
-    },
-  });
-  const defaultTitle = ref('');
-  const defaultLogo = ref('');
-  const logoUrl = ref('');
-  onMounted(async () => {
-    const res = await getPlatForm();
-    logoUrl.value = res?.background;
-    defaultTitle.value = res?.name;
-    defaultLogo.value = res?.logo;
-    if (logoUrl.value !== undefined) {
-      ifCustom.value = false;
-    } else {
-      const defaultLogo = 'src/assets/svg/login-bg.svg';
-      logoUrl.value = 'url(' + defaultLogo + ')';
-    }
-  });
-
-  const userStore = useUserStore();
-
-  const ifCustom = ref(true);
-  const getLogo = computed(() => {
-    return userStore.platInfo?.logo;
-  });
-  const { title } = useGlobSetting();
-  const getTitle = computed(() => {
-    // 设置icon
-    let link = (document.querySelector("link[rel*='icon']") ||
-      document.createElement('link')) as HTMLLinkElement;
-    link.type = 'image/x-icon';
-    link.rel = 'shortcut icon';
-    link.href = userStore.platInfo?.icon ?? '/favicon.ico';
-    document.getElementsByTagName('head')[0].appendChild(link);
-    logoUrl.value = userStore.platInfo?.background;
-    if (logoUrl.value !== undefined) {
-      ifCustom.value = false;
-    } else {
-      const defaultLogo = 'src/assets/svg/login-bg.svg';
-      logoUrl.value = 'url(' + defaultLogo + ')';
-    }
-    return userStore.platInfo?.name ?? title;
-  });
-  // const globSetting = useGlobSetting();
-  const { prefixCls } = useDesign('login');
-  const { t } = useI18n();
-  const localeStore = useLocaleStore();
-  const showLocale = localeStore.getShowPicker;
+import { computed, ref, onMounted } from 'vue';
+// import { AppLogo } from '/@/components/Application';
+import { AppLocalePicker, AppDarkModeToggle } from '/@/components/Application';
+import LoginForm from './LoginForm.vue';
+import ForgetPasswordForm from './ForgetPasswordForm.vue';
+import RegisterForm from './RegisterForm.vue';
+import MobileForm from './MobileForm.vue';
+import { useGlobSetting } from '/@/hooks/setting';
+import { useI18n } from '/@/hooks/web/useI18n';
+import { useDesign } from '/@/hooks/web/useDesign';
+import { useLocaleStore } from '/@/store/modules/locale';
+import { useUserStore } from '/@/store/modules/user';
+import { getPlatForm } from '/@/api/oem/index';
+
+defineProps({
+  sessionTimeout: {
+    type: Boolean,
+  },
+});
+const defaultTitle = ref('');
+const defaultLogo = ref('');
+const logoUrl = ref('');
+onMounted(async () => {
+  const res = await getPlatForm();
+  logoUrl.value = res?.background;
+  defaultTitle.value = res?.name;
+  defaultLogo.value = res?.logo;
+  if (logoUrl.value !== undefined) {
+    ifCustom.value = false;
+  } else {
+    const defaultLogo = 'src/assets/svg/login-bg.svg';
+    logoUrl.value = 'url(' + defaultLogo + ')';
+  }
+});
+
+const userStore = useUserStore();
+
+const ifCustom = ref(true);
+const getLogo = computed(() => {
+  return userStore.platInfo?.logo;
+});
+const { title } = useGlobSetting();
+const getTitle = computed(() => {
+  // 设置icon
+  let link = (document.querySelector("link[rel*='icon']") ||
+    document.createElement('link')) as HTMLLinkElement;
+  link.type = 'image/x-icon';
+  link.rel = 'shortcut icon';
+  link.href = userStore.platInfo?.icon ?? '/favicon.ico';
+  document.getElementsByTagName('head')[0].appendChild(link);
+  logoUrl.value = userStore.platInfo?.background;
+  if (logoUrl.value !== undefined) {
+    ifCustom.value = false;
+  } else {
+    const defaultLogo = 'src/assets/svg/login-bg.svg';
+    logoUrl.value = 'url(' + defaultLogo + ')';
+  }
+  return userStore.platInfo?.name ?? title;
+});
+// const globSetting = useGlobSetting();
+const { prefixCls } = useDesign('login');
+const { t } = useI18n();
+const localeStore = useLocaleStore();
+const showLocale = localeStore.getShowPicker;
   // const title = computed(() => globSetting?.title ?? '');
   // const title = computed(() => globSetting?.title ?? '');
 </script>
 </script>
 <style lang="less">
 <style lang="less">
-  @prefix-cls: ~'@{namespace}-login';
-  @logo-prefix-cls: ~'@{namespace}-app-logo';
-  @countdown-prefix-cls: ~'@{namespace}-countdown-input';
-  @dark-bg: #293146;
+@prefix-cls: ~'@{namespace}-login';
+@logo-prefix-cls: ~'@{namespace}-app-logo';
+@countdown-prefix-cls: ~'@{namespace}-countdown-input';
+@dark-bg: #293146;
 
 
-  html[data-theme='dark'] {
-    .@{prefix-cls} {
-      background-color: @dark-bg;
+html[data-theme='dark'] {
+  .@{prefix-cls} {
+    background-color: @dark-bg;
 
 
-      &::before {
-        background-image: url(/@/assets/svg/login-bg-dark.svg);
-      }
+    &::before {
+      background-image: url(/@/assets/svg/login-bg-dark.svg);
+    }
 
 
-      .ant-input,
-      .ant-input-password {
-        background-color: #232a3b;
-      }
+    .ant-input,
+    .ant-input-password {
+      background-color: #232a3b;
+    }
 
 
-      .ant-btn:not(.ant-btn-link):not(.ant-btn-primary) {
-        border: 1px solid #4a5569;
-      }
+    .ant-btn:not(.ant-btn-link):not(.ant-btn-primary) {
+      border: 1px solid #4a5569;
+    }
 
 
-      &-form {
-        background: transparent !important;
-      }
+    &-form {
+      background: transparent !important;
+    }
 
 
-      .app-iconify {
-        color: #fff;
-      }
+    .app-iconify {
+      color: #fff;
     }
     }
+  }
 
 
-    input.fix-auto-fill,
-    .fix-auto-fill input {
-      -webkit-text-fill-color: #c9d1d9 !important;
-      box-shadow: inherit !important;
+  input.fix-auto-fill,
+  .fix-auto-fill input {
+    -webkit-text-fill-color: #c9d1d9 !important;
+    box-shadow: inherit !important;
+  }
+}
+
+.@{prefix-cls} {
+  min-height: 100%;
+  overflow: hidden;
+
+  @media (max-width: @screen-xl) {
+    background-color: #293146;
+
+    .@{prefix-cls}-form {
+      background-color: #fff;
     }
     }
   }
   }
 
 
-  .@{prefix-cls} {
-    min-height: 100%;
-    overflow: hidden;
+  &::before {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    margin-left: -48%;
+    background-image: v-bind(logoUrl);
+    // background-image: url(/@/assets/svg/login-bg.svg);
+    background-position: 100%;
+    background-repeat: no-repeat;
+    background-size: auto 100%;
+    content: '';
 
 
     @media (max-width: @screen-xl) {
     @media (max-width: @screen-xl) {
-      background-color: #293146;
+      display: none;
+    }
+  }
 
 
-      .@{prefix-cls}-form {
-        background-color: #fff;
-      }
+  .@{logo-prefix-cls} {
+    position: absolute;
+    top: 12px;
+    height: 30px;
+
+    &__title {
+      font-size: 16px;
+      color: #fff;
     }
     }
 
 
-    &::before {
-      position: absolute;
-      top: 0;
-      left: 0;
-      width: 100%;
-      height: 100%;
-      margin-left: -48%;
-      background-image: v-bind(logoUrl);
-      // background-image: url(/@/assets/svg/login-bg.svg);
-      background-position: 100%;
-      background-repeat: no-repeat;
-      background-size: auto 100%;
-      content: '';
-
-      @media (max-width: @screen-xl) {
-        display: none;
-      }
+    img {
+      width: 32px;
     }
     }
+  }
 
 
+  .container {
     .@{logo-prefix-cls} {
     .@{logo-prefix-cls} {
-      position: absolute;
-      top: 12px;
-      height: 30px;
+      display: flex;
+      width: 60%;
+      height: 80px;
 
 
       &__title {
       &__title {
-        font-size: 16px;
+        font-size: 24px;
         color: #fff;
         color: #fff;
       }
       }
 
 
       img {
       img {
-        width: 32px;
+        width: 48px;
       }
       }
     }
     }
+  }
 
 
-    .container {
-      .@{logo-prefix-cls} {
-        display: flex;
-        width: 60%;
-        height: 80px;
-
-        &__title {
-          font-size: 24px;
-          color: #fff;
-        }
+  &-sign-in-way {
+    .anticon {
+      font-size: 22px;
+      color: #888;
+      cursor: pointer;
 
 
-        img {
-          width: 48px;
-        }
+      &:hover {
+        color: @primary-color;
       }
       }
     }
     }
+  }
 
 
-    &-sign-in-way {
-      .anticon {
-        font-size: 22px;
-        color: #888;
-        cursor: pointer;
+  input:not([type='checkbox']) {
+    min-width: 360px;
 
 
-        &:hover {
-          color: @primary-color;
-        }
-      }
+    @media (max-width: @screen-xl) {
+      min-width: 320px;
     }
     }
 
 
-    input:not([type='checkbox']) {
-      min-width: 360px;
-
-      @media (max-width: @screen-xl) {
-        min-width: 320px;
-      }
-
-      @media (max-width: @screen-lg) {
-        min-width: 260px;
-      }
-
-      @media (max-width: @screen-md) {
-        min-width: 240px;
-      }
-
-      @media (max-width: @screen-sm) {
-        min-width: 160px;
-      }
+    @media (max-width: @screen-lg) {
+      min-width: 260px;
     }
     }
 
 
-    .@{countdown-prefix-cls} input {
-      min-width: unset;
+    @media (max-width: @screen-md) {
+      min-width: 240px;
     }
     }
 
 
-    .ant-divider-inner-text {
-      font-size: 12px;
-      color: @text-color-secondary;
+    @media (max-width: @screen-sm) {
+      min-width: 160px;
     }
     }
   }
   }
+
+  .@{countdown-prefix-cls} input {
+    min-width: unset;
+  }
+
+  .ant-divider-inner-text {
+    font-size: 12px;
+    color: @text-color-secondary;
+  }
+}
 </style>
 </style>