<template>
  <q-dialog v-model="persistent" persistent content-class="bg-grey-1" transition-show="scale" transition-hide="scale">
    <q-card style="width: 450px;max-width:500px;">
      <q-card-section>
        <div class="text-h6">{{(saveObj&&saveObj.Id>0)?"修改班次":"新增班次"}}</div>
      </q-card-section>
      <q-card-section class="q-pt-none scroll" style="max-height: 70vh">
        <div class="row wrap">
          <div class="col-12">
            <q-input filled stack-label maxlength="20" :dense="false" v-model="msg.Name" ref="Name"
              class="col-12 q-pb-lg" label="班次名称" :rules="[val => !!val || '请填写班次名称']" />
          </div>
        </div>
        <div class="row wrap">
          <div class="col-12">
            <q-select v-model="schoolArr" multiple :options="schoolOptions" color="primary" filled clearable
              class="col-12 q-pb-lg" label="选择校区" option-label="SName" option-value="SId" ref="School_Ids"
              @input="changeschool" />
          </div>
        </div>
        <div class="row wrap">
          <div class="col-12 q-gutter-sm row">
            <q-input filled v-model="msg.StartTime" label="开始时间" mask="time" :rules="['time']" ref="StartTime"
              class="col-6 q-pr-lg q-pb-lg">
              <template v-slot:append>
                <q-icon name="access_time" class="cursor-pointer">
                  <q-popup-proxy transition-show="scale" transition-hide="scale">
                    <q-time now-btn v-model="msg.StartTime">
                      <div class="row items-center justify-end">
                        <q-btn v-close-popup label="关闭" color="primary" flat />
                      </div>
                    </q-time>
                  </q-popup-proxy>
                </q-icon>
              </template>
            </q-input>
            <q-input filled v-model="msg.EndTime" label="结束时间" mask="time" :rules="['time']" ref="EndTime"
              class="col-5 q-pb-lg">
              <template v-slot:append>
                <q-icon name="access_time" class="cursor-pointer">
                  <q-popup-proxy transition-show="scale" transition-hide="scale">
                    <q-time now-btn v-model="msg.EndTime">
                      <div class="row items-center justify-end">
                        <q-btn v-close-popup label="关闭" color="primary" flat />
                      </div>
                    </q-time>
                  </q-popup-proxy>
                </q-icon>
              </template>
            </q-input>
          </div>
        </div>
      </q-card-section>
      <q-card-actions align="right" class="bg-white">
        <q-btn label="取消" flat color="grey-10" style="font-weight:400 !important" @click="closeRuleForm" />
        <q-btn label="保存" color="accent q-px-md" style="font-weight:400 !important" @click="saveRule" />
      </q-card-actions>
    </q-card>
  </q-dialog>
</template>

<script>
  import {
    SetFrequency
  } from "../../api/duty/index"
  export default {
    props: {
      saveObj: {
        type: Object,
        default: null
      },
      schoolOptions: {
        type: Array,
        default: []
      }
    },
    data() {
      return {
        schoolArr: [],
        msg: {
          Id: 0,
          Name: "",
          School_Ids: "",
          StartTime: '',
          EndTime: "",
        },
        persistent: true,
      }
    },
    computed: {},
    created() {},
    mounted() {
      if (this.saveObj && this.saveObj.Id > 0) {
        let schoolids = this.saveObj.School_Ids.split(",");
        this.schoolArr = []
        schoolids.map((item) => {
          this.schoolOptions.map((_item) => {
            if (_item.SId == item) {
              this.schoolArr.push(_item)
            }
          })
        })
        this.msg.Id = this.saveObj.Id;
        this.msg.Name = this.saveObj.Name;
        this.msg.School_Ids = this.saveObj.School_Ids;
        this.msg.StartTime = this.saveObj.StartTime;
        this.msg.EndTime = this.saveObj.EndTime;
      }
    },
    methods: {
      changeschool() {},
      //保存信息
      saveRule() {
        this.$refs.Name.validate();
        this.$refs.School_Ids.validate();
        this.$refs.StartTime.validate();
        this.$refs.EndTime.validate();
        if (!this.$refs.Name.hasError &&
          !this.$refs.School_Ids.hasError &&
          !this.$refs.StartTime.hasError &&
          !this.$refs.EndTime.hasError) {
          if (this.schoolArr && this.schoolArr.length > 0) {
            this.msg.School_Ids = this.schoolArr.map(item => item.SId).toString();
          } else {
            this.msg.School_Ids = "";
          }
          SetFrequency(this.msg).then(res => {
            if (res.Code == 1) {
              this.$emit('success');
              this.closeRuleForm();
            }
          })
        }
      },
      //关闭窗口
      closeRuleForm() {
        this.$emit('close');
        this.persistent = false
      }
    },
  }
</script>