project-jiaxinglcpy
/
jxlcpy_base_daoshi_vue_ts
forked from common/base_daoshi_vue_ts
4
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Labels Milestones
New Pull Request

dev #5

Merged
zhangyao merged 5 commits from dev into test 3 years ago
Conversation 0 Commits 5 Files Changed 7
7 changed files with 75 additions and 144 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 15
      CHANGELOG.md
  2. 37
      package-lock.json
  3. 4
      package.json
  4. 107
      public/static/offline/JSON/getActivityList1.json
  5. 17
      src/components/Carousel/Carousel.vue
  6. 2
      src/types/home.d.ts
  7. 37
      src/views/Activity/Activity.vue

15
CHANGELOG.md
View File

@ -2,6 +2,21 @@
All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines. All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
## [1.0.0-B.4](https://git.1000my.com/project-jiaxinglcpy/jxlcpy_base_daoshi_vue_ts/compare/v1.0.0-B.3...v1.0.0-B.4) (2023-06-14)
### Features
* 🚀 修改滑动 ([a795fa1](https://git.1000my.com/project-jiaxinglcpy/jxlcpy_base_daoshi_vue_ts/commit/a795fa12527df4305cef3302a1109da335615b75))
## [1.0.0-B.3](https://git.1000my.com/project-jiaxinglcpy/jxlcpy_base_daoshi_vue_ts/compare/v1.0.0-B.2...v1.0.0-B.3) (2023-06-14)
### Bug Fixes
* 🧩 修改滑动问题 ([8d4361a](https://git.1000my.com/project-jiaxinglcpy/jxlcpy_base_daoshi_vue_ts/commit/8d4361a2f5b61c4add4f37b9fc8bb5085670da47))
* 修改轮播 ([aaa2198](https://git.1000my.com/project-jiaxinglcpy/jxlcpy_base_daoshi_vue_ts/commit/aaa21989d7b0f4679f1a20b93716191f218c5d07))
## [1.0.0-B.2](https://git.1000my.com/project-jiaxinglcpy/jxlcpy_base_daoshi_vue_ts/compare/v1.0.0-B.1...v1.0.0-B.2) (2023-06-14) ## [1.0.0-B.2](https://git.1000my.com/project-jiaxinglcpy/jxlcpy_base_daoshi_vue_ts/compare/v1.0.0-B.1...v1.0.0-B.2) (2023-06-14)

37
package-lock.json
View File

@ -1,12 +1,12 @@
{ {
"name": "vue_cli_ts", "name": "vue_cli_ts",
"version": "1.0.0-B.2",
"version": "1.0.0-B.4",
"lockfileVersion": 2, "lockfileVersion": 2,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "vue_cli_ts", "name": "vue_cli_ts",
"version": "1.0.0-B.2",
"version": "1.0.0-B.4",
"dependencies": { "dependencies": {
"@better-scroll/core": "^2.5.0", "@better-scroll/core": "^2.5.0",
"@better-scroll/observe-image": "^2.5.0", "@better-scroll/observe-image": "^2.5.0",
@ -18,7 +18,7 @@
"lottie-web": "^5.10.2", "lottie-web": "^5.10.2",
"pinia": "^2.0.30", "pinia": "^2.0.30",
"qrcode": "^1.5.1", "qrcode": "^1.5.1",
"swiper": "^9.0.5",
"swiper": "^8.4.5",
"vue": "^3.2.13", "vue": "^3.2.13",
"vue-i18n": "^9.2.2", "vue-i18n": "^9.2.2",
"vue-router": "^4.0.3", "vue-router": "^4.0.3",
@ -7840,6 +7840,14 @@
"entities": "^2.0.0" "entities": "^2.0.0"
} }
}, },
"node_modules/dom7": {
"version": "4.0.6",
"resolved": "https://registry.npmjs.org/dom7/-/dom7-4.0.6.tgz",
"integrity": "sha512-emjdpPLhpNubapLFdjNL9tP06Sr+GZkrIHEXLWvOGsytACUrkbeIdjO5g77m00BrHTznnlcNqgmn7pCN192TBA==",
"dependencies": {
"ssr-window": "^4.0.0"
}
},
"node_modules/domelementtype": { "node_modules/domelementtype": {
"version": "2.3.0", "version": "2.3.0",
"resolved": "https://registry.npmmirror.com/domelementtype/-/domelementtype-2.3.0.tgz", "resolved": "https://registry.npmmirror.com/domelementtype/-/domelementtype-2.3.0.tgz",
@ -16952,9 +16960,9 @@
} }
}, },
"node_modules/swiper": { "node_modules/swiper": {
"version": "9.0.5",
"resolved": "https://registry.npmjs.org/swiper/-/swiper-9.0.5.tgz",
"integrity": "sha512-UiLQ5fvn8L3ZZpaPa+9oiwKwhVGQt5TVc0UuXxFKHyTQe8g2E3vbPMiMfIGb6NhNGj5ntsSDyyNgg4qVmWlJkQ==",
"version": "8.4.5",
"resolved": "https://registry.npmjs.org/swiper/-/swiper-8.4.5.tgz",
"integrity": "sha512-zveyEFBBv4q1sVkbJHnuH4xCtarKieavJ4SxP0QEHvdpPLJRuD7j/Xg38IVVLbp7Db6qrPsLUePvxohYx39Agw==",
"funding": [ "funding": [
{ {
"type": "patreon", "type": "patreon",
@ -16965,7 +16973,9 @@
"url": "http://opencollective.com/swiper" "url": "http://opencollective.com/swiper"
} }
], ],
"hasInstallScript": true,
"dependencies": { "dependencies": {
"dom7": "^4.0.4",
"ssr-window": "^4.0.2" "ssr-window": "^4.0.2"
}, },
"engines": { "engines": {
@ -24884,6 +24894,14 @@
"entities": "^2.0.0" "entities": "^2.0.0"
} }
}, },
"dom7": {
"version": "4.0.6",
"resolved": "https://registry.npmjs.org/dom7/-/dom7-4.0.6.tgz",
"integrity": "sha512-emjdpPLhpNubapLFdjNL9tP06Sr+GZkrIHEXLWvOGsytACUrkbeIdjO5g77m00BrHTznnlcNqgmn7pCN192TBA==",
"requires": {
"ssr-window": "^4.0.0"
}
},
"domelementtype": { "domelementtype": {
"version": "2.3.0", "version": "2.3.0",
"resolved": "https://registry.npmmirror.com/domelementtype/-/domelementtype-2.3.0.tgz", "resolved": "https://registry.npmmirror.com/domelementtype/-/domelementtype-2.3.0.tgz",
@ -31910,10 +31928,11 @@
} }
}, },
"swiper": { "swiper": {
"version": "9.0.5",
"resolved": "https://registry.npmjs.org/swiper/-/swiper-9.0.5.tgz",
"integrity": "sha512-UiLQ5fvn8L3ZZpaPa+9oiwKwhVGQt5TVc0UuXxFKHyTQe8g2E3vbPMiMfIGb6NhNGj5ntsSDyyNgg4qVmWlJkQ==",
"version": "8.4.5",
"resolved": "https://registry.npmjs.org/swiper/-/swiper-8.4.5.tgz",
"integrity": "sha512-zveyEFBBv4q1sVkbJHnuH4xCtarKieavJ4SxP0QEHvdpPLJRuD7j/Xg38IVVLbp7Db6qrPsLUePvxohYx39Agw==",
"requires": { "requires": {
"dom7": "^4.0.4",
"ssr-window": "^4.0.2" "ssr-window": "^4.0.2"
} }
}, },

4
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "vue_cli_ts", "name": "vue_cli_ts",
"version": "1.0.0-B.2",
"version": "1.0.0-B.4",
"private": true, "private": true,
"scripts": { "scripts": {
"serve": "vue-cli-service serve", "serve": "vue-cli-service serve",
@ -27,7 +27,7 @@
"lottie-web": "^5.10.2", "lottie-web": "^5.10.2",
"pinia": "^2.0.30", "pinia": "^2.0.30",
"qrcode": "^1.5.1", "qrcode": "^1.5.1",
"swiper": "^9.0.5",
"swiper": "^8.4.5",
"vue": "^3.2.13", "vue": "^3.2.13",
"vue-i18n": "^9.2.2", "vue-i18n": "^9.2.2",
"vue-router": "^4.0.3", "vue-router": "^4.0.3",

107
public/static/offline/JSON/getActivityList1.json
View File

@ -58,113 +58,6 @@
"floorOrder": 1, "floorOrder": 1,
"point": 3, "point": 3,
"fileUrls": [] "fileUrls": []
}, {
"activityId": 8328,
"activityName": "3331111",
"activityNameEn": "2222",
"activityContent": "2132132132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n2132\n",
"activityContentEn": "2222222",
"activityAddress": "232131",
"activityAddressEn": "22222",
"activityType": 1,
"shopCode": "",
"shopName": "",
"shopNameEn": "",
"houseNumber": "",
"fileUrl": "/iotFile/project-odubitlp9mjy2wyuqkpfga/20230608/TDc5S9Z6KiVElVCqooqMj.jpg",
"qrFileUrl": "/iotFile/project-odubitlp9mjy2wyuqkpfga/20230608/y268pw6m8ys3YmtKUKGno.jpg",
"startDate": "2023-05-31",
"endDate": "2023-07-11",
"building": "",
"buildingCode": "",
"buildingOrder": 0,
"floor": "",
"floorCode": "",
"floorOrder": 0,
"point": -1,
"fileUrls": [
"/iotFile/project-odubitlp9mjy2wyuqkpfga/20230608/EHvBuaTyC8GkoE_hwP3CE.jpg",
"/iotFile/project-odubitlp9mjy2wyuqkpfga/20230608/vRycElclvtkNVHAmPvFgy.jpg",
"/iotFile/project-odubitlp9mjy2wyuqkpfga/20230608/Z8l7mYY91oMk_qiLXbUVN.jpg"
]
},
{
"activityId": 4390,
"activityName": "444活动打扫宫斗是的呢佛山到哪放大说法达萨罗客服经理肯定萨芬发的",
"activityNameEn": "dddd",
"activityContent": "拉萨动静分离凯撒京东方",
"activityContentEn": "kljl",
"activityAddress": "41111",
"activityAddressEn": "",
"activityType": 1,
"shopCode": "",
"shopName": "",
"shopNameEn": "",
"houseNumber": "",
"fileUrl": "/iotFile/project-odubitlp9mjy2wyuqkpfga/20230609/AqUbanFt3SXwU2dT68uNy.jpg",
"qrFileUrl": "/iotFile/project-odubitlp9mjy2wyuqkpfga/20230609/fCutkOWSsjkSaGJ1OwX38.jpg",
"startDate": "2023-06-07",
"endDate": "2023-07-17",
"building": "濮园未来社区",
"buildingCode": "gAi7ksmAnlR22G8CyLXbI",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "EuMWamqDI1Vd3v-oIYjY5",
"floorOrder": 1,
"point": 3,
"fileUrls": []
},
{
"activityId": 4390,
"activityName": "55444活动打扫宫斗是的呢佛山到哪放大说法达萨罗客服经理肯定萨芬发的",
"activityNameEn": "dddd",
"activityContent": "拉萨动静分离凯撒京东方",
"activityContentEn": "kljl",
"activityAddress": "41111",
"activityAddressEn": "",
"activityType": 1,
"shopCode": "",
"shopName": "",
"shopNameEn": "",
"houseNumber": "",
"fileUrl": "/iotFile/project-odubitlp9mjy2wyuqkpfga/20230609/AqUbanFt3SXwU2dT68uNy.jpg",
"qrFileUrl": "/iotFile/project-odubitlp9mjy2wyuqkpfga/20230609/fCutkOWSsjkSaGJ1OwX38.jpg",
"startDate": "2023-06-07",
"endDate": "2023-07-17",
"building": "濮园未来社区",
"buildingCode": "gAi7ksmAnlR22G8CyLXbI",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "EuMWamqDI1Vd3v-oIYjY5",
"floorOrder": 1,
"point": 3,
"fileUrls": []
},
{
"activityId": 4390,
"activityName": "66444活动打扫宫斗是的呢佛山到哪放大说法达萨罗客服经理肯定萨芬发的",
"activityNameEn": "dddd",
"activityContent": "拉萨动静分离凯撒京东方",
"activityContentEn": "kljl",
"activityAddress": "41111",
"activityAddressEn": "",
"activityType": 1,
"shopCode": "",
"shopName": "",
"shopNameEn": "",
"houseNumber": "",
"fileUrl": "/iotFile/project-odubitlp9mjy2wyuqkpfga/20230609/AqUbanFt3SXwU2dT68uNy.jpg",
"qrFileUrl": "/iotFile/project-odubitlp9mjy2wyuqkpfga/20230609/fCutkOWSsjkSaGJ1OwX38.jpg",
"startDate": "2023-06-07",
"endDate": "2023-07-17",
"building": "濮园未来社区",
"buildingCode": "gAi7ksmAnlR22G8CyLXbI",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "EuMWamqDI1Vd3v-oIYjY5",
"floorOrder": 1,
"point": 3,
"fileUrls": []
} }
] ]
} }

17
src/components/Carousel/Carousel.vue
View File

@ -1,27 +1,28 @@
<template> <template>
<!--
:observer="true"
-->
<swiper <swiper
v-if="acList.length" v-if="acList.length"
:modules="modules" :modules="modules"
:slides-per-view="1.12" :slides-per-view="1.12"
:observer="true"
:centered-slides="true" :centered-slides="true"
:initial-slide="acList.length !== 1 ? 1 : 0" :initial-slide="acList.length !== 1 ? 1 : 0"
:loop="acList.length > 3 ? true : false"
:loop="acList.length >= 2 ? true : false"
:pagination="true" :pagination="true"
:autoplay="acList.length > 3 ? { delay: 7000, disableOnInteraction: false } : false"
:autoplay="acList.length >= 2 ? { delay: 5000, disableOnInteraction: false } : false"
:dynamic-bullets="true" :dynamic-bullets="true"
:space-between="16" :space-between="16"
class="myswiper" class="myswiper"
> >
<swiper-slide v-for="item in acList" :key="item.code">
<img :src="item.fileUrl" class="img" />
<swiper-slide v-for="item in acList" :key="item.advertisingCode">
<img :key="item.advertisingCode" :src="item.fileUrl" class="img" />
</swiper-slide> </swiper-slide>
</swiper> </swiper>
<img v-else src="../../assets/images/nodata.svg" class="stay-tuned" alt="" /> <img v-else src="../../assets/images/nodata.svg" class="stay-tuned" alt="" />
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref } from 'vue'
import { Swiper, SwiperSlide } from 'swiper/vue' import { Swiper, SwiperSlide } from 'swiper/vue'
import { Autoplay, Pagination } from 'swiper' import { Autoplay, Pagination } from 'swiper'
import 'swiper/css' import 'swiper/css'
@ -30,7 +31,7 @@ type AcType = {
acList: HomeImage[] acList: HomeImage[]
} }
defineProps<AcType>() defineProps<AcType>()
const modules = ref([Autoplay, Pagination])
const modules = [Autoplay, Pagination]
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -51,7 +52,7 @@ const modules = ref([Autoplay, Pagination])
.myswiper { .myswiper {
height: 545px; height: 545px;
text-align: center; text-align: center;
.swiper-slide {
:deep(.swiper-slide) {
width: 800px; width: 800px;
height: 450px; height: 450px;
transition: all 0.3s linear; transition: all 0.3s linear;

2
src/types/home.d.ts
View File

@ -8,6 +8,6 @@ declare interface HomeBtn {
} }
declare interface HomeImage { declare interface HomeImage {
code: string
advertisingCode: string
fileUrl: string fileUrl: string
} }

37
src/views/Activity/Activity.vue
View File

@ -17,19 +17,23 @@
:dynamic-bullets="true" :dynamic-bullets="true"
:observer="true" :observer="true"
:grab-cursor="true" :grab-cursor="true"
:width="547"
:slides-per-view="actList.length === 2 ? 1.7 : 1.92"
:slides-offset-before="actList.length === 2 ? 200 : -70"
--> -->
<Swiper <Swiper
v-if="showList" v-if="showList"
:slides-per-view="actList.length === 2 ? 1.7 : 1.92"
:width="675"
:slides-per-view="1"
:loop-additional-slides="1"
:slides-offset-before="203"
:centered-slides="true" :centered-slides="true"
:space-between="32" :space-between="32"
:loop="actList.length > 3"
:initial-slide="actList.length > 3 ? 1 : 0"
:slides-offset-before="actList.length === 2 ? null : -70"
:loop="actList.length > 1"
:initial-slide="actList.length > 2 ? 1 : 0"
:modules="modules" :modules="modules"
:autoplay="actList.length > 3 ? { delay: 7000, disableOnInteraction: true } : false"
:autoplay="actList.length > 1 ? { delay: 5000, disableOnInteraction: false } : false"
:pagination="{ el: '.list-paginationh' }" :pagination="{ el: '.list-paginationh' }"
:class="{ 'is-center': actList.length === 1 }" :class="{ 'is-center': actList.length === 1 }"
class="swiper-big animate__animated animate__fadeInUp" class="swiper-big animate__animated animate__fadeInUp"
@ -50,7 +54,7 @@ import ActivityItem from './ActivityItem.vue'
import TypeBtnList from '@/components/TypeBtnList/TypeBtnList.vue' import TypeBtnList from '@/components/TypeBtnList/TypeBtnList.vue'
import { getMallActivity, getShopActivity } from '@/http/api/activity' import { getMallActivity, getShopActivity } from '@/http/api/activity'
import { ref, nextTick } from 'vue'
import { ref } from 'vue'
import 'swiper/css' import 'swiper/css'
import 'swiper/css/pagination' import 'swiper/css/pagination'
import { Autoplay, Pagination } from 'swiper' // import { Autoplay, Pagination } from 'swiper' //
@ -134,16 +138,15 @@ getData('mall')
height: 1200px; height: 1200px;
margin-top: 80px; margin-top: 80px;
margin-left: 0; margin-left: 0;
.swiper-wrapper {
.swiper-slide {
width: 547px !important;
height: 972px;
transition: all 0.3s linear;
transform-origin: center top;
&.swiper-slide-active {
width: 675px !important;
height: 1200px;
}
:deep(.swiper-slide) {
width: 547px; //!important;
height: 972px;
transition: all 0.3s linear;
transform-origin: center top;
&.swiper-slide-active {
width: 675px; // !important;
height: 1200px;
} }
} }
} }

Write Preview
Loading…
Cancel
Save