<template>
<a-modal
  v-model="visible"
  title="转换列表"
  :footer="null"
  width="50%"
>
  <div class="converted_list_container">
    <a-spin :spinning="loading">
      <vxe-table
        class="table_list"
        ref="convertedTable"
        show-overflow
        show-header-overflow
        border
        resizable
        :row-config="{ isHover: true }"
        :data="convertedList"
        height="auto"
      >
        <vxe-column
          type="seq"
          title="序号"
          width="60"
          align="center"
        ></vxe-column>
        <vxe-column field="name" title="名称"></vxe-column>
        <vxe-column field="startTime" title="开始时间" width="220" v-if="type=='TIMESTAMP'">
          <template #default="{ row }">
            {{ moment(Number(row.lowerBound)).format("YYYY-MM-DD HH:mm:ss") }}
          </template>
        </vxe-column>
        <vxe-column field="endTime" title="结束时间" width="220" v-if="type=='TIMESTAMP'">
          <template #default="{ row }">
            {{ moment(Number(row.upperBound)).format("YYYY-MM-DD HH:mm:ss") }}
          </template>
        </vxe-column>
        <vxe-column title="#" width="40">
          <template #default="{ row }">
            <a-checkbox disabled :checked="row.run"></a-checkbox>
          </template>
        </vxe-column>
        <template #empty>
          <a-empty
            :image-style="{
              height: '80px',
            }"
          >
            <span slot="description"> 暂无数据 </span>
          </a-empty>
        </template>
      </vxe-table>
    </a-spin>
  </div>
</a-modal>

</template>

<script>
const $dispatchcenter = require("@/api/dispatchcenter");
export default {
  name: "convertedList",
  props: {
    info: [Object],
    show: [Boolean]
  },
  data() {
    return {
      loading: false,
      pager: {
        pageNum: 1,
        pageSize: 15,
      },
      convertedList: [],
      type: undefined
    };
  },
  computed:{
    visible: {
      get() {
        return this.show
      },
      set(val) {
        this.$emit("update:show", val)
      }
    }
  },
  watch: {
    show: {
      handler(val) {
        val && this.getList()
      },
      immediate: true
    },
  },
  created() {},
  methods: {
    getList() {
      this.loading = true;
      let paramsList = this.info.executorParam ? this.info.executorParam.split(',') : [];
      $dispatchcenter
        .scheduleTransformLog({
          ...this.pager,
          queryParams: {
            F_jobInfoId_eq: this.info.jobInfoId,
            F_type_eq: paramsList[1] || "",
          }
        })
        .then((req) => {
          if (req.data.length > 0) {
            this.convertedList = JSON.parse(req.data[0].transforms);
            this.type = this.convertedList.length > 0 ? this.convertedList[0].boundType : undefined;
            // console.log(this.convertedList)
          } else {
            this.convertedList = [];
          }
        })
        .finally(() => {
          this.loading = false;
        })
    },

  }
};
</script>
<style lang="less" scoped>
.converted_list_container .table_list{
  height: 400px;
}
</style>