<template>
    <div class="app-center">
      <div class="app-top">
      <el-card >
        <el-radio-group v-model="radio1">
          <el-radio-button label="收银台订单"></el-radio-button>
          <el-radio-button label="油品交易订单"></el-radio-button>
          <el-radio-button label="商品交易订单"></el-radio-button>
          <el-radio-button label="会员充值订单"></el-radio-button>
<!--          <el-radio-button label="小程序交易订单"></el-radio-button>-->
          <el-radio-button label="挂账订单"></el-radio-button>
<!--          <el-radio-button label="未支付订单"></el-radio-button>-->
<!--          <el-radio-button label="积分兑换订单"></el-radio-button>-->
        </el-radio-group>
      </el-card>
      </div>
      <order_Cashier v-if="radio1 == '收银台订单' "></order_Cashier>
      <order_Oil v-if="radio1 == '油品交易订单' "></order_Oil>
      <order_Goods v-if="radio1 == '商品交易订单' "></order_Goods>
      <order_Vip v-if="radio1 == '会员充值订单' "></order_Vip>
<!--      <order_Ordinary v-if="radio1 == '小程序交易订单' "></order_Ordinary>-->
      <order_Added v-if="radio1 == '挂账订单' "></order_Added>
<!--      <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";

    export default {
        name: "Order",
        data(){
          return{

            radio1:'收银台订单'
          }
        },
      components:{
        order_Cashier,order_Added,order_Goods,order_Integral,order_Oil,order_Ordinary,order_Unpaid,order_Vip
      },
      methods: {
        handleClick(tab, event) {
          console.log(tab, event);
        }
      }

    }
</script>

<style scoped>
  .app-center{
    width: 100%;

    box-sizing: border-box;
    padding: 10px;
  }
  .app-top{
    width: 100%;
    margin-bottom: 20px;
    height: 60px;
    box-sizing: border-box;

  }

</style>
