<template>
  <a-modal title="预设时间" :visible="timeShow" @ok="timeOk " @cancel="timeCancel"
  :width=600 :body-style="{width:200}">
    <a-button @click="addTimes" style="position: absolute; right: 0px; margin-top: -10px; margin-right: 24px;">新增时间</a-button>
    <a-table
      ref="table"
      size="middle"
      :scroll="{ y:200}"
      :pagination="false" 
      rowKey="value"
      :columns="columns"
      :dataSource="timeList"
      :loading="loading"
      :row-selection="rowSelection"
      style="margin-top: 30px;"
      >
    </a-table>
  </a-modal>
</template>
<script>

import { initDictOptions } from '@/components/dict/JDictSelectUtil'

export default {
  name: 'PrefabricationTime',
  data () {
    return {
      timeList:[],
      columns:[],
      selected: null,
      loading: false,
      columns: [
        {
          title:'上课时间',
          align:"center",
          dataIndex: 'value'
        },
        {
          title:'上课时长',
          align:"center",
          dataIndex: 'title',
          customRender: (text) => text + ' 分钟'
        },
      ],
    }
  },
  computed: {
    rowSelection() {
      return {
        type: "radio", //单选按钮定义
        onChange: (selectedRowKeys, selectedRows) => {
          console.log("选中的",selectedRowKeys,selectedRows);
          this.selected = selectedRows;
         }
      };
    }
  },
  props: ['timeShow'],
  watch: {
    immediate: true,
    timeShow: {
      handler() {
        this.selected = null;
        initDictOptions('education_schedule').then((res) => {
          if (res.success) {
            this.timeList = res.result;
          }
        });
      },
    }
  },
  methods: {
    timeCancel() {
      this.$emit('child-event',null);
    },
    timeOk() {
      this.$emit('child-event',this.selected);
    },
    addTimes() {
      console.log('后面再做');
    }
  }
}
</script>
