middleground_code_v2/src/views/intergrationTask/detailData/index.vue

<template>
  <div>
    <base-layout
      ref="baseLayout"
      :buttonList="buttonList"
      @onFuncBtn="onFuncBtn"
      :querySwitch="true"
      :searchList="requirementList"
      @search="handleSearchEvent"
      :isPage="true"
      @pageChange="handlePageChange"
    >
      <div slot="main" slot-scope="{ tableHeight }">
        <base-table
          ref="baseTable"
          :showIndex="true"
          :funWidth="180"
          :funData="funData"
          @onFunc="onFunc"
          :tabLoading.sync="tabLoading"
          :tableHeight="tableHeight"
          :tableData="tableData"
          :tableColumn="tableColumnData"

        >
          <template #taskStatus="{row}">
            {{ taskStatusDist[row.taskStatus] }}
          </template>
        </base-table>
      </div>
    </base-layout>
    <right-dialog ref="rightDialog" @resetTable="resetTable"></right-dialog>
  </div>
</template>

<script>
import baseLayout from '@/components/base/baseLayout'
import baseTable from '@/components/base/baseTable'
import rightDialog from './rightDialog.vue'
import { authApi } from '@/api/apis/auth'

export default {
  components: {
    baseLayout,
    baseTable,
    rightDialog
  },
  data() {
    return {
      buttonList: [
        {
          menuName: '刷新',
          icon: 'el-icon-refresh',
          btnFunction: 'resetLoad'
        }
      ], //按钮组
      requirementList: [
        {
          placeholder: '任务名称',
          prop: 'taskName',
          tag: 'elInput'
        }
      ], //查询模板list
      tabLoading: false,
      tableColumnData: [
        {
          prop: 'taskName',
          label: '任务名称'
        },
        {
          prop: 'taskId',
          label: '任务编码'
        },
        {
          prop: 'taskStatus',
          label: '任务状态'
        },
        {
          prop: 'startTime',
          label: '当前任务开始时间'
        },
        {
          prop: 'endTime',
          label: '结束时间'
        },
        {
          prop: 'diffTime',
          label: '耗时'
        }
      ], //表头数据
      funData: [

        {
          color: '#6a9af1',
          text: '查看'
        }
      ],
      tableData: [], //表格数据
      pageModel: {
        pageNum: 1,
        pageSize: 100
      },
      queryModel: {
        code: '',
        name: '',
        classify: '',
        productionCompany: ''
      },
      taskStatusDist: {
        1: '执行中',
        2: '执行成功',
        3: '执行失败'
      }
    }
  },
  mounted() {
    // this.queryProductClassfy();
    this.GetProductionTableData()

  },
  methods: {
    onCellClick(row) {
      this.openLoading('detail')
      this.$refs.rightDialog.openDialog('show', row)
    },
    // 表格数据
    async GetProductionTableData() {
      this.tabLoading = true
      let param = {
        ...this.pageModel,
        ...this.queryModel
      }
      let res = await authApi(
        'integrationTaskLivingDetailsService',
        '',
        'queryEntityPage',
        '',
        param
      )
      this.tabLoading = false
      if (res.status == '200') {
        this.tableData = res.attribute.list
        this.$refs.baseLayout.setPageTotal(res.attribute.total)
      }
    },
    // 分页变化
    handlePageChange(val) {
      this.pageModel.pageNum = val.pageIndex
      this.pageModel.pageSize = val.pageSize
      this.GetProductionTableData()
    },
    // 按钮组
    onFuncBtn(btn) {
      this.onCellClick()
      // this[btn.btnFunction]()
    },
    // 新增
    add() {
      this.$refs.rightDialog.openDialog('add')
    },
    // 表格操作事件 查看 编辑 删除
    onFunc(index, row, item) {
      // 查看
      if (item.text === '查看') {
        this.openLoading('detail')
        this.$refs.rightDialog.openDialog('show', row)
      }
      // 编辑
      if (item.text === '编辑') {
        this.openLoading('detail')
        this.$refs.rightDialog.openDialog('edit', row)
      }
      // 删除
      if (item.text === '删除') {
        this.$delConfirm().then(() => {
          this.openLoading('del')
          this.productionDeleteById(row.id)
        })
      }
    },
    async productionDeleteById(id) {
      let param = {
        id: id
      }
      let res = await authApi(
        'sysPlugArgService',
        'integrationTaskService',
        'deletePlugArg',
        '',
        param
      )
      if (res.status == '200') {
        this.$vmNews('删除成功', 'success')
        this.resetTable()
      }
    },
    // 重置表格
    resetTable() {
      this.pageModel.pageNum = 1
      this.$refs.baseLayout.pageClear()
      this.GetProductionTableData()
    },
    // 搜索
    handleSearchEvent() {
      let data = this.$refs.baseLayout.ruleForm
      this.queryModel = data
      this.resetTable()
    },
    // 获取所有产品分类
    async queryProductClassfy() {
      let params = {
        tab_name: 'sys_product',
        column_name: 'classify'
      }
      let res = await authApi(
        'generalServiceImpl',
        'dictionaryshop',
        'selectDictionaryshop',
        '',
        params
      )
      if (res.status == '200') {
        this.requirementList[2].options = res.attribute
      }
    }
  }
}
</script>

<style scoped>
.clickTitle {
  color: #409eff;
  cursor: pointer;
}
</style>