1、添加登录轮播背景图

.env.development

@@ -11,7 +11,7 @@ VITE_PUBLIC_PATH = /
 # 可以有多个，注意多个不能换行，否则代理将会失效
 #VITE_PROXY = [["/api","http://localhost:3000"],["/upload","http://localhost:3300/upload"]]
 #VITE_PROXY=[["/api/workflow","http://10.0.0.2:8093/workflow/"],["/api","http://10.10.2.102:9500"]]
-VITE_PROXY=[["/api/magic-api/","http://127.0.0.1:8097","/magic-api/"],["/api","http://10.10.2.102:9500"]]
+VITE_PROXY=[["/api","http://10.10.2.102:9500"]]
 #VITE_PROXY=[["/api/approve/","http://127.0.0.1:8096","/approve/"],["/api","http://10.10.2.102:9500"]]
 #VITE_PROXY=[["/api/system/generator/","http://127.0.0.1:8091/system/generator/"],["/api/system/file/","http://127.0.0.1:8091/system/file/"],["/api/system/oss/","http://127.0.0.1:8091/system/oss/"],["/api/sales/","http://127.0.0.1:8096","/sales/"],["/api/mdm/","http://127.0.0.1:8096","/mdm/"],["/api","http://10.10.2.102:9500"]]
 #VITE_PROXY=[["/api/sales/","http://127.0.0.1:8096","/sales/"],["/api/mdm/","http://127.0.0.1:8096","/mdm/"],["/api","http://10.10.2.102:9500"]]

Dockerfile

@@ -15,4 +15,4 @@ VOLUME ["/etc/nginx/nginx.conf", "/usr/share/nginx/html"]
 
 CMD ["nginx","-g","daemon off;"]
 
-# docker build -t docker.ges.bjgastx.com/itc-web:1.1.17 .
+# docker build -t docker.ges.bjgastx.com/itc-web:1.1.18 .

src/views/secondDev/Login.vue

@@ -1,7 +1,7 @@
 <template>
     <div class="t-container">
        <!--  <StarBackground3 /> -->
-        <!-- <LoginCarousel /> -->
+        <LoginCarousel />
         <div :class="prefixCls" class="login-box relative w-full h-full" v-if="!isSingleLogin">
             <div class="center-box">
                 <div class="login-left-title">

src/views/secondDev/LoginCarousel.vue

@@ -1,5 +1,5 @@
 <template>
-  <a-carousel class="login-carousel" autoplay>
+  <a-carousel class="login-carousel" :dots="false" autoplay>
     <LoginCarouselImg v-for="img in imgs" :key="img.src" :src="img.src" :thumbnail="img.thumbnail"></LoginCarouselImg>
   </a-carousel>
 </template>
@@ -7,6 +7,16 @@
 import { defineComponent, h } from 'vue';
 
 // 导入图片资源
+import img1 from '/@/assets/images/login/1.jpg';
+import img2 from '/@/assets/images/login/2.jpg';
+import img3 from '/@/assets/images/login/3.jpg';
+import img4 from '/@/assets/images/login/4.jpg';
+import img5 from '/@/assets/images/login/5.jpg';
+import thumb1 from '/@/assets/images/login/thum/1.jpg';
+import thumb2 from '/@/assets/images/login/thum/2.jpg';
+import thumb3 from '/@/assets/images/login/thum/3.jpg';
+import thumb4 from '/@/assets/images/login/thum/4.jpg';
+import thumb5 from '/@/assets/images/login/thum/5.jpg';
 
 const LoginCarouselImg = defineComponent({
   name: 'LoginCarouselImg',
@@ -27,6 +37,28 @@ const LoginCarouselImg = defineComponent({
   setup() {
     return {};
   },
+  mounted(){
+     // 懒加载图片
+     if(this.src) {
+       this.loadImage();
+     }
+  },
+  methods: {
+    loadImage() {
+      // 创建 Image 对象预加载高清图片
+      const img = new Image();
+      img.onload = () => {
+        // 图片加载完成后切换到高清图
+        this.reader = true;
+      };
+      img.onerror = () => {
+        console.warn('高清图片加载失败:', this.src);
+        // 加载失败时使用缩略图
+        this.reader = false;
+      };
+      img.src = this.src;
+    }
+  },
   data() {
     return {
       reader: false, 
@@ -37,7 +69,9 @@ const LoginCarouselImg = defineComponent({
     return h('div', { class: 'carousel-item' }, [
       h('img', { 
         src: (this.reader ? this.src : this.thumbnail), 
-        alt: this.alt || '' 
+        alt: this.alt || '',
+        witth:"auto",
+        height:"100%"
       }),
     ]);
   },
@@ -55,11 +89,11 @@ export default defineComponent({
   data() {
     return {
         imgs: [
-        { src: new URL('/@/assets/images/login/1.png', import.meta.url).href, thumbnail: new URL('/@/assets/images/login/thum/1.png', import.meta.url).href, alt: '' },
+        { src: img1, thumbnail: thumb1, alt: '' },
-        { src: new URL('/@/assets/images/login/2.png', import.meta.url).href, thumbnail: new URL('/@/assets/images/login/thum/2.png', import.meta.url).href, alt: '' },
+        { src: img2, thumbnail: thumb2, alt: '' },
-        { src: new URL('/@/assets/images/login/3.png', import.meta.url).href, thumbnail: new URL('/@/assets/images/login/thum/3.png', import.meta.url).href, alt: '' },
+        { src: img3, thumbnail: thumb3, alt: '' },
-        { src: new URL('/@/assets/images/login/4.png', import.meta.url).href, thumbnail: new URL('/@/assets/images/login/thum/4.png', import.meta.url).href, alt: '' },
+        { src: img4, thumbnail: thumb4, alt: '' },
-        { src: new URL('/@/assets/images/login/5.png', import.meta.url).href, thumbnail: new URL('/@/assets/images/login/thum/5.png', import.meta.url).href, alt: '' },
+        { src: img5, thumbnail: thumb5, alt: '' },
         ],
     };
   },
@@ -74,6 +108,12 @@ export default defineComponent({
   width: 100%;
   height: 100%;
   z-index: 0;
+  overflow: hidden;
+}
+
+.carousel-item{
+   height: 98%;
+   width: auto !important;
 }