Merge remote-tracking branch 'origin/master'

zhangherong

2025-05-22 26f47cb7a96ca76f2e350dd541725fba37c395e0

Merge remote-tracking branch 'origin/master'

 src/views/eam/spare/EamSparePartInventoryList.vue

ÎļþÒÑɾ³ý

 src/views/eam/spare/EamSparePartsList.vue

@@ -2,32 +2,88 @@
  <a-card :bordered="false">
    <!-- æŸ¥è¯¢åŒºåŸŸ -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
      <a-form
        layout="inline"
        @keyup.enter.native="searchQuery"
      >
        <a-row :gutter="24">
          <a-col :xl="4" :lg="7" :md="8" :sm="24">
            <a-form-item label="备件编码">
              <j-input placeholder="请输入备件编码" v-model="queryParam.partCode"></j-input>
            </a-form-item>
          </a-col>
          <a-col :xl="4" :lg="7" :md="8" :sm="24">
            <a-form-item label="备件名称">
              <j-input placeholder="请输入备件名称" v-model="queryParam.partName"></j-input>
            </a-form-item>
          </a-col>
          <a-col :xl="4" :lg="7" :md="8" :sm="24">
          <a-col
            :xl="4"
            :lg="7"
            :md="8"
            :sm="24"
          >
            <a-form-item label="备件分类">
              <j-input placeholder="请输入备件分类" v-model="queryParam.partCategory"></j-input>
              <j-dict-select-tag
                allow-clear
                :disabled="false"
                placeholder="请选择备件分类"
                :triggerChange="true"
                dictCode="spare_part_category"
                v-model="queryParam.partCategory"
              />
            </a-form-item>
          </a-col>
          <a-col :xl="4" :lg="7" :md="8" :sm="24">
          <a-col
            :xl="4"
            :lg="7"
            :md="8"
            :sm="24"
          >
            <a-form-item label="备件编码">
              <j-input
                placeholder="请输入备件编码"
                v-model="queryParam.partCode"
              ></j-input>
            </a-form-item>
          </a-col>
          <a-col
            :xl="4"
            :lg="7"
            :md="8"
            :sm="24"
          >
            <a-form-item label="备件名称">
              <j-input
                placeholder="请输入备件名称"
                v-model="queryParam.partName"
              ></j-input>
            </a-form-item>
          </a-col>
          <a-col
            :xl="4"
            :lg="7"
            :md="8"
            :sm="24"
          >
            <a-form-item label="备件型号">
              <j-input placeholder="请输入备件型号" v-model="queryParam.partModel"></j-input>
              <j-input
                placeholder="请输入备件型号"
                v-model="queryParam.partModel"
              ></j-input>
            </a-form-item>
          </a-col>
          <a-col :xl="4" :lg="7" :md="8" :sm="24">
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
          <a-col
            :xl="4"
            :lg="7"
            :md="8"
            :sm="24"
          >
            <span
              style="float: left;overflow: hidden;"
              class="table-page-search-submitButtons"
            >
              <a-button
                type="primary"
                @click="searchQuery"
                icon="search"
              >查询</a-button>
              <a-button
                type="primary"
                @click="searchReset"
                icon="reload"
                style="margin-left: 8px"
              >重置</a-button>
            </span>
          </a-col>

@@ -37,24 +93,51 @@

    <!-- æ“ä½œæŒ‰é’®åŒºåŸŸ -->
    <div class="table-operator">
      <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
      <a-button type="primary" icon="download" @click="handleExportXls('备品备件管理')">导出</a-button>
      <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
        <a-button type="primary" icon="import">导入</a-button>
      <a-button
        @click="handleAdd"
        type="primary"
        icon="plus"
      >新增</a-button>
      <!-- <a-button
        type="primary"
        icon="download"
        @click="handleExportXls('备品备件管理')"
      >导出</a-button>
      <a-upload
        name="file"
        :showUploadList="false"
        :multiple="false"
        :headers="tokenHeader"
        :action="importExcelUrl"
        @change="handleImportExcel"
      >
        <a-button
          type="primary"
          icon="import"
        >导入</a-button>
      </a-upload>
      <a-dropdown v-if="selectedRowKeys.length > 0">
        <a-menu slot="overlay">
          <a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
          <a-menu-item
            key="1"
            @click="batchDel"
          ><a-icon type="delete" />删除</a-menu-item>
        </a-menu>
        <a-button style="margin-left: 8px"> æ‰¹é‡æ“ä½œ <a-icon type="down" /></a-button>
      </a-dropdown>
      </a-dropdown> -->
    </div>

    <!-- table区域-begin -->
    <div>
      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
      <div
        class="ant-alert ant-alert-info"
        style="margin-bottom: 16px;"
      >
        <i class="anticon anticon-info-circle ant-alert-icon"></i> å·²é€‰æ‹© <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项
        <a style="margin-left: 24px" @click="onClearSelected">清空</a>
        <a
          style="margin-left: 24px"
          @click="onClearSelected"
        >清空</a>
      </div>

      <a-table
@@ -67,10 +150,15 @@
        :pagination="ipagination"
        :loading="loading"
        class="j-table-force-nowrap"
        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
        @change="handleTableChange">
        :rowSelection='{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}'
        :customRow='clickThenSelect'
        @change="handleTableChange"
      >

        <span slot="action" slot-scope="text, record">
        <span
          slot="action"
          slot-scope="text, record"
        >
          <a @click="handleEdit(record)">编辑</a>

          <a-divider type="vertical" />
@@ -78,7 +166,10 @@
            <a class="ant-dropdown-link">更多 <a-icon type="down" /></a>
            <a-menu slot="overlay">
              <a-menu-item>
                <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
                <a-popconfirm
                  title="确定删除吗?"
                  @confirm="() => handleDelete(record.id)"
                >
                  <a>删除</a>
                </a-popconfirm>
              </a-menu-item>
@@ -87,116 +178,161 @@
        </span>

      </a-table>
      <a-tabs defaultActiveKey="1">
        <a-tab-pane
          tab='库存明细'
          key="1"
        >
          <div
            class="table-operator"
            style="margin:-16px"
          >
            <eamSpare-part-inventory-list :sparePartId='sparePartId' />
          </div>
        </a-tab-pane>
      </a-tabs>
    </div>
    <!-- table区域-end -->

    <!-- è¡¨å•åŒºåŸŸ -->
    <eamSpareParts-modal ref="modalForm" @ok="modalFormOk"></eamSpareParts-modal>
    <eamSpareParts-modal
      ref="modalForm"
      @ok="modalFormOk"
    ></eamSpareParts-modal>
  </a-card>
</template>

<script>
import '@assets/less/TableExpand.less'
import EamSparePartsModal from './modules/EamSparePartsModal.vue'
import EamSparePartsModal from './modules/EamSpareParts/EamSparePartsModal.vue'
import EamSparePartInventoryList from './modules/EamSpareParts/EamSparePartInventoryList.vue'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'

  export default {
    name: "EamSparePartsList",
    mixins:[JeecgListMixin],
    components: {
      EamSparePartsModal
    },
    data () {
      return {
        description: '备品备件管理管理页面',
        // è¡¨å¤´
        columns: [
              {
            title: '备件编码',
            align:"center",
            dataIndex: 'partCode'
          },
          {
            title: '备件名称',
            align:"center",
            dataIndex: 'partName'
          },
          {
            title: '分类',
            align:"center",
            dataIndex: 'partCategory'
          },
          {
            title: '型号',
            align:"center",
            dataIndex: 'partModel'
          },
          {
            title: '规格',
            align:"center",
            dataIndex: 'partSpecification'
          },
          {
            title: '存放仓库',
            align:"center",
            dataIndex: 'storehouse'
          },
          {
            title: '制造商',
            align:"center",
            dataIndex: 'manufacturingEnterprise'
          },
          {
            title: '单位',
            align:"center",
            dataIndex: 'unit'
          },
          {
            title: '有效期（天）',
            align:"center",
            dataIndex: 'periodOfValidity'
          },
              {
            title: '库存上限值',
            align:"center",
            dataIndex: 'inventoryMax'
          },
              {
            title: '库存下限值',
            align:"center",
            dataIndex: 'inventoryMin'
          },
              {
            title: '库存预警值',
            align:"center",
            dataIndex: 'inventoryWarning'
          },
          {
            title: '操作',
            dataIndex: 'action',
            align:"center",
            scopedSlots: { customRender: 'action' },
          }
        ],
        url: {
          list: "/eam/eamSpareParts/list",
          delete: "/eam/eamSpareParts/delete",
          deleteBatch: "/eam/eamSpareParts/deleteBatch",
          exportXlsUrl: "eam/eamSpareParts/exportXls",
          importExcelUrl: "eam/eamSpareParts/importExcel",
       },
export default {
  name: "EamSparePartsList",
  mixins: [JeecgListMixin],
  components: {
    EamSparePartsModal,
    EamSparePartInventoryList
  },
  data() {
    return {
      description: '备品备件管理页面',
      sparePartId: '-1',
      // è¡¨å¤´
      columns: [
        {
          title: '备件编码',
          align: "center",
          dataIndex: 'partCode'
        },
        {
          title: '分类',
          align: "center",
          dataIndex: 'partCategory_dictText'
        },
        {
          title: '备件名称',
          align: "center",
          dataIndex: 'partName'
        },
        {
          title: '型号',
          align: "center",
          dataIndex: 'partModel'
        },
        {
          title: '规格',
          align: "center",
          dataIndex: 'partSpecification'
        },
        {
          title: '存放仓库',
          align: "center",
          dataIndex: 'storehouse'
        },
        {
          title: '制造商',
          align: "center",
          dataIndex: 'manufacturingEnterprise'
        },
        {
          title: '单位',
          align: "center",
          dataIndex: 'unit'
        },
        {
          title: '有效期（天）',
          align: "center",
          dataIndex: 'periodOfValidity'
        },
        {
          title: '库存上限值',
          align: "center",
          dataIndex: 'inventoryMax'
        },
        {
          title: '库存下限值',
          align: "center",
          dataIndex: 'inventoryMin'
        },
        {
          title: '库存预警值',
          align: "center",
          dataIndex: 'inventoryWarning'
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: "center",
          scopedSlots: { customRender: 'action' },
        }
      ],
      url: {
        list: "/eam/eamSpareParts/list",
        delete: "/eam/eamSpareParts/delete",
        deleteBatch: "/eam/eamSpareParts/deleteBatch",
        exportXlsUrl: "eam/eamSpareParts/exportXls",
        importExcelUrl: "eam/eamSpareParts/importExcel",
      },
    }
  },
  computed: {
    importExcelUrl: function(){
    importExcelUrl: function () {
      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
    }
  },
    methods: {

    }
  methods: {
    searchReset() {
      this.queryParam = {}
      this.onClearSelected()
      this.loadData(1);
    },
    clickThenSelect(record) {
      return {
        on: {
          click: () => {
            this.onSelectChange(record.id.split(','), [record])
          }
        }
      }
    },
    onClearSelected() {
      this.selectedRowKeys = []
      this.selectionRows = []
      this.sparePartId = '-1'
    },
    onSelectChange(selectedRowKeys, selectionRows) {
      if (selectedRowKeys.length == 1) {
        this.sparePartId = selectionRows[0]['id']
      } else {
        this.sparePartId = '-1'
      }
      this.selectedRowKeys = selectedRowKeys
      this.selectionRows = selectionRows
    },
  }
}
</script>
<style scoped>
  @import '~@assets/less/common.less';
@import '~@assets/less/common.less';
</style>

 src/views/eam/spare/modules/EamSparePartInventoryModal.vue

ÎļþÒÑɾ³ý

 src/views/eam/spare/modules/EamSpareParts/EamSparePartInventoryList.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,194 @@
<template>
  <a-card
    :bordered="false"
    :class="'cust-erp-sub-tab'"
  >
    <!-- æŸ¥è¯¢åŒºåŸŸ -->
    <div class="table-page-search-wrapper">
      <a-form
        layout="inline"
        @keyup.enter.native="searchQuery"
      >
        <a-row :gutter="24">
        </a-row>
      </a-form>
    </div>
    <div>
      <a-table
        ref="table"
        size="middle"
        bordered
        rowKey="id"
        :scroll="{x:true}"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        @change="handleTableChange"
      >

      </a-table>
    </div>

  </a-card>
</template>

<script>
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import { getAction } from '@/api/manage'
import Tooltip from 'ant-design-vue/es/tooltip'
import { ACCESS_TOKEN } from '@/store/mutation-types'
import Vue from 'vue'
import { getFileAccessHttpUrl } from '@/api/manage';

export default {
  name: "EamSparePartInventoryList",
  mixins: [JeecgListMixin],
  components: {
    Tooltip,
  },
  props: {
    sparePartId: {
      type: String,
      default: '-1',
      required: false
    }
  },
  watch: {
    sparePartId: {
      immediate: true,
      handler(val) {
        if (!this.sparePartId) {
          this.clearList()
        } else {
          this.queryParam['sparePartId'] = val;
          this.loadData(1);
        }
      }
    }
  },
  data() {
    return {
      // è¡¨å¤´
      columns: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: "center",
          customRender: function (t, r, index) {
            return parseInt(index) + 1;
          }
        },
        // {
        //   title: '备品备件ID',
        //   align: "center",
        //   dataIndex: 'sparePartId'
        // },
        {
          title: '批次号',
          align: "center",
          dataIndex: 'batchNum'
        },
        {
          title: '库存数量',
          align: "center",
          dataIndex: 'inventory'
        },
        {
          title: '出厂日期(生产日期)',
          align: "center",
          dataIndex: 'manufactureDate'
        },
        {
          title: '供应商',
          align: "center",
          dataIndex: 'supplier'
        },
        {
          title: '截止有效期',
          align: "center",
          dataIndex: 'expirationOfValidity'
        },
        {
          title: '存放位置',
          align: "center",
          dataIndex: 'location'
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: "center",
          scopedSlots: { customRender: 'action' },
        }
      ],
      url: {
        list: "/eam/eamSparePartInventory/list",
        delete: "/eam/eamSparePartInventory/delete",
        deleteBatch: "/eam/eamSparePartInventory/deleteBatch",
        exportXlsUrl: "eam/eamSparePartInventory/exportXls",
        importExcelUrl: "eam/eamSparePartInventory/importExcel",
      },
      /* åˆ†é¡µå‚æ•° */
      ipagination: {
        current: 1,
        pageSize: 20,
        pageSizeOptions: ['5', '10', '20', '50'],
        showTotal: (total, range) => {
          return range[0] + '-' + range[1] + ' å…±' + total + '条'
        },
        showQuickJumper: true,
        showSizeChanger: true,
        total: 0
      },
    }
  },
  created() {
  },
  computed: {
  },
  methods: {
    clearList() {
      this.dataSource = []
      this.selectedRowKeys = []
      this.ipagination.current = 1
    },
    loadData(arg) {
      if (!this.url.list) {
        this.$message.error("请设置url.list属性!")
        return
      }
      //加载数据 è‹¥ä¼ å…¥å‚æ•°1则加载第一页的内容
      if (arg === 1) {
        this.ipagination.current = 1;
      }
      var params = this.getQueryParams();//查询条件
      this.loading = true;
      // this.originTargetKeys = [];
      getAction(this.url.list, params).then((res) => {
        if (res.success) {
          // for (let i = 0; i < res.result.records.length; i++) {
          //   let r = res.result.records[i].upload;
          //   r.src = this.getSrc(res.result.records[i].upload);
          // }
          this.dataSource = res.result.records || res.result;
          if (res.result.total) {
            this.ipagination.total = res.result.total;
          } else {
            this.ipagination.total = 0;
          }
          //update-end---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
        } else {
          this.$message.warning(res.message)
        }
      }).finally(() => {
        this.loading = false
      })
    },
  }
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>

 src/views/eam/spare/modules/EamSpareParts/EamSparePartsModal.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,324 @@
<template>
  <j-modal
    :title="title"
    :width="800"
    :visible="visible"
    :confirmLoading="confirmLoading"
    switchFullscreen
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="关闭"
  >

    <a-spin :spinning="confirmLoading">
      <a-form-model
        ref="form"
        :model="model"
        :rules="validatorRules"
      >
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              prop="partCode"
              label="备件编码"
            >
              <a-input
                placeholder="备件编码自动生成"
                v-model="model.partCode"
                :disabled="true"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              prop="partCategory"
              label="备件分类"
            >
              <!-- <a-input
                placeholder="请输入备件分类"
                v-model="model.partCategory"
              /> -->
              <j-dict-select-tag
                allow-clear
                :disabled="false"
                placeholder="请选择备件分类"
                :triggerChange="true"
                dictCode="spare_part_category"
                v-model="model.partCategory"
              />
            </a-form-model-item>
          </a-col>

        </a-row>
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              prop="partName"
              label="备件名称"
            >
              <a-input
                placeholder="请输入备件名称"
                v-model="model.partName"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              prop="partModel"
              label="备件型号"
            >
              <a-input
                placeholder="请输入备件型号"
                v-model="model.partModel"
              />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              prop="partSpecification"
              label="备件规格"
            >
              <a-input
                placeholder="请输入备件规格"
                v-model="model.partSpecification"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              prop="storehouse"
              label="存放仓库"
            >
              <a-input
                placeholder="请输入存放仓库"
                v-model="model.storehouse"
              />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              prop="unit"
              label="计量单位"
            >
              <a-input
                placeholder="请输入计量单位"
                v-model="model.unit"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              prop="manufacturingEnterprise"
              label="制造企业"
            >
              <a-input
                placeholder="请输入制造企业"
                v-model="model.manufacturingEnterprise"
              />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              prop="periodOfValidity"
              label="有效期(天)"
            >
              <a-input-number
                style="width: 100%"
                :min="0"
                :precision="0"
                v-model="model.periodOfValidity"
              />
            </a-form-model-item>
          </a-col>

          <a-col :span="12">
            <a-form-model-item
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              prop="inventoryWarning"
              label="库存预警值"
            >
              <a-input-number
                style="width: 100%"
                :min="0"
                v-model="model.inventoryWarning"
              />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-model-item
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              prop="inventoryMax"
              label="最大备货库存"
            >
              <a-input-number
                style="width: 100%"
                :min="0"
                v-model="model.inventoryMax"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              prop="inventoryMin"
              label="最小备货库存"
            >
              <a-input-number
                style="width: 100%"
                :min="0"
                v-model="model.inventoryMin"
              />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :span="24">
            <a-form-model-item
              :labelCol="{xs: { span: 24 }, sm: { span: 3 }}"
              :wrapperCol="{xs: { span: 24 },sm: { span: 21 }}"
              prop="remark"
              label="备注"
            >
              <a-textarea
                placeholder="请输入备注"
                v-model="model.remark"
              />
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </a-spin>
  </j-modal>
</template>

<script>
import { getAction, httpAction } from '@api/manage'
import moment from "moment"

export default {
  name: "EamSparePartsModal",
  data() {
    return {
      title: "操作",
      visible: false,
      model: {},
      labelCol: {
        xs: { span: 24 },
        sm: { span: 6 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 18 }
      },

      confirmLoading: false,
      validatorRules: {
        partName: [
          { required: true, message: '请输入备件名称' }
        ]
      },
      url: {
        add: "/eam/eamSpareParts/add",
        edit: "/eam/eamSpareParts/edit",
        generateRequisitionCode: "sys/sysBusinessCodeRule/generateBusinessCodeSeq"
      },
    }
  },
  created() {
  },
  methods: {
    add() {
      const that = this
      let params = {
        businessCode: "SparePartCodeRule"
      }
      getAction(that.url.generateRequisitionCode, params).then((res) => {
        if (res.success) {
          this.model = {
            partCode: res.result
          }
        } else {
          that.$message.warning(res.message);
        }
      })
      //初始化默认值
      that.edit(this.model);
    },
    edit(record) {
      this.model = Object.assign({}, record);
      this.visible = true;
    },
    close() {
      this.$emit('close');
      this.visible = false;
      this.$refs.form.clearValidate();
    },
    handleOk() {
      const that = this;
      // è§¦å‘表单验证
      this.$refs.form.validate(valid => {
        if (valid) {
          that.confirmLoading = true;
          let httpurl = '';
          let method = '';
          if (!this.model.id) {
            httpurl += this.url.add;
            method = 'post';
          } else {
            httpurl += this.url.edit;
            method = 'put';
          }
          httpAction(httpurl, this.model, method).then((res) => {
            if (res.success) {
              that.$message.success(res.message);
              that.$emit('ok');
            } else {
              that.$message.warning(res.message);
            }
          }).finally(() => {
            that.confirmLoading = false;
            that.close();
          })
        } else {
          return false;
        }
      })
    },
    handleCancel() {
      this.close()
    }
  }
}
</script>

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

 src/views/eam/spare/modules/EamSparePartsModal.vue

ÎļþÒÑɾ³ý

 src/views/tms/OutboundDetailList.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,238 @@
<template>
  <a-card :bordered="false" :class="'cust-erp-sub-tab'">
    <!-- æŸ¥è¯¢åŒºåŸŸ -->
<!--    <div class="table-page-search-wrapper">-->
<!--      <a-form layout="inline" @keyup.enter.native="searchQuery">-->
<!--        <a-row :gutter="24">-->
<!--        </a-row>-->
<!--      </a-form>-->
<!--    </div>-->
    <!-- æŸ¥è¯¢åŒºåŸŸ-END -->

    <!-- æ“ä½œæŒ‰é’®åŒºåŸŸ -->
    <div class="table-operator" v-if="mainId">
<!--      <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>-->
<!--      <a-button type="primary" icon="download" @click="handleExportXls('出库申请单明细')">导出</a-button>-->
<!--      <a-upload-->
<!--        name="file"-->
<!--        :showUploadList="false"-->
<!--        :multiple="false"-->
<!--        :headers="tokenHeader"-->
<!--        :action="importExcelUrl"-->
<!--        @change="handleImportExcel">-->
<!--          <a-button type="primary" icon="import">导入</a-button>-->
<!--      </a-upload>-->
<!--      <a-dropdown v-if="selectedRowKeys.length > 0">-->
<!--        <a-menu slot="overlay">-->
<!--          <a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>-->
<!--        </a-menu>-->
<!--        <a-button style="margin-left: 8px"> æ‰¹é‡æ“ä½œ <a-icon type="down" /></a-button>-->
<!--      </a-dropdown>-->
    </div>

    <!-- table区域-begin -->
    <div>
<!--      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">-->
<!--        <i class="anticon anticon-info-circle ant-alert-icon"></i> å·²é€‰æ‹© <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项-->
<!--        <a style="margin-left: 24px" @click="onClearSelected">清空</a>-->
<!--      </div>-->

      <a-table
        ref="table"
        size="middle"
        bordered
        rowKey="id"
        :scroll="{x:true}"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        :rowSelection="null"
        @change="handleTableChange">

<!--        <template slot="htmlSlot" slot-scope="text">-->
<!--          <div v-html="text"></div>-->
<!--        </template>-->
<!--        <template slot="imgSlot" slot-scope="text,record">-->
<!--          <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>-->
<!--          <img v-else :src="getImgView(text)" :preview="record.id" height="25px" alt="" style="max-width:80px;font-size: 12px;font-style: italic;"/>-->
<!--        </template>-->
<!--        <template slot="fileSlot" slot-scope="text">-->
<!--          <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>-->
<!--          <a-button-->
<!--            v-else-->
<!--            :ghost="true"-->
<!--            type="primary"-->
<!--            icon="download"-->
<!--            size="small"-->
<!--            @click="downloadFile(text)">-->
<!--            ä¸‹è½½-->
<!--          </a-button>-->
<!--        </template>-->

<!--        <span slot="action" slot-scope="text, record">-->
<!--          <a @click="handleEdit(record)">编辑</a>-->
<!--          <a-divider type="vertical" />-->
<!--          <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">-->
<!--            <a>删除</a>-->
<!--          </a-popconfirm>-->
<!--        </span>-->

      </a-table>
    </div>

    <outboundDetail-modal ref="modalForm" @ok="modalFormOk" :mainId="mainId"></outboundDetail-modal>
  </a-card>
</template>

<script>

  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  import OutboundDetailModal from './modules/outBound/OutboundDetailModal'

  export default {
    name: "OutboundDetailList",
    mixins:[JeecgListMixin],
    components: { OutboundDetailModal },
    props:{
      mainId:{
        type:String,
        default:'',
        required:false
      }
    },
    watch:{
      mainId:{
        immediate: true,
        handler(val) {
          if(!this.mainId){
            this.clearList()
          }else{
            this.queryParam['outStorehouseId'] = val
            this.loadData(1);
          }
        }
      }
    },
    data () {
      return {
        description: 'tms_outbound_order管理页面',
        disableMixinCreated:true,
        // è¡¨å¤´
        columns: [
          {
            title: '#',
            dataIndex: '',
            key:'rowIndex',
            width:60,
            align:"center",
            customRender:function (t,r,index) {
              return parseInt(index)+1;
            }
          },
          {
            title:'刀具编码',
            align:"center",
            dataIndex: 'toolNum'
          },
          {
            title:'工具类型',
            align:"center",
            dataIndex: 'applicationType_dictText'
          },
          {
            title:'中文名称',
            align:"center",
            dataIndex: 'chineseName'
          },
          {
            title:'型号/图号',
            align:"center",
            dataIndex: 'toolModel'
          },
          {
            title:'刀具材料',
            align:"center",
            dataIndex: 'toolMaterial'
          },
          {
            title:'零件材料',
            align:"center",
            dataIndex: 'partMaterial'
          },
          {
            title:'厂家',
            align:"center",
            dataIndex: 'supplierId'
          },
          {
            title:'仓库',
            align:"center",
            dataIndex: 'warehouseName'
          },
          {
            title:'出库库位',
            align:"center",
            dataIndex: 'outboundLocation'
          },
          {
            title:'申请出库数量',
            align:"center",
            dataIndex: 'outboundQuantity'
          },
          {
            title:'实际出库数量',
            align:"center",
            dataIndex: 'outActualCount'
          },
          {
            title:'出库状态',
            align:"center",
            dataIndex: 'status_dictText'
          },
          {
            title:'创建时间',
            align:"center",
            dataIndex: 'createTime'
          },
          // {
          //   title: '操作',
          //   dataIndex: 'action',
          //   align:"center",
          //   fixed:"right",
          //   width:147,
          //   scopedSlots: { customRender: 'action' },
          // }
        ],
        url: {
          list: "/tms/outboundOrder/listOutboundDetailByMainId",
          delete: "/tms/outboundOrder/deleteOutboundDetail",
          deleteBatch: "/tms/outboundOrder/deleteBatchOutboundDetail",
          exportXlsUrl: "/tms/outboundOrder/exportOutboundDetail",
          importUrl: "/tms/outboundOrder/importOutboundDetail",
        },
        dictOptions:{
         outStorehouseType:[],
        }
      }
    },
    created() {
    },
    computed: {
      importExcelUrl(){
        return `${window._CONFIG['domianURL']}/${this.url.importUrl}/${this.mainId}`;
      }
    },
    methods: {
      clearList(){
        this.dataSource=[]
        this.selectedRowKeys=[]
        this.ipagination.current = 1
      }

    }
  }
</script>
<style scoped>
  @import '~@assets/less/common.less'
</style>

 src/views/tms/OutboundOrderList.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,375 @@
<template>
  <a-card :bordered="false">
    <!-- æŸ¥è¯¢åŒºåŸŸ -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="出库单编号">
              <a-input placeholder="请输入出库单编号" v-model="queryParam.outNum"></a-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="出库类型">
              <j-dict-select-tag placeholder="请选择出库类型" v-model="queryParam.outStorehouseType" dictCode="out_storehouse_type"/>
            </a-form-item>
          </a-col>
          <template v-if="toggleSearchStatus">
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
              <a-form-item label="审核状态">
                <j-dict-select-tag placeholder="请选择审核状态" v-model="queryParam.orderStatus" dictCode="out_bill_status"/>
              </a-form-item>
            </a-col>
          </template>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
              <a @click="handleToggleSearch" style="margin-left: 8px">
                {{ toggleSearchStatus ? '收起' : '展开' }}
                <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
              </a>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
    <!-- æŸ¥è¯¢åŒºåŸŸ-END -->

    <!-- æ“ä½œæŒ‰é’®åŒºåŸŸ -->
    <div class="table-operator">
      <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
<!--      <a-button type="primary" icon="download" @click="handleExportXls('tms_outbound_order')">导出</a-button>-->
<!--      <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">-->
<!--        <a-button type="primary" icon="import">导入</a-button>-->
<!--      </a-upload>-->
      <!-- é«˜çº§æŸ¥è¯¢åŒºåŸŸ -->
<!--      <j-super-query :fieldList="superFieldList" ref="superQueryModal" @handleSuperQuery="handleSuperQuery"></j-super-query>-->
    </div>

    <!-- table区域-begin -->
    <div>
<!--      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">-->
<!--        <i class="anticon anticon-info-circle ant-alert-icon"></i> å·²é€‰æ‹© <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项-->
<!--        <a style="margin-left: 24px" @click="onClearSelected">清空</a>-->
<!--      </div>-->

      <a-table
        ref="table"
        size="middle"
        bordered
        rowKey="id"
        class="j-table-force-nowrap"
        :scroll="{x:true}"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange, type:'radio'}"
        :customRow="clickThenSelect"
        @change="handleTableChange">

<!--        <template slot="htmlSlot" slot-scope="text">-->
<!--          <div v-html="text"></div>-->
<!--        </template>-->
<!--        <template slot="imgSlot" slot-scope="text,record">-->
<!--          <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>-->
<!--          <img v-else :src="getImgView(text)" :preview="record.id" height="25px" alt="" style="max-width:80px;font-size: 12px;font-style: italic;"/>-->
<!--        </template>-->
<!--        <template slot="fileSlot" slot-scope="text">-->
<!--          <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>-->
<!--          <a-button-->
<!--            v-else-->
<!--            :ghost="true"-->
<!--            type="primary"-->
<!--            icon="download"-->
<!--            size="small"-->
<!--            @click="downloadFile(text)">-->
<!--            ä¸‹è½½-->
<!--          </a-button>-->
<!--        </template>-->

        <span slot="action" slot-scope="text, record">
          <a @click="handleDetail(record)">详情</a>
          <span v-if="record.orderStatus === '1'">
            <a-divider type="vertical" />
            <a-popconfirm title="确定提交吗?" @confirm="() => handleSubmit(record)">
              <a>提交</a>
            </a-popconfirm>
            <a-divider type="vertical" />
            <a-dropdown>
              <a class="ant-dropdown-link">更多<a-icon type="down" /></a>
              <a-menu slot="overlay">
                <a-menu-item>
                  <a @click="handleEdit(record)">编辑</a>
                </a-menu-item>
                <a-menu-item>
                  <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
                    <a>删除</a>
                  </a-popconfirm>
                </a-menu-item>
              </a-menu>
            </a-dropdown>
          </span>
        </span>

      </a-table>
    </div>

    <a-tabs defaultActiveKey="1">
      <a-tab-pane tab="出库申请单明细" key="1" >
        <OutboundDetailList ref="outboundDetailList" :mainId="outboundDetailMainId" />
      </a-tab-pane>
    </a-tabs>

    <outboundOrder-modal ref="modalForm" @ok="modalFormOk"></outboundOrder-modal>
  </a-card>
</template>

<script>

  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  import OutboundOrderModal from './modules/outBound/OutboundOrderModal'
  import { getAction, deleteAction } from '@/api/manage'
  import OutboundDetailList from './OutboundDetailList'
  import {initDictOptions,filterMultiDictText} from '@/components/dict/JDictSelectUtil'
  import '@/assets/less/TableExpand.less'

  export default {
    name: "OutboundOrderList",
    mixins:[JeecgListMixin],
    components: {
      OutboundDetailList,
      OutboundOrderModal
    },
    data () {
      return {
        description: 'tms_outbound_order管理页面',
        // è¡¨å¤´
        columns: [
          {
            title:'出库类型',
            align:"center",
            dataIndex: 'outStorehouseType_dictText',
          },
          {
            title:'出库单编号',
            align:"center",
            dataIndex: 'outNum'
          },
          {
            title:'单据状态',
            align:"center",
            dataIndex: 'orderStatus_dictText'
          },
          {
            title:'经手人',
            align:"center",
            dataIndex: 'handler_dictText'
          },
          {
            title:'审核人',
            align:"center",
            dataIndex: 'reviewer_dictText'
          },
          {
            title:'审核时间',
            align:"center",
            dataIndex: 'auditDate'
          },
          {
            title:'审核意见',
            align:"center",
            dataIndex: 'approvalOpinion'
          },
          {
            title:'申请出库时间',
            align:"center",
            dataIndex: 'outboundTime'
          },
          {
            title:'出库状态',
            align:"center",
            dataIndex: 'outStatus_dictText'
          },
          {
            title:'领用事由',
            align:"center",
            dataIndex: 'subjectMatter'
          },
          {
            title:'备注',
            align:"center",
            dataIndex: 'remark'
          },
          {
            title:'操作员',
            align:"center",
            dataIndex: 'createBy'
          },
          {
            title:'创建时间',
            align:"center",
            dataIndex: 'createTime'
          },
          {
            title: '操作',
            dataIndex: 'action',
            align:"center",
            fixed:"right",
            width:147,
            scopedSlots: { customRender: 'action' },
          }
        ],
        url: {
          list: "/tms/outboundOrder/list",
          delete: "/tms/outboundOrder/delete",
          submit: "/tms/outboundOrder/submit",
          deleteBatch: "/tms/outboundOrder/deleteBatch",
          exportXlsUrl: "/tms/outboundOrder/exportXls",
          importExcelUrl: "tms/outboundOrder/importExcel",
        },
        dictOptions:{
         outStorehouseType:[],
        },
        /* åˆ†é¡µå‚æ•° */
        ipagination:{
          current: 1,
          pageSize: 5,
          pageSizeOptions: ['5', '10', '50'],
          showTotal: (total, range) => {
            return range[0] + "-" + range[1] + " å…±" + total + "条"
          },
          showQuickJumper: true,
          showSizeChanger: true,
          total: 0
        },
        selectedMainId:'',
        superFieldList:[],
        outboundDetailMainId: '',
      }
    },
    created() {
      this.getSuperFieldList();
    },
    computed: {
      importExcelUrl: function(){
        return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
      }
    },
    methods: {
      modalFormOk() {
        this.$refs.outboundDetailList.clearList()
        this.loadData();
      },
      searchReset() {
        this.queryParam = {}
        this.onClearSelected()
        this.$refs.outboundDetailList.clearList()
        this.loadData(1);
      },
      initDictConfig(){
      },
      clickThenSelect(record) {
        return {
          on: {
            click: () => {
              this.onSelectChange(record.id.split(","), [record]);
            }
          }
        }
      },
      onClearSelected() {
        this.selectedRowKeys = [];
        this.selectionRows = [];
        this.selectedMainId = ''
        this.outboundDetailMainId = ''
      },
      onSelectChange(selectedRowKeys, selectionRows) {
        this.selectedMainId=selectedRowKeys[0]
        this.selectedRowKeys = selectedRowKeys;
        this.selectionRows = selectionRows;
        this.outboundDetailMainId = selectionRows[0]['id']
      },
      handleSubmit(record) {
        getAction(this.url.submit,{ id: record.id }).then((res)=>{
          if (res.success) {
            this.$message.success(res.message);
            this.loadData();
            this.$refs.outboundDetailList.clearList()
          } else {
            this.$message.warning(res.message);
          }
        })
      },
      handleDelete: function (id) {
        if(!this.url.delete){
          this.$message.error("请设置url.delete属性!")
          return
        }
        var that = this;
        deleteAction(that.url.delete, {id: id}).then((res) => {
          if (res.success) {
            //重新计算分页问题
            that.reCalculatePage(1)
            // that.$message.success(res.message);
            that.$notification.success({
              message:'消息',
              description:res.message
            });
            that.loadData();
            this.$refs.outboundDetailList.clearList()
          } else {
            // that.$message.warning(res.message);
            that.$notification.warning({
              message:'消息',
              description:res.message
            });
          }
        });
      },
      loadData(arg) {
        if(!this.url.list){
          this.$message.error("请设置url.list属性!")
          return
        }
        //加载数据 è‹¥ä¼ å…¥å‚æ•°1则加载第一页的内容
        if (arg === 1) {
          this.ipagination.current = 1;
        }
        this.onClearSelected()
        var params = this.getQueryParams();//查询条件
        this.loading = true;
        getAction(this.url.list, params).then((res) => {
          if (res.success) {
            this.dataSource = res.result.records;
            this.ipagination.total = res.result.total;
          }
          if(res.code===510){
            this.$message.warning(res.message)
          }
          this.loading = false;
        })
      },
      getSuperFieldList(){
        let fieldList=[];
        fieldList.push({type:'string',value:'outNum',text:'出库单编号',dictCode:''})
        fieldList.push({type:'string',value:'outStorehouseType',text:'出库类型',dictCode:'out_storehouse_type'})
        fieldList.push({type:'string',value:'handler',text:'经手人',dictCode:''})
        fieldList.push({type:'sel_user',value:'reviewer',text:'审核人'})
        fieldList.push({type:'string',value:'orderStatus',text:'单子状态',dictCode:''})
        fieldList.push({type:'date',value:'auditDate',text:'审核时间'})
        fieldList.push({type:'string',value:'approvalOpinion',text:'审核意见',dictCode:''})
        fieldList.push({type:'string',value:'subjectMatter',text:'领用事由',dictCode:''})
        fieldList.push({type:'date',value:'outboundTime',text:'出库时间'})
        fieldList.push({type:'string',value:'remark',text:'备注',dictCode:''})
        fieldList.push({type:'string',value:'createBy',text:'操作员',dictCode:''})
        fieldList.push({type:'date',value:'createTime',text:'创建时间'})
        this.superFieldList = fieldList
      }
    }
  }
</script>
<style scoped>
  @import '~@assets/less/common.less'
</style>

 src/views/tms/modules/outBound/JSelectOutboundToolModal.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,246 @@
<template>
  <!--支持全屏缩放-->
  <j-modal
    :visible="visible"
    :width="1200"
    :title="title"
    switchFullscreen
    @ok="handleSubmit"
    @cancel="close"
    style="top: 50px"
    cancelText="关闭"
  >
    <a-card :bordered="false">
      <div class="table-page-search-wrapper">
        <a-form layout="inline" @keyup.enter.native="searchQuery">
          <a-row :gutter="24">
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
              <a-form-item label="工具编码">
                <a-input placeholder="请输入工具编码,支持模糊查询" v-model="queryParam.toolCode"></a-input>
              </a-form-item>
            </a-col>
            <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
            <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
          </a-row>
        </a-form>
      </div>
      <!--出库单列表-->
      <a-table
        ref="table"
        size="middle"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :rowSelection="rowSelection"
        :loading="loading"
        @change="handleTableChange"
      >
      </a-table>
    </a-card>
  </j-modal>
</template>

<script>
import { filterObj } from '@/utils/util'
import { getAction } from '@api/manage'

export default {
  name: 'JSelectOutboundToolModal',
  components: {},
  props: {},
  data() {
    return {
      title: '选择出库工具',
      queryParam: {},
      columns: [
        {
          title: '#',
          dataIndex: '',
          key:'rowIndex',
          width:60,
          align:"center",
          customRender:function (t,r,index) {
            return parseInt(index)+1;
          }
        },
        {
          title:'工具编码',
          align:"center",
          dataIndex: 'toolNum'
        },
        {
          title:'工具编号',
          align:"center",
          dataIndex: 'toolId'
        },
        {
          title:'可用库存数量',
          align:"center",
          dataIndex: 'quantity'
        },
        {
          title:'所在仓库',
          align:"center",
          dataIndex: 'warehouseName'
        },
        {
          title:'所在库位号',
          align:"center",
          dataIndex: 'positionCode'
        },
        // {
        //   title:'出库状态;1.未出库；2.部分出库；3.出库完成',
        //   align:"center",
        //   dataIndex: 'status'
        // },
        // {
        //   title: '操作',
        //   dataIndex: 'action',
        //   align:"center",
        //   fixed:"right",
        //   width:147,
        //   scopedSlots: { customRender: 'action' },
        // }
      ],
      selectedRowKeys: [],
      oldSelectRow: [],
      scrollTrigger: { x: 1500, y: 500 },
      dataSource: [],
      selectionRows: [],
      ipagination: {
        current: 1,
        pageSize: 10,
        pageSizeOptions: ['5', '10', '20'],
        showTotal: (total, range) => {
          return range[0] + '-' + range[1] + ' å…±' + total + '条'
        },
        showQuickJumper: true,
        showSizeChanger: true,
        total: 0,
      },
      isorter: {
        column: 'toolCode',
        order: 'asc',
      },
      departTree: [],
      visible: false,
      loading: false,
      prepareKnifeDetailList:[],
      url: {
        list: '/tms/toolLedgerDetail/list'
      },
    }
  },
  computed: {
    rowSelection() {
      return {
        type: 'checkbox',
        onChange: (selectedRowKeys, selectedRows) => {
          this.selectedRowKeys = selectedRowKeys
          this.onSelectChange(selectedRows)
        },
        getCheckboxProps: (record) => ({
          props: {
            disabled: record.disabled,
          },
        }),
      }
    },
  },
  watch: {
  },
  created() {
  },
  methods: {
    async loadData(arg) {
      if (arg === 1) {
        this.ipagination.current = 1
      }
      this.loading = true
      let params = this.getQueryParams() //查询条件
      console.log(params)
      await getAction(this.url.list, params).then((res) => {
        if (res.success) {
          this.dataSource = res.result.records
          this.ipagination.total = res.result.total
        }
        if (res.code === 510) {
          this.$message.warning(res.message)
        }
        this.loading = false
      })
    },
    showModal(oldSelectRow) {
      this.oldSelectRow = oldSelectRow
      this.visible = true
      this.queryParam.status = '1'
      this.queryParam.excludeIds = oldSelectRow
      this.loadData(1)
    },
    getQueryParams() {
      let param = Object.assign({}, this.queryParam, this.isorter)
      param.field = this.getQueryField()
      param.pageNo = this.ipagination.current
      param.pageSize = this.ipagination.pageSize
      return filterObj(param)
    },
    //查询条件处理
    getQueryField() {
      let fields = ['id'];
      for (let a = 0; a < this.columns.length; a++) {
        fields.push(this.columns[a].dataIndex);
      }
      return fields.join(',');
    },
    searchReset() {
      this.queryParam = {}
      this.loadData(1)
    },
    close() {
      this.queryParam = {}
      // this.searchReset(0)
      this.selectedRowKeys = []
      this.selectionRows = []
      this.visible = false
    },
    handleTableChange(pagination, filters, sorter) {
      if (Object.keys(sorter).length > 0) {
        this.isorter.column = sorter.field
        this.isorter.order = 'ascend' === sorter.order ? 'asc' : 'desc'
      }
      this.ipagination = pagination
      this.loadData()
    },
    handleSubmit() {
      if (this.selectionRows.length > 0) {
        this.$bus.$emit('selectionRows', this.selectionRows)
        // this.searchReset(0)
        this.close()
      } else {
        this.$message.warning('请至少选择一条数据')
      }
    },
    onSelectChange(selectionRows) {
      this.selectionRows = selectionRows
    },
    searchQuery() {
      this.loadData(1)
    },
  },
}
</script>

<style scoped>
.ant-table-tbody .ant-table-row td {
  padding-top: 10px;
  padding-bottom: 10px;
}

#components-layout-demo-custom-trigger .trigger {
  font-size: 18px;
  line-height: 64px;
  padding: 0 24px;
  cursor: pointer;
  transition: color 0.3s;
}
</style>

 src/views/tms/modules/outBound/OutboundDetailModal.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,143 @@
<template>
  <j-modal
    :title="title"
    :width="width"
    :visible="visible"
    :confirmLoading="confirmLoading"
    switchFullscreen
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="关闭">
    <a-spin :spinning="confirmLoading">
      <a-form-model ref="form" :model="model" :rules="validatorRules">
        <a-row>
          <a-col :span="24">
            <a-form-model-item label="刀具编码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="toolCode">
              <a-input v-model="model.toolCode"placeholder="请输入刀具编码" ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="申请出库数量" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="outboundQuantity">
              <a-input-number v-model="model.outboundQuantity"placeholder="请输入申请出库数量" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="仓库" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="storageLocation">
              <a-input v-model="model.storageLocation"placeholder="请输入仓库" ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="出库库位" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="outboundLocation">
              <a-input v-model="model.outboundLocation"placeholder="请输入出库库位" ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="出库状态;1.未出库；2.部分出库；3.出库完成" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="status">
              <a-input-number v-model="model.status"placeholder="请输入出库状态;1.未出库；2.部分出库；3.出库完成" style="width: 100%" />
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </a-spin>
  </j-modal>
</template>

<script>

  import { httpAction } from '@/api/manage'
  import { validateDuplicateValue } from '@/utils/util'

  export default {
    name: "OutboundDetailModal",
    components: {
    },
    props:{
      mainId:{
        type:String,
        required:false,
        default:''
      }
    },
    data () {
      return {
        title:"操作",
        width:800,
        visible: false,
        model:{
        },
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },

        confirmLoading: false,
        validatorRules: {
        },
        url: {
          add: "/tms/outboundOrder/addOutboundDetail",
          edit: "/tms/outboundOrder/editOutboundDetail",
        }

      }
    },
    created () {
    //备份model原始值
      this.modelDefault = JSON.parse(JSON.stringify(this.model));
    },
    methods: {
      add () {
        this.edit(this.modelDefault);
      },
      edit (record) {
        this.model = Object.assign({}, record);
        this.visible = true;
      },
      close () {
        this.$emit('close');
        this.visible = false;
        this.$refs.form.clearValidate();
      },
      handleOk () {
        const that = this;
        // è§¦å‘表单验证
        this.$refs.form.validate(valid => {
          if (valid) {
            that.confirmLoading = true;
            let httpurl = '';
            let method = '';
            if(!this.model.id){
              httpurl+=this.url.add;
              method = 'post';
            }else{
              httpurl+=this.url.edit;
               method = 'put';
            }
            this.model['outStorehouseId'] = this.mainId
            httpAction(httpurl,this.model,method).then((res)=>{
              if(res.success){
                that.$message.success(res.message);
                that.$emit('ok');
              }else{
                that.$message.warning(res.message);
              }
            }).finally(() => {
              that.confirmLoading = false;
              that.close();
            })
          }else{
             return false
          }
        })
      },
      handleCancel () {
        this.close()
      },


    }
  }
</script>

 src/views/tms/modules/outBound/OutboundOrderModal.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,386 @@
<template>
  <j-modal
    :title="title"
    :width="width"
    :visible="visible"
    :confirmLoading="confirmLoading"
    switchFullscreen
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="关闭">
    <a-spin :spinning="confirmLoading">
      <a-form-model ref="form" :model="model" :rules="validatorRules">
        <a-row>
          <a-col :span="12">
            <a-form-model-item label="出库单编号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="outNum">
              <a-input :disabled="true" v-model="model.outNum" placeholder="系统自动生成"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="出库类型" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="outStorehouseType">
              <j-dict-select-tag :disabled="disableSubmit" @change="handleTypeChange" type="list" v-model="model.outStorehouseType" dictCode="out_storehouse_type" placeholder="请选择出库类型" />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-model-item label="出库时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="outboundTime">
              <j-date :disabled="disableSubmit" :show-time="true" dateFormat="YYYY-MM-DD HH:mm" placeholder="请选择出库时间" v-model="model.outboundTime" style="width: 100%"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="领用事由" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="subjectMatter">
              <a-input :disabled="disableSubmit" v-model="model.subjectMatter" placeholder="请输入领用事由" ></a-input>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-model-item label="审核人" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="reviewer">
              <j-select-user-by-dep :disabled="disableSubmit" v-model="model.reviewer" :store="'id'" :text="'realname'" :multi="false" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item v-if="addShow" label="经手人" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="handler">
              <j-select-user-by-dep v-model="model.handler" :store="'id'" :text="'realname'" :multi="false" disabled/>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-model-item v-if="addShow" label="单子状态" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="orderStatus">
              <j-dict-select-tag type="list" v-model="model.orderStatus" dictCode="out_bill_status" placeholder="请选择单子状态" disabled/>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item v-if="addShow" label="审核时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="auditDate">
              <j-date placeholder="请选择审核时间" v-model="model.auditDate" style="width: 100%" disabled/>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-model-item v-if="addShow" label="审核意见" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="approvalOpinion">
              <a-input v-model="model.approvalOpinion" placeholder="请输入审核意见" disabled></a-input>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-model-item label="备注" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="remark">
              <a-textarea :disabled="disableSubmit" v-model="model.remark" rows="4" placeholder="请输入备注" />
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </a-spin>

    <a-button v-show="selectBorrowTool" type="primary" :style="{ marginBottom: '8px' }" @click="selectOutBoundTool">选择出库工具</a-button>
    <a-table
      ref="table"
      size="middle"
      bordered
      rowKey="id"
      :scroll="{x:true}"
      :columns="columns"
      :dataSource="dataSource"
      :pagination="ipagination"
      :loading="loading"
      :rowSelection="null"
      @change="handleTableChange">

      <template v-for="col in columns" :slot="col.dataIndex" slot-scope="text, record, index">
        <div :key="col.dataIndex">
          <a-input-number
            v-if="col.dataIndex === 'outboundQuantity'"
            :disabled="record.quantity <= 1"
            :value="text"
            @change="(e) => handleChange(e, record.key, col, index)"
            :min="1"
          />
        </div>
      </template>
      <span slot="action" v-if="disableSubmit === false" slot-scope="text, record, index">
        <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record, index)">
          <a>删除</a>
        </a-popconfirm>
      </span>
    </a-table>
    <template slot="footer" v-if="disableSubmit === false">
      <a-button :style="{ marginRight: '8px' }" @click="handleCancel">关闭</a-button>
      <a-button @click="handleOk" :disabled="isDisabled" type="primary">确定</a-button>
    </template>

    <j-select-outbound-tool-modal ref="selectOutBoundToolModal"></j-select-outbound-tool-modal>
  </j-modal>

</template>

<script>

  import { httpAction } from '@/api/manage'
  import { validateDuplicateValue } from '@/utils/util'
  import OutboundDetailList from '../../OutboundDetailList.vue'
  import JSelectOutboundToolModal from './JSelectOutboundToolModal.vue'
  import { getAction } from '../../../../api/manage'
  import title from 'ant-design-vue/lib/skeleton/Title'

  export default {
    name: "OutboundOrderModal",
    components: {
      OutboundDetailList,
      JSelectOutboundToolModal
    },
    data () {
      return {
        title: '',
        width:1200,
        visible: false,
        disableSubmit: false,
        isDisabled: false,
        addShow: true,
        selectBorrowTool: false,
        model:{
        },
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        //表格参数
        ipagination: {
          current: 1,
          pageSize: 10,
          total: 0,
        },
        dataSource: [],
        loading: false,
        // è¡¨å¤´
        columns: [
          {
            title: '#',
            dataIndex: '',
            key:'rowIndex',
            width:60,
            align:"center",
            customRender:function (t,r,index) {
              return parseInt(index)+1;
            }
          },
          {
            title:'工具编码',
            align:"center",
            dataIndex: 'toolNum'
          },
          {
            title:'工具编号',
            align:"center",
            dataIndex: 'toolId'
          },
          {
            title:'可用库存',
            align:"center",
            dataIndex: 'quantity'
          },
          {
            title:'申请出库数量',
            align:"center",
            dataIndex: 'outboundQuantity',
            scopedSlots: { customRender: 'outboundQuantity' },
          },
          {
            title:'出库仓库',
            align:"center",
            dataIndex: 'warehouseName'
          },
          {
            title:'出库库位',
            align:"center",
            dataIndex: 'outboundLocation'
          },
          // {
          //   title:'出库状态;1.未出库；2.部分出库；3.出库完成',
          //   align:"center",
          //   dataIndex: 'status'
          // },
          {
            title: '操作',
            dataIndex: 'action',
            align:"center",
            fixed:"right",
            width:147,
            scopedSlots: { customRender: 'action' },
          }
        ],
        confirmLoading: false,
        validatorRules: {
           outStorehouseType: [
              { required: true, message: '请输入出库类型!'},
           ],
           subjectMatter: [
              { required: true, message: '请输入领用事由!'},
           ],
        },
        url: {
          list: "/tms/outboundOrder/listOutboundDetailByMainId",
          add: "/tms/outboundOrder/addTotal",
          edit: "/tms/outboundOrder/editTotal",
        }

      }
    },
    created () {
    //备份model原始值
      this.modelDefault = JSON.parse(JSON.stringify(this.model));
    },
    mounted() {
      this.$bus.$on('selectionRows', (data) => {
        for (let i = 0; i < data.length; i++) {
          this.dataSource.push({
            id: data[i].id,
            toolCode:data[i].toolCode,
            toolNum:data[i].toolNum,
            toolId: data[i].toolId,
            quantity: data[i].quantity,
            outboundQuantity: data[i].quantity,
            storageLocation: data[i].warehouseId,
            warehouseName: data[i].warehouseName,
            outboundLocation: data[i].positionCode
          })
        }
        this.ipagination.total = this.dataSource.length
      })
    },
    methods: {
      handleTypeChange(value) {
        if (value === '1') {
          this.selectBorrowTool = true
        }
        if (value === '2') {
          this.selectBorrowTool = false
        }
        if (value === '3') {
          this.selectBorrowTool = false
        }
        if (value === '4') {
          this.selectBorrowTool = false
        }
      },
      handleDelete(record, index) {
        this.dataSource.splice(index, 1)
      },
      handleChange(value, key, column, index) {
        console.log(value, key, column, index)
        const temp = [...this.dataSource]
        const target = temp.filter(item => key === item.key)[index];
        if (target) {
          target[column.dataIndex] = value
          this.dataSource = temp
          if(column.dataIndex === 'outboundQuantity'){
            if(target['quantity']<value){
              this.$message.error('申请出库数量不能大于可用库存!')
              this.isDisabled = true
            }else{
              this.isDisabled = false
            }
          }
          this.dataSource = temp
        }
      },
      selectOutBoundTool() {
        console.log(this.dataSource)
        let ids = ''
        if (this.title === '新增') {
          ids = this.dataSource.map(item => item.id).join(',')
        }
        if (this.title === '编辑') {
         ids = this.dataSource.map(item => item.toolLedgerDetailId).join(',')
        }
        this.$refs.selectOutBoundToolModal.showModal(ids)
      },
      add () {
        this.addShow = false
        this.edit(this.modelDefault);
        this.dataSource = []
      },
      edit (record) {
        if (record.id) {
          getAction(this.url.list,{ outStorehouseId : record.id }).then(res => {
            if (res.success) {
              this.dataSource = res.result.records
            }
            if (this.title === '编辑') {
              const type = record.outStorehouseType
              switch (type) {
                case '1':
                  this.handleTypeChange('1')
                  break
                case '2':
                  this.handleTypeChange('2')
                  break
                case '3':
                  this.handleTypeChange('3')
                  break
                case '4':
                  this.handleTypeChange('4')
                  break
              }
            }
          })
        }
        this.model = Object.assign({}, record);
        this.visible = true;
      },
      close () {
        this.$emit('close');
        this.addShow = true
        this.selectBorrowTool = false
        this.visible = false;
        this.$refs.form.clearValidate();
      },
      handleTableChange(pagination, filters, sorter) {
        this.ipagination = pagination
      },
      handleOk () {
        const that = this;
        // è§¦å‘表单验证
        this.$refs.form.validate(valid => {
          if (valid) {
            this.model.outboundDetailList = this.dataSource
            that.confirmLoading = true;
            let httpurl = '';
            let method = '';
            if(!this.model.id){
              httpurl+=this.url.add;
              method = 'post';
            }else{
              httpurl+=this.url.edit;
               method = 'put';
            }
            httpAction(httpurl,this.model,method).then((res)=>{
              if(res.success){
                that.$message.success(res.message);
                that.$emit('ok');
              }else{
                that.$message.warning(res.message);
              }
            }).finally(() => {
              that.confirmLoading = false;
              that.close();
            })
          }else{
             return false
          }
        })
      },
      handleCancel () {
        this.close()
      },


    }
  }
</script>