feat: 【ID1001298】 前台-工单排序调整

src/pages/index/order.vue

 <template>
-	<TabBarPage title="订单" :fixed="true" @click="goTop">
-		<view class="tools-box">
-			<view class="search-sub">
-				<u-subsection :current="curNow" :list="subList" active-color="white" bg-color="white"
-					inactive-color="#666" button-color="#2272FF" border-radius="36" @change="sectionChange" height="72"
-					bold>
-				</u-subsection>
-			</view>
-			<view class="search-btn" @click="handleClickSearch">
-				<image class="search-image" mode="widthFix" :src="sousuoImage"></image>
-				<text class="search-btn-text">搜订单</text>
-			</view>
-		</view>
-		<view class="u-tabs-box" v-show="curNow == 0">
-			<u-tabs height="66" activeColor="#2272FF" bg-color="none" inactive-color="#999" bar-height="4"
-				bar-width="44" :offset="[0,0]" :list="list" count="total" :current="current" @change="change"
-				:is-scroll="false" font-size="28" bold></u-tabs>
-		</view>
+  <TabBarPage title="订单" :fixed="true" @click="goTop">
+    <view class="tools-box">
+      <view class="search-sub">
+        <u-subsection
+          :current="curNow"
+          :list="subList"
+          active-color="white"
+          bg-color="white"
+          inactive-color="#666"
+          button-color="#2272FF"
+          border-radius="36"
+          @change="sectionChange"
+          height="72"
+          bold
+        >
+        </u-subsection>
+      </view>
+      <view class="search-btn" @click="handleClickSearch">
+        <image class="search-image" mode="widthFix" :src="sousuoImage"></image>
+        <text class="search-btn-text">搜订单</text>
+      </view>
+    </view>
+    <view class="u-tabs-box" v-show="curNow == 0">
+      <u-tabs
+        height="66"
+        activeColor="#2272FF"
+        bg-color="none"
+        inactive-color="#999"
+        bar-height="4"
+        bar-width="44"
+        :offset="[0, 0]"
+        :list="list"
+        count="total"
+        :current="current"
+        @change="change"
+        :is-scroll="false"
+        font-size="28"
+        bold
+      ></u-tabs>
+    </view>
 
-		<view class="tab-view">
-			<scroll-view scroll-y style="height: 100%;width: 100%;" @scrolltolower="reachBottom" scroll-anchoring
-				refresher-enabled="true" :refresher-triggered="triggered" :refresher-threshold="100" :scroll-top="scrollTop"
-				refresher-background="#F4F5F7" @refresherrefresh="onRefresh"
-				@refresherrestore="onRestore" @scroll="scroll" enable-back-to-top>
-				<view class="loading-view" v-if="!loaded && !_freshing">
-					<u-loading mode="flower"></u-loading>
-				</view>
-				<NoOrder v-else-if="noMore" imageName="zwdd.png" :customStyle="noOrderCustomStyle" />
-				<template v-else>
-					<view v-for="(item, index) in orderList" :key="item.orderId">
-						<OrderCell :orderData="item" :type="orderType" :location="dataValue" @click="handleClick"
-							@action="handleClickCellButton"> </OrderCell>
-					</view>
-					<view class="load-more-view">
-						<u-loadmore v-show="(pageNumber == 1 && loaded) || pageNumber > 1"  :status="loadStatus" bgColor="#F4F5F7"></u-loadmore>
-					</view>
-				</template>
-			</scroll-view>
-		</view>
-
-	</TabBarPage>
+    <view class="tab-view">
+      <scroll-view
+        scroll-y
+        style="height: 100%;width: 100%;"
+        @scrolltolower="reachBottom"
+        scroll-anchoring
+        refresher-enabled="true"
+        :refresher-triggered="triggered"
+        :refresher-threshold="100"
+        :scroll-top="scrollTop"
+        refresher-background="#F4F5F7"
+        @refresherrefresh="onRefresh"
+        @refresherrestore="onRestore"
+        @scroll="scroll"
+        enable-back-to-top
+      >
+        <view class="loading-view" v-if="!loaded && !_freshing">
+          <u-loading mode="flower"></u-loading>
+        </view>
+        <NoOrder
+          v-else-if="noMore"
+          imageName="zwdd.png"
+          :customStyle="noOrderCustomStyle"
+        />
+        <template v-else>
+          <view v-for="(item, index) in orderList" :key="item.orderId">
+            <OrderCell
+              :orderData="item"
+              :type="orderType"
+              :location="dataValue"
+              @click="handleClick"
+              @action="handleClickCellButton"
+            >
+            </OrderCell>
+          </view>
+          <view class="load-more-view">
+            <u-loadmore
+              v-show="(pageNumber == 1 && loaded) || pageNumber > 1"
+              :status="loadStatus"
+              bgColor="#F4F5F7"
+            ></u-loadmore>
+          </view>
+        </template>
+      </scroll-view>
+    </view>
+  </TabBarPage>
 </template>
 
 <script>
-	import TabBarPage from "@/components/tabBarList/index.vue"
-	import OrderCell from "@/components/order/index.vue"
-	import NoOrder from "@/components/order/noOrder.vue"
+import TabBarPage from '@/components/tabBarList/index.vue'
+import OrderCell from '@/components/order/index.vue'
+import NoOrder from '@/components/order/noOrder.vue'
+
+export default {
+  components: {
+    TabBarPage,
+    OrderCell,
+    NoOrder,
+  },
+  data() {
+    return {
+      curNow: 0,
+      pageNumber: 0,
+      pageSize: 1000, // 因为要排序，暂时去掉分页
+      orderList: [],
+      list: [
+        {
+          name: '待预约',
+          total: 0,
+        },
+        {
+          name: '待签到',
+          total: 0,
+        },
+        {
+          name: '待完工',
+          total: 0,
+        },
+        {
+          name: '审核中',
+          total: 0,
+        },
+        {
+          name: '异常单',
+          total: 0,
+        },
+      ],
+      current: 0,
+      loadStatus: 'loading',
+      dataValue: [],
+      loaded: false,
+      triggered: true,
+      _freshing: false,
+      scrollTop: 0,
+      old: {
+        scrollTop: 0,
+      },
+    }
+  },
+  computed: {
+    subList() {
+      return ['待处理', '已完工']
+    },
+    // 0:'去预约', 1:'去签到', 2:'去完工', 3:'审核中', 4:'去处理', 5'已完工'
+    orderType() {
+      return this.indexStatus[this.currentIndex]
+    },
+    currentIndex() {
+      return this.curNow == 0 ? this.current : 5
+    },
+    sousuoImage() {
+      return process.uniEnv.qn_base_url + 'sousuo.png'
+    },
+    types() {
+      return {
+        waitAppointment: 0, // 待预约、
+        waitCheckIn: 1, // 待签到、
+        waitFinish: 2, // 待完工、
+        audit: 3, // 审核中、
+        exception: 4, // 异常单、
+        finish: 5, //已完工
+      }
+    },
+    //waitAccept、waitAppointment、waitCheckIn、waitFinish、exception、finish
+    indexStatus() {
+      return {
+        0: 'waitAppointment',
+        1: 'waitCheckIn',
+        2: 'waitFinish',
+        3: 'audit',
+        4: 'exception',
+        5: 'finish',
+      }
+    },
+    countKeys() {
+      return [
+        'toAppointmentCount',
+        'toCheckinCount',
+        'toFinishCount',
+        'reviewingCount',
+        'exceptionCount',
+      ]
+    },
+    noMore() {
+      return this.orderList.length == 0 && this.loaded
+    },
+    noOrderCustomStyle() {
+      return this.curNow == 0
+        ? 'margin-top: 100rpx;background-color: #F4F5F7'
+        : 'margin-top: 200rpx;background-color: #F4F5F7'
+    },
+  },
+  onLoad(e) {
+    getApp().trackPage('订单首页')
+    this._freshing = false
+    if (e && e.type) {
+      this.current = e.type
+    }
+  },
+  onShow() {
+    this.reloadOrderInfo()
+  },
+  methods: {
+    sectionChange(index) {
+      this.curNow = index
+      this.reloadOrderList()
+    },
+    // tab栏切换
+    change(index) {
+      this.current = index
+      this.reloadOrderList()
+    },
 
-	export default {
-		components: {
-			TabBarPage,
-			OrderCell,
-			NoOrder
-		},
-		data() {
-			return {
-				curNow: 0,
-				pageNumber: 0,
-				pageSize: 20,
-				orderList: [],
-				list: [{
-						name: '待预约',
-						total: 0,
-					},
-					{
-						name: '待签到',
-						total: 0,
-					},
-					{
-						name: '待完工',
-						total: 0,
-					},
-					{
-						name: '审核中',
-						total: 0,
-					},
-					{
-						name: '异常单',
-						total: 0,
-					}
-				],
-				current: 0,
-				loadStatus: 'loading',
-				dataValue: [],
-				loaded: false,
-				triggered: true,
-				_freshing: false,
-				scrollTop: 0,
-				old: {
-					scrollTop: 0
-				}
-			};
-		},
-		computed: {
-			subList() {
-				return ['待处理', '已完工']
-			},
-			// 0:'去预约', 1:'去签到', 2:'去完工', 3:'审核中', 4:'去处理', 5'已完工'
-			orderType() {
-				return this.indexStatus[this.currentIndex]
-			},
-			currentIndex() {
-				return this.curNow == 0 ? this.current : 5
-			},
-			sousuoImage() {
-				return process.uniEnv.qn_base_url + 'sousuo.png'
-			},
-			types() {
-				return {
-					'waitAppointment': 0, // 待预约、
-					'waitCheckIn': 1, // 待签到、
-					'waitFinish': 2, // 待完工、
-					'audit': 3, // 审核中、
-					'exception': 4, // 异常单、
-					'finish': 5, //已完工
-				}
-			},
-			//waitAccept、waitAppointment、waitCheckIn、waitFinish、exception、finish
-			indexStatus() {
-				return {
-					0: 'waitAppointment',
-					1: 'waitCheckIn',
-					2: 'waitFinish',
-					3: 'audit',
-					4: 'exception',
-					5: 'finish'
-				}
-			},
-			countKeys() {
-				return ['toAppointmentCount', 'toCheckinCount', 'toFinishCount', 'reviewingCount', 'exceptionCount']
-			},
-			noMore() {
-				return this.orderList.length == 0 && this.loaded
-			},
-			noOrderCustomStyle() {
-				return this.curNow == 0 ? 'margin-top: 100rpx;background-color: #F4F5F7' : 'margin-top: 200rpx;background-color: #F4F5F7'
-			}
-			
-		},
-		onLoad(e) {
-			getApp().trackPage('订单首页')
-			this._freshing = false;
-			if (e && e.type) {
-				this.current = e.type
-			}
-		},
-		onShow() {
-			this.reloadOrderInfo()
-		},
-		methods: {
-			sectionChange(index) {
-				this.curNow = index;
-				this.reloadOrderList()
-			},
-			// tab栏切换
-			change(index) {
-				this.current = index;
-				this.reloadOrderList()
-			},
+    reachBottom(e) {
+      if (this.loadStatus != 'loadmore') return
+      this.loadStatus == 'loading'
+      this.getOrderList(this.currentIndex)
+    },
+    // 页面数据
+    getOrderList(index) {
+      // 状态处理
+      this.pageNumber += 1
+      if (this.pageNumber == 1) {
+        this.loaded = false
+      }
+      var param = {
+        pageNumber: this.pageNumber,
+        pageSize: this.pageSize,
+        keyword: '',
+        type: this.indexStatus[index],
+      }
+      var self = this
+      self.$u.api.listOrder(param).then((res) => {
+        if (res.code == 200) {
+          if (res.data.type != self.orderType) return
 
-			reachBottom(e) {
-				if (this.loadStatus != 'loadmore') return
-				this.loadStatus == 'loading'
-				this.getOrderList(this.currentIndex)
-			},
-			// 页面数据
-			getOrderList(index) {
-				// 状态处理
-				this.pageNumber += 1
-				if (this.pageNumber == 1) {
-					this.loaded = false
-				}
-				var param = {
-					pageNumber: this.pageNumber,
-					pageSize: this.pageSize,
-					keyword: '',
-					type: this.indexStatus[index]
-				}
-				var self = this;
-				self.$u.api.listOrder(param).then((res) => {
-					if (res.code == 200) {
-						if (res.data.type != self.orderType) return
-							
-						if (self.pageNumber == 1) {
-							self.orderList = []
-						}
-						if (res.data.list) {
-							self.orderList.push(...res.data.list)
-							if (self.list[self.types[res.data.type]]) {
-								self.list[self.types[res.data.type]].total = res.data.total
-							}
-							self.loadStatus = res.data.total > self.orderList.length  && res.data.list.length == self.pageSize ? 'loadmore' : 'nomore'
-						}
-					} else {
-						console.log(res.message, "获取订单数量失败！");
-					}
-					self.$nextTick(()=>{
-						if (self._freshing) {
-							self.triggered = false;
-							self._freshing = false;
-						}
-					})
-					this.loaded = true
-				});
+          if (self.pageNumber == 1) {
+            self.orderList = []
+          }
+          if (res.data.list) {
+            self.orderList.push(...res.data.list)
+            if (self.list[self.types[res.data.type]]) {
+              self.list[self.types[res.data.type]].total = res.data.total
+            }
+            self.orderList.sort((x, y) => {
+              return x.currentOverTime <= y.currentOverTime ? 1 : -1
+            })
+            self.loadStatus =
+              res.data.total > self.orderList.length &&
+              res.data.list.length == self.pageSize
+                ? 'loadmore'
+                : 'nomore'
+          }
+        } else {
+          console.log(res.message, '获取订单数量失败！')
+        }
+        self.$nextTick(() => {
+          if (self._freshing) {
+            self.triggered = false
+            self._freshing = false
+          }
+        })
+        this.loaded = true
+      })
+    },
 
-			},
+    // 获取订单数量
+    getOrderCount() {
+      var self = this
+      self.$u.api.listOrderCount().then((res) => {
+        if (res.code == 200) {
+          if (res.data) {
+            // 修改各个tab数量
+            var i = 0
+            var count = 0
+            for (var item of self.list) {
+              item.total = res.data[self.countKeys[i]]
+              count += item.total
+              i++
+            }
 
-			// 获取订单数量
-			getOrderCount() {
-				var self = this
-				self.$u.api.listOrderCount().then((res) => {
-					if (res.code == 200) {
-						if (res.data) {
-							// 修改各个tab数量
-							var i = 0
-							var count = 0
-							for (var item of self.list) {
-								item.total = res.data[self.countKeys[i]]
-								count += item.total
-								i++
-							}
-							
-							// 修改tab总数
-							if (count > 0) {
-								uni.setTabBarBadge({
-									index: 1,
-									text: String(count)
-								})
-							} else  {
-								uni.removeTabBarBadge({
-									index: 1
-								})
-							}
-						}
-					} else {
-						console.log(res.message, "获取订单数量失败！");
-					}
-				});
-			},
-			handleClickCellButton(item) {
-				// 去完工
-				uni.navigateTo({
-					url: 'pages/order/complete?orderId='+item.orderId 
-						+ "&categoryId=" + item.categoryId 
-						+ "&orderServiceType=" + item.orderServiceType
-						+ "&inGuaranteePeriod=" + item.inGuaranteePeriod
-						+ "&partnerCompanyId=" + item.partnerCompanyId
-						+ "&auditResultsId=" + (item.auditResults?Object.keys(item.auditResults)[Object.keys(item.auditResults).length - 1]:'')
-						+ "&maintainStep=" + item.maintainStep
-						+ '&orderStatus=' + item.orderStatus
-						+ '&brandId=' + item.lianbaoBrandId
-				})
-			},
-			handleClick(item, type, showCountTime) { // type:类型，showCountTime：是否显示倒计时。详情页面情况太多，提前传值可以避免页面晃动
-				//type类型
-				// 'waitAccept': 待接单、待抢单;'waitAppointment': 待预约;'waitCheckIn': 待签到;'waitFinish': 待完工;'audit': 审核中;'exception': 异常单;'finish': 已完工;'other': 工单结算信息
-				uni.navigateTo({
-					url: 'pages/order/detail?id=' + item.orderId + '&type=' + type + '&showCountTime=' + showCountTime
-				})
-			},
-			handleClickSearch() {
-				uni.navigateTo({
-					url: 'pages/order/search'
-				})
-			},
-			onRefresh() {
-				if (this._freshing) return;
-				this._freshing = true;
-				this.reloadOrderInfo()
-			},
-			onRestore() {
-				this.triggered = 'restore'; // 需要重置
-			},
-			reloadOrderInfo() {
-				this.reloadOrderList()
-				this.getOrderCount();
-			},
-			reloadOrderList() {
-				this.pageNumber = 0
-				this.loadStatus = 'loading'
-				this.getOrderList(this.currentIndex);
-			},
-			scroll(e) {
-				this.old.scrollTop = e.detail.scrollTop
-			},
-			goTop(e) {
-				this.scrollTop = this.old.scrollTop
-				this.$nextTick(function() {
-					this.scrollTop = 0
-				});
-			},
-		}
-	};
+            // 修改tab总数
+            if (count > 0) {
+              uni.setTabBarBadge({
+                index: 1,
+                text: String(count),
+              })
+            } else {
+              uni.removeTabBarBadge({
+                index: 1,
+              })
+            }
+          }
+        } else {
+          console.log(res.message, '获取订单数量失败！')
+        }
+      })
+    },
+    handleClickCellButton(item) {
+      // 去完工
+      uni.navigateTo({
+        url:
+          'pages/order/complete?orderId=' +
+          item.orderId +
+          '&categoryId=' +
+          item.categoryId +
+          '&orderServiceType=' +
+          item.orderServiceType +
+          '&inGuaranteePeriod=' +
+          item.inGuaranteePeriod +
+          '&partnerCompanyId=' +
+          item.partnerCompanyId +
+          '&auditResultsId=' +
+          (item.auditResults
+            ? Object.keys(item.auditResults)[
+                Object.keys(item.auditResults).length - 1
+              ]
+            : '') +
+          '&maintainStep=' +
+          item.maintainStep +
+          '&orderStatus=' +
+          item.orderStatus +
+          '&brandId=' +
+          item.lianbaoBrandId,
+      })
+    },
+    handleClick(item, type, showCountTime) {
+      // type:类型，showCountTime：是否显示倒计时。详情页面情况太多，提前传值可以避免页面晃动
+      //type类型
+      // 'waitAccept': 待接单、待抢单;'waitAppointment': 待预约;'waitCheckIn': 待签到;'waitFinish': 待完工;'audit': 审核中;'exception': 异常单;'finish': 已完工;'other': 工单结算信息
+      uni.navigateTo({
+        url:
+          'pages/order/detail?id=' +
+          item.orderId +
+          '&type=' +
+          type +
+          '&showCountTime=' +
+          showCountTime,
+      })
+    },
+    handleClickSearch() {
+      uni.navigateTo({
+        url: 'pages/order/search',
+      })
+    },
+    onRefresh() {
+      if (this._freshing) return
+      this._freshing = true
+      this.reloadOrderInfo()
+    },
+    onRestore() {
+      this.triggered = 'restore' // 需要重置
+    },
+    reloadOrderInfo() {
+      this.reloadOrderList()
+      this.getOrderCount()
+    },
+    reloadOrderList() {
+      this.pageNumber = 0
+      this.loadStatus = 'loading'
+      this.getOrderList(this.currentIndex)
+    },
+    scroll(e) {
+      this.old.scrollTop = e.detail.scrollTop
+    },
+    goTop(e) {
+      this.scrollTop = this.old.scrollTop
+      this.$nextTick(function() {
+        this.scrollTop = 0
+      })
+    },
+  },
+}
 </script>
 
 <style lang="scss" scoped>
-	.u-tabs-box {
-		margin-bottom: 30rpx;
-	}
+.u-tabs-box {
+  margin-bottom: 30rpx;
+}
 
-	.tab-view {
-		height: 100%;
-		overflow: auto;
-		// padding-bottom: 20rpx;
-		.load-more-view {
-			margin-bottom: 20rpx;
-		}
-		.loading-view {
-			width: 100%;
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			margin-top: 300rpx;
-			position: absolute;
-		}
-	}
+.tab-view {
+  height: 100%;
+  overflow: auto;
+  // padding-bottom: 20rpx;
+  .load-more-view {
+    margin-bottom: 20rpx;
+  }
+  .loading-view {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-top: 300rpx;
+    position: absolute;
+  }
+}
 
-	.tools-box {
-		display: flex;
-		flex-direction: row;
-		justify-content: space-between;
-		padding-bottom: 20rpx;
+.tools-box {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  padding-bottom: 20rpx;
 
-		.search-sub {
-			height: 72rpx;
-			width: 320rpx;
-		}
+  .search-sub {
+    height: 72rpx;
+    width: 320rpx;
+  }
 
-		.search-btn {
-			height: 72rpx;
-			width: 220rpx;
-			background-color: #ffffff;
-			border-radius: 36rpx;
-			color: #999999;
-			display: flex;
-			justify-content: center;
-			align-items: center;
+  .search-btn {
+    height: 72rpx;
+    width: 220rpx;
+    background-color: #ffffff;
+    border-radius: 36rpx;
+    color: #999999;
+    display: flex;
+    justify-content: center;
+    align-items: center;
 
-			.search-image {
-				width: 36rpx;
-				height: 32rpx;
-				flex-shrink: 0;
-				margin-right: 24rpx;
-			}
+    .search-image {
+      width: 36rpx;
+      height: 32rpx;
+      flex-shrink: 0;
+      margin-right: 24rpx;
+    }
 
-			.search-btn-text {
-				line-height: 36rpx;
-				font-weight: 400;
-				font-size: 26rpx;
-			}
-		}
-	}
+    .search-btn-text {
+      line-height: 36rpx;
+      font-weight: 400;
+      font-size: 26rpx;
+    }
+  }
+}
 </style>