diff --git a/pages/index/index.vue b/pages/index/index.vue
index 7fa9aee..b8ed931 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -17,18 +17,28 @@
-
+
-
-
-
-
- {{ cleanedText() }}
- {{ cleanedText() }}
-
+
+
+
+
+ {{ cleanedText() }}
+ {{ cleanedText() }}
+
+
+
+
+
+
+
+
+ 您有正在骑行中的订单.....
-
+
@@ -404,7 +414,7 @@
-
+
@@ -998,7 +1008,11 @@
specificDeviceMarkerId: null,
nearbyMarkers: [],
- duration:0
+ duration: 0,
+ showordertxt: true,
+ orderwidth: 688,
+
+ isCollapsed: false
}
},
watch: {
@@ -1007,11 +1021,11 @@
// console.log('userId 发生变化', newValue, oldValue);
this.getisInOrder()
},
- cleanedText() {
- this.$nextTick(() => {
- this.initScroll();
- });
- }
+ cleanedText() {
+ this.$nextTick(() => {
+ this.initScroll();
+ });
+ }
},
@@ -1251,7 +1265,41 @@
},
},
methods: {
-
+ toggleOrderTips() {
+ this.isCollapsed = !this.isCollapsed;
+ },
+ toggleTips() {
+ if (this.showordertxt) {
+ // 当内容显示时,缩小动画
+ this.animateWidth(192); // 缩小到 192
+ } else {
+ // 当内容隐藏时,扩展动画
+ this.animateWidth(686); // 扩展到 686
+ }
+ this.showordertxt = !this.showordertxt; // 切换显示状态
+ },
+ animateWidth(targetWidth) {
+ const startWidth = this.orderwidth;
+ const startTime = Date.now();
+ const duration = 1500; // 动画时长 1.5s
+
+ const animate = () => {
+ const currentTime = Date.now();
+ const elapsedTime = currentTime - startTime;
+
+ if (elapsedTime >= duration) {
+ this.orderwidth = targetWidth; // 动画结束时设置最终宽度
+ return;
+ }
+
+ const progress = elapsedTime / duration;
+ this.orderwidth = startWidth + (targetWidth - startWidth) * progress;
+
+ setTimeout(animate, 16); // 使用 setTimeout 实现平滑更新,约每16ms更新一次
+ };
+
+ animate();
+ },
cleanedText() {
return this.areaInfo.agreement.replace(/<\/?[^>]+(>|$)/g, "");
},
@@ -1985,7 +2033,7 @@
.parkingReturn /** 强制停车点还车 true:开启,false:关闭*/
let isInParkingArea = res.data.isInParkingArea /** 是否在停车区内*/
that.isInParkingArea = res.data
- .parkingReturn
+ .isInParkingArea
if (parkingReturn) {
// 不可以在停车点外还车
if (isInParkingArea) {
@@ -4209,14 +4257,14 @@
// .map(area => this.convertBoundaryToPolyline(area.boundaryStr));
// 更新折线数据
this.areaInfo = res.data
- setTimeout(()=>{
- let abb=this.cleanedText()
- console.log(abb.length,'cleanedTextcleanedTextcleanedText');
-
- // 计算滚动时间,基于文本宽度
- this.duration =abb.length*0.3; // 50 px/s 的速度
- },200)
-
+ setTimeout(() => {
+ let abb = this.cleanedText()
+ console.log(abb.length, 'cleanedTextcleanedTextcleanedText');
+
+ // 计算滚动时间,基于文本宽度
+ this.duration = abb.length * 0.3; // 50 px/s 的速度
+ }, 200)
+
this.polyline.push(polylines)
console.log();
// console.log(this.areaInfo, 'areaInfoareaInfo');
@@ -5076,7 +5124,7 @@
display: flex;
flex-direction: row;
- justify-content: center;
+ // justify-content: center;
align-items: center;
// align-items: center;
// justify-content: center;
@@ -5104,6 +5152,88 @@
}
+ // .order_tips {
+ // display: flex;
+ // flex-wrap: nowrap;
+ // align-items: center;
+ // margin-right: auto;
+ // // margin: 0 auto;
+ // margin-top: 38rpx;
+ // padding: 28rpx 41rpx;
+ // width: 688rpx;
+ // height: 110rpx;
+ // background: #3D3D3D;
+ // box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0, 0, 0, 0.3);
+ // border-radius: 53rpx 53rpx 53rpx 53rpx;
+
+ // image {
+ // margin-right: 34rpx;
+ // width: 44rpx;
+ // height: 51rpx;
+ // }
+
+ // .order_tips_txt {
+ // font-weight: 400;
+ // font-size: 36rpx;
+ // color: #FFFFFF;
+ // }
+
+ // .icon-xiangyou1 {
+ // margin-left: auto;
+ // font-size: 36rpx;
+ // color: #FFFFFF;
+ // }
+ // }
+ .order_tips {
+ display: flex;
+ flex-wrap: nowrap;
+ align-items: center;
+ margin-top: 38rpx;
+ margin-left: 34rpx;
+ padding: 28rpx 41rpx;
+ width: 688rpx;
+ height: 110rpx;
+ background: #3D3D3D;
+ box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0, 0, 0, 0.3);
+ border-radius: 53rpx;
+ transition: width 0.5s, padding 0.5s;
+
+ &.collapsed {
+ width: 192rpx;
+ padding: 28rpx 20rpx;
+ }
+
+ image {
+ margin-right: 34rpx;
+ width: 44rpx;
+ height: 51rpx;
+ transition: margin-right 0.5s;
+
+ .order_tips.collapsed & {
+ margin-right: 10rpx;
+ }
+ }
+
+ .order_tips_txt {
+ font-weight: 400;
+ font-size: 36rpx;
+ color: #FFFFFF;
+ transition: opacity 0.5s, max-width 0.5s;
+ overflow: hidden;
+ white-space: nowrap;
+
+ &.collapsed {
+ opacity: 0;
+ max-width: 0;
+ }
+ }
+
+ .icon-xiangyou1 {
+ margin-left: auto;
+ font-size: 36rpx;
+ color: #FFFFFF;
+ }
+ }
.swiper_tips {
display: flex;
flex-wrap: nowrap;
@@ -6035,6 +6165,7 @@
width: 686rpx;
height: 90rpx;
background: #4C97E7;
+ // background: #64B6A8;
border-radius: 54rpx 54rpx 54rpx 54rpx;
font-weight: 500;
diff --git a/pages_admin/admin_index.vue b/pages_admin/admin_index.vue
index 9deff7a..13286fb 100644
--- a/pages_admin/admin_index.vue
+++ b/pages_admin/admin_index.vue
@@ -34,14 +34,7 @@
-
-
- 全部设备
-
-
- {{deviceNum.allNum}}
-
-
+
-
+
+
+ 投放中
+
+
+ {{deviceNum.inOperation}}
+
+
+
待租
@@ -58,7 +59,7 @@
{{deviceNum.normalNum}}
-
+
预约中
@@ -66,7 +67,7 @@
{{deviceNum.inAppointmentNum}}
-
+
骑行中
@@ -74,7 +75,7 @@
{{deviceNum.ridingNum}}
-
+
临时锁车
@@ -82,15 +83,15 @@
{{deviceNum.temporarilyLockNum}}
-
+
- 下线
+ 禁用中
{{deviceNum.disabledNum}}
-
+
离线
@@ -98,12 +99,20 @@
{{deviceNum.offlineNum}}
-
-
+
+
仓库中
-
- {{deviceNum.offlineNum}}
+
+ {{deviceNum.inStashNum}}
+
+
+
+
+ 全部设备
+
+
+ {{deviceNum.allNum}}