diff --git a/App.vue b/App.vue index 8df9324..54a4650 100644 --- a/App.vue +++ b/App.vue @@ -54,6 +54,10 @@ .r { float: right; } + + .pr{ + position: relative; + } .fc { text-align: center; diff --git a/components/badge/badge.vue b/components/badge/badge.vue new file mode 100644 index 0000000..fb582b8 --- /dev/null +++ b/components/badge/badge.vue @@ -0,0 +1,38 @@ + + + + + \ No newline at end of file diff --git a/components/orderItem/orderItem.vue b/components/orderItem/orderItem.vue index b526e4d..2dd4162 100644 --- a/components/orderItem/orderItem.vue +++ b/components/orderItem/orderItem.vue @@ -23,7 +23,9 @@ {{ foodSn }} - 申请售后 + + 申请售后 + diff --git a/pages/main/order.vue b/pages/main/order.vue index 0d39f51..d0889ff 100644 --- a/pages/main/order.vue +++ b/pages/main/order.vue @@ -7,10 +7,13 @@ - + - {{tab}} + + + {{tab}} + @@ -59,9 +62,9 @@ tabLineLeft: 24 //tabLine 样式表的left值 } }, - onLoad(){ + onLoad() { //初始化 tapline的位置 - this.lineOffset(this.current) + this.lineOffset(this.current) }, computed: { //未付款订单 @@ -69,12 +72,17 @@ return this.$store.state.orderList.filter(item => item.main_status === '未付款') }, //已付款 并且没有申请退款的订单 - orderList_paid(){ - return this.$store.state.orderList.filter(item => item.main_status === '已付款' && item.refund_status === '未申请') + orderList_paid() { + return this.$store.state.orderList.filter(item => item.main_status === '已付款' && item.refund_status === + '未申请') }, - //已经申请退款的订单 - orderList_refund(){ + //申请中 已同意 主动退 等退款的订单 + orderList_refund() { return this.$store.state.orderList.filter(item => item.refund_status !== '未申请') + }, + //订单数量 数组[未付款订单数量,已付款没有产生退款相关业务的订单数量,申请中 已同意 主动退 等退款的订单数量] + orderCouArr() { + return [this.orderList_unpaid.length, this.orderList_paid.length, this.orderList_refund.length] } }, methods: { @@ -87,7 +95,7 @@ this.current = e.detail.current }, //计算每个 tabLine 的left值 - lineOffset(val){ + lineOffset(val) { // 计算每个 tabLine 的left值 const tabWidth = 200 const spacing = (750 - tabWidth * this.tabList.length - 48) / (this.tabList.length -