<template>
  <div class="app-container">
  <div class="el-container-md">

    <el-form :model="queryParams" class="live-goods-css" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="商品名称" prop="keywords" >
        <el-input
          v-model="queryParams.keywords"
          placeholder="请输入商品名称"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="上下架" prop="status" >
        <el-input
          v-model="queryParams.status"
          placeholder="请输入直播间状态"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

<!--    <div class="selection-toolbar">-->
<!--      <el-checkbox :indeterminate="isIndeterminate" v-model="allChecked" @change="toggleSelectAll">-->
<!--        {{ multipleSelection.length > 0 ? `已选 ${multipleSelection.length} 条` : '选中本页' }}-->
<!--      </el-checkbox>-->
<!--      <el-button  plain size="mini" @click="handleShelf">上架</el-button>-->
<!--      <el-button  plain size="mini" @click="handleUnshelf">下架</el-button>-->
<!--      <el-button  plain size="mini" @click="handleDeleteSelected">删除</el-button>-->
<!--      <el-button  plain type="mini" icon="el-icon-plus" @click="handleAddLiveGoods">添加商品</el-button>-->
<!--    </div>-->
    <el-table
      ref="dataTable"
      :data="dataList"
      style="width: 100%"
      v-loading="loading"
    >
      <!-- 题干列：显示试题的主要内容 -->
      <el-table-column
        prop="orderId"
        label="订单id"
        show-overflow-tooltip
      ></el-table-column>

      <el-table-column
        prop="orderCode"
        label="订单号"
      >
      </el-table-column>

      <el-table-column
        prop="userName"
        label="用户名称"
      ></el-table-column>

      <el-table-column
        prop="userPhone"
        label="用户电话"
      ></el-table-column>

      <el-table-column
        prop="totalPrice"
        label="总价格"
      ></el-table-column>

      <el-table-column
        prop="payPrice"
        label="支付价格"
      ></el-table-column>

      <el-table-column
        prop="isPay"
        label="是否支付"
      >
        <template slot-scope="scope">
          <el-tag type="success" v-if="scope.row.isPay == 1">已支付</el-tag>
          <el-tag type="info" v-if="scope.row.isPay == 0">未支付</el-tag>
        </template>
      </el-table-column>
      <el-table-column
        prop="status"
        label="订单状态"
      >
        <template slot-scope="scope">
          <el-tag v-if="scope.row.status == -1">申请退款</el-tag>
          <el-tag v-if="scope.row.status == -2">退货成功</el-tag>
          <el-tag v-if="scope.row.status == 0">已取消</el-tag>
          <el-tag v-if="scope.row.status == 1">待支付</el-tag>
          <el-tag v-if="scope.row.status == 2">代发货</el-tag>
          <el-tag v-if="scope.row.status == 3">待收货</el-tag>
          <el-tag v-if="scope.row.status == 4">待评价</el-tag>
          <el-tag v-if="scope.row.status == 5">已完成</el-tag>
        </template>
      </el-table-column>
      <el-table-column
        prop="companyUserId"
        label="销售id"
      ></el-table-column>
      <el-table-column
        prop="companyUserName"
        label="销售名称"
      ></el-table-column>
      <el-table-column
        prop="companyName"
        label="公司名称"
      ></el-table-column>



    </el-table>

    <!-- 分页组件：用于分页展示试题列表 -->
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
      style="margin-top: 20px;"
    />


  </div>
  </div>
</template>

<script>
import {liveProfitList} from '@/api/live/liveProfit';
export default {
  data() {
    return {
      loading: true,
      // 查询条件
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        keywords: null,
        status: null,
        liveId: null,
        desc: null,
        createTime: null,
        updateTime: null,
      },
      // 数据列表
      dataList:[],
      total:0,
      // 显示搜索条件
      showSearch: true,
    }
  },
  created(){
    this.getList();
  },
  mounted() {
    this.loading = false;
  },
  methods: {
    getList(){
      liveProfitList(this.queryParams).then(res=>{
        this.dataList = res.rows;
        this.total = res.total;
      })
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.loading = true
      // listLiveGoods(this.queryParams).then(response => {
      //   this.goodsLiveList = response.rows
      //   this.goodsLiveTotal = response.total
      //   this.loading = false
      // })
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.$refs.queryForm.resetFields();
    },
  },
}
</script>



<style scoped lang="scss">

</style>
