feat: 点击滚动到对应位置

CHANGELOG.md

@@ -1,4 +1,4 @@
-# 1.0.0 (2022-04-17)
+# 1.0.0 (2022-04-18)
 
 ### 🌟 新功能
 范围|描述|commitId
@@ -35,6 +35,7 @@
  - | 获取交付物信息 | [5ae68e2](https://101.201.226.163:50022/ccsens_tall/TALL-MUI-4/commits/5ae68e2)
  - | 获取手机唯一码 | [3f60cf8](https://101.201.226.163:50022/ccsens_tall/TALL-MUI-4/commits/3f60cf8)
  - | 将时间轴改成swiper滑动 | [12384f9](https://101.201.226.163:50022/ccsens_tall/TALL-MUI-4/commits/12384f9)
+ - | 交付物2 | [51db122](https://101.201.226.163:50022/ccsens_tall/TALL-MUI-4/commits/51db122)
  - | 交付物2 | [864b080](https://101.201.226.163:50022/ccsens_tall/TALL-MUI-4/commits/864b080)
  - | 解决时间轴日常任务不显示问题 | [c532a93](https://101.201.226.163:50022/ccsens_tall/TALL-MUI-4/commits/c532a93)
  - | 刻度模式时间轴 | [a9bc53a](https://101.201.226.163:50022/ccsens_tall/TALL-MUI-4/commits/a9bc53a)

pages/submitLog/submitLog.vue

@@ -17,22 +17,23 @@
 
     <view style="height: 44px;"></view>
 
+    <view class="scroll-box">
     <!-- 提交 -->
-    <view class="p-3 text-base">当前提交</view>
+    <view class="p-3 text-base scroll-0">当前提交</view>
 
     <view class="px-3">
       <p-deliver-upload-second class="pb-2" v-if="deliverData" :deliverData="deliverData" :task="task" :url="url" @upload-success="getDeliverData" @edit-success="getDeliverData"></p-deliver-upload-second>
     </view>
 
     <!-- 审核 -->
-    <view class="p-3 text-base">审核状态</view>
+    <view class="p-3 text-base scroll-1">审核状态</view>
 
     <view class="px-3">
       <p-deliver-check-second-detail v-if="deliverData" :deliverData="deliverData" :task="task" :url="url" @submit-end="getDeliverData"></p-deliver-check-second-detail>
     </view>
 
     <!-- 历史记录 -->
-    <view class="p-3 text-base">历史记录</view>
+    <view class="p-3 text-base scroll-2">历史记录</view>
 
     <view class="px-3" v-if="listRef && listRef.length">
       <view class="bg-white mb-3 rounded-md p-3 text-gray-400" v-for="item in listRef">
@@ -63,9 +64,11 @@
             <view v-else-if="checkItem.status === 1">
               <view class="text-green-600 mb-1">已通过</view>
 
-              <zwp-ring-timing mode="chart" :value="checkItem.score" active-color="#F59E0B" :radius="30" :bar-width="4">
+              <view class="text-yellow-500 font-medium text-base">{{ checkItem.score }}</view>
+
+              <!-- <zwp-ring-timing mode="chart" :value="checkItem.score" active-color="#F59E0B" :radius="30" :bar-width="4">
                 <text class="text-yellow-500 font-medium">{{ checkItem.score }}</text>
-              </zwp-ring-timing>
+              </zwp-ring-timing> -->
             </view>
             <view class="text-red-600" v-else>已驳回</view>
           </view>
@@ -74,6 +77,7 @@
     </view>
 
     <u-empty text="暂无记录" mode="history" style="padding-top: 120rpx" v-else></u-empty>
+    </view>
   </theme>
 </template>
 
@@ -125,6 +129,15 @@ onLoad(options => {
 
 function changeTabs(index) {
   current.value = index;
+
+  uni.createSelectorQuery().select('.scroll-' + index).boundingClientRect(data=>{//目标节点
+    uni.createSelectorQuery().select('.scroll-box').boundingClientRect((res)=>{//最外层盒子节点 　　　　
+      uni.pageScrollTo({ 　　　　　　
+        duration: 0,//过渡时间必须为0，否则运行到手机会报错
+        scrollTop: data.top - res.top //滚动到实际距离是元素距离顶部的距离减去最外层盒子的滚动距离（如res.top - data.top）
+      })
+    }).exec()
+  }).exec()
 }
 
 // 根据任务id获取交付物信息
@@ -136,7 +149,7 @@ async function getDeliverData() {
     const param = { taskId };
     const data = await uni.$u.api.getDeliverByTaskId(param, url.value);
     deliverData.value = data;
-    
+
     getHistory();
   } catch (error) {
     console.log('error: ', error);