<template>
  <div>
    <div class="table-default">
      <el-table :data="tableData" class="mt-3" v-loading="loading">
        <el-table-column prop="created_at" label="时间" min-width="200px" />
        <el-table-column prop="play_name" show-overflow-tooltip label="小程序" min-width="200px">
        </el-table-column>
        <el-table-column prop="username" label="优化师" show-overflow-tooltip min-width="200px">
        </el-table-column>
        <el-table-column prop="trade_no" label="交易单号" show-overflow-tooltip min-width="200px">
        </el-table-column>
        <el-table-column prop="price" label="充值金额" show-overflow-tooltip>
        </el-table-column>
        <el-table-column prop="uid" label="用户ID" show-overflow-tooltip>
        </el-table-column>
      </el-table>
      <Paginate />
    </div>
  </div>
</template>

<script lang="ts" setup>
import { useGetList } from '@/hook/curd/useGetList';
const props = defineProps({
  primary: Object,
});
const api = 'channel/order_list';
const { data, query, search, reset, loading } = useGetList(api);

const tableData = computed(() => data.value?.data);
if (props.primary) {
  query.value.puser_id = props.primary.company_uid
  query.value.created_at_start = props.primary.jiesuan_date + ' 00:00:00'
  query.value.created_at_end = props.primary.jiesuan_date + ' 23:59:59'
}
onMounted(() => {
  search();
});
</script>

<style scoped lang="scss">
.table-default {
  .set-warpper {
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }

  .wrapper {
    margin: 8px;

    .label {
      margin-right: 6px;
    }

    .content {
      font-size: 15px;
    }
  }
}
</style>
