DataOps-web/src/views/modelSystem/modelTrain/index.vue

<template>
  <div class="pa-3 white">
    <m-filter :option="filter" @search="handleSearch" />
    <m-table
      class="mt-3"
      :loading="loading"
      :headers="headers"
      :items="items"
      :total="total"
      :page-info="pageInfo"
      item-key="task_id"
      @add="handleAdd"
      @delete="handleDelete"
      @pageHandleChange="pageHandleChange"
      @sort="handleSort"
    >
      <template #status="{item}">
        <v-chip :color="item.status === 'failed' ? 'error' : 'success'" small>{{ item.status }}</v-chip>
      </template>
      <template #actions="{ item }">
        <template v-if="item.directory_exists">
          <v-btn color="success" text @click="handleExecute(item.task_id)">执行</v-btn>
          <!-- <v-btn color="success" text @click="handleExecuteStep(item.task_id)">分步执行</v-btn> -->
          <v-btn color="primary" text @click="handleFindExecute(item.task_id)">执行进度</v-btn>
          <v-btn color="primary" text @click="handleTable(item.task_id)">表名清单</v-btn>
          <v-btn color="primary" text @click="handleFiles(item.task_id)">任务文件</v-btn>
          <v-btn color="primary" text @click="handleLog(item.task_id)">运行日志</v-btn>
          <v-btn color="error" text @click="handleDelete([item.task_id])">删除</v-btn>
        </template>
        <template v-else>
          <v-chip small>已删除</v-chip>
        </template>
      </template>
    </m-table>
    <ModelTrainEdit ref="modelTrainEditRefs" @success="init"></ModelTrainEdit>
    <ModelTrainStatus ref="modelTrainStatusRefs"></ModelTrainStatus>
    <ModelTrainTable ref="modelTrainTableRefs"></ModelTrainTable>
    <ModelTrainLog ref="modelTrainLogRefs"></ModelTrainLog>
    <ModelTrainFiles ref="modelTrainFilesRefs"></ModelTrainFiles>
    <ModelTrainStep ref="modelTrainStepRefs"></ModelTrainStep>
  </div>
</template>

<script>
import MFilter from '@/components/Filter'
import MTable from '@/components/List/table.vue'
import ModelTrainEdit from './modelTrainEdit.vue'
import ModelTrainStatus from './modelTrainStatus.vue'
import ModelTrainTable from './modelTrainTable.vue'
import ModelTrainLog from './modelTrainLog.vue'
import ModelTrainFiles from './modelTrainFiles.vue'
import ModelTrainStep from './modelTrainStep.vue'
import {
  // createDataTasks,
  executeDataTasks,
  getDataTasksList,
  deleteDataTasks
} from '@/api/dataChart'
export default {
  name: 'modelTrain',
  components: {
    MFilter,
    MTable,
    ModelTrainEdit,
    ModelTrainStatus,
    ModelTrainTable,
    ModelTrainLog,
    ModelTrainFiles,
    ModelTrainStep
  },
  data () {
    return {
      loading: false,
      show: false,
      filter: {
        list: [
          { type: 'textField', value: '', label: '任务名称', key: 'task_name' }
        ]
      },
      queryData: {
        task_name: null
      },
      headers: [
        { text: '任务名称', align: 'start', value: 'task_name' },
        { text: '数据库名称', align: 'start', value: 'db_name' },
        { text: '上下文', align: 'start', value: 'business_context' },
        { text: '运行状态', align: 'center', value: 'status' },
        { text: '创建者', align: 'center', value: 'created_by' },
        { text: '操作', align: 'start', value: 'actions' }
      ],
      itemData: {},
      items: [],
      orders: [],
      pageInfo: {
        size: 10,
        current: 1
      },
      total: 0
    }
  },
  created () {
    this.init()
  },
  methods: {
    async init () {
      this.loading = true
      try {
        const { data } = await getDataTasksList({
          ...this.queryData,
          page: this.pageInfo.current,
          page_size: this.pageInfo.size
        })
        this.items = data.tasks
        this.total = data.total
      } catch (error) {
        this.$snackbar.error(error)
      } finally {
        this.loading = false
      }
    },
    handleSearch (val) {
      Object.assign(this.queryData, val)
      this.pageInfo.current = 1
      this.init()
    },
    handleAdd () {
      this.$refs.modelTrainEditRefs.open()
    },
    // handleEdit (item) {
    //   this.itemData = item
    //   this.show = true
    // },
    handleFindExecute (id) {
      this.$refs.modelTrainStatusRefs.open(id)
    },
    handleTable (id) {
      this.$refs.modelTrainTableRefs.open(id)
    },
    // 查看任务文件
    handleFiles (id) {
      this.$refs.modelTrainFilesRefs.open(id)
    },
    handleLog (id) {
      this.$refs.modelTrainLogRefs.open(id)
    },
    async handleExecute (id) {
      try {
        const { data } = await executeDataTasks(id, {
          execution_mode: 'complete'
        })
        this.$snackbar.success(data.response)
      } catch (error) {
        this.$snackbar.error(error)
      }
    },
    handleExecuteStep (id) {
      this.$refs.modelTrainStepRefs.open(id)
    },
    handleDelete (ids) {
      if (Array.isArray(ids) && !ids.length) return this.$snackbar.warning('请选择要删除的选项')
      this.$confirm('提示', '是否删除该选项')
        .then(async () => {
          try {
            await deleteDataTasks({
              task_ids: ids,
              confirm: true
            })
            this.$snackbar.success('删除成功')
            this.init()
          } catch (error) {
            this.$snackbar.error('删除失败')
          }
        })
    },
    pageHandleChange (page) {
      this.pageInfo.current = page
      this.init()
    },
    handleSort (val) {
      this.orders = val
      this.init()
    }
  }
}
</script>

<style lang="scss" scoped>

</style>