<template>
  <div class="page-body myActiveOrder">
    <div class="row col" style="margin-bottom: 10px">
      <div class="row col">
        <q-btn color="accent" size="sm" class="q-mr-md" label="返回" @click="goBack" />
        <div v-if="activeName" style="line-height: 25px">
          活动名称：{{ activeName }}
        </div>
      </div>
      <q-btn color="accent" style="float: right" v-if="from == 1" size="sm" label="参与者名单" @click="gourl" />
    </div>
    <div class="page-content">
      <OrderItem :dataList="data.List" ref="orderL" :authObj="authObj" :modityOrderType="2" :cancelList="CancelList"
        :formActiveMan="true" @agree="agreeApply" @refuse="jujueMsg" @success="refreshClassOrder" isActivity>
      </OrderItem>
      <div class="row" style="justify-content: flex-end; padding: 5px 20px">
        <q-pagination v-model="msg.pageIndex" :max="pageCount" @input="changePage" class="full-width justify-end"
          color="primary" :input="true">
        </q-pagination>
      </div>
    </div>
    <!-- 拒绝报名 -->
    <el-dialog title="拒绝报名" :visible.sync="showJujue" width="600px">
      <div class="activityFlex">
        <el-input type="textarea" rows="4" v-model="bdMsg.RejectRemark"></el-input>
      </div>
      <span slot="footer" class="dialog-footer">
        <!-- <el-button type="primary" size="small" @click="sureJujue">确定</el-button> -->
        <q-btn text-color="accent" size="sm" class="q-mr-md" label="取消" @click="showJujue = false" />
        <q-btn color="accent" size="sm" class="q-mr-md" label="确定" @click="sureJujue" />
      </span>
    </el-dialog>
  </div>
</template>
<script>
  import {
    quertClassOrderList
  } from "../../api/sale/sale";

  import OrderItem from "../../components/sale/activeOrder-item.vue";
  export default {
    meta: {
      title: "活动报名列表",
    },
    components: {
      OrderItem,
    },
    data() {
      return {
        data: {},
        activeName: "",
        msg: {
          pageIndex: 1,
          pageSize: 10,
          ActivityId: 0,
        },
        pageCount: 0,
        //正常订单
        dataList: [],
        //取消订单
        CancelList: [],
        //权限判断
        authObj: {
          isShowName: true, //不显示班级名称
          isShowEditSale: true, //显示修改销售按钮
          isShowEducationRemark: true, //显示修改教务备注
          isShowPrincipalRemark: true, //显示校长备注
          isShowManagerRemark: true, //显示总经理备注
          isShowCommissionEdit: true, //显示修改提成按钮
          isShowRewardEdit: true, //显示修改额外提成按钮
        },
        bdMsg: {
          Id: 0, //报名id
          ApplyForCancelStatus: 1, //申请取消审核状态 1同意 2拒绝
          RejectRemark: "",
        },
        showJujue: false,
        from: 0, //来源页面,1===活动=>活动管理=>活动列表
      };
    },
    created() {
      if (this.$route.query.Id) {
        this.msg.ActivityId = this.$route.query.Id;
      }
      if (this.$route.query.name) {
        this.activeName = this.$route.query.name;
      }
      if (this.$route.query.from) {
        this.from = this.$route.query.from;
      }
      this.getList();
    },
    methods: {
      //获取订单列表
      getList() {
        this.loading = true;
        this.apipostDS(
          "/api/Education/GetConsultOrderStatisticsPage",
          this.msg,
          (res) => {
            this.loading = false;
            if (res.data.resultCode === 1) {
              this.data = res.data.data.pageData;
              this.pageCount = res.data.data.pageCount;
            }
          }
        );
      },
      //刷新页面
      refreshClassOrder() {
        this.getList();
      },
      goBack() {
        this.$router.go(-1);
      },
      //翻页
      changePage(val) {
        this.msg.pageIndex = val;
        this.getList();
      },
      //同意
      agreeApply(item) {
        this.bdMsg.Id = item.Id;
        this.bdMsg.ApplyForCancelStatus = 1;
        this.apipostDS(
          "/api/Education/SetCommerceConsultApplyCancel",
          this.bdMsg,
          (res) => {
            if (res.data.resultCode == 1) {
              this.Success("操作成功");
              this.getList();
            } else {
              this.Error(res.data.message);
            }
          }
        );
      },
      jujueMsg(item) {
        this.bdMsg.Id = item.Id;
        this.showJujue = true;
      },
      // 拒绝
      sureJujue() {
        if (!this.bdMsg.RejectRemark) {
          this.Error("请输入拒绝原因");
          return;
        }
        this.bdMsg.ApplyForCancelStatus = 2;
        this.apipostDS(
          "/api/Education/SetCommerceConsultApplyCancel",
          this.bdMsg,
          (res) => {
            if (res.data.resultCode == 1) {
              this.showJujue = false;
              this.Success("操作成功");
              this.getList();
            } else {
              this.Error(res.data.message);
            }
          }
        );
      },
      gourl() {
        this.$router.push({
          path: "/activity/activeSignUpList2",
          query: {
            Id: this.msg.ActivityId,
            name: this.activeName,
            from: this.from,
          },
        });
      },
    },
  };
</script>
<style>
  .myActiveOrder .table-body {
    height: calc(100vh - 220px);
  }

  /*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
  .myActiveOrder .table-body::-webkit-scrollbar {
    width: 5px;
    height: 5px;
    background-color: #f5f5f5;
  }

  /*定义滚动条轨道 内阴影+圆角*/
  .myActiveOrder .table-body::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
    background-color: #f5f5f5;
  }

  /*定义滑块 内阴影+圆角*/
  .myActiveOrder .table-body::-webkit-scrollbar-thumb {
    border-radius: 5px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    background-color: #555;
  }
</style>