<template>
  <div id="mainBody">
    <div v-if="user">
      <div class="user-info"> <el-button size="small" @click="$router.push('/main/user_credit_setting')">技术信用配置</el-button> 全部：{{totalCount}} ，待授权：{{waitCount}}，成功：{{successCount}}，拒绝：{{failCount}}</div>
      <el-table
        :data="finaceList" border
        style="width: 100%">
        <el-table-column
          prop=""
          label="购买方">
          <template slot-scope="scope">
          <span class="lblue point">
            <a  target="_blank" :href="scope.row.host+'/wo/'+scope.row.uid">{{scope.row.nickname}}</a>
          </span>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="被查询方">
          <template slot-scope="scope">
            <span class="lblue point">
            <a target="_blank" :href="scope.row.host+'/wo/'+scope.row.visited_uid">{{scope.row.visited_nickname}}</a>
          </span>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="付款时间">
          <template slot-scope="scope">
            <span v-if="scope.row.status>0">{{scope.row.pay_time}}</span>
            <span v-else>--</span>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="授权时间">
          <template slot-scope="scope">
            <span v-if="scope.row.status==2">{{scope.row.updated_at}}</span>
            <span v-else>--</span>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="购买套餐">
          <template slot-scope="scope">
            {{scope.row.package_name}}
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="当前状态">
          <template slot-scope="scope">
            {{scope.row.status_name}}
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="操作">
          <template slot-scope="scope">
            <a :href="'/main/user_credit_item?id='+scope.row.id" style="color: #3c95ff">查看详情</a>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="order-footer">
      <el-pagination
        background
        @current-change="getFinanceList"
        @size-change="changePageSize"
        :current-page.sync="currentPage"
        :page-sizes="[10, 20, 30, 40]"
        :page-size="20"
        layout="total, sizes, prev, pager, next, jumper"
        :total="totalCount"
      ></el-pagination>
    </div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        user: {},

        finaceList: [],

        // 下发的总数据
        totalData: {},
        // 负责人
        checkUser: "",
        // 审核人列表
        periodStatusList: [],
        // 数据总条目
        waitCount: 0,
        successCount: 0,
        failCount: 0,
        totalCount: 0,
        currentPage: 1,
        currentPageSize: 20,
        // 列表数据
        tableData: [],
      };
    },
    computed: {
      isTest() {
        return this.localData.env === "test";
      },
    },
    mounted() {
      this.getFinanceList();
    },
    methods: {

      clickDev(uid) {
        this.$router.push({path: "/main/orders_detail", params: {id: uid}});
      },
      changePageSize(val) {
        this.currentPage=val;
        this.getFinanceList();
      },
      // 获取列表数据
      async getFinanceList() {
        let body = {
          page: this.currentPage,
          size: this.currentPageSize,
          user: this.$route.query.user

        };
        const res = await this.$post("/api/admin/user_credit/get_orders", body);
        var data = res.data;
        this.finaceList = data.orders;
        console.log(data.count);
        this.totalCount = Number(data.count.all);
        this.waitCount = Number(data.count.wait);
        this.successCount = Number(data.count.approve);
        this.failCount = Number(data.count.reject);
      },
      async downFinanceList() {
        let body = {
          page: this.currentPage,
          page_size: this.currentPageSize,
          user: this.$route.query.user
        };
        var url =
          window.location.host + "/api/admin/order/export?" + "artificial_mark=1";
        console.log(url);
        window.location.href = "https://" + url;
      },
    }
  };
</script>

<style lang="scss" scoped>
  .user-name {
    margin-bottom: 10px;
  }

  .user-info {
    margin-bottom: 10px;
  }

  .order-footer {
    position: absolute;
    bottom: 10px;
    left: 10px;
  }

  .product_title {
    overflow: hidden;
    -webkit-line-clamp: 1;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
  }

  #mainBody {
    white-space: nowrap;
    overflow-x: scroll;
    height: calc(100% - 40px);
  }
</style>
