You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

136 lines
4.1 KiB

<template>
<v-page>
<v-header :title="$t('otc.a3')">
<template #right>
<v-picker :list="list" v-model="status" @input="changeStatus">
<template #default="{label}">
<view class="color-light">
{{label||$t('otc.c1')}}
<van-icon name="arrow-down" />
</view>
</template>
</v-picker>
</template>
</v-header>
<van-tabs
:ellipsis="false"
:border="false"
class="border-b"
:active="tab"
@change="tabChange($event.detail.name)"
>
<van-tab :title="$t('otc.h2')" :name="1"></van-tab>
<van-tab :title="$t('otc.h3')" :name="2"></van-tab>
<van-tab :title="$t('otc.h4')" :name="3"></van-tab>
<van-tab :title="$t('otc.h5')" :name="4"></van-tab>
</van-tabs>
<v-paging :ajax="myOrders" ref="scroll" :data="{type:tab,status}" class="layout-main">
<template #box="list">
<view class="list">
<view
class="item bg-panel-3 box-shadow rounded-sm p-md m-md"
v-for="item in $list(list)"
:key="item.id"
>
<view class="row m-t-sm d-flex align-center">
<view class="label"> {{$t('otc.f5')}} </view>
<view class="flex-fill fn-right color-light">{{ item.order_sn }}</view>
</view>
<view class="row m-t-sm d-flex align-center">
<view class="label"> {{$t('otc.c1')}} </view>
<view class="flex-fill fn-right color-light"> {{ item.status_text }} </view>
</view>
<view class="row m-t-sm d-flex align-center">
<view class="label"> {{$t('otc.c3')}} </view>
<view class="flex-fill fn-right color-light"> {{ item.money }} </view>
</view>
<view class="row m-t-sm d-flex align-center">
<view class="label"> {{$t('otc.b0')}} </view>
<view class="flex-fill fn-right color-light"> {{ item.price }} CNY </view>
</view>
<view class="row m-t-sm d-flex align-center">
<view class="label"> {{$t('otc.c4')}} </view>
<view class="flex-fill fn-right color-light"> {{ item.amount }} </view>
</view>
<view class="row m-t-sm d-flex align-center">
<view class="label"> {{$t('otc.b1')}} </view>
<view class="flex-fill fn-right color-light"> {{ item.seller_payments.pay_type_text }} </view>
</view>
<view class="row m-t-sm d-flex align-center">
<view class="label"> {{$t('otc.h6')}} </view>
<view class="flex-fill fn-right color-light"> {{ item.created_at }} </view>
</view>
<view class="row m-t-sm d-flex align-center">
<view class="label"> {{$t('otc.b2')}} </view>
<view class="flex-fill fn-right color-light">
<v-button type="blue" @click="toDetail(item)" size="mini" class="rounded-xs">
{{$t('otc.h7')}}
</v-button>
</view>
</view>
</view>
</view>
</template>
</v-paging>
</v-page>
</template>
<script>
import Otc from "@/api/otc";
export default {
name: "order",
data() {
return {
tab: 1,
status:99
};
},
computed:{
list(){
return [
{
value:99,
label:this.$t('otc.h8')
},
{
value:0,
label:this.$t('otc.h9')
},
{
value:1,
label:this.$t('otc.i0')
},
{
value:2,
label:this.$t('otc.i1')
},
{
value:3,
label:this.$t('otc.c9')
},
{
value:4,
label:this.$t('otc.i2')
},
]
}
},
methods: {
myOrders:Otc.myOrders,
tabChange(idx){
this.tab = idx
this.$nextTick(()=>{
this.$refs.scroll.ref()
})
},
changeStatus(){
this.$nextTick(()=>{
this.$refs.scroll.ref()
})
},
toDetail(item){
this._router.push({path:'/pages/otc/detail',query:{id:item.id}})
}
},
};
</script>