<template>
  <my-dialog :print="print" title="改约" :is-show="show" @handleSave="handleSave" @close="closeDialog">
    <el-form id="reOrder" ref="form" size="small" :model="form" label-width="100px">
      <div v-for="(item,index) in patients" :key="index">
        <div class="secTitle">{{ `${item.itemName} ${item.patientName}` }}</div>
        <el-date-picker
          v-model="item.appointDate"
          type="datetime"
          placeholder="选择日期时间"
        />
      </div>
    </el-form>
  </my-dialog>
</template>

<script>
import MyDialog from '@/page-subspecialty/views/modules/nurseManagement/myDialog.vue'

export default {
  name: 'ReDialog',
  components: { MyDialog },
  props: {
    isShow: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      show: false,
      print: {
        id: 'reOrder'
      },
      patients: [],
      form: {
        date1: '',
        date2: '',
        date3: '',
        date4: '',
        date5: '',
        date6: ''
      }
    }
  },
  watch: {
    isShow(val) {
      this.show = val
    }
  },
  methods: {
    closeDialog(val) {
      this.$emit('close', val)
    },
    handleSave() {
      this.patients.forEach(item => {
        this.$set(item, 'appointDate', this.$moment(item.appointDate).format('YYYY-MM-DD HH:mm:ss'))
      })
      this.$http.post('/appoint/batchUpdateAppointInfo', [...this.patients]).then(() => {
        this.$emit('saveAppoint')
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.line{
  text-align: center;
}
.secTitle{
  font-size: 16px;
  font-weight: bold;
  color:  rgba(0, 0, 0, 0.85);
  margin: 16px 0;
}
</style>
