feat: 🚀 会员、文化学院、活动

package-lock.json

@@ -5921,6 +5921,14 @@
         "entities": "^2.0.0"
       }
     },
+    "dom7": {
+      "version": "4.0.6",
+      "resolved": "https://registry.npmmirror.com/dom7/-/dom7-4.0.6.tgz",
+      "integrity": "sha512-emjdpPLhpNubapLFdjNL9tP06Sr+GZkrIHEXLWvOGsytACUrkbeIdjO5g77m00BrHTznnlcNqgmn7pCN192TBA==",
+      "requires": {
+        "ssr-window": "^4.0.0"
+      }
+    },
     "domelementtype": {
       "version": "2.3.0",
       "resolved": "https://registry.npmmirror.com/domelementtype/-/domelementtype-2.3.0.tgz",
@@ -12319,7 +12327,7 @@
     },
     "ssr-window": {
       "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/ssr-window/-/ssr-window-4.0.2.tgz",
+      "resolved": "https://registry.npmmirror.com/ssr-window/-/ssr-window-4.0.2.tgz",
       "integrity": "sha512-ISv/Ch+ig7SOtw7G2+qkwfVASzazUnvlDTwypdLoPoySv+6MqlOV10VwPSE6EWkGjhW50lUmghPmpYZXMu/+AQ=="
     },
     "ssri": {
@@ -12923,10 +12931,11 @@
       }
     },
     "swiper": {
-      "version": "9.0.5",
-      "resolved": "https://registry.npmjs.org/swiper/-/swiper-9.0.5.tgz",
-      "integrity": "sha512-UiLQ5fvn8L3ZZpaPa+9oiwKwhVGQt5TVc0UuXxFKHyTQe8g2E3vbPMiMfIGb6NhNGj5ntsSDyyNgg4qVmWlJkQ==",
+      "version": "8.4.7",
+      "resolved": "https://registry.npmmirror.com/swiper/-/swiper-8.4.7.tgz",
+      "integrity": "sha512-VwO/KU3i9IV2Sf+W2NqyzwWob4yX9Qdedq6vBtS0rFqJ6Fa5iLUJwxQkuD4I38w0WDJwmFl8ojkdcRFPHWD+2g==",
       "requires": {
+        "dom7": "^4.0.4",
         "ssr-window": "^4.0.2"
       }
     },

package.json

@@ -27,7 +27,7 @@
     "lottie-web": "^5.10.2",
     "pinia": "^2.0.30",
     "qrcode": "^1.5.1",
-    "swiper": "^9.0.5",
+    "swiper": "^8.4.5",
     "vue": "^3.2.13",
     "vue-i18n": "^9.2.2",
     "vue-router": "^4.0.3",

public/static/offline/JSON/getActivityList1.json

@@ -1 +1,80 @@
-{"code":200,"msg":"操作成功","data":{"activityList":[{"activityId":67,"activityName":"2022秋季会员系列Miss Dior 花漾系列香水 惊喜上线VIP会员","activityNameEn":"DIOR","activityContent":"2022秋季会员系列Miss Dior 花漾系列香水 惊喜上线VIP会员","activityContentEn":"Dior","activityAddress":"商场活动2地址","activityAddressEn":"Chinese Address","activityType":1,"shopCode":"","shopName":"","shopNameEn":"","houseNumber":"","fileUrl":"/iotFile/2023/04/18/rShdVfOa1tj5QXDblRzSE.png","startDate":"2023-04-16","endDate":"2023-04-30","building":"","buildingCode":"","buildingOrder":0,"floor":"","floorCode":"","floorOrder":0,"point":-1},{"activityId":68,"activityName":"惊喜上线VIP会员","activityNameEn":"vip","activityContent":"惊喜上线VIP会员","activityContentEn":"vip\n","activityAddress":"商场活动2地址","activityAddressEn":"Chinese Address","activityType":1,"shopCode":"","shopName":"","shopNameEn":"","houseNumber":"","fileUrl":"/iotFile/2023/04/18/qcivkL9KGHO-0DonwV8UR.png","startDate":"2023-04-17","endDate":"2023-04-30","building":"","buildingCode":"","buildingOrder":0,"floor":"","floorCode":"","floorOrder":0,"point":-1}]}}
+{
+  "code": 200,
+  "msg": "操作成功",
+  "data": {
+    "activityList": [
+      {
+        "activityId": 67,
+        "activityName": "2022秋季会员系列Miss Dior 花漾系列香水 惊喜上线VIP会员",
+        "activityNameEn": "DIOR",
+        "activityContent": "2022秋季会员系列Miss Dior 花漾系列香水 惊喜上线VIP会员",
+        "activityContentEn": "Dior",
+        "activityAddress": "商场活动2地址",
+        "activityAddressEn": "Chinese Address",
+        "activityType": 1,
+        "shopCode": "",
+        "shopName": "",
+        "shopNameEn": "",
+        "houseNumber": "",
+        "fileUrl": "/iotFile/2023/04/18/rShdVfOa1tj5QXDblRzSE.png",
+        "startDate": "2023-04-16",
+        "endDate": "2023-04-30",
+        "building": "",
+        "buildingCode": "",
+        "buildingOrder": 0,
+        "floor": "",
+        "floorCode": "",
+        "floorOrder": 0,
+        "point": -1
+      },
+      {
+        "activityId": 68,
+        "activityName": "惊喜上线VIP会员",
+        "activityNameEn": "vip",
+        "activityContent": "惊喜上线VIP会员",
+        "activityContentEn": "vip\n",
+        "activityAddress": "商场活动2地址",
+        "activityAddressEn": "Chinese Address",
+        "activityType": 1,
+        "shopCode": "",
+        "shopName": "",
+        "shopNameEn": "",
+        "houseNumber": "",
+        "fileUrl": "/iotFile/2023/04/18/qcivkL9KGHO-0DonwV8UR.png",
+        "startDate": "2023-04-17",
+        "endDate": "2023-04-30",
+        "building": "",
+        "buildingCode": "",
+        "buildingOrder": 0,
+        "floor": "",
+        "floorCode": "",
+        "floorOrder": 0,
+        "point": -1
+      },
+      {
+        "activityId": 68,
+        "activityName": "惊喜上线VIP会员",
+        "activityNameEn": "vip",
+        "activityContent": "惊喜上线VIP会员",
+        "activityContentEn": "vip\n",
+        "activityAddress": "商场活动2地址",
+        "activityAddressEn": "Chinese Address",
+        "activityType": 1,
+        "shopCode": "",
+        "shopName": "",
+        "shopNameEn": "",
+        "houseNumber": "",
+        "fileUrl": "/iotFile/2023/04/18/qcivkL9KGHO-0DonwV8UR.png",
+        "startDate": "2023-04-17",
+        "endDate": "2023-04-30",
+        "building": "",
+        "buildingCode": "",
+        "buildingOrder": 0,
+        "floor": "",
+        "floorCode": "",
+        "floorOrder": 0,
+        "point": -1
+      }
+    ]
+  }
+}

src/http/api/member/index.ts

@@ -0,0 +1,3 @@
+import { request } from '../../http'
+// 获取会员信息
+export const getMemberInfo = () => request<MemberInfo>({ url: `/JSON/getMemberInterests.json` })

src/i18n/lang/en.json

@@ -9,5 +9,6 @@
   "stopSpeedUp": "Stop acceleration",
   "search_home": "Search",
   "dispoint": "Activity and Discount",
-  "service": "Service"
+  "service": "Service",
+  "school": "College Of Culture"
 }

src/i18n/lang/tw.json

@@ -9,5 +9,6 @@
   "stopSpeedUp": "停止加速",
   "search_home": "搜索",
   "dispoint": "優惠與活動",
-  "service": "貼心服務"
+  "service": "貼心服務",
+  "school": "文化學院"
 }

src/i18n/lang/zh.json

@@ -9,5 +9,6 @@
   "stopSpeedUp": "停止加速",
   "search_home": "搜索",
   "dispoint": "优惠与活动",
-  "service": "贴心服务"
+  "service": "贴心服务",
+  "school": "文化学院"
 }

src/router/routes.ts

@@ -38,6 +38,22 @@ export const routes: RouteRecordRaw[] = [
       showMap: false
     }
   },
+  {
+    path: '/member',
+    name: 'Member',
+    component: () => import(/* webpackChunkName: "member" */ '@/views/Member/Member.vue'),
+    meta: {
+      showMap: false
+    }
+  },
+  {
+    path: '/school',
+    name: 'School',
+    component: () => import(/* webpackChunkName: "activity" */ '@/views/School/School.vue'),
+    meta: {
+      showMap: false
+    }
+  },
   {
     path: '/service',
     name: 'Service',

src/types/member.d.ts

@@ -0,0 +1,18 @@
+declare interface MemberInfo {
+  title?: string // 标题
+  titleEn?: string // 英文标题
+  content?: string // 内容
+  contentEn?: string // 英文内容
+  fileList?: Array<string> // 图片集合
+  qrFileList?: Array<QrFile> // 二维码集合
+}
+
+type QrFile = {
+  name: string // 名称
+  nameEn: string // 英文名称
+  fileUrl: string // 二维码地址
+}
+
+declare interface fileList {
+  fileUrl: string
+}

src/views/Activity/Activity.vue

@@ -1,8 +1,10 @@
 <template>
   <div class="po">{{ $t('dispoint') }}</div>
-  <div class="carousel">
-    <Carousel :ac-list="aclist" />
-  </div>
+  <Transition name="zoom">
+    <div class="carousel">
+      <Carousel :ac-list="aclist" />
+    </div>
+  </Transition>
 </template>
 
 <script setup lang="ts">
@@ -28,10 +30,6 @@ getMallActivity().then(({ data }) => {
   line-height: 32px;
 }
 .carousel {
-  position: fixed;
-  top: 244px;
-  left: 0;
-  overflow: hidden;
-  width: 1920px;
+  padding-top: 244px;
 }
 </style>

src/views/Member/Member.vue

@@ -0,0 +1,44 @@
+<template>
+  <typeBtnGroup class="top" :list="list" />
+  <div class="carousel">
+    <Carousel :ac-list="memberInfo" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { shallowRef } from 'vue'
+import { getMemberInfo } from '@/http/api/member/index'
+import Carousel from '@/components/Carousel/Carousel.vue'
+import typeBtnGroup from '@/components/TypeBtnList/TypeBtnList.vue'
+const list = [
+  {
+    title: '金卡会员',
+    titleEn: 'Gold Card Member'
+  },
+  {
+    title: '黑卡会员',
+    titleEn: 'Black Card Member'
+  }
+]
+const memberInfo = shallowRef<fileList[]>([])
+getMemberInfo().then(({ data }) => {
+  if (data.fileList) {
+    memberInfo.value = data.fileList?.map(item => {
+      return {
+        fileUrl: item
+      }
+    })
+  }
+})
+</script>
+
+<style lang="scss" scoped>
+.top {
+  position: fixed;
+  top: 140px;
+  left: 734px;
+}
+.carousel {
+  padding-top: 244px;
+}
+</style>

src/views/School/School.vue

@@ -0,0 +1,35 @@
+<template>
+  <div class="po">{{ $t('school') }}</div>
+  <Transition name="zoom">
+    <div class="carousel">
+      <Carousel :ac-list="aclist" />
+    </div>
+  </Transition>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import { getMallActivity } from '@/http/api/activity'
+import Carousel from '@/components/Carousel/Carousel.vue'
+const aclist = ref<Activity[]>([])
+getMallActivity().then(({ data }) => {
+  aclist.value = data.activityList
+})
+</script>
+
+<style lang="scss" scoped>
+.po {
+  position: fixed;
+  top: 140px;
+  left: 900px;
+  font-size: 24px;
+  font-family: 'font_regular';
+  color: #84754e;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 32px;
+}
+.carousel {
+  padding-top: 244px;
+}
+</style>

src/views/ServiceList/ServiceList.vue

@@ -11,8 +11,8 @@
     </div>
   </Transition>
   <div class="btn">
-    <span class="text">请至</span>
-    <span class="textC">B1楼服务台</span>
+    <span class="text">导航至</span>
+    <span class="textC">服务台</span>
   </div>
 </template>