From 58521493f172071ac3e029f956176072a210fe96 Mon Sep 17 00:00:00 2001 From: yangan <yangan0921@163.com> Date: 星期二, 05 三月 2024 14:22:03 +0800 Subject: [PATCH] feat:修改地址 --- pages/driver-page/driver-index/test-index.vue | 119 +++++++++++++++++++++++++++++++++++++++++++++++++---------- 1 files changed, 99 insertions(+), 20 deletions(-) diff --git a/pages/driver-page/driver-index/test-index.vue b/pages/driver-page/driver-index/test-index.vue index 4157599..9ab69af 100644 --- a/pages/driver-page/driver-index/test-index.vue +++ b/pages/driver-page/driver-index/test-index.vue @@ -1,6 +1,8 @@ <template> <div class="warp"> - <div class="warp-box"> + <scroll-view + scroll-y class="page" @scroll="onScroll"> + <div class="warp-box"> <!-- 褰撳墠鐨勮鍗� --> <!-- 鍗犱綅 --> <div v-if="loading" class="ingOrderBox"></div> @@ -65,7 +67,7 @@ <view class="time-icon"><u-icon name="clock" color="#515151" size="25"></u-icon></view> - <view class="send-date">{{ item.yuYueSection }}</view> + <view class="send-date">{{ item.yuYueTime }}</view> </div> <div class="twoRight"> <u-tag :text="item.coalName" plain> </u-tag> @@ -76,9 +78,11 @@ <span class="more" @click="todoHistory">MORE>></span> </div> </div> - + <!-- 钂欏眰 --> + <!-- 涔濆鏍� --> - <view class="gridBox" > + <view class="gridBoxBg no-right no-left"> + <view class="gridBox" > <u-grid :border="false" col="4" @@ -90,10 +94,12 @@ > <u--image :showLoading="true" :src="listItem.src" width="50px" height="50px" @click="gridClick(listItem)"></u--image> - <text class="grid-text">{{listItem.title}}</text> + <text class="grid-text" >{{listItem.title}}</text> </u-grid-item> </u-grid> </view> + </view> + <!-- 绔嬪嵆鎶㈠崟 --> <div class="orderGrabbing" v-for="item,i in driverBillOfLoadingData.list1" :key="i"> <!-- 绗竴琛� --> @@ -218,10 +224,10 @@ </span> </div> </div> - <div v-if="!driverBillOfLoadingData.list3.length"><u-empty + <!-- <div v-if="!driverBillOfLoadingData.list3.length"><u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" - textSize="30"></u-empty></div> + textSize="30"></u-empty></div> --> <!-- 閫氱煡閫氬憡 --> <combined-title title="閫氱煡鍏憡"></combined-title> <div class="tongzhi"> @@ -276,7 +282,11 @@ </u-cell> </u-cell-group> </view> - </div> + + </div> + </scroll-view> + <view class="mark" ref="mark" :style="{ display:markFlag ,top: markFlag ? 0 : '100vh'}"> + </view> <!-- 鎶㈠崟鎻愮ず妯℃�佹 --> <view class="qianDanModel"> <u-modal :show="qiangDanShow" @@ -337,7 +347,10 @@ return { labaIcon, newIcon, + markFlag:'none', noticeModelShow:false, + garidInitTop:'', //鍏冪礌鍒濆璺濈椤堕儴鐨勯珮搴� + screenHeight:'', notice:{ title:'', content:"", @@ -367,10 +380,10 @@ // src: '/static/image/鏃犱汉鍊煎畧/鍙告満绔椤�/缁� 15(2).jpg', // title: '璐ㄦ' // }, - { - src: '/static/image/鏃犱汉鍊煎畧/鍙告満绔椤�/缁� 15(3).jpg', - title: '杞﹂槦绠$悊' - }, + // { + // src: '/static/image/鏃犱汉鍊煎畧/鍙告満绔椤�/缁� 15(3).jpg', + // title: '杞﹂槦绠$悊' + // }, { src: '/static/image/鏃犱汉鍊煎畧/鍙告満绔椤�/缁� 15(4).jpg', title: '鍏充簬鎴戜滑', @@ -417,6 +430,7 @@ // this.TourImgList = TourImgList this.getLogOn() this.getNoticeList(); + this.watchScrollFun(); }, onShow() { this.init(); @@ -460,11 +474,33 @@ url: '/pages/public-page/message/message' }); break; + + case '鍚堜綔鍩哄湴': + uni.navigateTo({ + url: '/pages/driver-page/driver-index/bill-of-lading-details/cooperationBase/index' + }); + break; default: break; } + }, + onScroll(e){ + // 鐩戝惉椤甸潰鍚戜笂婊氬姩浜嬩欢 + let query = uni.createSelectorQuery().in(this); + query.select('.gridBox').boundingClientRect(data => { + if(this.garidInitTop && (this.garidInitTop > data.top)){ + // console.log(data,data.top, query.select('.mark')); + this.$nextTick(() => { + this.markFlag = 'block'; //鏄剧ず + }); + }else{ + this.$nextTick(() => { + this.markFlag = 'none'; //闅愯棌 + }); + } + }).exec(); }, init() { this.qiangDanList(); @@ -475,6 +511,16 @@ loadmore(){ this.noticePage.current ++; this.getNoticeList(); + + }, + watchScrollFun(){ + //鍒濆鍖栬幏鍙栧睆骞曢珮搴� + const res = uni.getSystemInfoSync(); + let query = uni.createSelectorQuery().in(this); + query.select('.gridBox').boundingClientRect(data => { + this.garidInitTop = data.top; + }).exec(); + this.screenHeight = res.screenHeight; }, getNoticeList(){ @@ -627,6 +673,9 @@ </script> <style lang="scss" scoped> .warp{ + .page{ + z-index: 999; + } width: 100%; height:100%; display: flex; @@ -639,17 +688,20 @@ background-size: 100% 600rpx; .warp-box{ width: 100%; - height:calc(100vh - 45px); + height:calc(100vh - 73px); + z-index: 9; display: flex; flex-direction: column; - overflow-y: auto; + // overflow-y: auto; margin: 0 auto; - padding-bottom: 100rpx; + background-color: unset; + // padding-bottom: 100rpx; .ingOrderBox{ width: 94%; height: 30%; transform: translateY(20%); } + .ingOrder{ width: 94%; height: 380rpx; @@ -749,7 +801,7 @@ display: flex; justify-content: space-between; .twoleft{ - width: 325rpx; + display: flex; justify-content: space-around; align-items: center; @@ -766,7 +818,6 @@ } } .twoRight{ - width: 210rpx; display: flex; justify-content: space-around; } @@ -795,6 +846,7 @@ height: 270rpx; margin: 0 auto; margin-top: 30rpx; + margin-bottom: 30rpx; .grid-text{ font-size: 28rpx; font-family: Microsoft YaHei; @@ -889,7 +941,7 @@ display: flex; justify-content: space-between; .twoleft{ - width: 200rpx; + display: flex; justify-content: space-around; align-items: center; @@ -1036,7 +1088,7 @@ display: flex; justify-content: space-between; .twoleft{ - width: 200rpx; + display: flex; justify-content: space-around; align-items: center; @@ -1045,6 +1097,10 @@ font-family: Microsoft YaHei; font-weight: 300; color: #515151; + } + span{ + font-size: 28rpx; + margin-left: 10rpx; } } .twoRight{ @@ -1134,6 +1190,29 @@ } } +.gridBoxBg{ + // box-shadow:0 0 10px 10px #9fb1c5; + width: 92%; + margin: 10rpx auto; - +} +.mark{ + height: calc(100vh - 60vh); + background-color: #ccc; + position: absolute; + bottom: 0; + width: 100%; + left :0; + z-index: 1; + opacity: 0.6; + transition: 2.5s all ; +} +// .no-right { +// /* .left-top, .left-bottom 缁勫悎 */ +// box-shadow: -5px -5px 10px -4px #fff, -5px 5px 10px -4px #fff; +// } +// .no-left { +// /* .right-bottom, .right-top 缁勫悎 */ +// box-shadow: 5px 5px 10px -4px #fff, 5px -5px 10px -4px #fff; +// } </style> \ No newline at end of file -- Gitblit v1.9.1