From 5a813f3b28f3cbf1db3a3657ccf83267c6e0d315 Mon Sep 17 00:00:00 2001
From: Ben Lin <maobin001@msn.com>
Date: 星期四, 24 十月 2024 11:22:02 +0800
Subject: [PATCH] 工艺路线相关优化

---
 src/views/sys/login/Login.vue |  108 ++++++++++++++++++++++++++----------------------------
 1 files changed, 52 insertions(+), 56 deletions(-)

diff --git a/src/views/sys/login/Login.vue b/src/views/sys/login/Login.vue
index dd11c68..fc2147e 100644
--- a/src/views/sys/login/Login.vue
+++ b/src/views/sys/login/Login.vue
@@ -1,20 +1,22 @@
 <template>
   <div :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" />
+    <div class="flex items-center absolute right-4 top-4">
+      <AppDarkModeToggle class="enter-x mr-2" v-if="!sessionTimeout" />
+      <AppLocalePicker
+        class="text-white enter-x xl:text-gray-600"
+        :show-text="false"
+        v-if="!sessionTimeout && showLocale"
+      />
+    </div>
 
-    <!-- <span class="-enter-x xl:hidden">
-      <AppLogo :alwaysShowTitle="true" />
-    </span> -->
+    <span class="mt-5 -enter-x xl:hidden">
+      <LoginLogo :alwaysShowTitle="false" />
+    </span>
 
     <div class="container relative h-full py-2 mx-auto sm:px-10">
       <div class="flex h-full">
         <div class="hidden min-h-full pl-4 mr-4 xl:flex xl:flex-col xl:w-6/12">
-          <AppLogo class="-enter-x"/>
+          <loginLogo class="-enter-x" />
           <div class="my-auto">
             <!-- <img
               :alt="title"
@@ -22,9 +24,10 @@
               class="w-1/2 -mt-16 -enter-x"
             /> -->
             <div class="mt-10 font-medium text-white -enter-x">
-              <span class="inline-block mt-4 text-3xl"> {{ t('楦块箘浠撳偍绠$悊WMS绯荤粺') }}</span>
+              <span v-if="!IsMes" class="inline-block mt-4 text-3xl"> {{ t('楦块箘鏅鸿兘鏅洪�燱MS绯荤粺') }}</span>
+              <span v-if="IsMes" class="inline-block mt-4 text-3xl"> {{ t('楦块箘鏅鸿兘鏅洪�燤ES绯荤粺') }}</span>
             </div>
-            <div class="mt-5 font-normal text-white text-md dark:text-gray-500 -enter-x">
+            <div class="mt-5 font-normal text-white dark:text-gray-500 -enter-x">
               {{ t('鏈潵鍙 鏁板瓧鍖栨櫤閫犲钩鍙�') }}
             </div>
           </div>
@@ -36,9 +39,9 @@
           >
             <LoginForm />
             <ForgetPasswordForm />
-            <!-- <RegisterForm />
+            <RegisterForm />
             <MobileForm />
-            <QrCodeForm /> -->
+            <QrCodeForm />
           </div>
         </div>
       </div>
@@ -46,15 +49,17 @@
   </div>
 </template>
 <script lang="ts" setup>
-  import { computed } from 'vue';
-  import { AppLogo } from '/@/components/Application';
-  import { AppLocalePicker } from '/@/components/Application';
-  import LoginForm from './LoginForm.vue';
+  import { AppDarkModeToggle, AppLocalePicker, AppLogo, LoginLogo } from '@/components/Application';
+  import { useGlobSetting } from '@/hooks/setting';
+  import { useDesign } from '@/hooks/web/useDesign';
+  import { useI18n } from '@/hooks/web/useI18n';
+  import { useLocaleStore } from '@/store/modules/locale';
+  import { computed, ref } from 'vue';
   import ForgetPasswordForm from './ForgetPasswordForm.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 LoginForm from './LoginForm.vue';
+  import MobileForm from './MobileForm.vue';
+  import QrCodeForm from './QrCodeForm.vue';
+  import RegisterForm from './RegisterForm.vue';
 
   defineProps({
     sessionTimeout: {
@@ -68,6 +73,7 @@
   const localeStore = useLocaleStore();
   const showLocale = localeStore.getShowPicker;
   const title = computed(() => globSetting?.title ?? '');
+  const IsMes = ref(globSetting.systemType == 'MES');
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-login';
@@ -80,7 +86,7 @@
       background-color: @dark-bg;
 
       &::before {
-        background-image: url(/@/assets/svg/login-bg-dark.svg);
+        background-image: url('@/assets/svg/login-bg-dark.svg');
       }
 
       .ant-input,
@@ -88,7 +94,7 @@
         background-color: #232a3b;
       }
 
-      .ant-btn:not(.ant-btn-link):not(.ant-btn-primary) {
+      .ant-btn:not(.ant-btn-link, .ant-btn-primary) {
         border: 1px solid #4a5569;
       }
 
@@ -99,12 +105,10 @@
       .app-iconify {
         color: #fff;
       }
-    }
 
-    input.fix-auto-fill,
-    .fix-auto-fill input {
-      -webkit-text-fill-color: #c9d1d9 !important;
-      box-shadow: inherit !important;
+      .ant-divider-inner-text {
+        color: @text-color-secondary;
+      }
     }
   }
 
@@ -112,6 +116,7 @@
     min-height: 100%;
     overflow: hidden;
 
+    /* stylelint-disable-next-line media-query-no-invalid */
     @media (max-width: @screen-xl) {
       background-color: #293146;
 
@@ -121,18 +126,18 @@
     }
 
     &::before {
+      content: '';
       position: absolute;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       margin-left: -48%;
-      background-image: url(/@/assets/svg/login-bg.svg);
-      background-position: 100%;
+      background-image: url('@/assets/svg/login-bg.svg');
       background-repeat: no-repeat;
+      background-position: 100%;
       background-size: auto 100%;
-      content: '';
-
+      /* stylelint-disable-next-line media-query-no-invalid */
       @media (max-width: @screen-xl) {
         display: none;
       }
@@ -140,45 +145,40 @@
 
     .@{logo-prefix-cls} {
       position: absolute;
-      // top: 12px;
-      top:69px;
+      top: 12px;
       height: 30px;
 
       &__title {
-        // font-size: 16px;
         color: #fff;
+        font-size: 16px;
       }
+
       img {
         width: 32px;
       }
     }
+
     .container {
       .@{logo-prefix-cls} {
         display: flex;
-        // width: 60%;
-        width: 20%;
+        width: 60%;
         height: 80px;
-        flex-direction: column;
-        justify-content: center;
-        // align-items: flex-start;
 
         &__title {
-          // font-size: 24px;
-          // color: #fff;
-          color:red;
-          text-shadow: 1px 1px 1px #fff;
+          color: #fff;
+          font-size: 24px;
         }
 
         img {
-          width:280px; //48px;
+          width: 220px; //48px;
         }
       }
     }
 
     &-sign-in-way {
       .anticon {
-        font-size: 22px;
         color: #888;
+        font-size: 22px;
         cursor: pointer;
 
         &:hover {
@@ -186,21 +186,22 @@
         }
       }
     }
+
     input:not([type='checkbox']) {
       min-width: 360px;
-
+      /* stylelint-disable-next-line media-query-no-invalid */
       @media (max-width: @screen-xl) {
         min-width: 320px;
       }
-
+      /* stylelint-disable-next-line media-query-no-invalid */
       @media (max-width: @screen-lg) {
         min-width: 260px;
       }
-
+      /* stylelint-disable-next-line media-query-no-invalid */
       @media (max-width: @screen-md) {
         min-width: 240px;
       }
-
+      /* stylelint-disable-next-line media-query-no-invalid */
       @media (max-width: @screen-sm) {
         min-width: 160px;
       }
@@ -208,11 +209,6 @@
 
     .@{countdown-prefix-cls} input {
       min-width: unset;
-    }
-
-    .ant-divider-inner-text {
-      font-size: 12px;
-      color: @text-color-secondary;
     }
   }
 </style>

--
Gitblit v1.9.3