boss/pages/main/index/solution.vue

<template>
  <div>
    <div class="count-list" v-if="record">
      <div class="count-item">总数：{{record.sum}}</div>
      <div class="count-item">待审核：{{record.wait_check}}</div>
      <div class="count-item">已通过：{{record.approve}}</div>
      <div class="count-item">拒绝：{{record.deny}}</div>
    </div>
    <div class="content" v-if="solutionData">
      <el-table :data="solutionData" height="100%" border style="width: 100%">
        <el-table-column prop="title" label="方案名称"></el-table-column>
        <el-table-column prop="login_mobile" label="联系方式"></el-table-column>
        <el-table-column prop="updated_at" label="入驻时间"></el-table-column>
        <el-table-column prop="checked_at" label="操作时间"></el-table-column>
        <el-table-column prop="nickname" label="客户经理"></el-table-column>
        <el-table-column prop="status" label="当前状态"></el-table-column>

        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-checkbox label="1" @change="contact(scope.row.id)" name="type">联系他</el-checkbox>
            <el-button
              type="text"
              @click="detail(scope.row.id)"
            >查看详情</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <el-pagination class="order-footer" background layout="prev, pager, next" :page-size="20" :total="Number(solutionData.total)" @current-change="handleCurrentChange"/>

  </div>
</template>

<script>
    export default {
        data() {
            return {
                page: 1,
                solutionData: [],
                form: {
                    reason: ''
                },
                record:[],
                isDialogShow: false
            };
        },
        mounted() {
            this.getList();
        },
        methods: {

            async detail(id) {
                window.open(`/main/solution_detail?id=${id}`,'_self')
            },


            async getList() {
                const page = this.page;
                const size = 20;
                const data = {
                    page,
                    size
                };
                let res = await this.$post("/api/admin/kaifawu/getProviders", data);
                this.solutionData = res.data.list;
                this.record = res.data.record;
            },
            async contact(id) {

                const data = {
                    id
                };
                let res = await this.$post("/api/admin/kaifawu/contact", data);
                    this.$message({
                        message: res.info,
                        type: 'success'
                    });
            },
        }
    };
</script>

<style lang="scss" scoped>
  .count-list {
    padding-bottom: 10px;
    display: flex;
    align-items: center;
  }

  .count-item {
    margin-right: 20px;
    font-size: 16px;
  }

  .content {
    white-space: nowrap;
    overflow-x: scroll;
    height: calc(100vh - 150px);
  }

  .btn {
    width: 80px;
  }

  .order-footer {
    margin-top: 10px;
  }
</style>