<template>
  <a-card :bordered="false">

    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline">
        <a-row :gutter="24">

          <a-col :md="6" :sm="8">
            <a-form-item label="日期">
              <a-input placeholder="请输入日期" v-model="queryParam.date"></a-input>
            </a-form-item>
          </a-col>
          <a-col :md="6" :sm="8">
            <a-form-item label="账户ID">
              <a-input placeholder="请输入账户ID" v-model="queryParam.accountId"></a-input>
            </a-form-item>
          </a-col>
        <a-col :md="6" :sm="8">
            <a-form-item label="快手ID">
              <a-input placeholder="请输入快手ID" v-model="queryParam.kid"></a-input>
            </a-form-item>
          </a-col>
          <a-col :md="6" :sm="8">
            <a-form-item label="广告主名称">
              <a-input placeholder="请输入广告主名称" v-model="queryParam.advertiserName"></a-input>
            </a-form-item>
          </a-col>
          <a-col :md="6" :sm="8">
            <a-form-item label="广告主创建时间">
              <a-input placeholder="请输入广告主创建时间" v-model="queryParam.advertiserCreateTime"></a-input>
            </a-form-item>
          </a-col>
          <a-col :md="6" :sm="8" >
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
            </span>
          </a-col>

        </a-row>
      </a-form>
    </div>

    <!-- 操作按钮区域 -->
    <div class="table-operator">
      <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
      <a-button type="primary" icon="download" @click="handleExportXls('代理商报表')">导出</a-button>
      <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
        <a-button type="primary" icon="import">导入</a-button>
      </a-upload>
    </div>

    <!-- table区域-begin -->
    <div>

      <a-table
        ref="table"
        size="middle"
        bordered
        rowKey="id"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        @change="handleTableChange">

      </a-table>
    </div>
    <!-- table区域-end -->

    <!-- 表单区域 -->
    <kuaishouReportDailyAgent-modal ref="modalForm" @ok="modalFormOk"></kuaishouReportDailyAgent-modal>
  </a-card>
</template>

<script>
  import KuaishouReportDailyAgentModal from './modules/KuaishouReportDailyAgentModal'
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'

  export default {
    name: "KuaishouReportDailyAgentList",
    mixins:[JeecgListMixin],
    components: {
      KuaishouReportDailyAgentModal
    },
    data () {
      return {
        description: '代理商报表管理页面',
        // 表头
        columns: [
		   {
            title: '日期',
            align:"center",
            dataIndex: 'date'
           },
		   {
            title: '账户ID',
            align:"center",
            dataIndex: 'accountId'
           },
		   {
            title: '快手ID',
            align:"center",
            dataIndex: 'kid'
           },
		   {
            title: '广告主名称',
            align:"center",
            dataIndex: 'advertiserName'
           },
		   {
            title: '广告主创建时间',
            align:"center",
            dataIndex: 'advertiserCreateTime'
           },
		   {
            title: '有消费计划数',
            align:"center",
            dataIndex: 'costCampaignCount'
           },
		   {
            title: '总余额',
            align:"center",
            dataIndex: 'balance'
           },
		   {
            title: '总消耗',
            align:"center",
            dataIndex: 'cost'
           },
		   {
            title: '现金消耗',
            align:"center",
            dataIndex: 'xianjinCost'
           },
		   {
            title: '后返消耗',
            align:"center",
            dataIndex: 'fandianCost'
           },
		   {
            title: '框返消耗',
            align:"center",
            dataIndex: 'kuangfanCost'
           },
		   {
            title: '激励账户消耗',
            align:"center",
            dataIndex: 'jiliCost'
           },
		   {
            title: '信用账户消耗',
            align:"center",
            dataIndex: 'xinyongCost'
           },
		   {
            title: '封面曝光数',
            align:"center",
            dataIndex: 'fengmianShowCount'
           },
		   {
            title: '封面点击数',
            align:"center",
            dataIndex: 'fengmianClickCount'
           },
		   {
            title: '素材曝光数',
            align:"center",
            dataIndex: 'sucaiShowCount'
           },
		   {
            title: '行为数',
            align:"center",
            dataIndex: 'convertCount'
           },
		   {
            title: '封面点击率',
            align:"center",
            dataIndex: 'fengmianClickRate'
           },
		   {
            title: '转化点击率',
            align:"center",
            dataIndex: 'convertClickRate'
           }
        ],
		url: {
          list: "/report/kuaishouReportDailyAgent/list",
          delete: "/report/kuaishouReportDailyAgent/delete",
          deleteBatch: "/report/kuaishouReportDailyAgent/deleteBatch",
          exportXlsUrl: "report/kuaishouReportDailyAgent/exportXls",
          importExcelUrl: "report/kuaishouReportDailyAgent/importExcel",
       },
    }
  },
  computed: {
    importExcelUrl: function(){
      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
    }
  },
    methods: {
        
    }
  }
</script>
<style scoped>
  @import '~@assets/less/common.less'
</style>