import { QBreadcrumbs, QBreadcrumbsEl } from './QBreadcrumbs-d508f268.js';
import { defineStore, mapActions, mapState, createElementBlock, createBaseVNode, createVNode, withCtx, QBtn, useQuasar, resolveComponent, openBlock, QIcon, createTextVNode, Fragment, renderList, toDisplayString, createCommentVNode, createBlock, pushScopeId, popScopeId } from './__federation_expose_Modules-a9c6a6fc.js';
import { QSpace } from './QSpace-afce9c3e.js';
import { QInput } from './QInput-a81d9a9f.js';
import { QCheckbox } from './QCheckbox-5e45c1d5.js';
import { QTable, QTh, QTd } from './QTable-7f066ad6.js';
import { QTr } from './QTr-08515a17.js';
import { QSpinnerGears } from './QSpinnerGears-56c57999.js';
import { _export_sfc } from './_plugin-vue_export-helper-e9a2c33e.js';

const useTrainingStore = defineStore('training', {
  state() {
    // data
    return {
      trainingList: [],
      tableData: [],
      newTraining: null
    };
  },
  actions: {
    // methods
    reset() {
      this.tableData = [];
      this.trainingList = [];
    },
    getTrainingList() {
      window.$http.get('/rest/v1/trainings').then(res => {
        this.trainingList = res.data.trainings;
        this.trainingList.forEach(element => {
          if (element.kubeflow_exp != 'xxx') {
            element.kubeflow_exp = element.kubeflow_exp;
          }
          this.tableData.push({
            training: {
              name: element.training_name,
              id: element.training_id
            },
            resource: element.dataset_type,
            pipeline: {
              name: element.pipeline_name,
              version: element.pipeline_version
            },
            expId: element.kubeflow_exp,
            created: element.created_date,
            lastUpdated: element.updated_date,
            status: element.status
          });
        });
      }).catch(error => {
        console.log("getListTraining", error);
      });
    }
  },
  getters: {// computed
  }
});

const showTrainingList_vue_vue_type_style_index_0_scoped_9f97d97a_lang = '';

useQuasar();
const _sfc_main = {
  name: 'listTraining',
  data() {
    return {
      pagination: {
        rowsPerPage: 100 // current rows per page being displayed
      },

      status: ['Running...', 'Completed', 'Error'],
      tableHeader: [{
        name: 'name',
        label: 'Name',
        align: 'left',
        field: 'name'
      }, {
        name: 'resource',
        label: 'Resource',
        align: 'left',
        field: 'resource'
      }, {
        name: 'pipeline',
        label: 'Pipeline',
        align: 'left',
        field: 'pipeline'
      }, {
        name: 'expId',
        label: 'Training ID',
        align: 'left',
        field: 'expId'
      }, {
        name: 'lastUpdated',
        label: 'Last Updated',
        align: 'left',
        field: 'lastUpdated'
      }, {
        name: 'status',
        label: 'Status',
        align: 'left',
        field: 'status'
      }],
      selected: [],
      filter: ''
    };
  },
  methods: {
    ...mapActions(useTrainingStore, ['getTrainingList', 'reset'])
  },
  computed: {
    ...mapState(useTrainingStore, ['tableData', 'newTraining'])
  },
  beforeRouteLeave(to) {
    if (to.params.id == 'xxx') {
      this.reset();
      this.getTrainingList();
      this.$q.notify({
        type: 'warning',
        message: 'The Training ID is currently being generated by the system. Kindly refresh the page to obtain the updated information.'
      });
      return false;
    }
  },
  created() {
    this.reset();
    this.getTrainingList();
  }
};
const _withScopeId = n => (pushScopeId("data-v-9f97d97a"), n = n(), popScopeId(), n);
const _hoisted_1 = {
  class: "row nav-text"
};
const _hoisted_2 = {
  class: "col"
};
const _hoisted_3 = {
  class: "row",
  style: {
    "padding-right": "15px"
  }
};
const _hoisted_4 = {
  class: "row",
  style: {
    "margin-left": "16px",
    "margin-right": "15px"
  }
};
const _hoisted_5 = {
  class: "col"
};
const _hoisted_6 = /*#__PURE__*/_withScopeId(() => /*#__PURE__*/createBaseVNode("span", {
  class: "body-text"
}, " name: ", -1));
const _hoisted_7 = /*#__PURE__*/_withScopeId(() => /*#__PURE__*/createBaseVNode("br", null, null, -1));
const _hoisted_8 = /*#__PURE__*/_withScopeId(() => /*#__PURE__*/createBaseVNode("span", {
  class: "body-text"
}, " version: ", -1));
const _hoisted_9 = {
  key: 0,
  style: {
    "font-weight": "600",
    "color": "red"
  }
};
const _hoisted_10 = {
  key: 1
};
const _hoisted_11 = {
  key: 0
};
const _hoisted_12 = {
  key: 1
};
const _hoisted_13 = {
  key: 0,
  class: "status-running"
};
const _hoisted_14 = {
  key: 1,
  class: "status-complete"
};
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
  const _component_router_link = resolveComponent("router-link");
  return openBlock(), createElementBlock("div", null, [createBaseVNode("div", _hoisted_1, [createBaseVNode("div", _hoisted_2, [createVNode(QBreadcrumbs, null, {
    default: withCtx(() => [createVNode(QBreadcrumbsEl, {
      label: "Model Training"
    })]),
    _: 1
  })])]), createBaseVNode("div", _hoisted_3, [createVNode(QBtn, {
    class: "training-button",
    "no-caps": "",
    flat: "",
    to: {
      name: 'new-training'
    }
  }, {
    default: withCtx(() => [createVNode(QIcon, {
      size: "xs",
      left: "",
      name: "fas fa-plus"
    }), createTextVNode(" New training ")]),
    _: 1
  }), createVNode(QSpace), createVNode(QInput, {
    style: {
      "width": "300px"
    },
    placeholder: "Search by Training ID",
    outlined: "",
    dense: "",
    modelValue: $data.filter,
    "onUpdate:modelValue": _cache[1] || (_cache[1] = $event => $data.filter = $event)
  }, {
    append: withCtx(() => [createVNode(QBtn, {
      style: {
        "color": "#2050cb",
        "font-size": "10px"
      },
      flat: "",
      dense: "",
      icon: "fas fa-magnifying-glass",
      onClick: _cache[0] || (_cache[0] = () => {})
    })]),
    _: 1
  }, 8, ["modelValue"])]), createBaseVNode("div", _hoisted_4, [createBaseVNode("div", _hoisted_5, [createVNode(QTable, {
    flat: "",
    modelValue: $data.selected,
    "onUpdate:modelValue": _cache[2] || (_cache[2] = $event => $data.selected = $event),
    columns: $data.tableHeader,
    rows: _ctx.tableData,
    "row-key": "expId",
    filter: $data.filter,
    selected: $data.selected,
    "onUpdate:selected": _cache[3] || (_cache[3] = $event => $data.selected = $event),
    selection: "multiple",
    pagination: $data.pagination,
    "show-select": ""
  }, {
    header: withCtx(props => [createVNode(QTr, {
      props: props
    }, {
      default: withCtx(() => [createVNode(QTh, {
        "auto-width": "",
        class: "header-table"
      }, {
        default: withCtx(() => [createVNode(QCheckbox, {
          size: "2em",
          modelValue: props.selected,
          "onUpdate:modelValue": $event => props.selected = $event
        }, null, 8, ["modelValue", "onUpdate:modelValue"])]),
        _: 2
      }, 1024), (openBlock(true), createElementBlock(Fragment, null, renderList(props.cols, col => {
        return openBlock(), createBlock(QTh, {
          key: col.name,
          props: props,
          class: "header-table"
        }, {
          default: withCtx(() => [createTextVNode(toDisplayString(col.label), 1)]),
          _: 2
        }, 1032, ["props"]);
      }), 128))]),
      _: 2
    }, 1032, ["props"])]),
    "body-selection": withCtx(props => [createVNode(QCheckbox, {
      size: "2em",
      modelValue: props.selected,
      "onUpdate:modelValue": $event => props.selected = $event
    }, null, 8, ["modelValue", "onUpdate:modelValue"])]),
    "body-cell-name": withCtx(({
      row
    }) => [createVNode(QTd, null, {
      default: withCtx(() => [createVNode(_component_router_link, {
        to: '/model-training/training-details/' + row.expId
      }, {
        default: withCtx(() => [createBaseVNode("span", null, toDisplayString(row.training.name), 1)]),
        _: 2
      }, 1032, ["to"])]),
      _: 2
    }, 1024)]),
    "body-cell-pipeline": withCtx(({
      row
    }) => [createVNode(QTd, {
      class: "pipeline-column"
    }, {
      default: withCtx(() => [_hoisted_6, createTextVNode(" " + toDisplayString(row.pipeline.name) + " ", 1), _hoisted_7, _hoisted_8, createTextVNode(" " + toDisplayString(row.pipeline.version), 1)]),
      _: 2
    }, 1024)]),
    "body-cell-expId": withCtx(({
      row
    }) => [createVNode(QTd, null, {
      default: withCtx(() => [row.expId == 'xxx' ? (openBlock(), createElementBlock("span", _hoisted_9, " Updating... ")) : (openBlock(), createElementBlock("span", _hoisted_10, toDisplayString(row.expId), 1))]),
      _: 2
    }, 1024)]),
    "body-cell-lastUpdated": withCtx(({
      row
    }) => [createVNode(QTd, null, {
      default: withCtx(() => [row.expId == 'xxx' ? (openBlock(), createElementBlock("span", _hoisted_11, toDisplayString(row.created), 1)) : (openBlock(), createElementBlock("span", _hoisted_12, toDisplayString(row.lastUpdated), 1))]),
      _: 2
    }, 1024)]),
    "body-cell-status": withCtx(({
      row
    }) => [createVNode(QTd, {
      class: "status-column"
    }, {
      default: withCtx(() => [row.status == 1 ? (openBlock(), createElementBlock("span", _hoisted_13, [createTextVNode(toDisplayString($data.status[row.status - 1]) + " ", 1), createVNode(QSpinnerGears, {
        color: "primary",
        size: "1.5em",
        thickness: 1
      })])) : createCommentVNode("", true), row.status == 2 ? (openBlock(), createElementBlock("span", _hoisted_14, toDisplayString($data.status[row.status - 1]), 1)) : createCommentVNode("", true)]),
      _: 2
    }, 1024)]),
    _: 1
  }, 8, ["modelValue", "columns", "rows", "filter", "selected", "pagination"])])])]);
}
const showTrainingList = /*#__PURE__*/_export_sfc(_sfc_main, [['render', _sfc_render], ['__scopeId', "data-v-9f97d97a"]]);

export { showTrainingList as default };
