<template>
    <div :class="['module-property']" >
        <Collapse>
            <Panel>
                上报纵览整体设置
                <div slot="content">
                    <div class="property-item">
                        <label>选择任务</label>
                        <Select v-model="selectedTask.Code" clearable style="width:200px;" :label-in-value="true">
                            <Option v-for="(taskList,index) in taskLists" :value="taskList.Code" :key="index">{{taskList.Title}}</Option>
                        </Select>
                    </div>
                    <div class="property-item-content">
                      <Checkbox @on-change="changeRedo" v-model="selectedTask.ShowReLinkIcon">显示跳转图标</Checkbox>
                    </div>    
                </div>
            </Panel>
        </Collapse>
    </div>
</template>

<script>
import api from "@modules/portal/api/statestatsApi.js";
import commonEnum from "@modules/common/static/CommonEnum.js";
import weekPicker from "@libs/weekpicker.js";
import datepicker from "@libs/datepicker-me.js";
import "@base/styles/datepicker/datepicker.css";

const periodType = window.JCP.Enum.TaskPeriodType;
window.On_StateStats_TaskChanged = "onstatestatstaskchanged";
window.On_ReloadChanged = "reloadchanged";

export default {
  created() {
    let prop = this.$store.getters.getNodeProp(this.itemId);
    if (!prop) {
      this.$store.commit("setNodeProp", {
        id: this.itemId,
        selectedTask: {
          Code: "",
          Title: "a",
          StartDate: "",
          PeriodType: "0",
          ShowReLinkIcon: false
        }
      });
    }
    this.selectedTask = this.$store.getters.getNodeProp(
      this.itemId
    ).selectedTask;
  },
  data() {
    return {
      taskLists: [],
      selectedTask: {
        Code: "",
        Title: "",
        StartDate: "",
        PeriodType: "",
        ShowReLinkIcon: false
      }
    };
  },

  props: ["itemId"],

  mounted() {
    api.getAllTasks(null, result => {
      this.taskLists = result.TaskList;
    });
  },
  methods: {
    changeRedo() {
      this.$root.$emit(
        window.On_ReloadChanged + this.itemId,
        this.selectedTask.ShowReLinkIcon
      );
    }
  },

  computed: {},

  watch: {
    "selectedTask.Code": function(newValue) {
      if (!newValue) return;

      let curTask = this.taskLists.filter(item => item.Code == newValue)[0];
      if (!curTask) return;

      this.selectedTask.Title = curTask.Title;
      this.selectedTask.PeriodType = curTask.PeriodType;
      this.selectedTask.StartDate = curTask.StartDate;
      this.selectedTask.ShowReLinkIcon = this.selectedTask.ShowReLinkIcon;
      this.$root.$emit(
        window.On_StateStats_TaskChanged + this.itemId,
        this.selectedTask
      );
    }
  }
};
</script>

