|
@@ -1,257 +1,280 @@
|
|
|
-<template>
|
|
|
- <view class="box">
|
|
|
- <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==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.ID)">
|
|
|
- <view class="itemTop">
|
|
|
- <view style="itemType" v-if="item.SheetType==1">商城-商品订单</view>
|
|
|
- <view style="itemType" v-if="item.SheetType==2">商城-项目订单</view>
|
|
|
- <view style="itemType" v-if="item.SheetType==3">商城-套餐订单</view>
|
|
|
- <view style="itemType" v-if="item.SheetType==4">救援订单</view>
|
|
|
- <view style="itemType" v-if="item.SheetType==5">钣喷订单</view>
|
|
|
- <view style="itemType" v-if="item.SheetType==6">集客订单</view>
|
|
|
-
|
|
|
- <view class="itemSheetState" v-if="item.SheetState==1">待付款</view>
|
|
|
- <view class="itemSheetState" v-if="item.SheetState==2">待服务</view>
|
|
|
- <view class="itemSheetState" v-if="item.SheetState==3">已完成</view>
|
|
|
- <view class="itemSheetState" v-if="item.SheetState==4">已取消</view>
|
|
|
-
|
|
|
- </view>
|
|
|
- <view class="itemShopBg">
|
|
|
- <view class="shopName">{{item.SheetContent}}</view>
|
|
|
- <view class="price">¥{{item.RealMoney}}</view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="itemName">{{item.CreateTime}}</view>
|
|
|
-
|
|
|
- </view>
|
|
|
-
|
|
|
- <nodata v-show="items==''&&isload"></nodata>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
- import nodata from '@/components/nodata/nodata.vue'
|
|
|
- export default {
|
|
|
- components: {
|
|
|
- nodata
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- page: 1,
|
|
|
- tabIndex: '',
|
|
|
- items: [],
|
|
|
- isload: false,
|
|
|
-
|
|
|
- }
|
|
|
- },
|
|
|
- onLoad(opt) {
|
|
|
-
|
|
|
- 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(id) {
|
|
|
- uni.navigateTo({
|
|
|
- url:"../../orderDetail/mallOrderDetail?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;
|
|
|
- }
|
|
|
-
|
|
|
- .tab {
|
|
|
- background: #FFFFFF;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- line-height: 92rpx;
|
|
|
- position: fixed;
|
|
|
- width: calc(100vw - 48rpx);
|
|
|
- padding-left: 24rpx;
|
|
|
- padding-right: 24rpx;
|
|
|
- height: 92rpx;
|
|
|
- z-index: 11;
|
|
|
- }
|
|
|
-
|
|
|
- .tabLine {
|
|
|
-
|
|
|
- font-size: 30rpx;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
-
|
|
|
- .tabActive {
|
|
|
- color: #FF4F00;
|
|
|
- border-bottom: 4rpx solid #FF4F00;
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- .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;
|
|
|
+<template>
|
|
|
+ <view class="box">
|
|
|
+ <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==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" v-if="item.SheetType==1">商城-商品订单</view>
|
|
|
+ <view class="itemType" v-if="item.SheetType==2">商城-项目订单</view>
|
|
|
+ <view class="itemType" v-if="item.SheetType==3">商城-套餐订单</view>
|
|
|
+ <view class="itemType" v-if="item.SheetType==4">救援订单</view>
|
|
|
+ <view class="itemType" v-if="item.SheetType==5">钣喷订单</view>
|
|
|
+ <view class="itemType" v-if="item.SheetType==6">集客订单</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">{{item.SheetContent}}</view>
|
|
|
+ <view style="color: #333333;font-size: 22rpx;">¥<span class="price">{{item.RealMoney}}</span></view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="itemName">{{item.CreateTime}}</view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <nodata v-show="items==''&&isload"></nodata>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import nodata from '@/components/nodata/nodata.vue'
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ nodata
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ page: 1,
|
|
|
+ tabIndex: '',
|
|
|
+ items: [],
|
|
|
+ isload: false,
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(opt) {
|
|
|
+
|
|
|
+ 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集客
|
|
|
+ if((item.SheetType==1)||(item.SheetType==2)||(item.SheetType==3)){
|
|
|
+ uni.navigateTo({
|
|
|
+ url: "mallOrderDetail?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;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tab {
|
|
|
+ background: #FFFFFF;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ line-height: 92rpx;
|
|
|
+ position: fixed;
|
|
|
+ width: calc(100vw - 48rpx);
|
|
|
+ padding-left: 24rpx;
|
|
|
+ padding-right: 24rpx;
|
|
|
+ height: 92rpx;
|
|
|
+ z-index: 11;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tabLine {
|
|
|
+
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tabActive {
|
|
|
+ color: #FF4F00;
|
|
|
+ border-bottom: 4rpx solid #FF4F00;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .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: #FF2400
|
|
|
}
|
|
|
- .itemType{
|
|
|
- color: #999999; font-size: 24rpx;
|
|
|
+ .redColor {
|
|
|
+ color: #FF0000;
|
|
|
}
|
|
|
- .itemSheetState {
|
|
|
- font-size: 24rpx;
|
|
|
- color: #FF2400
|
|
|
+ .orangeColor {
|
|
|
+ color: #F19D01;
|
|
|
}
|
|
|
-
|
|
|
- .itemShopBg {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- margin-top: 20rpx;
|
|
|
+ .greenColor {
|
|
|
+ color: #00A040;
|
|
|
}
|
|
|
-
|
|
|
- .shopName {
|
|
|
- color: #333333;
|
|
|
+
|
|
|
+
|
|
|
+ .itemShopBg {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .shopName {
|
|
|
+ color: #333333;
|
|
|
font-size: 30rpx;
|
|
|
- /* 隐藏文字显示 ...不换行 */
|
|
|
- overflow: hidden;
|
|
|
- text-overflow: ellipsis;
|
|
|
- white-space: nowrap;
|
|
|
- }
|
|
|
-
|
|
|
- .price {
|
|
|
+ font-weight: bold;
|
|
|
+ /* 隐藏文字显示 ...不换行 */
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+
|
|
|
+ .price {
|
|
|
color: #333333;
|
|
|
- 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;
|
|
|
- }
|
|
|
+ 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>
|