125 lines
3.0 KiB
Vue
125 lines
3.0 KiB
Vue
<template>
|
|
<div class="app-center">
|
|
<div class="tab-box">
|
|
<div class="tab_" :class="{active:index== tabindex }" @click="getindex(index)" v-for="(item,index) in tabs"
|
|
:key="index">
|
|
{{ item.name }}
|
|
</div>
|
|
</div>
|
|
<!-- 收银台订单-->
|
|
<order_Cashier v-if="tabindex == 0 "></order_Cashier>
|
|
<!-- 油品订单-->
|
|
<order_Oil v-if="tabindex == 1 "></order_Oil>
|
|
<!-- 商品订单-->
|
|
<order_Goods v-if="tabindex == 2 "></order_Goods>
|
|
<!-- 会员充值订单-->
|
|
<order_Vip v-if="tabindex == 3 "></order_Vip>
|
|
<!-- 挂账订单-->
|
|
<order_Added v-if="tabindex == 4 "></order_Added>
|
|
<!-- 积分商城订单 -->
|
|
<pointsCashier v-if="tabindex == 5 "></pointsCashier>
|
|
<!-- <order_Ordinary v-if="radio1 == '小程序交易订单' "></order_Ordinary>-->
|
|
<!-- <order_Unpaid v-if="radio1 == '未支付订单' "></order_Unpaid>-->
|
|
<!-- <order_Integral v-if="radio1 == '积分兑换订单' "></order_Integral>-->
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import order_Cashier from "../orderComponents/order_Cashier";
|
|
import order_Added from "../orderComponents/order_Added";
|
|
import order_Goods from "../orderComponents/order_Goods";
|
|
import order_Integral from "../orderComponents/order_Integral";
|
|
import order_Oil from "../orderComponents/order_Oil";
|
|
import order_Ordinary from "../orderComponents/order_Ordinary";
|
|
import order_Unpaid from "../orderComponents/order_Unpaid";
|
|
import order_Vip from "../orderComponents/order_Vip";
|
|
import pointsCashier from "./integralOrder/pointsCashier.vue"
|
|
|
|
export default {
|
|
name: "Order",
|
|
data() {
|
|
return {
|
|
radio1: '收银台订单',
|
|
tabindex: 0,
|
|
tabs: [
|
|
{
|
|
name: "收银台订单",
|
|
},
|
|
{
|
|
name: "油品订单",
|
|
},
|
|
{
|
|
name: "商品订单",
|
|
},
|
|
{
|
|
name: "会员充值订单",
|
|
},
|
|
{
|
|
name: "挂账订单",
|
|
},
|
|
{
|
|
name: "积分商城订单",
|
|
},
|
|
],
|
|
}
|
|
},
|
|
components: {
|
|
order_Cashier, order_Added, order_Goods, order_Integral, order_Oil, order_Ordinary, order_Unpaid, order_Vip,pointsCashier
|
|
},
|
|
methods: {
|
|
getindex(index) {
|
|
this.tabindex = index
|
|
console.log(index,80)
|
|
},
|
|
handleClick(tab, event) {
|
|
console.log(tab, event);
|
|
}
|
|
}
|
|
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.app-center {
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
.app-top {
|
|
width: 100%;
|
|
margin-bottom: 20px;
|
|
height: 60px;
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
|
|
.tab-box {
|
|
width: 100%;
|
|
height: 50px;
|
|
background: #fff;
|
|
display: flex;
|
|
box-sizing: border-box;
|
|
margin-bottom: 25px;
|
|
}
|
|
|
|
.tab_ {
|
|
width: 85px;
|
|
height: 100%;
|
|
//border-bottom: 2px solid #FF770F;
|
|
display: flex;
|
|
font-weight: 500;
|
|
font-size: 14px;
|
|
color: #999999;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-left: 50px;
|
|
cursor: pointer;
|
|
}
|
|
.active {
|
|
border-bottom: 2px solid #FF770F !important;
|
|
color: #FF770F !important;
|
|
}
|
|
</style>
|