123

2 years ago · 90decd8232
4 changed files with 155 additions and 123 deletions
--- a/logo.ico
+++ b/logo.ico
--- a/src/mock/case.js
+++ b/src/mock/case.js
@ -476,7 +476,7 @@ import A54 from '@/assets/img/all_case/54.jpg'
 import A55 from '@/assets/img/all_case/55.jpg'
 import A56 from '@/assets/img/all_case/56.jpg'

-export const allCaseList = [
+export const allCaseList1 = [
  {
    id: '1',
    picUrl: A1,
@ -585,120 +585,9 @@ export const allCaseList = [
    example_id: '5',
    industry_id: '3',
  },
-  {
-    id: '19',
-    picUrl: A19,
-    example_id: '6',
-    industry_id: '3',
-  },
-  {
-    id: '20',
-    picUrl: A20,
-    example_id: '7',
-    industry_id: '3',
-  },
-  {
-    id: '21',
-    picUrl: A21,
-    example_id: '8',
-    industry_id: '3',
-  },
-  {
-    id: '22',
-    picUrl: A22,
-    example_id: '1',
-    industry_id: '4',
-  },
-  {
-    id: '23',
-    picUrl: A23,
-    example_id: '2',
-    industry_id: '4',
-  },
-  {
-    id: '24',
-    picUrl: A24,
-    example_id: '3',
-    industry_id: '4',
-  },
-  {
-    id: '25',
-    picUrl: A25,
-    example_id: '4',
-    industry_id: '4',
-  },
-  {
-    id: '26',
-    picUrl: A26,
-    example_id: '1',
-    industry_id: '5',
-  },
-  {
-    id: '27',
-    picUrl: A27,
-    example_id: '2',
-    industry_id: '5',
-  },
-  {
-    id: '28',
-    picUrl: A28,
-    example_id: '3',
-    industry_id: '5',
-  },
-  {
-    id: '29',
-    picUrl: A29,
-    example_id: '4',
-    industry_id: '5',
-  },
-  {
-    id: '30',
-    picUrl: A30,
-    example_id: '5',
-    industry_id: '5',
-  },
-  {
-    id: '31',
-    picUrl: A31,
-    example_id: '1',
-    industry_id: '6',
-  },
-  {
-    id: '32',
-    picUrl: A32,
-    example_id: '2',
-    industry_id: '6',
-  },
-  {
-    id: '33',
-    picUrl: A33,
-    example_id: '3',
-    industry_id: '6',
-  },
-  {
-    id: '34',
-    picUrl: A34,
-    example_id: '1',
-    industry_id: '7',
-  },
-  {
-    id: '35',
-    picUrl: A35,
-    example_id: '2',
-    industry_id: '7',
-  },
-  {
-    id: '36',
-    picUrl: A36,
-    example_id: '3',
-    industry_id: '7',
-  },
-  {
-    id: '37',
-    picUrl: A37,
-    example_id: '4',
-    industry_id: '7',
-  },
+]
+
+export const allCaseList3 = [
  {
    id: '38',
    picUrl: A38,
@ -814,3 +703,120 @@ export const allCaseList = [
    industry_id: '9',
  },
 ]
+
+export const allCaseList2 = [
+  {
+    id: '19',
+    picUrl: A19,
+    example_id: '6',
+    industry_id: '3',
+  },
+  {
+    id: '20',
+    picUrl: A20,
+    example_id: '7',
+    industry_id: '3',
+  },
+  {
+    id: '21',
+    picUrl: A21,
+    example_id: '8',
+    industry_id: '3',
+  },
+  {
+    id: '22',
+    picUrl: A22,
+    example_id: '1',
+    industry_id: '4',
+  },
+  {
+    id: '23',
+    picUrl: A23,
+    example_id: '2',
+    industry_id: '4',
+  },
+  {
+    id: '24',
+    picUrl: A24,
+    example_id: '3',
+    industry_id: '4',
+  },
+  {
+    id: '25',
+    picUrl: A25,
+    example_id: '4',
+    industry_id: '4',
+  },
+  {
+    id: '26',
+    picUrl: A26,
+    example_id: '1',
+    industry_id: '5',
+  },
+  {
+    id: '27',
+    picUrl: A27,
+    example_id: '2',
+    industry_id: '5',
+  },
+  {
+    id: '28',
+    picUrl: A28,
+    example_id: '3',
+    industry_id: '5',
+  },
+  {
+    id: '29',
+    picUrl: A29,
+    example_id: '4',
+    industry_id: '5',
+  },
+  {
+    id: '30',
+    picUrl: A30,
+    example_id: '5',
+    industry_id: '5',
+  },
+  {
+    id: '31',
+    picUrl: A31,
+    example_id: '1',
+    industry_id: '6',
+  },
+  {
+    id: '32',
+    picUrl: A32,
+    example_id: '2',
+    industry_id: '6',
+  },
+  {
+    id: '33',
+    picUrl: A33,
+    example_id: '3',
+    industry_id: '6',
+  },
+  {
+    id: '34',
+    picUrl: A34,
+    example_id: '1',
+    industry_id: '7',
+  },
+  {
+    id: '35',
+    picUrl: A35,
+    example_id: '2',
+    industry_id: '7',
+  },
+  {
+    id: '36',
+    picUrl: A36,
+    example_id: '3',
+    industry_id: '7',
+  },
+  {
+    id: '37',
+    picUrl: A37,
+    example_id: '4',
+    industry_id: '7',
+  },
+]
--- a/src/views/Index/components/CasePictureList/index.vue
+++ b/src/views/Index/components/CasePictureList/index.vue
@ -63,10 +63,11 @@
                duration="100"
                :pauseOnHover="true"
                :pauseOnClick="true"
+                style="height: 100%"
              >
                <div
                  class="img_card"
-                  v-for="item in allCaseList"
+                  v-for="item in allCaseList1"
                  :key="item.id"
                >
                  <img class="pic" :src="item.picUrl" alt="" />
@ -87,11 +88,21 @@
                duration="100"
                :pauseOnHover="true"
                :pauseOnClick="true"
+                style="height: 100%"
              >
-                <div class="img_card" v-for="item in 20" :key="item">
-                  <img class="pic" :src="A1" alt="" />
+                <div
+                  class="img_card"
+                  v-for="item in allCaseList2"
+                  :key="item.id"
+                >
+                  <img class="pic" :src="item.picUrl" alt="" />
                  <div class="dialog_text">
-                    <div class="btn">查看详情</div>
+                    <div
+                      class="btn"
+                      @click="toDetail(item.example_id, item.industry_id)"
+                    >
+                      查看详情
+                    </div>
                  </div>
                </div>
              </Vue3Marquee>
@ -101,11 +112,21 @@
                duration="100"
                :pauseOnHover="true"
                :pauseOnClick="true"
+                style="height: 100%"
              >
-                <div class="img_card" v-for="item in 30" :key="item">
-                  <img class="pic" :src="A1" alt="" />
+                <div
+                  class="img_card"
+                  v-for="item in allCaseList3"
+                  :key="item.id"
+                >
+                  <img class="pic" :src="item.picUrl" alt="" />
                  <div class="dialog_text">
-                    <div class="btn">查看详情</div>
+                    <div
+                      class="btn"
+                      @click="toDetail(item.example_id, item.industry_id)"
+                    >
+                      查看详情
+                    </div>
                  </div>
                </div>
              </Vue3Marquee>
@ -131,7 +152,7 @@ import { Autoplay } from 'swiper'
 import { handleScreenAuto, handleScreenToFlexCenter } from '@/common/utils'
 import { useCountStore, useDetailStore, useSwiperStore } from '@/store'
 import { storeToRefs } from 'pinia'
-import { allCaseList } from '@/mock/case'
+import { allCaseList2, allCaseList1, allCaseList3 } from '@/mock/case'
 // Import Swiper styles
 import 'swiper/css'
 const countStore = useCountStore()
@ -232,6 +253,7 @@ const showEmpty = ref(true)
      .wrapper_swiper {
        display: flex;
        flex-direction: column;
+        min-height: 0;
        flex: 1;
        justify-content: space-between;
        .data_container {
@ -257,6 +279,7 @@ const showEmpty = ref(true)
        .pic_list {
          padding: 46px 75px 75px 75px;
          position: relative;
+          min-height: 0;
          flex: 1;
          display: flex;
          justify-content: space-evenly;
@ -287,12 +310,14 @@ const showEmpty = ref(true)
            margin-bottom: 41px;
          }
          .scroll_container_case {
+            min-height: 0;
            flex: 1;
            display: flex;
            align-items: center;
            .img_card {
              width: auto;
              height: 100%;
+              flex: 1;
              margin: 0 22px;
              position: relative;
              .pic {
--- a/src/views/Index/components/WebOfThing/index.vue
+++ b/src/views/Index/components/WebOfThing/index.vue
@ -56,6 +56,7 @@ import Project from '@/assets/img/web/zuo1.png'
      font-family: Source Han Sans CN;
      font-weight: 400;
      color: #ffffff;
+      letter-spacing: 3px;
      display: flex;
      align-items: center;
      justify-content: center;