<template>
  <basic-container>
    <div>
      <Card class="cardTitle">
        <p>
          <el-button type="primary" @click="backPage" style="width: 80px;"
            >返回</el-button
          >
        </p>
      </Card>

      <avue-crud
        style="width:100%;margin-top:15px;"
        :data="tableData"
        :option="option"
        :page.sync="page"
        :table-loading="tableLoading"
        @on-load="getList"
        @size-change="sizeChange"
        @current-change="currentChange"
      >
        <template slot="menu" slot-scope="scope">
          <el-button
            type="text"
            size="small"
            icon="el-icon-view"
            v-show="scope.row.status == '1'"
            @click="agreeBtn(scope.row, scope.index)"
            >同意
          </el-button>

          <el-button
            type="text"
            size="small"
            icon="el-icon-view"
            v-show="scope.row.status == '1'"
            @click="refuseBtn(scope.row, scope.index)"
            >拒绝
          </el-button>
        </template>
        <template slot="quizResult" slot-scope="scope">
          <template v-if="scope.row.quizResult && scope.row.quizResult.length">
            <template v-for="(item, index) in scope.row.quizResult">
              <span :key="item.quizId">
                <span class="mark-text" @click="showQuizFn(item)">{{
                  item.finalMark || 0
                }}</span>
                <span v-if="scope.row.quizResult.length - 1 !== index">/</span>
              </span>
            </template>
          </template>
        </template>
      </avue-crud>
    </div>
    <quizDialog :showDialog.sync="showAddQuizDialog" :quizItem="quizItem" />
  </basic-container>
</template>

<script>
import { receiptApprovalData } from "@/const/crud/assignPoints/quota/approval";

import {
  getPage,
  approvalStatus,
  updateZZ
} from "@/api/assignPoints/currency/approval";
import quizDialog from "@/views/admin/wmscorepackagestatus/components/quizDialog";

export default {
  name: "receiptApproval",
  components: { quizDialog },
  data() {
    return {
      tableData: [],
      option: receiptApprovalData,
      page: {
        pageSize: 10,
        pagerCount: 5
      },
      tableLoading: false,
      searchForm: {},
      quizItem: {},
      showAddQuizDialog: false
    };
  },
  mounted() {},
  methods: {
    // 初始化页面
    getList(page, params) {
      this.tableLoading = true;
      getPage(
        Object.assign(
          {
            packageId: this.$route.query.id,
            current: page.currentPage,
            size: page.pageSize
          },
          params,
          this.searchForm
        )
      )
        .then(response => {
          this.tableData = [];
          this.tableData = response.data.data.records;
          this.page.total = response.data.data.total;
          this.tableLoading = false;
        })
        .catch(() => {
          this.tableLoading = false;
        });
    },

    // 返回按钮
    backPage() {
      this.$router.$avueRouter.closeTag();
      this.$router.back();
    },

    // 同意按钮
    agreeBtn(row) {
      this.$confirm("是否同意", "提示", {
        confirmButtonText: "是",
        cancelButtonText: "否",
        type: "warning"
      })
        .then(() => {
          let arg = {
            packageId: row.packageId,
            id: row.id,
            status: 2
          };
          approvalStatus(arg)
            .then(data => {
              //this.$message.success("审核通过");
              this.getList(this.page);
            })
            .catch(() => {});
        })
        .catch(() => {
          //this.$message.error("请求异常");
        });
    },

    // 拒绝按钮
    refuseBtn(row) {
      this.$confirm("是否拒绝", "警告", {
        confirmButtonText: "是",
        cancelButtonText: "否",
        type: "warning"
      })
        .then(() => {
          let arg = {
            packageId: row.packageId,
            id: row.id,
            status: 3
          };
          approvalStatus(arg)
            .then(data => {
              //this.$message.success("审核通过");
              this.getList(this.page);
            })
            .catch(() => {
              this.$message.error("请求异常");
            });
        })
        .catch(() => {});
    },

    // 取消按钮
    cancelBtn() {
      this.enableForm = {};
    },
    // 分页查询
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
    },
    currentChange(current) {
      this.page.currentPage = current;
    },
    // 合规测评
    showQuizFn(quizItem) {
      this.quizItem = quizItem;
      this.showAddQuizDialog = true;
    }
  }
};
</script>

<style lang="scss" scoped>
.mark-text {
  cursor: pointer;
  color: #6eb657;
  &:hover {
    text-decoration: underline;
  }
}
</style>
