import { QBreadcrumbs, QBreadcrumbsEl } from './QBreadcrumbs-d508f268.js';
import { createElementBlock, createBaseVNode, createVNode, withCtx, Fragment, resolveComponent, openBlock, QBtn, renderList, createTextVNode, toDisplayString, createBlock, pushScopeId, popScopeId } from './__federation_expose_Modules-a9c6a6fc.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 { _export_sfc } from './_plugin-vue_export-helper-e9a2c33e.js';

const showServingList_vue_vue_type_style_index_0_scoped_17567fdb_lang = '';

const _sfc_main = {
  name: 'listTraining',
  data() {
    return {
      headers: {
        "Authorization": "Bearer " + window.$cookies.get('token')
      },
      tableHeader: [{
        label: 'Endpoint',
        align: 'left',
        name: 'endPoint',
        field: 'endPoint'
      }, {
        label: 'Training Name',
        align: 'left',
        name: 'trainingName',
        field: 'trainingName'
      }, {
        label: 'Pipeline',
        align: 'left',
        name: 'pipeline',
        field: 'pipeline'
      }, {
        label: 'Last served',
        align: 'left',
        name: 'lastServed',
        field: 'lastServed'
      }, {
        label: 'Status',
        align: 'left',
        name: 'status',
        field: 'status'
      }],
      tableData: [],
      servingModelsList: null,
      selected: [],
      search: '',
      pagination: {
        rowsPerPage: 100
      }
    };
  },
  methods: {
    getServingModelsList() {
      window.$http.get('/rest/v1/serving', {
        headers: this.headers
      }).then(res => {
        this.servingModelsList = res.data.serving_models;
        var tempId = -1;
        var endPointText = '';
        var endPointLink = '';
        this.servingModelsList.forEach(element => {
          if (tempId != element.training_id) {
            tempId = element.training_id;
            const found = this.servingModelsList.find(item => item.training_id == element.training_id && item.is_primary == true);
            console.log(found);
            endPointText = window.location.origin + "/rest/v1/serving/" + element.training_id;
            endPointLink = '/model-serving/serving-details/primary-' + found.training_id;
            this.tableData.push({
              training: {
                name: found.training_name,
                id: found.training_id
              },
              pipeline: {
                name: found.pipeline_name,
                version: found.pipeline_version
              },
              endPointText: endPointText,
              endPointLink: endPointLink,
              modelShortname: element.id_string,
              modelId: found.model_id,
              datasetName: found.dataset_name,
              lastServed: found.lastserved_date,
              status: "Serving"
            });
          }
          endPointText = window.location.origin + "/rest/v1/serving/" + element.training_id + "/" + element.model_id + "-" + element.id_string;
          endPointLink = '/model-serving/serving-details/' + element.model_id;
          this.tableData.push({
            training: {
              name: element.training_name,
              id: element.training_id
            },
            pipeline: {
              name: element.pipeline_name,
              version: element.pipeline_version
            },
            endPointText: endPointText,
            endPointLink: endPointLink,
            modelShortname: element.id_string,
            modelId: element.model_id,
            datasetName: element.dataset_name,
            lastServed: element.lastserved_date,
            status: "Serving"
          });
        });
      }).catch(error => {
        console.log("list_serving", error);
      });
    }
  },
  created() {
    this.getServingModelsList();
  },
  computed: {
    filteredItems() {
      return this.tableData.filter(item => {
        // ["datasetName", "lastServed"].
        // return true;
        return new RegExp(this.search).exec(item.modelId) || new RegExp(this.search).exec(item.training.name + "-" + item.training.id);
      });
    }
  }
};
const _withScopeId = n => (pushScopeId("data-v-17567fdb"), n = n(), popScopeId(), n);
const _hoisted_1 = {
  class: "row nav-text"
};
const _hoisted_2 = {
  class: "col"
};
const _hoisted_3 = {
  class: "row",
  style: {
    "margin": "0px 0px 0px 15px"
  }
};
const _hoisted_4 = {
  class: "col-3"
};
const _hoisted_5 = {
  class: "row",
  style: {
    "margin": "11px 15px 0px 15px"
  }
};
const _hoisted_6 = {
  class: "col"
};
const _hoisted_7 = {
  class: "row"
};
const _hoisted_8 = /*#__PURE__*/_withScopeId(() => /*#__PURE__*/createBaseVNode("b", null, "name:", -1));
const _hoisted_9 = {
  class: "row"
};
const _hoisted_10 = /*#__PURE__*/_withScopeId(() => /*#__PURE__*/createBaseVNode("b", null, "version:", -1));
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
  const _component_router_link = resolveComponent("router-link");
  return openBlock(), createElementBlock(Fragment, null, [createBaseVNode("div", _hoisted_1, [createBaseVNode("div", _hoisted_2, [createVNode(QBreadcrumbs, null, {
    default: withCtx(() => [createVNode(QBreadcrumbsEl, {
      label: "Prediction Serving"
    })]),
    _: 1
  })])]), createBaseVNode("div", _hoisted_3, [createBaseVNode("div", _hoisted_4, [createVNode(QInput, {
    style: {
      "width": "300px"
    },
    placeholder: "Search by training name",
    outlined: "",
    dense: "",
    modelValue: $data.search,
    "onUpdate:modelValue": _cache[1] || (_cache[1] = $event => $data.search = $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_5, [createBaseVNode("div", _hoisted_6, [createVNode(QTable, {
    flat: "",
    rows: $options.filteredItems,
    columns: $data.tableHeader,
    "row-key": "modelId",
    "show-select": "",
    selection: "multiple",
    selected: $data.selected,
    "onUpdate:selected": _cache[2] || (_cache[2] = $event => $data.selected = $event),
    pagination: $data.pagination
  }, {
    header: withCtx(props => [createVNode(QTr, {
      props: props
    }, {
      default: withCtx(() => [createVNode(QTh, {
        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"])]),
    "header-selection": withCtx(scope => [createVNode(QCheckbox, {
      size: "2em",
      modelValue: scope.selected,
      "onUpdate:modelValue": $event => scope.selected = $event
    }, null, 8, ["modelValue", "onUpdate:modelValue"])]),
    "body-selection": withCtx(scope => [createVNode(QCheckbox, {
      size: "2em",
      modelValue: scope.selected,
      "onUpdate:modelValue": $event => scope.selected = $event
    }, null, 8, ["modelValue", "onUpdate:modelValue"])]),
    "body-cell-endPoint": withCtx(props => [createVNode(QTd, {
      style: {
        "color": "#2050cb"
      }
    }, {
      default: withCtx(() => [createVNode(_component_router_link, {
        to: props.row.endPointLink
      }, {
        default: withCtx(() => [createTextVNode(toDisplayString(props.row.endPointText), 1)]),
        _: 2
      }, 1032, ["to"])]),
      _: 2
    }, 1024)]),
    "body-cell-trainingName": withCtx(props => [createVNode(QTd, null, {
      default: withCtx(() => [createTextVNode(toDisplayString(props.row.training.name), 1)]),
      _: 2
    }, 1024)]),
    "body-cell-pipeline": withCtx(props => [createVNode(QTd, null, {
      default: withCtx(() => [createBaseVNode("div", _hoisted_7, [_hoisted_8, createTextVNode("  " + toDisplayString(props.row.pipeline.name), 1)]), createBaseVNode("div", _hoisted_9, [_hoisted_10, createTextVNode("   " + toDisplayString(props.row.pipeline.version), 1)])]),
      _: 2
    }, 1024)]),
    "body-cell-status": withCtx(props => [createVNode(QTd, {
      style: {
        "color": "#198754",
        "font-weight": "bold"
      }
    }, {
      default: withCtx(() => [createTextVNode(toDisplayString(props.row.status), 1)]),
      _: 2
    }, 1024)]),
    _: 1
  }, 8, ["rows", "columns", "selected", "pagination"])])])], 64);
}
const showServingList = /*#__PURE__*/_export_sfc(_sfc_main, [['render', _sfc_render], ['__scopeId', "data-v-17567fdb"]]);

export { showServingList as default };
