<template>
  <div>
    <q-dialog v-model="show" persistent transition-show="scale" transition-hide="scale" @input="changeDig">
      <q-card style="width: 600px;max-width:900px;">
        <q-card-section class="row items-center q-pb-none">
          <div class="text-h6">取消约课</div>
          <q-space />
          <q-btn icon="close" flat round dense @click="changeDig(false)" />
        </q-card-section>
        <q-card-section class="q-pt-none scroll" style="max-height: 70vh">
          <q-field filled label="学员列表" stack-label>
            <template v-slot:control>
              <div class="row">
                <q-checkbox v-model="selectStu" v-for="(x, y) in saveObj.GuestList" :key="y" :val="x.AppointmentId">
                  {{ x.GuestName }}
                </q-checkbox>
              </div>
            </template>
          </q-field>

        </q-card-section>
        <q-separator />
        <q-card-actions align="right" class="bg-white">
          <q-btn label="取消" flat color="grey-10" @click="changeDig(false)" />
          <q-btn label="确定" dense color="accent" @click="save" />
        </q-card-actions>
      </q-card>
    </q-dialog>
  </div>
</template>
<script>
  import {
    cancelSureAppointment
  } from "../../../api/studyabroad/subscribe.js";
  export default {
    model: {
      prop: "show",
      event: "changeshow"
    },
    props: {
      saveObj: {
        type: Object,
        default: null
      },
      date: {
        type: String,
        default: ""
      },
      show: {
        type: Boolean,
        default: false
      }
    },
    data() {
      return {
        msg: {
          Date: "",
          TeacherId: 0,
          StuIds: 0,
          ShiftSort: "",
        },
        selectStu: []
      };
    },
    methods: {
      //开关弹窗
      changeDig(val) {
        this.$emit("changeshow", val);
      },
      save() {
        if (this.selectStu.length == 0) {
          this.$q.notify({
            message: "请选择学生",
            position: "top"
          });
          return;
        }
        const msg = {
          Date: this.date,
          TeacherId: this.saveObj.Tid,
          ShiftSort: this.saveObj.ShiftSort,
          AppointIds: this.selectStu.toString()
        };
        cancelSureAppointment(msg).then(res => {
          if (res.Code == 1) {
            this.$q.notify({
              message: "操作成功",
              position: "top"
            });
            this.$emit("success",this.selectStu);
            this.selectStu = []
            this.changeDig(false)
          }
        });
      }
    }
  };

</script>
