mt-ck-wms-ui/src/views/art/processList.vue

<!--
 * @Author: gtz
 * @Date: 2021-04-06 20:07:22
 * @LastEditors: zwq
 * @LastEditTime: 2022-03-03 17:00:54
 * @Description: file content
-->
<template>
  <div class="usermanager-container">
    <head-form
      :placeholder-name="placeholderName"
      :key-name="keyName"
      @getDataList="getList"
      @add="addNew"
    />
    <base-table :table-config="tableProps" :table-data="list" :is-loading="listLoading" :page="listQuery.current" :limit="listQuery.size">
      <method-btn slot="handleBtn" :method-list="tableBtn" @clickBtn="handleClick" />
    </base-table>
    <pagination :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="getList" />
    <Process-add v-if="addOrUpdateVisible" ref="addOrUpdate" :eq-list="eqList" @refreshDataList="getList" />
  </div>
</template>

<script>
// edit here
// import DataDict from './filters'
const tableBtn = [{
  type: 'edit',
  btnName: 'btn.edit'
}, {
  type: 'delete',
  btnName: 'btn.delete'
}]
const tableProps = [{
  prop: 'name',
  label: i18n.t('module.art.processList.processName'),
  align: 'center'
},
// {
//   prop: 'type',
//   label: i18n.t('module.art.processList.type'),
//   align: 'center',
//   filter: DataDict('typeFilter')
// },
{
  prop: 'description',
  label: i18n.t('module.art.processList.description'),
  align: 'center'
}]
import BaseTable from '@/components/BaseTable'
// edit here
import { list, del } from '@/api/art-manage/process'
import { equipmentlistList } from '@/api/basicData/Equipment/equipmentInfo'
import HeadForm from '@/components/basicData/HeadForm'
import ProcessAdd from './components/Process-add'
import Pagination from '@/components/Pagination'
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
import i18n from '@/lang'
export default {
  name: 'OrgManager',
  components: { Pagination, BaseTable, MethodBtn, HeadForm, ProcessAdd },
  props: {},
  data() {
    return {
      keyName: i18n.t('module.art.processList.processName'),
      placeholderName: this.$t('module.art.processList.processName'),
      tableBtn,
      tableProps,
      list: [],
      total: 0,
      listLoading: true,
      showDialog: false,
      curEditId: null,
      showEditDialog: false,
      addOrUpdateVisible: false,
      listQuery: {
        current: 1,
        size: 10,
        key: ''
      },
      date: null,
      defaultProps: {
        children: 'children',
        label: 'label'
      },
      eqList: []
    }
  },
  computed: {
    orderId() {
      return this.$route.query.orderId
    }
  },
  created() {
    this.getEqList()
    // this.listLoading = false
  },
  mounted() {},
  methods: {
    handleClick(raw) {
      console.log(raw)
      switch (raw.type) {
        case 'delete':
          this.$confirm(i18n.t('deleteMsgBox.content'), i18n.t('deleteMsgBox.hint'), {
            confirmButtonText: i18n.t('btn.confirm'),
            cancelButtonText: i18n.t('btn.cancel'),
            type: 'warning'
          }).then(async() => {
            // 走接口
            const result = await del({
              id: raw.data.id
            })
            if (result.code === 0) {
              this.$message({
                type: 'success',
                message: i18n.t('deleteMsgBox.doneMsg')
              })
              this.getList()
            }
          })
          break
        case 'edit':
          this.addNew(raw.data.id)
          break
      }
    },
    async getEqList(key) {
      // edit here
      const res = await equipmentlistList()
      if (res.code === 0) {
        this.eqList = res.data.records
      }
      this.getList()
    },
    async getList(key) {
      this.listLoading = true
      if (typeof (key) === 'string') {
        this.listQuery.key = key
      }
      // edit here
      const res = await list(this.listQuery)
      console.log(res)
      if (res.code === 0) {
        this.list = res.data.records ? res.data.records : []
        this.total = res.data.total
        this.listLoading = false
      }
    },
    // 新增 / 修改
    addNew(id) {
      this.addOrUpdateVisible = true
      this.$nextTick(() => {
        this.$refs.addOrUpdate.init(id)
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.usermanager-container {
  padding: 20px;
  .method-btn-area {
    padding: 15px 30px;
    margin: 10px 0 20px 0;
    border: 1px solid #dfe6ec;
  }
  .tree-select-container {
    border: 1px solid #dfe6ec;
    min-height: 400px;
    padding: 20px;
  }
}
.edit-input {
  padding-right: 100px;
}
.cancel-btn {
  position: absolute;
  right: 15px;
  top: 10px;
}
</style>