From c7fdbdc4523e16970626abebbc6d21367b0b476b Mon Sep 17 00:00:00 2001
From: Mila <Mila@pollex.com.tw>
Date: 星期三, 08 十二月 2021 17:50:24 +0800
Subject: [PATCH] update: TODO#132097 [快速篩選] 滑動切換顧問清單
---
PAMapp/components/QuickFilter/QuickFilterConsultantList.vue | 21 +++++++++++++++++++++
PAMapp/assets/scss/vendors/elementUI/_carousel.scss | 13 ++++++++++++-
2 files changed, 33 insertions(+), 1 deletions(-)
diff --git a/PAMapp/assets/scss/vendors/elementUI/_carousel.scss b/PAMapp/assets/scss/vendors/elementUI/_carousel.scss
index 6f8d436..d62d8aa 100644
--- a/PAMapp/assets/scss/vendors/elementUI/_carousel.scss
+++ b/PAMapp/assets/scss/vendors/elementUI/_carousel.scss
@@ -23,15 +23,26 @@
}
.pam-quickFilter-carousel {
+ border-radius: 10px;
+ box-shadow: 0 0 6px 0 #00000029;
.el-carousel__container {
.el-carousel__item {
width: 100%;
- box-shadow: 0 0 6px #00000029;
border-radius: 10px;
background-color: $PRIMARY_WHITE;
}
}
+ @include desktop {
+ border-radius: 0;
+ box-shadow: 0;
+ .el-carousel__container {
+ .el-carousel__item {
+ box-shadow: 0 0 6px #00000029;
+ }
+ }
+ }
+
@media (min-width: 768px) {
.el-carousel__container {
transform: translateX(30%);
diff --git a/PAMapp/components/QuickFilter/QuickFilterConsultantList.vue b/PAMapp/components/QuickFilter/QuickFilterConsultantList.vue
index d8a1707..402eb5e 100644
--- a/PAMapp/components/QuickFilter/QuickFilterConsultantList.vue
+++ b/PAMapp/components/QuickFilter/QuickFilterConsultantList.vue
@@ -14,6 +14,8 @@
>
<div
class="fill"
+ @touchstart="moveStart"
+ @touchend="moveEnd"
>
<UiAvatar
:size="200"
@@ -87,6 +89,24 @@
@Prop() consultantList!: Consultant[];
isVisiblePopUp = false;
popUpTxt = '����憿批��';
+ startPosition = 0;
+ endPosition = 0;
+
+ moveStart(event: TouchEvent) {
+ this.startPosition = event.changedTouches[0].clientX;
+ }
+
+ moveEnd(event: TouchEvent) {
+ this.endPosition = event.changedTouches[0].clientX;
+ if (this.endPosition < this.startPosition) {
+ this.nextCard();
+ return;
+ }
+
+ if (this.endPosition > this.startPosition) {
+ this.prevCard();
+ }
+ }
nextCard() {
(this.$refs.carouselRef as ElCarousel).next();
@@ -100,6 +120,7 @@
this.popUpTxt = txt;
this.isVisiblePopUp = true;
}
+
showAgentDetail(agentNo: string): void {
this.$router.push(`/agentInfo/${agentNo}`);
}
--
Gitblit v1.8.0