zc_saas_admin/src/views/education/examManagement/applicationData/byTrainee.vue

<template>
  <div id="byTrainee">
    <div class="dis_fs">
      <div class="dis_left">
        <div class="dis_fs">
          <input type="text" class="inputSty" v-model="formData.searchKey" />
          <div class="btnSearchSty" @click="getStudent">查询</div>
          <div class="btnSearchSty" @click="getStudent(1)">重置</div>
        </div>
        <ul>
          <li
            class="listy"
            :class="active === item.userId ? 'active' : ''"
            v-for="(item, index) in studentList"
            :key="index"
            @click="changeNewActive(item)"
          >
            {{ item.realname }} {{ item.idCard }}
          </li>
        </ul>
        <el-pagination
          style="text-align: center"
          small
          layout="prev, pager, next"
          :total="total"
          :current-page.sync="formData.pageNum"
          @current-change="handleCurrentChange"
        >
        </el-pagination>
      </div>
      <div class="dis_right" v-if="active">
        <el-table
          ref="multipleTable"
          :data="tableData"
          border
          :header-cell-style="{
            'background-color': '#eee',
            padding: '8px',
            color: '#333',
          }"
          @expand-change="expandChange"
        >
          <!-- 插槽 -->
          <el-table-column type="expand">
            <template slot-scope="props">
              <el-table
                ref="multipleTable"
                :data="props.row.children"
                border
                :header-cell-style="{
                  'background-color': '#eee',
                  padding: '8px',
                  color: '#333',
                }"
              >
                <el-table-column
                  v-for="(item, index) in tableSet"
                  :width="item.width"
                  :key="index"
                  :label="item.label"
                  align="center"
                  :show-overflow-tooltip="true"
                  header-align="center"
                >
                  <template slot-scope="scope">
                    <div v-if="item.scope === 'isOptions'">
                      <template v-for="(itemt, indext) in item.options">
                        <span
                          :key="indext"
                          v-if="itemt.value === scope.row[item.prop]"
                          >{{ itemt.label }}</span
                        >
                      </template>
                    </div>
                    <div v-else-if="item.scope === 'resultType'">
                      {{ scope.row[item.prop1] }}
                      <span
                        :style="
                          scope.row[item.prop2] === 1
                            ? 'color:purple'
                            : scope.row[item.prop2] === 0
                            ? 'color:red;'
                            : ''
                        "
                      >
                        {{
                          scope.row[item.prop2] === 1
                            ? "通过"
                            : scope.row[item.prop2] === 0
                            ? "不通过"
                            : ""
                        }}
                      </span>
                    </div>
                    <div v-else-if="item.scope === 'goodsInfos'">
                      {{
                        scope.row[item.prop1] +
                        "-" +
                        scope.row[item.prop2] +
                        "-"
                      }}<span style="color: red"
                        >￥{{ scope.row[item.prop3] }}</span
                      >
                    </div>
                    <div v-else-if="item.scope === 'applyInfos'">
                      <div>{{ scope.row[item.prop] }}</div>
                      {{
                        $methodsTools.onlyForma(scope.row[item.prop1], false)
                      }}
                      {{
                        scope.row[item.prop2]
                          ? scope.row[item.prop2].replace("-", ":")
                          : ""
                      }}-{{
                        scope.row[item.prop3]
                          ? scope.row[item.prop3].replace("-", ":")
                          : ""
                      }}
                    </div>
                    <span v-else-if="item.scope === 'aTimeList'">{{
                      scope.row[item.prop] === null
                        ? "--"
                        : $methodsTools.onlyForma(scope.row[item.prop])
                    }}</span>
                    <div v-else>{{ scope.row[item.prop] }}</div>
                  </template>
                </el-table-column>
                <el-table-column
                  label="操作"
                  align="center"
                  fixed="right"
                  width="180px"
                  v-if="false"
                >
                  <template slot-scope="scope">
                    <el-button
                      type="text"
                      :disabled="
                        scope.row.subscribeStatus === 2 ||
                        scope.row.examStatus !== 0
                      "
                      @click="openClearYX(scope.row)"
                      >取消预约</el-button
                    ><el-button
                      type="text"
                      :disabled="scope.row.subscribeStatus === 2"
                      @click="editExam(scope.row)"
                      >考试登记</el-button
                    ><el-button
                      type="text"
                      :disabled="scope.row.subscribeStatus === 2"
                      @click="openZS(scope.row)"
                      >成绩和证书登记</el-button
                    >
                  </template>
                </el-table-column>
              </el-table>
            </template></el-table-column
          >
          <!-- 插槽 -->
          <template v-for="(item, index) in tableList">
            <el-table-column
              v-if="item.scope !== 'inputs'"
              :width="item.width"
              :key="index"
              :label="item.label"
              align="center"
              :show-overflow-tooltip="true"
              header-align="center"
            >
              <template slot-scope="scope">
                <div v-if="item.scope === 'goodsName'">
                  {{ scope.row[item.prop1] }}-{{ scope.row[item.prop2] }}-
                  <span style="color: red">￥{{ scope.row[item.prop3] }}</span>
                </div>
                <div v-else-if="item.scope === 'numTypes'">
                  总：{{ scope.row[item.prop1] }} 消耗：{{
                    scope.row[item.prop2]
                  }}
                  剩余：{{ scope.row[item.prop1] - scope.row[item.prop2] }}
                  <el-button type="text" @click="seeInfos(scope.row, item.type)"
                    >查看</el-button
                  >
                </div></template
              >
            </el-table-column></template
          >
        </el-table>
        <pagination
          :total="totalRight"
          :pageSize="tabSearchData.pageSize"
          :currentPage="tabSearchData.pageNum"
          @handleSizeChange="handleSizeChange"
          @handleCurrentChange="handleCurrentChanges"
        />
      </div>
      <p v-else style="text-align: center; width: 100%">请选择学员</p>
    </div>
    <el-dialog
      :visible.sync="dialogCG"
      width="560px"
      :show-close="false"
      :close-on-click-modal="false"
    >
      <div slot="title" class="hearders">
        <div class="leftTitle">考试登记</div>
        <div class="rightBoxs">
          <img
            src="@/assets/images/Close@2x.png"
            alt=""
            @click="dialogCG = false"
          />
        </div>
      </div>
      <div>
        <div class="aListBottom">{{ listData.realname }}</div>
        <el-form
          :model="listData"
          label-width="120px"
          class="demo-ruleForm"
          :rules="rules"
          ref="listData"
        >
          <el-form-item label="考试登记状态" prop="examStatus">
            <el-radio-group v-model="listData.examStatus">
              <el-radio :label="1">正常</el-radio>
              <el-radio :label="2">缺考</el-radio>
              <el-radio :label="3">作弊</el-radio>
              <el-radio :label="4">替考</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="考试登记补充" prop="remark">
            <el-input
              v-model="listData.remark"
              type="textarea"
              :rows="4"
            ></el-input>
          </el-form-item>
        </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogCG = false">取消</el-button>
        <el-button
          :disabled="
            listData.performance != null || listData.performance != undefined
          "
          type="primary"
          @click="submitChecks('listData')"
          >确定</el-button
        >
      </span>
    </el-dialog>
    <el-dialog
      :visible.sync="dialogDJ"
      width="420px"
      :show-close="false"
      :close-on-click-modal="false"
    >
      <div slot="title" class="hearders">
        <div class="leftTitle">取消预约</div>
        <div class="rightBoxs">
          <img
            src="@/assets/images/Close@2x.png"
            alt=""
            @click="dialogDJ = false"
          />
        </div>
      </div>
      <div>
        <div class="aListBottom">{{ listData.realname }}</div>
        <p style="margin: 0px">您确定要取消所选学员的考试预约吗？</p>
        <p style="margin: 0px">取消后将无法恢复，请慎重考虑！</p>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogDJ = false">取消</el-button>
        <el-button type="primary" @click="submitChecksDJ">确定</el-button>
      </span>
    </el-dialog>
    <el-dialog
      :visible.sync="dialogPLS"
      width="460px"
      :show-close="false"
      :close-on-click-modal="false"
    >
      <div slot="title" class="hearders">
        <div class="leftTitle">成绩和证书登记</div>
        <div class="rightBoxs">
          <img
            src="@/assets/images/Close@2x.png"
            alt=""
            @click="dialogPLS = false"
          />
        </div>
      </div>
      <div>
        <div class="aListBottom">{{ listData.realname }}</div>
        <el-form label-width="100px">
          <el-form-item label="考试成绩" required>
            <el-input-number
              :controls="false"
              v-model="listData.performance"
              :min="0"
            ></el-input-number
            >分
          </el-form-item>
          <el-form-item label="考试结果" required>
            <el-radio-group v-model="listData.result">
              <el-radio :label="1">通过</el-radio>
              <el-radio :label="0">不通过</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="证书编号">
            <el-input v-model="listData.certificateCode"></el-input>
          </el-form-item>
          <el-form-item label="登记补充">
            <el-input
              v-model="listData.remark"
              type="textarea"
              :rows="4"
            ></el-input>
          </el-form-item>
        </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogPLS = false">取消</el-button>
        <el-button type="primary" @click="submitChecksPals">确定</el-button>
      </span>
    </el-dialog>
    <el-dialog
      :visible.sync="dialoginfoWatch"
      width="760px"
      :show-close="false"
      :close-on-click-modal="false"
    >
      <div slot="title" class="hearders">
        <div class="leftTitle">
          {{
            activeInfoType === 1
              ? "考试次数"
              : activeInfoType === 2
              ? "前培次数"
              : "未知"
          }}
        </div>
        <div class="rightBoxs">
          <img
            src="@/assets/images/Close@2x.png"
            alt=""
            @click="dialoginfoWatch = false"
          />
        </div>
      </div>
      <div>
        <el-form :model="infoData" class="demo-form-inline" label-width="120px">
          <el-button type="info" style="margin-bottom: 20px" size="mini"
            >商品自带{{
              activeInfoType === 1
                ? "考试次数"
                : activeInfoType === 2
                ? "前培次数"
                : "未知"
            }}</el-button
          >
          <el-form-item label="商品名称：">
            <span
              >{{ infoData.goodsCode }}-{{ infoData.goodsName }}-￥{{
                infoData.standPrice
              }}</span
            >
          </el-form-item>
          <el-form-item
            :label="
              activeInfoType === 1
                ? '考试次数：'
                : activeInfoType === 2
                ? '前培次数：'
                : '未知'
            "
          >
            <span>{{
              activeInfoType === 1
                ? infoData.examNumber - infoData.examNumberAll
                : activeInfoType === 2
                ? infoData.doNumber - infoData.doNumberAll
                : ""
            }}</span>
          </el-form-item>
          <div v-if="activeInfoType === 1 && infoData.userExamGoodsSupplement && infoData.userExamGoodsSupplement.length > 0">
            <el-button type="info" style="margin-bottom: 20px" size="mini"
              >补考商品自带考试次数</el-button
            >
            <div
              v-for="(item, index) in infoData.userExamGoodsSupplement"
              :key="index"
            >
              <el-form-item label="商品名称：">
                <span
                  >{{ item.code }}-{{ item.goodsName }}({{
                    item.educationName +
                    "-" +
                    item.projectName +
                    "-" +
                    item.businessName
                  }})-￥{{ item.standPrice }}</span
                >
              </el-form-item>
              <el-col :span="24"
                ><el-form-item label="考试次数：">{{
                  item.examNumber
                }}</el-form-item></el-col
              >
              <!-- <el-col :span="16"
                ><el-form-item label="使用有效期："
                  >{{ $methodsTools.onlyForma(item.makeStartTime, false) }}至{{
                    $methodsTools.onlyForma(item.makeEndTime, false)
                  }}</el-form-item
                ></el-col
              > -->
            </div>
          </div>
          <div v-if="activeInfoType === 2 && infoData.userExamGoodsSupplementVos && infoData.userExamGoodsSupplementVos.length > 0">
            <el-button type="info" style="margin-bottom: 20px" size="mini"
              >前培商品自带前培次数</el-button
            >
            <div
              v-for="(item, index) in infoData.userExamGoodsSupplementVos"
              :key="index"
            >
              <el-form-item label="商品名称：">
                <span
                  >{{ item.code }}-{{ item.goodsName }}({{
                    item.educationName +
                    "-" +
                    item.projectName +
                    "-" +
                    item.businessName
                  }})-￥{{ item.standPrice }}</span
                >
              </el-form-item>
              <el-col :span="24"
                ><el-form-item label="前培次数：">{{
                  item.doNumber
                }}</el-form-item></el-col
              >
              <!-- <el-col :span="16"
                ><el-form-item label="使用有效期："
                  >{{ $methodsTools.onlyForma(item.makeStartTime, false) }}至{{
                    $methodsTools.onlyForma(item.makeEndTime, false)
                  }}</el-form-item
                ></el-col
              > -->
            </div>
          </div>
          <el-button type="info" style="margin-bottom: 20px" size="mini"
            >消耗{{
              activeInfoType === 1
                ? "考试次数"
                : activeInfoType === 2
                ? "前培次数"
                : "未知"
            }}</el-button
          >
          <el-form-item
            :label="
              activeInfoType === 1
                ? '考试次数：'
                : activeInfoType === 2
                ? '前培次数：'
                : '未知'
            "
          >
            <span>{{
              activeInfoType === 1
                ? infoData.expendNumber
                : activeInfoType === 2
                ? infoData.expendBefore
                : ""
            }}</span>
          </el-form-item>
          <el-button type="info" style="margin-bottom: 20px" size="mini">{{
            activeInfoType === 1
              ? "剩余考试次数"
              : activeInfoType === 2
              ? "剩余前培次数"
              : "未知"
          }}</el-button>
          <el-form-item
            :label="
              activeInfoType === 1
                ? '剩余考试次数：'
                : activeInfoType === 2
                ? '剩余前培次数：'
                : '未知'
            "
          >
            <span>{{
              activeInfoType === 1
                ? infoData.examNumber - infoData.expendNumber
                : activeInfoType === 2
                ? infoData.doNumber - infoData.expendBefore
                : ""
            }}</span>
          </el-form-item>
        </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialoginfoWatch = false">取 消</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import pagination from "@/components/pagination";
export default {
  name: "ByTrainee",
  components: { pagination },
  data() {
    return {
      active: "",
      studentList: [],
      formData: {
        pageNum: 1,
        pageSize: 10,
      },
      tabSearchData: {
        userId: "",
        pageNum: 1,
        pageSize: 10,
      },
      totalRight: 0,
      tableList: [
        {
          label: "所购商品",
          prop1: "goodsCode",
          prop2: "goodsName",
          prop3: "standPrice",
          scope: "goodsName",
        },
        {
          label: "考试次数",
          prop1: "examNumber",
          prop2: "expendNumber",
          scope: "numTypes",
          type: 1,
        },
        {
          label: "前培次数",
          prop1: "doNumber",
          prop2: "expendBefore",
          scope: "numTypes",
          type: 2,
        },
      ],
      tableData: [],
      tableSet: [
        {
          label: "预约考试",
          prop: "subscribeStatus",
          hidden: true,
          width: "130px",
          scope: "isOptions",
          options: [
            {
              label: "正常",
              value: 1,
            },
            {
              label: "取消",
              value: 2,
            },
          ],
        },
        {
          label: "前培标记",
          prop: "beforeStatus",
          hidden: true,
          width: "130px",
          scope: "isOptions",
          options: [
            {
              label: "已开通",
              value: 1,
            },
            {
              label: "未开通",
              value: 0,
            },
          ],
        },
        {
          label: "考试登记",
          prop: "examStatus",
          hidden: true,
          width: "130px",
          scope: "isOptions",
          options: [
            {
              label: "待登记",
              value: 0,
            },
            {
              label: "正常",
              value: 1,
            },
            {
              label: "缺考",
              value: 2,
            },
            {
              label: "作弊",
              value: 3,
            },
            {
              label: "替考",
              value: 4,
            },
          ],
        },
        {
          label: "考试成绩和结果",
          prop1: "performance",
          prop2: "result",
          hidden: true,
          width: "130px",
          scope: "resultType",
        },
        {
          label: "证书编号",
          prop: "certificateCode",
          hidden: true,
          width: "130px",
        },
        {
          label: "考试标题",
          prop: "applyName",
          hidden: true,
          width: "130px",
        },
        {
          label: "学员姓名",
          prop: "realname",
          hidden: true,
          width: "130px",
        },
        {
          label: "学员身份证",
          prop: "idCard",
          hidden: true,
          width: "170px",
        },
        {
          label: "所购商品",
          prop1: "goodsCode",
          prop2: "goodsName",
          prop3: "standPrice",
          hidden: true,
          width: "220px",
          scope: "goodsInfos",
        },
        {
          label: "学员报考类型",
          prop: "studentType",
          hidden: true,
          width: "130px",
          scope: "isOptions",
          options: [
            {
              label: "非补考学员",
              value: 1,
            },
            {
              label: "补考学员",
              value: 2,
            },
          ],
        },
        {
          label: "所报专业",
          prop: "categoryName",
          hidden: true,
          width: "130px",
        },
        {
          label: "预约场次(考试地点和时间)",
          prop: "applySiteAddress",
          prop1: "applySiteExamTime",
          prop2: "applySiteStartTime",
          prop3: "applySiteEndTime",
          hidden: true,
          width: "280px",
          scope: "applyInfos",
        },
        {
          label: "考试次数消耗",
          prop: "examExpend",
          hidden: true,
          width: "130px",
        },
        {
          label: "预约场次(考培地点和时间)",
          prop: "applySiteAddressTrain",
          prop1: "applySiteExamTrainTime",
          prop2: "applySiteStartTrainTime",
          prop3: "applySiteEndTrainTime",
          hidden: true,
          width: "280px",
          scope: "applyInfos",
        },
        {
          label: "前培次数消耗",
          prop: "beforeExpend",
          hidden: true,
          width: "130px",
        },
        {
          label: "创建时间",
          prop: "createTime",
          hidden: true,
          scope: "aTimeList",
          width: "160px",
        },
      ],
      total: 0,
      dialogDJ: false,
      dialogCG: false,
      dialogPLS: false,
      dialoginfoWatch: false,
      listData: {},
      infoData: {},
      activeInfoType: 0, //1考试次数2前培次数---头部标题变化
      rules: {
        examStatus: [
          { required: true, message: "请选择考试登记状态", trigger: "change" },
        ],
      },
    };
  },
  mounted() {
    this.getStudent();
  },
  activated() {
    this.getStudent();
  },
  methods: {
    seeInfos(row, int) {
      this.activeInfoType = int;
      this.$api
        .inquiresystemsubscribeUserExam({
          goodsId: row.goodsId,
          userId: row.userId,
          orderGoodsId:row.orderGoodsId
        })
        .then((res) => {
          this.infoData = JSON.parse(JSON.stringify(res.data));
          this.infoData.doNumberAll = 0;
          this.infoData.examNumberAll = 0;
          this.infoData.userExamGoodsSupplement.forEach((item) => {
            this.infoData.examNumberAll += item.examNumber;
          });
          this.infoData.userExamGoodsSupplementVos.forEach((item) => {
            this.infoData.doNumberAll += item.doNumber;
          });
          this.dialoginfoWatch = true;
        });
    },
    openZS(row) {
      if (row.examStatus !== 1) {
        this.$message.warning("考试登记状态为正常的计划才可执行该操作");
        return;
      }
      this.listData = JSON.parse(JSON.stringify(row));
      this.dialogPLS = true;
    },
    submitChecksPals() {
      if (!this.listData.performance && this.listData.performance !== 0) {
        this.$message.warning(`未填写考试成绩，请填写考试成绩！`);
        return;
      }
      if (!this.listData.result && this.listData.result !== 0) {
        this.$message.warning(`未选择考试结果，请选择考试结果！`);
        return;
      }
      var data = JSON.parse(JSON.stringify(this.listData));
      this.$api.appsystemsubscribe([data]).then((res) => {
        var dat = {
          subscribeId: this.listData.subscribeId,
        };
        this.$api.inquiresystemsubscribelist(dat).then((res) => {
          for (let k = 0; k < res.rows.length; k++) {
            for (let i = 0; i < res.rows[k].examApplySite.length; i++) {
              for (
                let j = 0;
                j < res.rows[k].examApplySite[i].examApplySiteTime.length;
                j++
              ) {
                res.rows[k].examApplySite[i].examApplySiteTime[j].siteTime =
                  JSON.parse(
                    res.rows[k].examApplySite[i].examApplySiteTime[j].siteTime
                  );
              }
            }
            for (let i = 0; i < res.rows[k].examApplySiteTrain.length; i++) {
              for (
                let j = 0;
                j < res.rows[k].examApplySiteTrain[i].examApplySiteTime.length;
                j++
              ) {
                res.rows[k].examApplySiteTrain[i].examApplySiteTime[
                  j
                ].siteTime = JSON.parse(
                  res.rows[k].examApplySiteTrain[i].examApplySiteTime[j]
                    .siteTime
                );
              }
            }
          }
          let ast = res.rows[0];
          for (let i = 0; i < this.tableData.length; i++) {
            if (this.tableData[i].goodsId === data.goodsId) {
              for (let k = 0; k < this.tableData[i].children.length; k++) {
                if (
                  this.tableData[i].children[k].subscribeId === data.subscribeId
                ) {
                  this.$set(this.tableData[i].children, k, ast);
                }
              }
            }
          }
          this.$message.success("已修改成绩和证书登记");
          this.dialogPLS = false;
        });
      });
    },
    openClearYX(row) {
      this.listData = JSON.parse(JSON.stringify(row));
      this.dialogDJ = true;
    },
    submitChecksDJ() {
      var data = JSON.parse(JSON.stringify(this.listData));
      data.subscribeId = [data.subscribeId];
      data.subscribeStatus = 2;
      this.$api.editsystemsubscribe(data).then((res) => {
        var dat = {
          subscribeId: this.listData.subscribeId,
        };
        this.$api.inquiresystemsubscribelist(dat).then((res) => {
          for (let k = 0; k < res.rows.length; k++) {
            for (let i = 0; i < res.rows[k].examApplySite.length; i++) {
              for (
                let j = 0;
                j < res.rows[k].examApplySite[i].examApplySiteTime.length;
                j++
              ) {
                res.rows[k].examApplySite[i].examApplySiteTime[j].siteTime =
                  JSON.parse(
                    res.rows[k].examApplySite[i].examApplySiteTime[j].siteTime
                  );
              }
            }
            for (let i = 0; i < res.rows[k].examApplySiteTrain.length; i++) {
              for (
                let j = 0;
                j < res.rows[k].examApplySiteTrain[i].examApplySiteTime.length;
                j++
              ) {
                res.rows[k].examApplySiteTrain[i].examApplySiteTime[
                  j
                ].siteTime = JSON.parse(
                  res.rows[k].examApplySiteTrain[i].examApplySiteTime[j]
                    .siteTime
                );
              }
            }
          }
          let ast = res.rows[0];
          for (let i = 0; i < this.tableData.length; i++) {
            if (this.tableData[i].goodsId === data.goodsId) {
              for (let k = 0; k < this.tableData[i].children.length; k++) {
                if (
                  this.tableData[i].children[k].subscribeId ===
                  data.subscribeId[0]
                ) {
                  this.$set(this.tableData[i].children, k, ast);
                }
              }
            }
          }
        });
        this.$message.success("已取消预约");
        this.dialogDJ = false;
      });
    },
    editExam(row) {
      this.listData = JSON.parse(JSON.stringify(row));
      this.dialogCG = true;
    },
    submitChecks(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          if (!this.listData.examStatus) {
            this.$message.warning("请选择考试登记状态");
            return;
          }
          this.submitForm();
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    submitForm() {
      var data = JSON.parse(JSON.stringify(this.listData));
      data.subscribeId = [data.subscribeId];
      this.$api.editsystemsubscribe(data).then((res) => {
        var dat = {
          subscribeId: this.listData.subscribeId,
        };
        this.$api.inquiresystemsubscribelist(dat).then((res) => {
          for (let k = 0; k < res.rows.length; k++) {
            for (let i = 0; i < res.rows[k].examApplySite.length; i++) {
              for (
                let j = 0;
                j < res.rows[k].examApplySite[i].examApplySiteTime.length;
                j++
              ) {
                res.rows[k].examApplySite[i].examApplySiteTime[j].siteTime =
                  JSON.parse(
                    res.rows[k].examApplySite[i].examApplySiteTime[j].siteTime
                  );
              }
            }
            for (let i = 0; i < res.rows[k].examApplySiteTrain.length; i++) {
              for (
                let j = 0;
                j < res.rows[k].examApplySiteTrain[i].examApplySiteTime.length;
                j++
              ) {
                res.rows[k].examApplySiteTrain[i].examApplySiteTime[
                  j
                ].siteTime = JSON.parse(
                  res.rows[k].examApplySiteTrain[i].examApplySiteTime[j]
                    .siteTime
                );
              }
            }
          }
          let ast = res.rows[0];
          for (let i = 0; i < this.tableData.length; i++) {
            if (this.tableData[i].goodsId === data.goodsId) {
              for (let k = 0; k < this.tableData[i].children.length; k++) {
                if (
                  this.tableData[i].children[k].subscribeId ===
                  data.subscribeId[0]
                ) {
                  this.$set(this.tableData[i].children, k, ast);
                }
              }
            }
          }
        });
        this.$message.success("考试登记修改成功");
        this.dialogCG = false;
      });
    },
    async expandChange(row, e) {
      if (e.length > 0) {
        //获取后台数据
        const result = await this.getApis({
          userId: row.userId,
          goodsId: row.goodsId,
          orderGoodsId:row.orderGoodsId
        });
        //便利table数组，找到符合本行数据，赋值
        this.tableData.forEach((item, index) => {
          if (row.orderGoodsId === item.orderGoodsId) {
            item.children = result;
          }
        });
      }
    },
    getApis(data) {
      return new Promise((resolve, reject) => {
        this.$api.inquiresystemsubscribelist(data).then((res) => {
          // for (let k = 0; k < res.rows.length; k++) {
          //   for (let i = 0; i < res.rows[k].examApplySite.length; i++) {
          //     for (
          //       let j = 0;
          //       j < res.rows[k].examApplySite[i].examApplySiteTime.length;
          //       j++
          //     ) {
          //       res.rows[k].examApplySite[i].examApplySiteTime[j].siteTime =
          //         JSON.parse(
          //           res.rows[k].examApplySite[i].examApplySiteTime[j].siteTime
          //         );
          //     }
          //   }
          //   for (let i = 0; i < res.rows[k].examApplySiteTrain.length; i++) {
          //     for (
          //       let j = 0;
          //       j < res.rows[k].examApplySiteTrain[i].examApplySiteTime.length;
          //       j++
          //     ) {
          //       res.rows[k].examApplySiteTrain[i].examApplySiteTime[
          //         j
          //       ].siteTime = JSON.parse(
          //         res.rows[k].examApplySiteTrain[i].examApplySiteTime[j]
          //           .siteTime
          //       );
          //     }
          //   }
          // }
          resolve(res.rows);
        });
      });
    },
    acs(int) {
      if (int === 2) {
        this.tabSearchData.pageSize = 10;
        this.tabSearchData.pageNum = 1;
      }
      this.$api
        .inquiresystemsubscribelistUserExam(this.tabSearchData)
        .then((res) => {
          this.totalRight = res.total;
          this.active = this.tabSearchData.userId;
          this.tableData = res.rows.map((item) => {
            return {
              ...item,
              children: [],
              //新增空数组children装展开行内容
            };
          });
        });
    },
    changeNewActive(item) {
      if (item.userId === this.active) {
        return;
      }
      this.tabSearchData.userId = item.userId;
      this.acs(2);
    },
    getStudent(int) {
      if (int === 1) {
        this.formData = {
          pageNum: 1,
          pageSize: 10,
        };
      }
      this.$api.inquiresystemsubscribelistUser(this.formData).then((res) => {
        this.total = res.total;
        this.studentList = res.rows;
      });
    },
    handleCurrentChange(v) {
      this.formData.pageNum = v;
      this.getStudent();
    },
    handleSizeChange(v) {
      this.tabSearchData.pageSize = v;
      this.tabSearchData.pageNum = 1;
      this.acs();
    },
    handleCurrentChanges(v) {
      this.tabSearchData.pageNum = v;
      this.acs();
    },
  },
};
</script>

<style lang="less" scoped>
.dis_fs {
  margin-top: 12px;
  display: flex;
  .dis_left {
    min-width: 250px;
    background-color: #eee;
    margin-right: 20px;
    padding: 10px 14px;
    .inputSty {
      width: 133px;
      outline: none;
      height: 26px;
    }
    .btnSearchSty {
      border: 1px solid #666;
      background-color: #fff;
      padding: 0px 6px;
      font-size: 14px;
      height: 26px;
      line-height: 26px;
      border-left: none;
      cursor: pointer;
    }
  }
  .dis_right {
    flex: 1;
  }
}
.listy {
  margin-bottom: 6px;
  padding: 4px;
  font-size: 14px;
  cursor: pointer;
  border: 1px solid transparent;
}
.active {
  border: 1px solid #000;
  background-color: #fff;
}
/deep/.el-button {
  border-radius: 8px;
}
/deep/.el-dialog {
  border-radius: 8px;
  .el-dialog__header {
    padding: 0;
    .hearders {
      height: 40px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0px 18px 0px 20px;
      border-bottom: 1px solid #e2e2e2;
      .leftTitle {
        font-size: 14px;
        font-weight: bold;
        color: #2f4378;
      }
      .rightBoxs {
        display: flex;
        align-items: center;
        img {
          width: 14px;
          height: 14px;
          margin-left: 13px;
          cursor: pointer;
        }
      }
    }
  }
  .el-dialog__footer {
    padding: 0;
    .dialog-footer {
      padding: 0px 40px;
      height: 70px;
      border-top: 1px solid #e2e2e2;
      display: flex;
      align-items: center;
      justify-content: flex-end;
    }
  }
}
.imgBox {
  width: 100%;
  // height: 210px;
  border: 1px solid #e2e2e2;
  border-radius: 8px;
  padding: 8px 8px 3px;
  display: flex;
  flex-direction: column;
  align-items: center;
  .imgLabel {
    flex: 1;
    width: 100%;
    border: 1px dotted #e2e2e2;
    color: #999;
    font-size: 14px;
    cursor: pointer;
    border-radius: 8px;
    .msPhoto {
      display: flex;
      justify-content: center;
      align-items: center;
      max-width: 100%;
      max-height: 270px;
      img {
        max-width: 100%;
        max-height: 270px;
      }
    }
    .imgbbx {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      width: 100%;
      height: 100%;
      i {
        font-weight: bold;
        margin: 14px 0;
        font-size: 24px;
      }
    }
  }
  p {
    margin: 5px 0px;
  }
}
.aListBottom {
  margin-bottom: 20px;
  padding: 0px 6px;
  border: 1px solid #999;
  border-radius: 4px;
  height: 30px;
  line-height: 30px;
  display: inline-block;
}
.liBVS {
  margin-right: 20px;
  margin-bottom: 12px;
  padding: 0px 6px;
  border: 1px solid #999;
  border-radius: 4px;
  height: 30px;
  line-height: 30px;
  display: inline-block;
  float: left;
}
.clsw {
  margin-left: 4px;
  cursor: pointer;
  color: #f56c6c;
}
</style>