|
|
@@ -0,0 +1,288 @@
|
|
|
+<template>
|
|
|
+ <view class="box">
|
|
|
+ <homenav :iStatusBarHeight="iStatusBarHeight" :title="'我的订单'" :cj="3"></homenav>
|
|
|
+ <view class="tab">
|
|
|
+ <view class="tabLine" :class="{tabActive:tabIndex==0}" @click="tabClick(0)">全部</view>
|
|
|
+ <view class="tabLine" :class="{tabActive:tabIndex==1}" @click="tabClick(1)">待确认</view>
|
|
|
+ <view class="tabLine" :class="{tabActive:tabIndex==5}" @click="tabClick(5)">已接单</view>
|
|
|
+ <view class="tabLine" :class="{tabActive:tabIndex==2}" @click="tabClick(2)">已出发</view>
|
|
|
+ <view class="tabLine" :class="{tabActive:tabIndex==3}" @click="tabClick(3)">已完成</view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="main">
|
|
|
+ <view class="itemBg" v-for="(item,index) in items" @click="goDetail(item)">
|
|
|
+ <view class="itemTop">
|
|
|
+ <view class="itemType">救援订单</view>
|
|
|
+ <view class="itemSheetState redColor" v-if="item.SheetState==5">待成团</view>
|
|
|
+ <view class="itemSheetState redColor" v-if="item.SheetState==1">待付款</view>
|
|
|
+ <view class="itemSheetState orangeColor" v-if="item.SheetState==2">待服务</view>
|
|
|
+ <view class="itemSheetState greenColor" v-if="item.SheetState==3">已完成</view>
|
|
|
+ <view class="itemSheetState" v-if="item.SheetState==4">已取消</view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="itemShopBg">
|
|
|
+ <view class="shopName">救援类型-救援场景</view>
|
|
|
+ <!-- <view style="color: #333333;font-size: 22rpx;">￥<span class="price">{{item.PayType==1?item.RealMoney:0}}</span></view> -->
|
|
|
+ </view>
|
|
|
+ <view class="renBox" v-if="item.SheetType==6">
|
|
|
+ <image src="../../../static/timg/icon_ren.png" mode="" class="renimg"></image>
|
|
|
+ <view class="renMobilePhone">{{item.MobilePhone}}</view>
|
|
|
+ <view class="renNickName">{{item.NickName?item.NickName:''}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="itemName">{{item.CreateTime}}</view>
|
|
|
+ <view class="itemName" style="padding-top: 2rpx;padding-bottom: 0;">{{item.ShopName}}</view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <nodata v-show="items==''&&isload"></nodata>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import nodata from '@/components/nodata/nodata.vue'
|
|
|
+ import homenav from "@/components/homenav/nav.vue"
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ nodata,homenav
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ page: 1,
|
|
|
+ tabIndex: '',
|
|
|
+ items: [],
|
|
|
+ isload: false,
|
|
|
+ iStatusBarHeight:'',
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(opt) {
|
|
|
+ this.iStatusBarHeight = uni.getSystemInfoSync().statusBarHeight;
|
|
|
+ this.tabIndex = opt.num;
|
|
|
+ this.getData()
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ console.log(this.tabIndex)
|
|
|
+ this.getData()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ tabClick(num) {
|
|
|
+ this.tabIndex = num;
|
|
|
+ this.page = 1;
|
|
|
+ this.getData()
|
|
|
+ },
|
|
|
+ goDetail(item) {
|
|
|
+ //SheetType 1 商品2项目3套餐4救援5钣喷6集客
|
|
|
+ uni.navigateTo({
|
|
|
+ url: "rescueOrderOrderDetail?id=" + item.ID
|
|
|
+ })
|
|
|
+
|
|
|
+ },
|
|
|
+ getData() {
|
|
|
+ uni.showLoading({
|
|
|
+ title: '加载中'
|
|
|
+ });
|
|
|
+ this.isload = false;
|
|
|
+ var padata = {
|
|
|
+ page: this.page,
|
|
|
+ limit: 10,
|
|
|
+ sheetState: this.tabIndex > 0 ? this.tabIndex : ''
|
|
|
+ }
|
|
|
+
|
|
|
+ this.$http('openOrderManagement/getOpenSheetList', padata, 'GET').then(res => {
|
|
|
+ uni.hideLoading();
|
|
|
+ this.isload = true;
|
|
|
+
|
|
|
+ var list = res.data.Items;
|
|
|
+
|
|
|
+ if (this.page == 1) {
|
|
|
+ this.items = list
|
|
|
+ } else {
|
|
|
+ this.items = this.items.concat(list)
|
|
|
+ }
|
|
|
+
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ },
|
|
|
+ onReachBottom() {
|
|
|
+ this.page++;
|
|
|
+
|
|
|
+ this.getData()
|
|
|
+ },
|
|
|
+ onPullDownRefresh() {
|
|
|
+ this.page = 1;
|
|
|
+ this.getData()
|
|
|
+ setTimeout(function() {
|
|
|
+ uni.stopPullDownRefresh();
|
|
|
+ }, 1000);
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+ .box {
|
|
|
+ min-height: 100vh;
|
|
|
+ background: #F4F5F7;
|
|
|
+ }
|
|
|
+ .renBox{
|
|
|
+ color: #1A1A1A;
|
|
|
+ background: #F7F7F7;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ display: flex;
|
|
|
+ padding: 20rpx;font-size: 24rpx;
|
|
|
+ line-height: 30rpx;
|
|
|
+ margin-top: 16rpx;
|
|
|
+ }
|
|
|
+ .renimg{
|
|
|
+ width: 30rpx;height: 30rpx;
|
|
|
+ }
|
|
|
+ .renMobilePhone{
|
|
|
+ padding-left: 13rpx;
|
|
|
+ }
|
|
|
+ .renNickName{
|
|
|
+ padding-left: 20rpx;
|
|
|
+ }
|
|
|
+ .tab {
|
|
|
+ background: #FFFFFF;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ line-height: 92rpx;
|
|
|
+ position: fixed;
|
|
|
+ width: calc(100vw - 100rpx);
|
|
|
+ padding-left: 50rpx;
|
|
|
+ padding-right: 50rpx;
|
|
|
+ height: 92rpx;
|
|
|
+ z-index: 11;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tabLine {
|
|
|
+
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #333333;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tabActive {
|
|
|
+ color: #FF0000;
|
|
|
+ font-weight: bold;
|
|
|
+ border-bottom: 4rpx solid #FF0000;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .main {
|
|
|
+ padding-top: 92rpx;
|
|
|
+ padding-bottom: 20rpx;
|
|
|
+ background-color: #F4F5F7;
|
|
|
+ }
|
|
|
+
|
|
|
+ .itemBg {
|
|
|
+ margin: 20rpx 24rpx;
|
|
|
+ background-color: #FFFFFF;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ padding: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .itemTop {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ }
|
|
|
+
|
|
|
+ .itemType {
|
|
|
+ color: #999999;
|
|
|
+ font-size: 24rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .itemSheetState {
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #999999
|
|
|
+ }
|
|
|
+ .redColor {
|
|
|
+ color: #FF0000;
|
|
|
+ }
|
|
|
+ .orangeColor {
|
|
|
+ color: #F19D01;
|
|
|
+ }
|
|
|
+ .greenColor {
|
|
|
+ color: #00A040;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ .itemShopBg {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-top: 20rpx;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .shopName {
|
|
|
+ color: #333333;
|
|
|
+ font-size: 30rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ /* 隐藏文字显示 ...不换行 */
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+
|
|
|
+ .price {
|
|
|
+ color: #333333;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 32rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .itemName {
|
|
|
+ color: #666666;
|
|
|
+ font-size: 24rpx;
|
|
|
+ padding: 16rpx 0;
|
|
|
+ height: 30rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+
|
|
|
+ .plateBg {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .plateNumber {
|
|
|
+ color: #666666;
|
|
|
+ font-size: 24rpx;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+ .itemLineBottom {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ }
|
|
|
+ .itemBtn1 {
|
|
|
+ width: 150rpx;
|
|
|
+ height: 56rpx;
|
|
|
+ border-radius: 36rpx;
|
|
|
+ border: 2rpx solid #DDDDDD;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 56rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #3C3C3C;
|
|
|
+ margin-left: 40rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .itemBtn2 {
|
|
|
+ width: 150rpx;
|
|
|
+ height: 56rpx;
|
|
|
+ border-radius: 36rpx;
|
|
|
+ border: 2rpx solid #FF4F00;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 56rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #FF4F00;
|
|
|
+ margin-left: 40rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .orderState {
|
|
|
+ color: #F19D01;
|
|
|
+ font-size: 24rpx;
|
|
|
+ padding-left: 20rpx;
|
|
|
+ }
|
|
|
+</style>
|
