kd-aiot-frontend/src/views/material/materialBOM/index.vue

<template>
  <div class="ele-body">
    <el-card shadow="never">
      <BOMSearch @search="reload" :statusOpt="statusOpt" />
      <ele-pro-table
        ref="table"
        :columns="columns"
        :datasource="datasource"
        class="dict-table"
        tool-class="ele-toolbar-actions"
      >
        <!-- 表头工具栏 -->
        <template v-slot:toolbar>
          <el-button type="primary" size="small" @click="handelEdit('新建')">新建</el-button>
          <el-button
            size="small"
            type="primary"
            icon="el-icon-refresh-left"
            class="ele-btn-icon"
            @click='refreshData'
            :loading="loading"
          >刷新</el-button>
        </template>
        <template v-slot:action="{ row }">
          <el-link type="primary" @click="handelDetail(row)">详情</el-link>
          <!-- <el-link type="primary"  icon="el-icon-edit"  @click="handelEdit('编辑')">编辑</el-link> -->
        </template>
      </ele-pro-table>
    </el-card>
    <ViewDialog ref="detailDialogRef" :statusOpt="statusOpt" />
    <EditDialog ref="editDialogRef" :statusOpt="statusOpt"></EditDialog>
  </div>
</template>

<script>
  import BOMSearch from './components/BOM-search.vue';
  import ViewDialog from './components/view-dialog.vue';
  import EditDialog from './components/edit-dialog.vue'
  import { getPage , syncBom } from '@/api/material/BOM';

  export default {
    name: 'SystemDictionary',
    components: { BOMSearch, ViewDialog, EditDialog },
    data () {
      return {
        // 表格列配置
        columns: [
          {
            label: '序号',
            columnKey: 'index',
            type: 'index',
            width: 55,
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'code',
            label: 'BOM编码',
            showOverflowTooltip: true
          },
          {
            prop: 'name',
            label: 'BOM名称',
            showOverflowTooltip: true
          },
          {
            prop: 'categoryCode',
            label: '产品编码',
            showOverflowTooltip: true
          },
          {
            prop: 'categoryName',
            label: '产品名称',
            showOverflowTooltip: true
          },
          {
            prop: 'version',
            label: '版本'
          },
          {
            prop: 'status ',
            label: '状态',
            formatter: (row) => {
              return this.statusOpt[row.status];
            }
          },
          {
            prop: 'createUserName',
            label: '创建人',
            showOverflowTooltip: true
          },
          {
            prop: 'createTime',
            label: '创建日期',
            showOverflowTooltip: true
          },
          {
            action: 'action',
            slot: 'action',
            label: '操作'
          }
        ],
        statusOpt: {
          '-1': '草稿',
          0: '已停用',
          1: '已发布'
        },
        loading:false
      };
    },

    methods: {
      /* 表格数据源 */
      datasource ({ where, page, limit }) {
        return getPage({
          ...where,
          pageNum: page,
          size: limit
        });
      },
      handelDetail (row) {
        this.$refs.detailDialogRef.open(row);
      },
      /* 刷新表格 */
      reload (where) {
        this.$refs.table.reload({ where });
      },
      /* 显示编辑 */
      handelEdit (row) {
        this.$refs.editDialogRef.open(row);
      },
      /* 删除 */
      remove () {
        this.$confirm('确定要删除选中的字典吗?', '提示', {
          type: 'warning'
        })
          .then(() => {
            if (this.$refs.dictData.selection.length == 0) {
              this.$message({
                message: '当前未选择数据',
                type: 'error'
              });
              return;
            }
            let ids = this.$refs.dictData.selection.map((item) => item.id);
            const loading = this.$loading({ lock: true });

            removeDictionary(ids, true)
              .then((msg) => {
                loading.close();
                this.$message.success(msg);
                this.reload();
              })
              .catch((e) => {
                loading.close();
                // this.$message.error(e.message);
              });
          })
          .catch(() => {});
      },

      // 刷新数据
      refreshData(){
          this.loading = true;
          syncBom().then(res=>{
             if(res=='0'){
               this.loading = false;
                this.$message.success('数据刷新成功！')
                this.reload()
             }
          })
          .catch((e) => {
            this.loading = false;
          });
      }

    }
  };
</script>

<style lang="scss" scoped></style>