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 @@
</view>
</view>
- <view class="" style="width: 100%;height: 50rpx;">
+ <view class="" style="width: 100%;height: 20rpx;">
</view>
- <view class="swiper_tips">
- <view class="cont">
- <image src="https://lxnapi.ccttiot.com/bike/img/static/u1G7wy5BEuNOY8QVyZcF" mode=""></image>
- <view class="scroll-container" ref="scrollContainer">
- <text class="scroll-text" ref="scrollText" :style="{ animation: `scroll-text ${duration}s linear ` }">{{ cleanedText() }}</text>
- <text class="scroll-text" ref="scrollTextClone">{{ cleanedText() }}</text> <!-- Duplicate the text for seamless scrolling -->
- </view>
+ <view class="swiper_tips" @click="changetips">
+ <view class="cont">
+ <image src="https://lxnapi.ccttiot.com/bike/img/static/u1G7wy5BEuNOY8QVyZcF" mode=""></image>
+ <view class="scroll-container" ref="scrollContainer">
+ <text class="scroll-text" ref="scrollText"
+ :style="{ animation: `scroll-text ${duration}s linear infinite` }">{{ cleanedText() }}</text>
+ <text class="scroll-text" ref="scrollTextClone"
+ :style="{ animation: `scroll-text ${duration}s linear infinite` }">{{ cleanedText() }}</text>
+ <!-- Duplicate the text for seamless scrolling -->
+ </view>
+ </view>
+ <view class="iconfont icon-xiangyou1"></view>
+ </view>
+ <view class="order_tips" :class="{ collapsed: isCollapsed }" v-if="orderinfo.status" @click="starTime">
+ <image src="https://lxnapi.ccttiot.com/bike/img/static/ukbZbyKgdFhB84ZAidyf" mode=""></image>
+ <view class="order_tips_txt" :class="{ collapsed: isCollapsed }">
+ 您有正在骑行中的订单.....
</view>
- <view class="iconfont icon-xiangyou1"></view>
+ <view class="iconfont icon-xiangyou1" @click="toggleOrderTips"></view>
</view>
</view>
@@ -404,7 +414,7 @@
</view>
</view>
- <view class="tipss_box">
+ <!-- <view class="tipss_box">
<view class="tipss" v-if="orderinfo.status" @click="starTime">
您有正在进行中的订单 <view class="iconfont icon-xiangyou1" style="margin-left: 20rpx;">
@@ -435,7 +445,7 @@
- </view>
+ </view> -->
<view class="bottom_more" v-if="showindex==1">
<view class="close" @click="showindex=0">
<image src="https://api.ccttiot.com/smartmeter/img/static/uM76uO46a5cZOkFlffnX" mode=""></image>
@@ -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 @@
</view>
</view>
<view class="decice_cont">
- <view class="cont" @click="changeidx(7)">
- <view class="text" :class="statusidx==7?'act1':''">
- 全部设备
- </view>
- <view class="text" :class="statusidx==7?'act1':''">
- {{deviceNum.allNum}}
- </view>
- </view>
+
<!-- <view class="cont" @click="changeidx(0)">
<view class="text" :class="statusidx==0?'act1':''">
未上架
@@ -50,7 +43,15 @@
1
</view>
</view> -->
- <view class="cont" @click="changeidx(1)">
+ <view class="cont" @click="changeidx('-0')">
+ <view class="text" :class="statusidx=='-0'?'act1':''">
+ 投放中
+ </view>
+ <view class="text" :class="statusidx=='-0'?'act1':''">
+ {{deviceNum.inOperation}}
+ </view>
+ </view>
+ <view class="cont" @click="changeidx('1')">
<view class="text" :class="statusidx==1?'act1':''">
待租
</view>
@@ -58,7 +59,7 @@
{{deviceNum.normalNum}}
</view>
</view>
- <view class="cont" @click="changeidx(2)" style="width: 140rpx;">
+ <view class="cont" @click="changeidx('2')" style="width: 140rpx;">
<view class="text" :class="statusidx==2?'act1':''">
预约中
</view>
@@ -66,7 +67,7 @@
{{deviceNum.inAppointmentNum}}
</view>
</view>
- <view class="cont" @click="changeidx(3)">
+ <view class="cont" @click="changeidx('3')">
<view class="text" :class="statusidx==3?'act1':''">
骑行中
</view>
@@ -74,7 +75,7 @@
{{deviceNum.ridingNum}}
</view>
</view>
- <view class="cont" @click="changeidx(4)">
+ <view class="cont" @click="changeidx('4')">
<view class="text" :class="statusidx==4?'act1':''">
临时锁车
</view>
@@ -82,15 +83,15 @@
{{deviceNum.temporarilyLockNum}}
</view>
</view>
- <view class="cont" @click="changeidx(8)">
+ <view class="cont" @click="changeidx('8')">
<view class="text" :class="statusidx==8?'act1':''">
- 下线
+ 禁用中
</view>
<view class="text" :class="statusidx==8?'act1':''">
{{deviceNum.disabledNum}}
</view>
</view>
- <view class="cont" @click="changeidx(9)">
+ <view class="cont" @click="changeidx('9')">
<view class="text" :class="statusidx==9?'act1':''">
离线
</view>
@@ -98,12 +99,20 @@
{{deviceNum.offlineNum}}
</view>
</view>
- <view class="cont" @click="changeidx(0)">
- <view class="text" :class="statusidx==0?'act1':''">
+ <view class="cont" @click="changeidx('0')">
+ <view class="text" :class="statusidx=='0'?'act1':''">
仓库中
</view>
- <view class="text" :class="statusidx==0?'act1':''">
- {{deviceNum.offlineNum}}
+ <view class="text" :class="statusidx=='0'?'act1':''">
+ {{deviceNum.inStashNum}}
+ </view>
+ </view>
+ <view class="cont" @click="changeidx('7')">
+ <view class="text" :class="statusidx==7?'act1':''">
+ 全部设备
+ </view>
+ <view class="text" :class="statusidx==7?'act1':''">
+ {{deviceNum.allNum}}
</view>
</view>
<!-- <view class="cont">
@@ -154,7 +163,7 @@
markdata: {
},
- statusidx: 7,
+ statusidx: '-0',
deviceNum: {},
areaId: 0,
showIconAndCallout: false
@@ -698,7 +707,7 @@
// Handle request error
});
}else if ( this.statusidx == 9) {
- data.status = ''
+ data.status = '-0'
data.onlineStatus=0
this.$u.get(`/appVerify/allVehicleInfo?`, data).then((res) => {
if (res.code == 200) {