mts / MTS-UI · Files

<template>
  <a-card :bordered="false">
    <a-modal
      :width="modalWidth"
      :style="modalStyle"
      :visible="visible"
      :maskClosable="false"
      @cancel="handleCancel">
      <template slot="footer">
        <a-button @click="handleCancel">关闭</a-button>
      </template>

      <a-row :gutter="12">
        <a-col :md="4" :sm="8">
          <a-form-item label="物料名称" :labelCol="{span: 6}" :wrapperCol="{span: 14, offset: 1}">
            <a-input placeholder="请输入物料名称" v-model="name" @keyup.enter="searchEnterFun($event)"></a-input>
          </a-form-item>
        </a-col>

        <a-col :md="5" :sm="8">
          <a-form-item label="物料编码" :labelCol="{span: 6}" :wrapperCol="{span: 14, offset: 1}">
            <a-input placeholder="请输入物料编码" v-model="code" @keyup.enter="searchEnterFun($event)"></a-input>
          </a-form-item>
        </a-col>

        <a-col :md="10" :sm="12">
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button type="primary" @click="queryBom" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
              <a-button type="primary" @click="addBoxDetail" icon="plus" style="margin-left: 8px">新增</a-button>
              <a-upload style="margin-left: 8px" name="file" :data="{'boxid':box_id}" :showUploadList="false"
                        :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
                 <a-button type="primary" icon="import">导入</a-button>
              </a-upload>
            </span>
        </a-col>
      </a-row>

      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
        <i class="anticon anticon-info-circle ant-alert-icon"></i>已选择&nbsp;<a
        style="font-weight: 600">{{ selectedRowKeys.length }}</a>项&nbsp;&nbsp;
        <a style="margin-left: 24px" @click="onClearSelected">清空</a>
      </div>

      <a-table
        ref="table"
        rowKey="id"
        size="middle"
        :columns="columns"
        :loading="loading"
        :dataSource="dataSource"
        :pagination="false">

       <span slot="status" slot-scope="status">
          <a-tag :key="status">
            {{ solutionStatus(status) }}
          </a-tag>
        </span>

        <span slot="action" slot-scope="text, record">
       <a-popconfirm v-if="record.status=='0'" title="确定删除吗?" @confirm="() =>delBoxDetail(record.id)">
        <a><a-icon type="delete"/>删除</a>
      </a-popconfirm>
      </span>
      </a-table>

    </a-modal>
    <scan-box-detail-modal ref="addBoxForm" @fatherMethodBox="searchResetBox"></scan-box-detail-modal>
  </a-card>
</template>

<script>
import {JeecgListMixin} from '@/mixins/JeecgListMixin'
import {mixinDevice} from '@/utils/mixin'
import ScanBoxDetailModal from "./modules/ScanBoxDetailModal";
import {queryBoxList} from '@/api/api'
import {deleteAction} from '@/api/manage'
import {ajaxGetDictItems} from "../../api/api";

export default {
  name: "BoxDetailList",
  mixins: [JeecgListMixin, mixinDevice],
  components: {
    ScanBoxDetailModal
  },
  data() {
    return {
      modalWidth: '90%',
      modalStyle: {'top': '20px'},
      title: '操作',
      visible: false,
      box_id: '',
      code: '',
      name: '',
      loading: false,
      dataSource: [],
      statusList: [],
      bomIdList: [],
      labelCol: {
        xs: {span: 24},
        sm: {span: 5},
      },
      wrapperCol: {
        xs: {span: 24},
        sm: {span: 16},
      },
      columns: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          width: 120,
          align: "center",
          customRender: function (t, r, index) {
            return parseInt(index) + 1;
          }
        },
        {
          title: '名称',
          dataIndex: 'name',
          key: 'name'
        },
        {
          title: '编码',
          dataIndex: 'code',
          key: 'code'
        },
        {
          title: '规格',
          dataIndex: 'spec',
          key: 'spec'
        },
        {
          title: '发货数量',
          dataIndex: 'outqty',
          key: 'outqty'
        }, {
          title: '收货数量',
          dataIndex: 'inqty',
          key: 'inqty'
        }, {
          title: '状态',
          dataIndex: 'status',
          key: 'status',
          scopedSlots: {customRender: 'status'}
        },
        {
          title: '备注',
          dataIndex: 'remark',
          key: 'remark'
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: "center",
          scopedSlots: {customRender: 'action'}
        }
      ],
      url: {
        list: "/scan_box_detail/scanBoxDetail/list",
        delete: "/scan_box_detail/scanBoxDetail/delete",
        deleteBatch: "/scan_box_detail/scanBoxDetail/deleteBatch",
        exportXlsUrl: "/scan_box_detail/scanBoxDetail/exportXls",
        importExcelUrl: "scan_box_detail/scanBoxDetail/importExcel",

      },
    }
  },
  created() {
    this.loadFrom()
  },
  computed: {
    importExcelUrl: function () {
      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
    },
  },
  methods: {
    loadFrom() {
      getBomInfoId().then((res) => {
        if (res.success) {
          this.bomIdList = res.result
        }
      })

    },
    filterOption(input, option) {
      return (
        option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
      );
    },

    solutionStatus(value) {
      var actions = []
      Object.keys(this.statusList).some((key) => {
        if (this.statusList[key].value == ('' + value)) {
          actions.push(this.statusList[key].text)
          return true
        }
      })
      return actions.join('')
    },

    handleCancel() {
      this.visible = false
    },

    addBoxDetail(record) {
      record.boxId = this.box_id
      this.$refs.addBoxForm.edit(record);
    },

    searchResetBox() {
      this.dataSource = [];
      this.queryBom()
    },
    show(record) {
      this.box_id = record.id
      this.visible = true
      this.queryBom()
      ajaxGetDictItems('scanStatus').then((res) => {
        if (res.success) {
          this.statusList = res.result
        }
      })
    },

    searchEnterFun(e) {
      var keyCode = window.event ? e.keyCode : e.which;
      if (keyCode == 13) {
        this.queryBom()
      }
    },

    delBoxDetail(id) {
      deleteAction(this.url.delete, {id: id}).then((res) => {
        if (res.success) {
          this.$message.success(res.message);
          this.queryBom();
          this.onClearSelected();
        } else {
          this.$message.warning(res.message);
        }
      }).finally(() => {
        this.loading = false;
      });
    },

    loadData() {

    },
    queryBom() {
      // this.onClearSelected()
      this.loading = true
      var params = this.getQueryParams()//查询条件
      params.code = this.code
      params.name = this.name
      params.boxId = this.box_id
      this.uuid = this.no
      queryBoxList(params).then((res) => {
        if (res.code == 200) {
          this.dataSource = [];
          this.dataSource = res.result
          this.loading = false
          //this.pro_no=this.no;
        } else {
          this.loading = false
          this.dataSource = [];
          this.$message.error(res.message)
        }
      })
    },
    searchReset() {
      var that = this;
      that.no = "";
      that.name = "";
      that.f08 = "";
    }


  }
}
</script>

<style scoped>

</style>