<style>
  .w400 {
    width: 400px !important;
  }

  /* .el-select-dropdown__item{
        min-width: 400px;
   } */
   .el-picker-panel{
       z-index: 9999!important;
   }
</style>
<template>
  <q-dialog v-model="persistent" persistent content-class="bg-grey-1" transition-show="scale" transition-hide="scale">
    <q-card style="max-width:600px;width:600px;" class="remind_Dialog">
      <q-card-section>
        <div class="text-h6">修改提醒时间</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-select class="q-pb-lg" style="width:400px;display:inline-block;" multiple filled stack-label use-input
              use-chips option-value="Id" option-label="Name" v-model="daysOne" ref="ManagerId" :options="optionList"
              :dense="false" emit-value map-options>
              <template v-slot:no-option>
                <q-item>
                  <q-item-section class="text-grey">
                    未找到相关数据
                  </q-item-section>
                </q-item>
              </template>
            </q-select>
            个工作日
          </div>
        </div>
        <div class="row wrap">
          <div class="col-12" style="margin-bottom:50px;">
            <span style="margin:0 5px 0 55px;">时间</span>
            <el-time-select v-model="msg.Time" class="w400" :picker-options="{
                start: '00:00',
                step: '00:15',
                end: '23:59'
            }" placeholder="选择时间">
            </el-time-select>
          </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 {
    SetOKRRemindInfo
  } from '../../api/okr/index'
  export default {
    props: {
      saveObj: {
        type: Object,
        default: null,
      }
    },
    data() {
      return {
        persistent: true,
        msg: {
          Id: 0,
          Days: '',
          Time: '',
          Type: 1
        },
        optionList: [{
          Id: 1,
          Name: 1
        }, {
          Id: 2,
          Name: 2
        }, {
          Id: 3,
          Name: 3
        }, {
          Id: 4,
          Name: 4
        }, {
          Id: 5,
          Name: 5
        }, {
          Id: 6,
          Name: 6
        }, {
          Id: 7,
          Name: 7
        }, {
          Id: 8,
          Name: 8
        }, {
          Id: 9,
          Name: 9
        }, {
          Id: 10,
          Name: 10
        }, {
          Id: 11,
          Name: 11
        }, {
          Id: 12,
          Name: 12
        }, {
          Id: 13,
          Name: 13
        }, {
          Id: 14,
          Name: 14
        }, {
          Id: 15,
          Name: 15
        }, {
          Id: 16,
          Name: 16
        }, {
          Id: 17,
          Name: 17
        }, {
          Id: 18,
          Name: 18
        }, {
          Id: 19,
          Name: 19
        }, {
          Id: 20,
          Name: 20
        }],
        daysOne: [],
      }
    },
    computed: {},
    mounted() {
       this.msg.Id = this.saveObj.Id;
       this.daysOne = this.saveObj.Days.split(',');
       this.msg.Time = this.saveObj.Time;
       this.msg.Type = this.saveObj.Type;
    },
    methods: {
      //取消
      closeRuleForm() {
        this.$emit('close');
        this.persistent = false
      },
      //保存信息
      saveRule() {
        if(this.daysOne&&this.daysOne.length>0){
            this.msg.Days= this.daysOne.join(',');
        }
        SetOKRRemindInfo(this.msg).then(res => {
          if (res.Code == 1) {
            this.$emit('success');
            this.closeRuleForm();
          }
        })
      },
    },
  }

</script>
