修改领料车、领料清单、项目事件配置等界面

package.json

@@ -13,7 +13,6 @@
     "dist"
   ],
   "peerDependencies": {
-    "ant-design-vue": "^4.2.1",
     "pc-component-v3": "^1.1.12",
     "v-tooltip": "^4.0.0-beta.17",
     "vue-select": "^4.0.0-beta.6"
@@ -53,5 +52,10 @@
   "repository": {
     "type": "http",
     "url": "http://prodog.leanwo.com:3000/prodog-client-2023/client-wms-v3.git"
+  },
+  "dependencies": {
+    "@ant-design/icons-vue": "^7.0.1",
+    "ant-design-vue": "^4.0.0-rc.6",
+    "client-wms-v3": "file:"
   }
 }

src/main.js

@@ -6,6 +6,9 @@ import VTooltip from 'v-tooltip';
 import * as PcClientComponent from 'pc-component-v3';
 window.Uuid = PcClientComponent.Uuid;
 window.Notify = PcClientComponent.Notify;
+window.onerror = function(message, source, lineno, colno, error) {
+  if (message.includes('ResizeObserver')) return true;
+};
 
 import Antd from 'ant-design-vue';
 import App from './App.vue';

src/pick/StockOutPrepareApproved.vue

@@ -1,193 +1,124 @@
 <template>
-  <div>
-    <Navbar
-      title="领料清单"
-      :is-go-back="false"
-    >
-      <button
-        class="dropdown-toggle btn-light"
-        data-toggle="dropdown"
-        aria-expanded="false"
-        title="仓库库存"
-        @click="stockOutPrepareLine()"
-      >
-        <i
-          class="fa fa-home"
-          aria-hidden="true"
-        />
-      </button>
-      <button
-        class="dropdown-toggle btn-light"
-        data-toggle="dropdown"
-        aria-expanded="false"
-        @click="openStockOutCar()"
-      >
-        <i class="fa fa-shopping-cart" />
-        <span
-          class="badge bg-green"
-          style="margin-left:-5px;margin-top:-10px;"
-        >{{ count }}</span>
-      </button>
-    </Navbar>
-    <div class="flex-container">
-      <div class="flex-header">
-        <div class="form-inline">
-          <div class="form-group">
-            <label for="projectItem">
-              <span class="text-danger">
-                *
-              </span>
-              项目事件
-            </label>
-            <a-select
-              v-model:value="projectItemName"
-              style="width: 220px"
-              show-search
-              @change="projectHandleChange"
-            >
-              <a-select-option v-for="item in projectList" :key="item.id" :value="item.name"> {{ item.name }}</a-select-option>
-            </a-select>
-            <!-- <select
-              id="projectItem"
-              class="form-control"
-            /> -->
-          </div>
-          <div class="form-group">
-            <button
-              type="button"
-              class="btn btn-primary"
-              @click="getStockOutPrepareDatas"
-            >
-              查询
-            </button>
-            <button
-              type="button"
-              class="btn btn-danger"
-              @click="deleteStockOutPrepare"
-            >
-              删除
-            </button>
-          </div>
-        </div>
-      </div>
-      <div
-        class="flex-content"
-        style="margin-top: -50px;"
-      >
-        <!--左列,显示领料单据-->
-        <div class="flex-aside">
-          <div>
-            <nav>
-              <ul
-                class="pager"
-                style="margin: 5px 0;"
-              >
-                <li>
-                  <a
-                    href="javascript:void(0)"
-                    class="pull-left"
-                    @click="previousPage"
-                  >上一页</a>
-                </li>
-                <li>
-                  <a
-                    href="javascript:void(0)"
-                    class="pull-right"
-                    @click="nextPage"
-                  >下一页</a>
-                </li>
-              </ul>
-            </nav>
-            <div class="list-group">
-              <template
-                v-for="stockOutPrepare in stockOutPrepares"
-                :key="stockOutPrepare.id"
-              >
-                <a
-                  href="javascript:void(0)"
-                  class="list-group-item"
-                  :class="{'active' : stockOutPrepare === selectedStockOutPrepare}"
-                  @click="setStockOutPrepare(stockOutPrepare)"
-                >{{ stockOutPrepare.documentNo }}({{ stockOutPrepare.warehouseName }},{{ stockOutPrepare.status }})</a>
-              </template>
-            </div>
-          </div>
-        </div>
-        <!--右列,显示领料详情-->
-        <div class="flex-main">
-          <table class="fixed-table table table-striped table-bordered">
-            <thead>
-              <tr>
-                <td style="width: 50px;">序号</td>
-                <td style="width: 50px;">图片</td>
-                <td style="width: 150px;">物料编码</td>
-                <td style="width: 250px;">物料名称</td>
-                <td style="width: 150px;">规格型号</td>
-                <td style="width: 80px;">需求模板</td>
-                <td style="width: 80px;">需求数量</td>
-                <td style="width: 80px;">领用数量</td>
-                <td style="width: 80px;">状态</td>
-              </tr>
-            </thead>
-            <tbody v-if="stockOutPrepareLines.length > 0">
-              <tr
-                v-for="(item,index) in stockOutPrepareLines"
-                :key="item.inventoryId"
-              >
-                <td style="text-align:center;vertical-align:middle;">{{ index+1 }}</td>
-                <td>
-                  <img
-                    :src="Common.getThumbnailImageSrc(className, item.imageName)"
-                    class="image"
-                    @click="$refs.imagePreview.preview(className, item.imageName)"
-                  />
-                </td>
-                <td style="text-align:center;vertical-align:middle;">{{ item.inventoryNo }}</td>
-                <td style="text-align:center;vertical-align:middle;">{{ item.inventoryName }}</td>
-                <td style="text-align:center;vertical-align:middle;">{{ item.inventoryType }}</td>
-                <td style="text-align:center;vertical-align:middle;">{{ item.stockOutPrepateTemplateName }}</td>
-                <td style="text-align:center;vertical-align:middle;">{{ item.needQuantity }}</td>
-                <td style="text-align:center;vertical-align:middle;">{{ item.quantity }}</td>
-                <td
-                  v-if="item.inventoryStatus == 2"
-                  style="background: deepskyblue;text-align:center;vertical-align:middle;"
+  <a-layout>
+    <a-layout-header class="header">
+      <Navbar title="领料清单" :is-go-back="false">
+        <a-space>
+          <a-button type="link" title="仓库库存" @click="stockOutPrepareLine">
+            <template #icon><HomeOutlined /></template>
+          </a-button>
+          <a-button type="link" title="领料车" @click="openStockOutCar">
+            <template #icon><ShoppingCartOutlined /></template>
+            <a-badge :count="count" :number-style="{ marginTop: '-2px' }" />
+          </a-button>
+        </a-space>
+      </Navbar>
+    </a-layout-header>
+
+    <a-layout-content class="content">
+      <a-form layout="inline" class="search-form">
+        <a-form-item label="项目事件" required>
+          <a-select
+            v-model:value="projectItemName"
+            style="width: 220px"
+            show-search
+            @change="projectHandleChange"
+          >
+            <a-select-option v-for="item in projectList" :key="item.id" :value="item.name">
+              {{ item.name }}
+            </a-select-option>
+          </a-select>
+        </a-form-item>
+
+        <a-form-item>
+          <a-space>
+            <a-button type="primary" @click="getStockOutPrepareDatas">查询</a-button>
+            <a-button danger @click="deleteStockOutPrepare">删除</a-button>
+          </a-space>
+        </a-form-item>
+      </a-form>
+
+      <a-layout class="main-layout">
+        <a-layout-sider width="300px" class="sider">
+          <a-space direction="vertical" class="pagination-controls">
+            <a-button-group>
+              <a-button @click="previousPage">上一页</a-button>
+              <a-button @click="nextPage">下一页</a-button>
+            </a-button-group>
+            
+            <a-list item-layout="horizontal" :data-source="stockOutPrepares">
+              <template #renderItem="{ item }">
+                <a-list-item 
+                  :class="{ 'selected-list-item': item === selectedStockOutPrepare }"
+                  @click="setStockOutPrepare(item)"
                 >
-                  已拣货
-                </td>
-                <td
-                  v-if="item.inventoryStatus == 1"
-                  style="background: red;text-align:center;vertical-align:middle;"
-                >
-                  未拣货
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-      </div>
+                  {{ item.documentNo }}({{ item.warehouseName }},{{ item.status }})
+                </a-list-item>
+              </template>
+            </a-list>
+          </a-space>
+        </a-layout-sider>
+
+        <a-layout-content>
+          <a-table
+            :columns="columns"
+            :data-source="stockOutPrepareLines"
+            :scroll="{ x: 1500, y: '60vh' }"
+            size="small"
+            bordered
+            row-key="inventoryId"
+          >
+            <template #bodyCell="{ column, record }">
+              <template v-if="column.dataIndex === 'image'">
+                <a-image
+                  :src="Common.getThumbnailImageSrc(className, record.imageName)"
+                  width="40"
+                  :preview="false"
+                  @click="$refs.imagePreview.preview(className, record.imageName)"
+                />
+              </template>
+              
+              <template v-if="column.dataIndex === 'inventoryStatus'">
+                <a-tag :color="record.inventoryStatus === 2 ? 'blue' : 'red'">
+                  {{ record.inventoryStatus === 2 ? '已拣货' : '未拣货' }}
+                </a-tag>
+              </template>
+            </template>
+          </a-table>
+        </a-layout-content>
+      </a-layout>
+
       <div class="flex-footer">
-        <div class="pull-left">
-          <span>第{{ (pagination.current_page-1)*pagination.per_page+1 }}-{{ pagination.current_page*pagination.per_page }}条,共计{{ pagination.total }}条,每页显示</span>
-          <PageSizeSelect @page-size-changed="gridSizeSelect" />
-          <span>条</span>
-        </div>
-        <div class="pull-right">
-          <VueBootstrapPagination
-            v-if="pagination.last_page > 0"
-            :pagination="pagination"
-            :callback="getStockOutPrepareLineDatas"
+        <a-space>
+          <span>第{{ (pagination.current_page - 1) * pagination.per_page + 1 }}-{{ 
+            pagination.current_page * pagination.per_page 
+          }}条,共计{{ pagination.total }}条</span>
+          <a-select 
+            v-model:value="pagination.per_page" 
+            style="width: 90px"
+            @change="gridSizeSelect"
+          >
+            <a-select-option :value="20">20</a-select-option>
+            <a-select-option :value="50">50</a-select-option>
+            <a-select-option :value="100">100</a-select-option>
+          </a-select>
+          <a-pagination 
+            v-model:current="pagination.current_page"
+            :total="pagination.total"
+            :page-size="pagination.per_page"
+            show-less-items
+            @change="getStockOutPrepareLineDatas"
           />
-        </div>
+        </a-space>
       </div>
-    </div>
-    <div>
-      <Loading v-if="loading" />
-    </div>
+    </a-layout-content>
+
     <ImagePreview ref="imagePreview" />
-  </div>
+    <Loading v-if="loading" />
+  </a-layout>
 </template>
 
 <script>
+import { HomeOutlined, ShoppingCartOutlined } from '@ant-design/icons-vue';
 import Common from '../common/Common.js';
 import StockOutPrepareResource from '../api/wms/StockOutPrepareResource.js';
 import StockOutPrepareLineResource from '../api/wms/StockOutPrepareLineResource.js';
@@ -195,6 +126,8 @@ import PickingCarResource from '../api/wms/PickingCarResource.js';
 
 export default {
   components: {
+    HomeOutlined,
+    ShoppingCartOutlined,
   },
   data: function () {
     this.Common = Common;
@@ -230,6 +163,17 @@ export default {
       bomInventoryId: undefined,
       count: 0,
       loading: false,
+      columns: [
+        { title: '序号', dataIndex: 'index', width: 80 },
+        { title: '图片', dataIndex: 'image', width: 100 },
+        { title: '物料编码', dataIndex: 'inventoryNo', width: 150 },
+        { title: '物料名称', dataIndex: 'inventoryName', width: 200 },
+        { title: '规格型号', dataIndex: 'inventoryType', width: 150 },
+        { title: '需求模板', dataIndex: 'stockOutPrepateTemplateName', width: 120 },
+        { title: '需求数量', dataIndex: 'needQuantity', width: 120 },
+        { title: '领用数量', dataIndex: 'quantity', width: 120 },
+        { title: '状态', dataIndex: 'inventoryStatus', width: 100 },
+      ],
     };
   },
   watch: {
@@ -572,7 +516,6 @@ export default {
           _self.pagination.total = successData.total;
           _self.stockOutPrepareLines = successData.datas;
           _self.pagination.last_page = Math.ceil(successData.total / successData.length);
-          _self.fixedTableHeader();
         } else {
           Notify.error('提示', successData.errorMessage, false);
           return;
@@ -584,103 +527,41 @@ export default {
 
     },
 
-    /**
-         * 冻结表头
-         */
-    fixedTableHeader: function () {
-      let _self = this;
-      _self.$nextTick(function () {
-        $('.fixed-table').tableFixer({ 'left': 4, 'head': true });
-      });
-    },
-
   },
 };
 </script>
 
 
 <style scoped>
-.form-inline .form-group label {
-    width: 80px;
-    text-align: right;
-    padding-right: 5px;
+.header {
+  background: #fff;
+  padding: 0;
 }
 
-.form-inline .form-group input,
-.form-inline .form-group select {
-    width: 200px;
+.main-layout {
+  margin-top: 16px;
+  background: #fff;
+  padding: 16px;
 }
-</style>
 
-<style scoped>
-.flex-container {
-    display: flex;
-    /* 垂直*/
-    flex-direction: column;
-    width: 100%;
-    /*视口被均分为100单位的vh 占据整个窗口，扣掉顶部topNav的距离后，计算得到container的高度*/
-    height: calc(100vh - 70px);
+.sider {
+  background: #fff;
+  border-right: 1px solid #f0f0f0;
+  padding-right: 16px;
 }
 
-.flex-header {
-    /*放大缩小比例为0 */
-    height: 400px;
-    flex: 0 0 100px;
+.selected-list-item {
+  background-color: #e6f7ff;
+  border-right: 3px solid #1890ff;
 }
 
 .flex-footer {
-    margin-top: 0.8em;
-    height: 40px;
-    flex: 0 0 40px;
-}
-
-.flex-content {
-    display: flex;
-    flex: 1;
-    overflow: auto;
-}
-
-.flex-aside {
-    flex: 0 0 300px;
-    padding-right: 10px;
-}
-
-.flex-main {
-    overflow: scroll;
-    flex: 1;
-}
-
-.image {
-    width: 40px;
-    height: 40px;
-}
-
-.modal-img-box {
-    width: 100%;
-    text-align: center;
-    overflow: auto;
-}
-
-.m-img {
-    width: 100%;
-}
-</style>
-
-<style scoped>
-.fixed-table {
-    table-layout: fixed;
-    width: 800px !important;
-    min-width: 800px !important;
-}
-
-table.fixed-table tr {
-    height: 40px;
+  padding: 12px 0;
+  border-top: 1px solid #f0f0f0;
+  margin-top: 16px;
 }
 
-table.fixed-table th,
-table.fixed-table td {
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
+.pagination-controls {
+  width: 100%;
 }
 </style>

src/pick/StockOutPrepareLine1.vue

@@ -0,0 +1,1265 @@
+<template>
+  <a-layout>
+    <a-layout-header class="header">
+      <a-form layout="inline" class="form-container">
+        <a-form-item label="采购订单号">
+          <a-select
+            v-model:value="documentNo"
+            placeholder="输入采购订单号"
+            show-search
+            option-filter-prop="children"
+          />
+        </a-form-item>
+
+        <a-form-item label="存货名称">
+          <a-input v-model:value="inventoryName" placeholder="输入存货档案名称" />
+        </a-form-item>
+
+        <a-form-item label="规格型号">
+          <a-input v-model:value="inventoryType" placeholder="输入规格型号" />
+        </a-form-item>
+
+        <a-form-item label="打印范围">
+          <a-select
+            v-model:value="selectedNum"
+            @change="refreshPurchaseOrderLineTable"
+          >
+            <a-select-option value="0">全部</a-select-option>
+            <a-select-option value="1">未打印</a-select-option>
+            <a-select-option value="2">已打印</a-select-option>
+          </a-select>
+        </a-form-item>
+
+        <a-form-item>
+          <a-space>
+            <a-button type="primary" @click="refreshPurchaseOrderLineTable">
+              查询
+            </a-button>
+            <a-button type="primary" @click="showNeedPrint">
+              打印
+              <a-badge :count="notPrintCount" />
+            </a-button>
+          </a-space>
+        </a-form-item>
+      </a-form>
+    </a-layout-header>
+
+    <a-layout-content class="content">
+      <a-table
+        :columns="columns"
+        :data-source="purchaseOrderLines"
+        :scroll="{ x: 1200 }"
+        row-key="id"
+      >
+        <template #bodyCell="{ column, record, index }">
+          <template v-if="column.dataIndex === 'index'">{{ index + 1 }}</template>
+          <template v-if="column.dataIndex === 'operation'">
+            <a-button type="link" @click="refreshPackModal(record.id)">包装</a-button>
+          </template>
+        </template>
+      </a-table>
+
+      <!-- 分页组件 -->
+      <a-pagination
+        v-model:current="pagination.current_page"
+        :total="pagination.total"
+        :page-size="pagination.per_page"
+        class="pagination-wrapper"
+        show-less-items
+      />
+    </a-layout-content>
+  </a-layout>
+
+  <!-- 包装模态框 -->
+  <div id="pack-modal" class="modal fade" aria-hidden="true" data-backdrop="static">
+    <div class="modal-dialog modal-lg" style="width:1000px;">
+      <div class="modal-content">
+        <div class="modal-header">
+          <button type="button" class="close" data-dismiss="modal">
+            <span aria-hidden="true">&times;</span>
+            <span class="sr-only">Close</span>
+          </button>
+          <h4 class="modal-title">包装</h4>
+        </div>
+        <div id="modal-body" class="modal-body" style="color:#676767;">
+          <div class="container-fluid">
+            <div class="row header-row">
+              <div class="col-md-2">
+                <div class="form-control-label">存货档案名称</div>
+              </div>
+              <div class="col-md-4">
+                <input v-model="packData.inventoryName" autocomplete="off" class="form-control" disabled type="text" />
+              </div>
+              <div class="col-md-2">
+                <div class="form-control-label">存货档案编号</div>
+              </div>
+              <div class="col-md-4">
+                <input v-model="packData.inventoryCode" autocomplete="off" class="form-control" disabled type="text" />
+              </div>
+            </div>
+            <div class="row header-row">
+              <div class="col-md-2">
+                <div class="form-control-label">订单数量</div>
+              </div>
+              <div class="col-md-4">
+                <input v-model="packData.quantity" autocomplete="off" class="form-control" disabled type="text" />
+              </div>
+              <div class="col-md-2">
+                <div class="form-control-label">工作令</div>
+              </div>
+              <div class="col-md-4">
+                <input v-model="packData.projectInventoryName" autocomplete="off" class="form-control" disabled type="text" />
+              </div>
+            </div>
+            <div class="row header-row">
+              <div class="col-md-2">
+                <div class="form-control-label">预算分类项</div>
+              </div>
+              <div class="col-md-4">
+                <input v-model="packData.componentInventoryName" autocomplete="off" class="form-control" disabled type="text" />
+              </div>
+              <div class="col-md-2">
+                <div class="form-control-label">已打印包装件数</div>
+              </div>
+              <div class="col-md-4">
+                <input v-model="purchaseOrderLinePrint.printedInventoryInstanceCount" autocomplete="off" class="form-control" disabled type="text" />
+              </div>
+            </div>
+            <div class="row header-row">
+              <div class="col-md-2">
+                <div class="form-control-label">已打印物料总数</div>
+              </div>
+              <div class="col-md-4">
+                <input v-model="purchaseOrderLinePrint.printedInventoryInstanceQuantity" autocomplete="off" class="form-control" disabled type="text" />
+              </div>
+              <div class="col-md-2">
+                <div class="form-control-label">未打印包装件数</div>
+              </div>
+              <div class="col-md-4">
+                <input v-model="purchaseOrderLinePrint.notPrintedInventoryInstanceCount" autocomplete="off" class="form-control" disabled type="text" />
+              </div>
+            </div>
+            <div class="row header-row">
+              <div class="col-md-2">
+                <div class="form-control-label">未打印物料总数</div>
+              </div>
+              <div class="col-md-4">
+                <input v-model="purchaseOrderLinePrint.notPrintedInventoryInstanceQuantity" autocomplete="off" class="form-control" disabled type="text" />
+              </div>
+            </div>
+            <div class="row header-row">
+              <div class="col-md-6 col-md-offset-5">
+                <div class="col-md-3">
+                  <button type="button" class="btn btn-info btn-sm" @click="showOnePackModal">添加一个包装</button>
+                </div>
+                <div class="col-md-3">
+                  <button type="button" class="btn btn-info btn-sm" @click="showMorePackModal">添加多个包装</button>
+                </div>
+                <div class="col-md-4">
+                  <!-- eslint-disable-next-line -->
+                    <select v-model="buttonText" class="selectpicker form-control" data-style="btn-info" style="width:110%; padding-left:1px; margin: 0px 10px" @change="packModalPrintStatus">
+                    <option value="0">显示全部</option>
+                    <option value="1">显示未打印</option>
+                  </select>
+                </div>
+                <div class="col-md-3">
+                  <button type="button" class="btn btn-primary btn-sm" style="position: absolute;top: -33px;left: 400px;" @click="printNotPrintedContent">
+                    打印未打印的内容
+                    <span class="badge">{{ notPrintCount }}</span>
+                  </button>
+                </div>
+              </div>
+            </div>
+          </div> 
+          <div class="row">
+            <div class="col-sm-12">
+              <div id="myTabContent" class="tab-content">
+                <table id="table-width" class="myTable" style="color: #ccc;">
+                  <thead>
+                    <tr>
+                      <th>序号</th>
+                      <th>包装创建时间</th>
+                      <th>包装内物料数量</th>
+                      <th>打印次数</th>
+                      <th>打印状态</th>
+                      <th>打印</th>
+                      <th>删除</th>
+                    </tr>
+                  </thead>
+                  <tbody>
+                    <template v-if="buttonText == 0">
+                      <tr v-for="(item,index) in inventoryInstances" :key="item.id">
+                        <td>{{ index + 1 }}</td>
+                        <td>{{ item.createDate }}</td>
+                        <td style="cursor: pointer;text-decoration: underline;" @click="changeQty(item.id,item.quantity)">{{ item.quantity }}</td>
+                        <td>{{ item.printCount }}</td>
+                        <td v-if="item.printStatus == 0">未打印</td>
+                        <td v-else-if="item.printStatus == 1">待打印</td>
+                        <td v-else>已打印</td>
+                        <td>
+                          <button type="button" class="btn btn-success btn-sm" @click="printPack(item.id)">打印</button>
+                        </td>
+                        <td>
+                          <button type="button" class="btn btn-danger btn-sm" @click="deletePack(item.id)">删除</button>
+                        </td>
+                      </tr>
+                    </template>
+                    <template v-if="buttonText == 1 && item.printStatus == 0">
+                      <tr v-for="(item,index) in inventoryInstances" :key="item.id">
+                        <td>{{ index + 1 }}</td>
+                        <td>{{ item.createDate }}</td>
+                        <td style="cursor: pointer;text-decoration: underline;" @click="changeQty(item.id,item.quantity)">{{ item.quantity }}</td>
+                        <td>{{ item.printCount }}</td>
+                        <td>未打印</td>
+                        <td>
+                          <button type="button" class="btn btn-success btn-sm" @click="printPack(item.id)">打印</button>
+                        </td>
+                        <td>
+                          <button type="button" class="btn btn-danger btn-sm" @click="deletePack(item.id)">删除</button>
+                        </td>
+                      </tr>
+                    </template>
+                  </tbody>
+                </table>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  
+  <!-- 包装模态框:END -->
+  <!--  +1模态框 -->
+  <div id="pack-modal-1" class="modal fade" aria-hidden="true" data-backdrop="static">
+    <div class="modal-dialog modal-lg" style="width:800px;">
+      <div class="modal-content">
+        <div class="modal-header">
+          <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
+          <h4 class="modal-title">输入包装内物料数量</h4>
+        </div>
+        <div id="modal-body" class="modal-body" style="color:#676767;">
+          <div class="row header-row">
+            <div class="col-md-2">
+              <div class="form-control-label">包装内物料数量:</div>
+            </div>
+            <div class="col-md-4">
+              <input v-model="packOneQty" autocomplete="off" class="form-control" type="text" />
+            </div>
+          </div>
+        </div>
+        <div class="modal-footer">
+          <button type="button" class="btn btn-default" @click="cancelOnePackModal">取消</button>
+          <button type="button" class="btn btn-primary" @click="saveOnePack">确定</button>
+        </div>
+      </div>
+    </div>
+  </div>
+  <!-- +1模态框END -->
+  <!--  +N模态框 -->
+  <div id="pack-modal-N" class="modal fade" aria-hidden="true" data-backdrop="static">
+    <div class="modal-dialog modal-lg" style="width:800px">
+      <div class="modal-content">
+        <div class="modal-header">
+          <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
+          <h4 class="modal-title">输入包装内物料数量</h4>
+        </div>
+        <div class="modal-body" style="color:#676767;">
+          <div class="row header-row">
+            <div class="col-md-2">
+              <div class="form-control-label">包装数量:</div>
+            </div>
+            <div class="col-md-4">
+              <input v-model="packMoreCount" autocomplete="off" class="form-control" type="text" />
+            </div>
+          </div>
+          <div class="row header-row">
+            <div class="col-md-2">
+              <div class="form-control-label">包装内物料数量:</div>
+            </div>
+            <div class="col-md-4">
+              <input v-model="packMoreQty" autocomplete="off" class="form-control" type="text" />
+            </div>
+          </div>
+        </div>
+        <div class="modal-footer">
+          <button type="button" class="btn btn-default" @click="cancelMorePackModal">取消</button>
+          <button type="button" class="btn btn-primary" @click="saveMorePack">确定</button>
+        </div>
+      </div>
+    </div>
+  </div>
+  <!-- +N模态框END -->
+  <!-- 打印模态框 -->
+  <div id="print-modal" class="modal fade" aria-hidden="true" data-backdrop="static">
+    <div class="modal-dialog modal-lg" style="width:1000px">
+      <div class="modal-content">
+        <div id="modal-body" class="modal-body" style="color:#676767;">
+          <div class="row header-row">
+            <button type="button" class="close" data-dismiss="modal" style="margin-right:5px;">
+              <span aria-hidden="true">&times;</span>
+              <span class="sr-only">Close</span>
+            </button>
+            <ul id="myTab" class="nav nav-tabs">
+              <li class="active">
+                <a id="notPrint-a" href="#notPrint-deal" data-toggle="tab" class="hide-table" @click="getNoPrintInventoryInstancePrint">待打印
+                </a>
+              </li>
+              <li>
+                <a id="printed-a" href="#Printed-deal" data-toggle="tab" class="hide-table" @click="getPrintedInventoryInstancePrint">已打印
+                </a>
+              </li>
+            </ul>
+          </div>
+          <div class="row header-row">
+            <div class="container-fluid">
+              <div id="myTabContent" class="tab-content">
+                <div id="notPrint-deal" class="tab-pane fade in active">
+                  <div class="tab-pane">
+                    <div class="row">
+                      <div class="col-md-12">
+                        <div class="col-md-2">
+                          <span>采购订单号:</span>
+                          <!-- eslint-disable-next-line -->
+                            <input autocomplete="off" id="documentNo-noPrint" v-model="notPrintDocumentNo" type="text" class="form-control col-md-2 query-input-noPrint" placeholder="输入采购订单号" />
+                        </div>
+                        <div class="col-md-2">
+                          <span>存货档案名称:</span>
+                          <!--eslint-disable-next-line -->
+                            <input autocomplete="off" id="inventoryName-noPrint" v-model="notPrintInventoryName" type="text" style="padding-left: 5px;" class="form-control col-md-2 query-input-noPrint" placeholder="输入存货档案名称" />
+                        </div>
+                        <!--eslint-disable-next-line -->
+                          <div class="col-md-2">
+                          <span>存货档案编码:</span>
+                          <!--eslint-disable-next-line -->
+                            <input autocomplete="off" id="inventoryCode-noPrint" v-model="notPrintInventoryCode" type="text" style="padding-left: 5px;" class="form-control col-md-2 query-input-noPrint" placeholder="输入存货档案编码" />
+                        </div>
+                        <div class="col-md-2">
+                          <span>规格型号:</span>
+                          <!-- eslint-disable-next-line -->
+                            <input autocomplete="off" id="inventoryType-noPrint" v-model="notPrintInventoryType" type="text" class="form-control col-md-2 query-input-noPrint" placeholder="输入规格型号" />
+                        </div>
+                        <div class="col-md-2" style="position: absolute;top: 20px;right: 150px;">
+                          <button id="query-noPrint" type="button" class="btn btn-primary btn-sm" @click="getNoPrintInventoryInstancePrint">查询</button>
+                        </div>
+                      </div>
+                      <div class="col-md-12">
+                        <table id="myTable" class="myTable" style="color:#ccc;">
+                          <thead>
+                            <tr>
+                              <th>
+                                <input id="select-all-notPrint" v-model="checkAll" autocomplete="off" type="checkbox" name="select-all-notPrint" @click="notPrintCheckedAll()" />
+                              </th>
+                              <th>序号</th>
+                              <th>订单编号</th>
+                              <th>存货档案名称</th>
+                              <th>存货档案编码</th>
+                              <th>规格型号</th>
+                              <th>创建日期</th>
+                              <th>包装内物料数量</th>
+                              <th>订单数量</th>
+                              <th>打印状态</th>
+                            </tr>
+                          </thead>
+                          <tbody id="table-notPrint">
+                            <tr v-for="(item,index) in notPrintInventoryInstances" :key="item.id">
+                              <td>
+                                <input v-model="notPrintCheckboxModel" autocomplete="off" type="checkbox" :value="item.id" /> 
+                              </td>
+                              <td>{{ index + 1 }}</td>
+                              <td>{{ item.purchaseOrderDocumentNo }}</td>
+                              <td>{{ item.inventoryName }}</td>
+                              <td>{{ item.inventoryCode }}</td>
+                              <td>{{ item.inventoryType }}</td>
+                              <td>{{ item.createDate }}</td>
+                              <td>{{ item.printQuantity }}</td>
+                              <td>{{ item.quantity }}</td>
+                              <td>待打印</td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </div>
+                    </div>
+                    <div class="modal-footer">
+                      <button id="savePrint-btn-notPrint" type="button" class="btn btn-primary" @click="printReport(0)">打印条码</button>
+                    </div>
+                  </div>		
+                </div>	
+                <div id="Printed-deal" class="tab-pane fade ">
+                  <div class="tab-pane">
+                    <div class="row">
+                      <div class="col-md-12">
+                        <div class="col-md-2">
+                          <span>采购订单号:</span>
+                          <!-- eslint-disable-next-line -->
+                            <input autocomplete="off" id="documentNo-print" v-model="printedDocumentNo" type="text" class="form-control col-md-2 query-input-print" placeholder="输入采购订单号" />
+                        </div>
+                        <div class="col-md-2">
+                          <span>存货档案名称:</span>
+                          <!-- eslint-disable-next-line -->
+                            <input autocomplete="off" id="inventoryName-print" v-model="printedInventoryName" type="text" style="padding-left: 5px;" class="form-control col-md-2 query-input-print" placeholder="输入存货档案名称" />
+                        </div>
+                        <div class="col-md-2">
+                          <span>存货档案编码:</span>
+                          <!--eslint-disable-next-line -->
+                            <input autocomplete="off" id="inventoryCode-print" v-model="printedInventoryCode" type="text" style="padding-left: 5px;" class="form-control col-md-2 query-input-print" placeholder="输入存货档案编码" />
+                        </div>
+                        <div class="col-md-2">
+                          <span>规格型号:</span>
+                          <!-- eslint-disable-next-line -->
+                            <input autocomplete="off" id="inventoryType-print" v-model="printedInventoryType" type="text" class="form-control col-md-2 query-input-print" placeholder="输入规格型号" />
+                        </div>
+                        <div class="col-md-2" style="position: absolute;top: 20px;right: 150px;">
+                          <button id="query-print" type="button" class="btn btn-primary btn-sm" @click="getPrintedInventoryInstancePrint">查询</button>
+                        </div>
+                      </div>
+                      <div class="col-md-12">
+                        <table id="myTable" class="myTable" style="color:#ccc;">
+                          <thead>
+                            <tr>
+                              <th><input v-model="printedCheckAll" autocomplete="off" type="checkbox" name="select-all-printed" @click="printedCheckedAll()" /></th>
+                              <th>序号</th>
+                              <th>订单编号</th>
+                              <th>存货档案名称</th>
+                              <th>存货档案编码</th>
+                              <th>规格型号</th>
+                              <th>创建日期</th>
+                              <th>打印日期</th>
+                              <th>包装内物料数量</th>
+                              <th>订单数量</th>
+                              <th>打印状态</th>
+                            </tr>
+                          </thead>
+                          <tbody id="table-Printed">
+                            <tr v-for="(item,index) in printedInventoryInstances" :key="item.id">
+                              <td>
+                                <input v-model="printedCheckboxModel" autocomplete="off" type="checkbox" :value="item.id" /> 
+                              </td>
+                              <td>{{ (pagination.current_page - 1) * pagination.per_page + 1 + index }}</td>
+                              <td>{{ item.purchaseOrderDocumentNo }}</td>
+                              <td>{{ item.inventoryName }}</td>
+                              <td>{{ item.inventoryCode }}</td>
+                              <td>{{ item.inventoryType }}</td>
+                              <td>{{ item.createDate }}</td>
+                              <td>{{ item.printedDate }}</td>
+                              <td>{{ item.printQuantity }}</td>
+                              <td>{{ item.quantity }}</td>
+                              <td>已打印</td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </div>
+                    </div>
+                    <div class="modal-footer">
+                      <button id="sendDocPrint-btn" type="button" class="btn btn-primary" @click="printReport(2)">打印发货单</button>
+                      <button id="savePrint-btn-Printed" type="button" class="btn btn-primary" @click="printReport(1)">打印条码</button>
+                    </div>
+                    <div class="row">
+                      <VueBootstrapPagination v-if="isShowPage" :pagination="pagination" :callback="getPrintedInventoryInstancePrint" />
+                    </div>
+                  </div>		
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <!-- 打印模态框END -->
+  <!--  pdf、Excel下载模态框 -->
+  <div id="pack-modal-download" class="modal fade" aria-hidden="true" data-backdrop="static">
+    <div class="modal-dialog modal-lg" style="width:500px">
+      <div class="modal-content">
+        <div class="modal-header">
+          <button type="button" class="close" data-dismiss="modal" style="margin-right:10px;margin-top:-5px;">
+            <span aria-hidden="true">&times;</span>
+            <span class="sr-only">Close</span>
+          </button>
+          <h4 class="modal-title">选择下载格式</h4>
+        </div>
+        <div id="modal-body" class="modal-body" style="color:#676767;">
+          <div class="row header-row">
+            <div class="col-md-2">
+              <button id="download-pdf" type="button" class="btn btn-info">
+                <a style="color:#fff;" target="_blank" @click="downloadPdf">PDF下载</a>
+              </button>
+            </div>
+            <div class="col-md-2">
+              <button id="download-Excel" type="button" class="btn btn-info">
+                <a style="color:#fff;" target="_blank" @click="downloadExcel">Excel下载</a>
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <!-- pdf、Excel下载模态框END -->
+  <!--  修改数量模态框start -->
+  <div id="pack-modal-quantity" class="modal fade" aria-hidden="true" data-backdrop="static">
+    <div class="modal-dialog modal-lg" style="width:800px;">
+      <div class="modal-content">
+        <div class="modal-header">
+          <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
+          <h4 class="modal-title">输入包装内物料数量</h4> 
+        </div>
+        <div id="modal-body" class="modal-body" style="color:#676767;">
+          <input id="inventoryInstanceId" autocomplete="off" type="hidden" value="" />
+          <div class="row header-row">
+            <div class="col-md-2"><div class="form-control-label">包装内物料数量:</div></div>
+            <div class="col-md-4"><input id="pack-changeQty" v-model="quantity" autocomplete="off" class="form-control" type="text" /></div>
+          </div>
+        </div>
+        <div class="modal-footer">
+          <button id="cancel-btn-changeQty" type="button" class="btn btn-default" @click="cancelChangeQty">取消</button>
+          <button id="saveQty-btn-changeQty" type="button" class="btn btn-primary" @click="saveChangeQty">保存</button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import Common from '../common/Common.js';
+
+
+
+export default {
+  components: {
+    
+    
+  },
+  data: function () {
+    return {
+      columns: [
+        { title: '序号', dataIndex: 'index', width: 60 },
+        { title: '存货名称', dataIndex: 'inventoryName' },
+        { title: '存货编码', dataIndex: 'inventoryCode' },
+        { title: '规格型号', dataIndex: 'inventoryType' },
+        { title: '订单数量', dataIndex: 'quantity' },
+        { title: '操作', dataIndex: 'operation', fixed: 'right' },
+      ],
+      inventoryName: '',
+      inventoryCode: '',
+      inventoryType: '',
+      documentNo: '',
+      selectedNum: '',
+      purchaseOrderLines: [],
+      purchaseOrderLineId: '',
+      packData: {},
+      purchaseOrderLinePrint: {},
+      buttonText: '',
+      inventoryInstances: [],
+      packOneQty: '',
+      packMoreCount: '',
+      packMoreQty: '',
+      notPrintInventoryInstances: [],
+      notPrintInventoryName: '',
+      notPrintInventoryCode: '',
+      notPrintInventoryType: '',
+      notPrintDocumentNo: '',
+      notPrintCheckboxModel: [], //获取选项框数据
+      checkAll: false, //全选,
+      reportResult: {},
+      pagination: {
+        total: 0,
+        per_page: 30,
+        current_page: 1,
+        last_page: 10,
+      },
+      isShowPage: false,
+      printedInventoryInstances: [],
+      printedInventoryName: '',
+      printedInventoryCode: '',
+      printedInventoryType: '',
+      printedDocumentNo: '',
+      printedCheckboxModel: [], //获取选项框数据
+      printedCheckAll: false, //全选,
+      notPrintCount: '',
+      quantity: '',
+      inventoryInstanceId: '',
+    };
+  },
+  watch: {
+    // 反选
+    notPrintCheckboxModel: {
+      handler: function (val, oldVal) {
+        console.log(this.notPrintCheckboxModel.toString());
+        if (
+          this.notPrintInventoryInstances.length ==
+          this.notPrintCheckboxModel.length
+        ) {
+          this.checkAll = true;
+        } else {
+          this.checkAll = false;
+        }
+      },
+      deep: true,
+    },
+    // 反选
+    printedCheckboxModel: {
+      handler: function (val, oldVal) {
+        console.log(this.printedCheckboxModel.toString());
+        if (
+          this.printedInventoryInstances.length ==
+          this.printedCheckboxModel.length
+        ) {
+          this.printedCheckAll = true;
+        } else {
+          this.printedCheckAll = false;
+        }
+      },
+      deep: true,
+    },
+  },
+  mounted: function () {
+    this.loadDocumentNo();
+    this.getNeedPrintCount();
+  },
+  methods: {
+    loadDocumentNo: function () {
+      var _self = this;
+      $('#documentNo')
+        .select2({
+          placeholder: '输入采购订单号',
+          allowClear: false,
+          ajax: {
+            type: 'get',
+            dataType: 'json',
+            url: Common.getApiURL(
+              'PurchaseOrderLineResource/queryPurchaseOrderLineDocumentNo',
+            ),
+            beforeSend: function (request) {
+              Common.addTokenToRequest(request);
+            },
+            data: function (params) {
+              return {
+                documentNo: params.term,
+              };
+            },
+            processResults: function (data) {
+              return {
+                results: $.map(data, function (item) {
+                  return {
+                    id: item.documentNo,
+                    text: item.documentNo,
+                  };
+                }),
+              };
+            },
+          },
+        })
+        .on('select2:select', function (event) {
+          console.log(event.params.data);
+          _self.documentNo = event.params.data.text;
+          _self.refreshPurchaseOrderLineTable();
+          _self.keydown();
+        });
+    },
+    refreshPurchaseOrderLineTable: function () {
+      var _self = this;
+      var purchaseOrderDocumentNo = _self.documentNo;
+      var inventoryName = _self.inventoryName;
+      var inventoryType = _self.inventoryType;
+      var inventoryCode = _self.inventoryCode;
+      var printNum = _self.selectedNum;
+      if (
+        purchaseOrderDocumentNo == '' &&
+        inventoryName == '' &&
+        inventoryCode == '' &&
+        inventoryType == ''
+      ) {
+        return;
+      } else {
+        var url;
+        if (printNum == 1) {
+          url =
+            'PurchaseOrderLineResource/findNotPrintByDocumentNoNameCodeType';
+        } else if (printNum == 2) {
+          url = 'PurchaseOrderLineResource/findPrintedByDocumentNoNameCodeType';
+        } else {
+          url = 'PurchaseOrderLineResource/findAllByDocumentNoNameCodeType';
+        }
+        $.ajax({
+          url: Common.getApiURL(url),
+          type: 'post',
+          data: {
+            documentNo: purchaseOrderDocumentNo,
+            inventoryName: inventoryName,
+            inventoryCode: inventoryCode,
+            inventoryType: inventoryType,
+          },
+          beforeSend: function (request) {
+            Common.addTokenToRequest(request);
+          },
+          success: function (data) {
+            //console.log(data);
+            _self.purchaseOrderLines = data;
+          },
+          error: function (XMLHttpRequest, textStatus, errorThrown) {
+            Common.processException(XMLHttpRequest, textStatus, errorThrown);
+          },
+        });
+      }
+    },
+    refreshPackModal: function (purchaseOrderLineId) {
+      var _self = this;
+      _self.purchaseOrderLineId = purchaseOrderLineId;
+
+      _self.getNeedPrintCount();
+      //根据采购订单明细Id查询PurchaseOrderLinePackDto
+      if (purchaseOrderLineId == undefined || purchaseOrderLineId == '') {
+        return;
+      }
+      $.ajax({
+        url:
+          Common.getApiURL(
+            'PurchaseOrderLineResource/queryPurchaseOrderLinePackDto?purchaseOrderLineId=',
+          ) + purchaseOrderLineId,
+        async: false,
+        type: 'get',
+        beforeSend: function (request) {
+          Common.addTokenToRequest(request);
+        },
+        success: function (data) {
+          console.log(data);
+          _self.packData = data;
+          _self.purchaseOrderLinePrint = data.purchaseOrderLinePrintDto;
+          $('#pack-modal').modal('show');
+          _self.showInventoryInstanceTable(purchaseOrderLineId);
+        },
+        error: function (XMLHttpRequest, textStatus, errorThrown) {
+          Common.processException(XMLHttpRequest, textStatus, errorThrown);
+        },
+      });
+    },
+    showInventoryInstanceTable: function (purchaseOrderLineId) {
+      var _self = this;
+      var url;
+      if (_self.buttonText == 0) {
+        url =
+          'InventoryInstanceResource/loadInventoryInstance/?purchaseOrderLineId=';
+      } else {
+        url =
+          'InventoryInstanceResource/notPrintedInventoryInstance/?purchaseOrderLineId=';
+      }
+      $.ajax({
+        url: Common.getApiURL(url) + purchaseOrderLineId,
+        async: false,
+        type: 'get',
+        beforeSend: function (request) {
+          Common.addTokenToRequest(request);
+        },
+        success: function (data) {
+          // //渲染InventoryInstanceDto表格数据
+          console.log(data);
+          _self.inventoryInstances = data;
+        },
+        error: function (XMLHttpRequest, textStatus, errorThrown) {
+          Common.processException(XMLHttpRequest, textStatus, errorThrown);
+        },
+      });
+    },
+    showOnePackModal: function () {
+      this.packOneQty = '';
+      $('#pack-modal').modal('hide');
+      $('#pack-modal-1').modal('show');
+    },
+    cancelOnePackModal: function () {
+      $('#pack-modal-1').modal('hide');
+      $('#pack-modal').modal('show');
+      $('body').css('overflow-y', 'hidden');
+      $('#pack-modal').css('overflow-y', 'auto');
+    },
+    // 保存一个包装
+    saveOnePack: function () {
+      var _self = this;
+      var inventoryInstanceDtos = [];
+      var quantity = _self.packOneQty;
+      var purchaseOrderLineId = _self.purchaseOrderLineId;
+      var aa = {
+        quantity: quantity,
+        purchaseOrderLineId: purchaseOrderLineId,
+      };
+      inventoryInstanceDtos.push(aa);
+      console.log(inventoryInstanceDtos);
+      // 保存InventoryInstances
+      $.ajax({
+        url: Common.getApiURL(
+          'InventoryInstanceResource/saveInventoryInstances',
+        ),
+        dataType: 'json',
+        type: 'post',
+        contentType: 'application/json',
+        data: JSON.stringify(inventoryInstanceDtos),
+        beforeSend: function (request) {
+          Common.addTokenToRequest(request);
+        },
+        success: function (jsonData) {
+          _self.refreshPackModal(purchaseOrderLineId);
+          _self.refreshPurchaseOrderLineTable();
+          $('#pack-modal-1').modal('hide');
+          $('#pack-modal').css('overflow-y', 'auto');
+        },
+        error: function (XMLHttpRequest, textStatus, errorThrown) {
+          Common.processException(XMLHttpRequest, textStatus, errorThrown);
+        },
+      });
+    },
+    showMorePackModal: function () {
+      this.packMoreCount = '';
+      this.packMoreQty = '';
+      $('#pack-modal-N').modal('show');
+      $('#pack-modal').modal('hide');
+    },
+    cancelMorePackModal: function () {
+      $('#pack-modal-N').modal('hide');
+      $('#pack-modal').modal('show');
+      $('body').css('overflow-y', 'hidden');
+      $('#pack-modal').css('overflow-y', 'auto');
+    },
+    // 保存多个包装
+    saveMorePack: function () {
+      var _self = this;
+      var inventoryInstanceDtos = [];
+      var count = _self.packMoreCount;
+      for (var i = 0; i < count; i++) {
+        var quantity = _self.packMoreQty;
+        var purchaseOrderLineId = _self.purchaseOrderLineId;
+        var aa = {
+          quantity: quantity,
+          purchaseOrderLineId: purchaseOrderLineId,
+        };
+        inventoryInstanceDtos.push(aa);
+      }
+      // 保存包装信息
+      $.ajax({
+        url: Common.getApiURL(
+          'InventoryInstanceResource/saveInventoryInstances',
+        ),
+        dataType: 'json',
+        type: 'post',
+        contentType: 'application/json',
+        data: JSON.stringify(inventoryInstanceDtos),
+        beforeSend: function (request) {
+          Common.addTokenToRequest(request);
+        },
+        success: function (jsonData) {
+          _self.refreshPackModal(purchaseOrderLineId);
+          _self.refreshPurchaseOrderLineTable();
+          $('#pack-modal-N').modal('hide');
+          $('#pack-modal').css('overflow-y', 'auto');
+        },
+        error: function (XMLHttpRequest, textStatus, errorThrown) {
+          Common.processException(XMLHttpRequest, textStatus, errorThrown);
+        },
+      });
+    },
+    packModalPrintStatus: function () {
+      var _self = this;
+      _self.refreshPackModal(_self.purchaseOrderLineId);
+    },
+    printPack: function (inventoryInstanceId) {
+      var _self = this;
+      $.ajax({
+        url: Common.getApiURL(
+          'InventoryInstancePrintResource/saveInventoryInstancesToInventoryInstancePrint',
+        ),
+        async: false,
+        type: 'post',
+        beforeSend: function (request) {
+          Common.addTokenToRequest(request);
+        },
+        data: {
+          inventoryInstanceId: inventoryInstanceId,
+        },
+        success: function (data) {
+          _self.refreshPackModal(_self.purchaseOrderLineId);
+          Notify.success('提示', '放入打印队列完成', false);
+        },
+        error: function (XMLHttpRequest, textStatus, errorThrown) {
+          Common.processException(XMLHttpRequest, textStatus, errorThrown);
+        },
+      });
+    },
+    deletePack: function (inventoryInstanceId) {
+      var _self = this;
+      $.ajax({
+        url:
+          Common.getApiURL(
+            'InventoryInstanceResource/deleteByInventoryInstanceId?inventoryInstanceId=',
+          ) + inventoryInstanceId,
+        async: false,
+        type: 'get',
+        beforeSend: function (request) {
+          Common.addTokenToRequest(request);
+        },
+        success: function (data) {
+          _self.refreshPackModal(_self.purchaseOrderLineId);
+          _self.refreshPurchaseOrderLineTable();
+        },
+        error: function (XMLHttpRequest, textStatus, errorThrown) {
+          Common.processException(XMLHttpRequest, textStatus, errorThrown);
+        },
+      });
+    },
+    printNotPrintedContent: function () {
+      var _self = this;
+      var data = [];
+      _self.inventoryInstances.forEach(function (item) {
+        data.push(item.id);
+      });
+      $.ajax({
+        url: Common.getApiURL(
+          'InventoryInstancePrintResource/saveNotPrintedInventoryInstancesToInventoryInstancePrint',
+        ),
+        async: true,
+        dataType: 'json',
+        type: 'post',
+        contentType: 'application/json; charset=utf-8',
+        data: JSON.stringify(data),
+        beforeSend: function (request) {
+          Common.addTokenToRequest(request);
+        },
+        success: function (data) {
+          _self.refreshPackModal(_self.purchaseOrderLineId);
+          _self.showPrintModal();
+        },
+        error: function (XMLHttpRequest, textStatus, errorThrown) {
+          //showPrintModal();
+          Common.processException(XMLHttpRequest, textStatus, errorThrown);
+        },
+      });
+    },
+    //点击打印未打印，显示打印模态框
+    showPrintModal: function () {
+      var _self = this;
+      _self.getNoPrintInventoryInstancePrint();
+      $('#pack-modal').modal('hide');
+      $('#print-modal').modal('show');
+      $('#print-modal').css('overflow-y', 'auto');
+      $('body').css('overflow-y', 'hidden');
+    },
+    showNeedPrint: function () {
+      var _self = this;
+      $.ajax({
+        url: Common.getApiURL(
+          'InventoryInstancePrintResource/queryInventoryInstancePrint',
+        ),
+        async: true,
+        dataType: 'json',
+        type: 'post',
+        data: {
+          printed: false,
+        },
+        beforeSend: function (request) {
+          Common.addTokenToRequest(request);
+        },
+        success: function (data) {
+          $('#print-modal').modal('show');
+          _self.notPrintInventoryInstances = data;
+        },
+        error: function (XMLHttpRequest, textStatus, errorThrown) {
+          Common.processException(XMLHttpRequest, textStatus, errorThrown);
+        },
+      });
+    },
+    getNoPrintInventoryInstancePrint: function () {
+      var _self = this;
+      var documentNo = _self.notPrintDocumentNo;
+      var inventoryName = _self.notPrintInventoryName;
+      var inventoryCode = _self.notPrintInventoryCode;
+      var inventoryType = _self.notPrintInventoryType;
+      $.ajax({
+        url: Common.getApiURL(
+          'InventoryInstancePrintResource/queryInventoryInstancePrint',
+        ),
+        async: true,
+        dataType: 'json',
+        type: 'post',
+        data: {
+          printed: false,
+          documentNo: documentNo,
+          inventoryName: inventoryName,
+          inventoryCode: inventoryCode,
+          inventoryType: inventoryType,
+        },
+        beforeSend: function (request) {
+          Common.addTokenToRequest(request);
+        },
+        success: function (data) {
+          _self.notPrintInventoryInstances = data;
+        },
+        error: function (XMLHttpRequest, textStatus, errorThrown) {
+          Common.processException(XMLHttpRequest, textStatus, errorThrown);
+        },
+      });
+    },
+
+    getPrintedInventoryInstancePrint: function () {
+      var _self = this;
+      var documentNo = _self.printedDocumentNo;
+      var inventoryName = _self.printedInventoryName;
+      var inventoryCode = _self.printedInventoryCode;
+      var inventoryType = _self.printedInventoryType;
+      $.ajax({
+        url: Common.getApiURL(
+          'InventoryInstancePrintResource/queryPrintedInventoryInstancePrint',
+        ),
+        async: false,
+        dataType: 'json',
+        type: 'post',
+        data: {
+          printed: true,
+          currentPage: _self.pagination.current_page,
+          pageSize: _self.pagination.per_page,
+          documentNo: documentNo,
+          inventoryName: inventoryName,
+          inventoryCode: inventoryCode,
+          inventoryType: inventoryType,
+        },
+        beforeSend: function (request) {
+          Common.addTokenToRequest(request);
+        },
+        success: function (data) {
+          _self.printedInventoryInstances = data.inventoryInstancePrintDtos;
+
+          _self.isShowPage = true;
+          _self.printedCheckAll = false;
+          _self.printedCheckboxModel.splice(
+            0,
+            _self.printedCheckboxModel.length,
+          );
+          console.log(data);
+          // 分页相关
+          _self.pagination.total = data.totalCount;
+          _self.pagination.last_page =
+            data.totalCount % _self.pagination.per_page == 0
+              ? data.totalCount / _self.pagination.per_page
+              : Math.floor(data.totalCount / _self.pagination.per_page) + 1;
+        },
+        error: function (XMLHttpRequest, textStatus, errorThrown) {
+          Common.processException(XMLHttpRequest, textStatus, errorThrown);
+        },
+      });
+    },
+    // 打印流程
+    printReport: function (buttonStatus) {
+      var _self = this;
+      var checkedNum;
+      var recordIds;
+      var id;
+      if (buttonStatus == 0) {
+        id = 283981;
+        checkedNum = _self.notPrintCheckboxModel.length;
+        recordIds = _self.notPrintCheckboxModel;
+      } else if (buttonStatus == 1) {
+        id = 283981;
+        checkedNum = _self.printedCheckboxModel.length;
+        recordIds = _self.printedCheckboxModel;
+      } else {
+        id = 284941;
+        checkedNum = _self.printedCheckboxModel.length;
+        recordIds = _self.printedCheckboxModel;
+      }
+      if (checkedNum == 0) {
+        Notify.notice('提示', '请选择打印内容', false);
+      } else {
+        $.ajax({
+          url: Common.getApiURL('ProcessReportResource/runProcessByIds/') + id,
+          async: true,
+          dataType: 'json',
+          type: 'post',
+          contentType: 'application/json; charset=utf-8',
+          data: JSON.stringify(recordIds),
+          beforeSend: function (request) {
+            Common.addTokenToRequest(request);
+          },
+          success: function (data) {
+            _self.refreshPurchaseOrderLineTable();
+            console.log(data);
+            _self.getNeedPrintCount();
+            $('#print-modal').modal('hide');
+            $('#pack-modal-download').modal('show');
+            //_self.showDownloadModal(data);
+            _self.reportResult = data.reportResults[0];
+          },
+          error: function (XMLHttpRequest, textStatus, errorThrown) {
+            Common.processException(XMLHttpRequest, textStatus, errorThrown);
+          },
+        });
+      }
+    },
+    //下载Excel
+    downloadExcel: function () {
+      var _self = this;
+      var url = '../..';
+      var excelDownLoadUrl = _self.reportResult.excelDownLoadUrl;
+      if (excelDownLoadUrl == undefined) {
+        Notify.error('提示', '下载失败', false);
+      } else {
+        var ExcelUrl = url + '/' + excelDownLoadUrl;
+        window.open(ExcelUrl);
+      }
+    },
+    // 下载Pdf
+    downloadPdf: function () {
+      var _self = this;
+      var url = '../..';
+      var pdfDownLoadUrl = _self.reportResult.pdfDownLoadUrl;
+      if (pdfDownLoadUrl == undefined) {
+        Notify.error('提示', '下载失败', false);
+      } else {
+        var pdfUrl = url + '/' + pdfDownLoadUrl;
+        window.open(pdfUrl);
+      }
+    },
+    // 未打印全选
+    notPrintCheckedAll: function () {
+      var _self = this;
+      if (event.currentTarget.checked) {
+        _self.notPrintInventoryInstances.forEach(function (item) {
+          _self.notPrintCheckboxModel.push(item.id);
+        });
+      } else {
+        _self.notPrintCheckboxModel.splice(
+          0,
+          this.notPrintCheckboxModel.length,
+        );
+      }
+    },
+    // 已打印全选
+    printedCheckedAll: function () {
+      var _self = this;
+      if (event.currentTarget.checked) {
+        _self.printedInventoryInstances.forEach(function (item) {
+          _self.printedCheckboxModel.push(item.id);
+        });
+      } else {
+        _self.printedCheckboxModel.splice(0, this.printedCheckboxModel.length);
+      }
+    },
+
+    // 打印队列中未打印数量
+    getNeedPrintCount: function () {
+      var _self = this;
+      $.ajax({
+        url: Common.getApiURL(
+          'InventoryInstancePrintResource/queryInventoryInstancePrintCount',
+        ),
+        async: true,
+        dataType: 'json',
+        type: 'post',
+        beforeSend: function (request) {
+          Common.addTokenToRequest(request);
+        },
+        success: function (data) {
+          _self.notPrintCount = data;
+        },
+        error: function (XMLHttpRequest, textStatus, errorThrown) {
+          Common.processException(XMLHttpRequest, textStatus, errorThrown);
+        },
+      });
+    },
+    changeQty: function (inventoryInstanceId, quantity) {
+      var _self = this;
+      _self.quantity = quantity;
+      _self.inventoryInstanceId = inventoryInstanceId;
+      $.ajax({
+        url: Common.getApiURL('InventoryInstanceResource/quantity'),
+        async: true,
+        dataType: 'json',
+        type: 'post',
+        data: {
+          inventoryInstanceId: inventoryInstanceId,
+          quantity: quantity,
+        },
+        beforeSend: function (request) {
+          Common.addTokenToRequest(request);
+        },
+        success: function (data) {
+          $('#pack-modal-quantity').modal('show');
+          $('#pack-modal').modal('hide');
+        },
+        error: function (XMLHttpRequest, textStatus, errorThrown) {
+          Common.processException(XMLHttpRequest, textStatus, errorThrown);
+        },
+      });
+    },
+    cancelChangeQty: function () {
+      $('#pack-modal-quantity').modal('hide');
+      $('#pack-modal').modal('show');
+      $('body').css('overflow-y', 'hidden');
+      $('#pack-modal').css('overflow-y', 'auto');
+    },
+    saveChangeQty: function () {
+      var _self = this;
+      var inventoryInstanceId = _self.inventoryInstanceId;
+      var quantity = _self.quantity;
+      if (quantity == '' || quantity < 0) {
+        Notify.error('输入有误', '数量填写不正确', false);
+        return;
+      }
+      $.ajax({
+        url: Common.getApiURL('InventoryInstanceResource/quantity'),
+        async: true,
+        dataType: 'json',
+        type: 'post',
+        data: {
+          inventoryInstanceId: inventoryInstanceId,
+          quantity: quantity,
+        },
+        beforeSend: function (request) {
+          Common.addTokenToRequest(request);
+        },
+        success: function (data) {
+          _self.refreshPackModal(_self.purchaseOrderLineId);
+          _self.refreshPurchaseOrderLineTable();
+          $('#pack-modal-quantity').modal('hide');
+          $('#pack-modal').modal('show');
+          $('body').css('overflow-y', 'hidden');
+          $('#pack-modal').css('overflow-y', 'auto');
+        },
+        error: function (XMLHttpRequest, textStatus, errorThrown) {
+          Common.processException(XMLHttpRequest, textStatus, errorThrown);
+        },
+      });
+    },
+    // 键盘回车事件
+    keydown: function () {
+      var _self = this;
+      document.onkeydown = function (event) {
+        var currentEvent = event || window.event || arguments[0];
+        if (currentEvent && currentEvent.keyCode == 13) {
+          currentEvent.preventDefault();
+          _self.refreshPurchaseOrderLineTable();
+        }
+      };
+    },
+  },
+};
+</script>
+
+<style scoped>
+.header {
+  padding: 16px;
+  background: #fff;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+}
+
+.form-container {
+  margin-bottom: 24px;
+}
+
+.pagination-wrapper {
+  margin-top: 24px;
+  text-align: right;
+}
+
+/* 表格样式优化 */
+:deep(.ant-table-thead > tr > th) {
+  background: #fafafa;
+  text-align: center;
+}
+</style>

src/pick/StockOutPrepareLineProjectReceivingAddress.vue

@@ -1,277 +1,148 @@
 <template>
-  <div>
-    <Navbar
-      title="项目事件收货地址维护"
-      is-go-back="true"
-    />
-    <div class="flex-container">
-      <!-- 保存收货地址 -->
-      <div class="flex-header">
-        <form class="form-horizontal">
-          <div class="form-group">
-            <label for="projectItems" class="col-sm-2 control-label">项目事件</label>
-            <div class="col-sm-10">
-              <v-select
-                id="projectItems"
-                v-model="projectItems"
-                :options="projectItemList"
-                :label="'name'"
-                @input="projectItemIdAssignment(projectItems.id)"
-              />
-            </div>
-          </div>
-          <div class="form-group">
-            <label for="toClient" class="col-sm-2 control-label">收货单位</label>
-            <div class="col-sm-10">
-              <input
-                id="toClient"
-                v-model="toClient"
-                autocomplete="off"
-                type="text"
-                class="form-control"
-                placeholder="收货单位"
-              />
-            </div>
-          </div>
-          <div class="form-group">
-            <label for="toAddress" class="col-sm-2 control-label">收货地址</label>
-            <div class="col-sm-10">
-              <input
-                id="toAddress"
-                v-model="toAddress"
-                autocomplete="off"
-                type="text"
-                class="form-control"
-                placeholder="收货地址"
-              />
-            </div>
-          </div>
-          <div class="form-group">
-            <label for="toContractUser" class="col-sm-2 control-label">收货联系人</label>
-            <div class="col-sm-10">
-              <input
-                id="toContractUser"
-                v-model="toContractUser"
-                autocomplete="off"
-                type="text"
-                class="form-control"
-                placeholder="收货联系人"
-              />
-            </div>
-          </div>
-          <div class="form-group">
-            <label for="toContractPhone" class="col-sm-2 control-label">收货联系电话</label>
-            <div class="col-sm-10">
-              <input
-                id="toContractPhone"
-                v-model="toContractPhone"
-                autocomplete="off"
-                type="text"
-                class="form-control"
-                placeholder="收货联系电话"
-              />
-            </div>
-          </div>
-          <div class="form-group">
-            <div class="col-sm-offset-2 col-sm-10">
-              <div class="checkbox">
-                <label>
-                  <input v-model="defaultAddress" autocomplete="off" type="checkbox" @click="isDefaultAddress()" /> 默认地址
-                </label>
-              </div>
-            </div>
-          </div>
-          <div class="form-group">
-            <div class="col-sm-offset-2 col-sm-10">
-              <button type="button" class="btn btn-default" @click="addBtn()">保存</button>
-            </div>
-          </div>
-        </form>
-      </div>
-      <!-- 查询收货地址 -->
-      <!-- <div class="flex-content table-responsive" style="margin-top: 130px;">
-      <table class="fixed-table table table-striped table-bordered text-nowrap">-->
-      <div class="flex-content table-responsive" style="margin-top: 130px;">
-        <table class="text-nowrap table-bordered table-striped table">
-          <thead>
-            <tr>
-              <th style="width:200px;">项目事件</th>
-              <th style="width:200px;">收货单位</th>
-              <th style="width:200px;">收货地址</th>
-              <th style="width:200px;">收货联系人</th>
-              <th style="width:200px;">收货联系电话</th>
-              <th style="width:200px;">操作</th>
-              <th style="width:200px;">&nbsp;</th>
-            </tr>
-          </thead>
-          <tbody>
-            <tr v-for="item in ProjectItemAddressDtos" :key="item.id">
-              <td>{{ item.projectItemName }}</td>
-              <td>{{ item.toClient }}</td>
-              <td>{{ item.toAddress }}</td>
-              <td>{{ item.toContractUser }}</td>
-              <td>{{ item.toContractPhone }}</td>
-              <td>
-                <button
-                  type="button"
-                  data-toggle="modal"
-                  data-target="#myModal"
-                  class="btn-link"
-                  @click="findAddress(item)"
-                >
-                  修改
-                </button>
-                <button type="button" class="btn-link" @click="deleteAddress(item.id)">删除</button>
-              </td>
-              <td>
-                <a v-if="item.defaultAddress" style="cursor:pointer;">默认地址</a>
-                <a v-else style="cursor:pointer;" @click="updateDefaultAddress(item.id)">设为默认地址</a>
-              </td>
-            </tr>
-          </tbody>
-        </table>
+  <a-layout>
+    <!-- 头部导航改造 -->
+    <a-layout-header class="header">
+      <Navbar title="项目事件收货地址维护" :is-go-back="true" />
+    </a-layout-header>
 
-        <!-- 模态框（Modal） -->
-        <div
-          id="myModal"
-          class="modal fade"
-          tabindex="-1"
-          role="dialog"
-          aria-labelledby="myModalLabel"
-          aria-hidden="true"
-        >
-          <div class="modal-dialog">
-            <div class="modal-content">
-              <div class="modal-header">
-                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
-                <h4 id="myModalLabel" class="modal-title">修改项目事件收货地址</h4>
-              </div>
-              <div class="modal-body">
-                <form class="form-horizontal">
-                  <div class="form-group">
-                    <label for="projectItemList" class="col-sm-2 control-label">项目事件</label>
-                    <div class="col-sm-10">
-                      <v-select
-                        id="projectItemList"
-                        v-model="projectItemDto"
-                        :options="projectItemList"
-                        :label="'name'"
-                      />
-                    </div>
-                  </div>
-                  <div class="form-group">
-                    <label for="toClient" class="col-sm-2 control-label">收货单位</label>
-                    <div class="col-sm-10">
-                      <input
-                        id="toClient"
-                        v-model="ProjectItemAddressDto.toClient"
-                        autocomplete="off"
-                        type="text"
-                        class="form-control"
-                        placeholder="收货单位"
-                      />
-                    </div>
-                  </div>
-                  <div class="form-group">
-                    <label for="toAddress" class="col-sm-2 control-label">收货地址</label>
-                    <div class="col-sm-10">
-                      <input
-                        id="toAddress"
-                        v-model="ProjectItemAddressDto.toAddress"
-                        autocomplete="off"
-                        type="text"
-                        class="form-control"
-                        placeholder="收货地址"
-                      />
-                    </div>
-                  </div>
-                  <div class="form-group">
-                    <label for="toContractUser" class="col-sm-2 control-label">收货联系人</label>
-                    <div class="col-sm-10">
-                      <input
-                        id="toContractUser"
-                        v-model="ProjectItemAddressDto.toContractPhone"
-                        autocomplete="off"
-                        type="text"
-                        class="form-control"
-                        placeholder="收货联系人"
-                      />
-                    </div>
-                  </div>
-                  <div class="form-group">
-                    <label for="toContractPhone" class="col-sm-2 control-label">收货联系电话</label>
-                    <div class="col-sm-10">
-                      <input
-                        id="toContractPhone"
-                        v-model="ProjectItemAddressDto.toContractUser"
-                        autocomplete="off"
-                        type="text"
-                        class="form-control"
-                        placeholder="收货联系电话"
-                      />
-                    </div>
-                  </div>
-                  <div class="form-group">
-                    <div class="col-sm-offset-2 col-sm-10">
-                      <div class="checkbox">
-                        <label>
-                          <input
-                            v-model="ProjectItemAddressDto.defaultAddress"
-                            autocomplete="off"
-                            type="checkbox"
-                            @click="isDefault()"
-                          /> 默认地址
-                        </label>
-                      </div>
-                    </div>
-                  </div>
-                </form>
-              </div>
-              <div class="modal-footer">
-                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
-                <button type="button" class="btn btn-primary" data-dismiss="modal" @click="updataByIdAndTOAddress()">保存</button>
-              </div>
-            </div>
-            <!-- /.modal-content -->
-          </div>
-          <!-- /.modal -->
-        </div>
-        <!-- 模态框 -->
-      </div>
-      <div class="flex-footer">
-        <div class="pull-left">
-          <span>第{{ (pagination.current_page-1)*pagination.per_page+1 }}-{{ pagination.current_page*pagination.per_page }}条,共计{{ pagination.total }}条,每页显示</span>
-          <PageSizeSelect @page-size-changed="gridSizeSelect" />
-          <span>条</span>
-        </div>
-        <div class="pull-right">
-          <VueBootstrapPagination
-            :pagination="pagination"
-            :callback="queryToAddress"
+    <a-layout-content class="content">
+      <!-- 表单区域改造 -->
+      <a-form :model="form" layout="vertical" class="form-container">
+        <a-form-item label="项目事件">
+          <a-select
+            v-model:value="selectedProjectItemId" 
+            :options="projectItemList"
+            show-search 
+            allow-clear
+            @change="handleProjectChange"
           />
-        </div>
+        </a-form-item>
+
+        <a-form-item label="收货单位">
+          <a-input v-model:value="toClient" placeholder="请输入收货单位" />
+        </a-form-item>
+
+        <a-form-item label="收货地址">
+          <a-input v-model:value="toAddress" placeholder="请输入收货地址" />
+        </a-form-item>
+
+        <a-form-item label="收货联系人">
+          <a-input v-model:value="toContractUser" placeholder="请输入联系人" />
+        </a-form-item>
+
+        <a-form-item label="联系电话">
+          <a-input v-model:value="toContractPhone" placeholder="请输入联系电话" />
+        </a-form-item>
+
+        <a-form-item>
+          <a-checkbox v-model:checked="defaultAddress" @change="isDefaultAddress">
+            设为默认地址
+          </a-checkbox>
+        </a-form-item>
+
+        <a-form-item>
+          <a-button type="primary" @click="addBtn">保存地址</a-button>
+        </a-form-item>
+      </a-form>
+
+      <!-- 表格区域改造 -->
+      <a-table
+        :columns="columns"
+        :data-source="ProjectItemAddressDtos"
+        :scroll="{ x: 1200 }"
+        :pagination="false"
+        row-key="id"
+        bordered
+      >
+        <template #bodyCell="{ column, record }">
+          <template v-if="column.dataIndex === 'operation'">
+            <a-space>
+              <a-button type="link" @click="findAddress(record)">编辑</a-button>
+              <a-popconfirm
+                title="确认删除该地址？"
+                @confirm="deleteAddress(record.id)"
+              >
+                <a-button type="link" danger>删除</a-button>
+              </a-popconfirm>
+            </a-space>
+          </template>
+          <template v-if="column.dataIndex === 'defaultAddress'">
+            <a-tag v-if="record.defaultAddress" color="green">默认地址</a-tag>
+            <a-button v-else type="link" @click="updateDefaultAddress(record.id)">
+              设为默认
+            </a-button>
+          </template>
+        </template>
+      </a-table>
+
+      <!-- 分页改造 -->
+      <div class="pagination-wrapper">
+        <a-pagination
+          v-model:current="pagination.current_page"
+          :total="pagination.total"
+          :page-size="pagination.per_page"
+          show-less-items
+          @change="queryToAddress"
+        />
       </div>
-    </div>
-  </div>
+
+      <!-- 编辑模态框改造 -->
+      <a-modal
+        v-model:visible="modalVisible"
+        title="编辑收货地址"
+        width="600px"
+        :destroy-on-close="true"
+      >
+        <a-form layout="vertical">
+          <a-form-item label="项目事件">
+            <a-select
+              v-model:value="projectItemDtoId"
+              :options="projectItemList"
+              show-search
+              option-filter-prop="label"
+            />
+          </a-form-item>
+          <a-form-item label="收货单位">
+            <a-input v-model:value="ProjectItemAddressDto.toClient" />
+          </a-form-item>
+          <a-form-item label="收货地址">
+            <a-input v-model:value="ProjectItemAddressDto.toAddress" />
+          </a-form-item>
+          <a-form-item label="联系人">
+            <a-input v-model:value="ProjectItemAddressDto.toContractUser" />
+          </a-form-item>
+          <a-form-item label="联系电话">
+            <a-input v-model:value="ProjectItemAddressDto.toContractPhone" />
+          </a-form-item>
+          <a-form-item>
+            <a-checkbox v-model:checked="ProjectItemAddressDto.defaultAddress">
+              默认地址
+            </a-checkbox>
+          </a-form-item>
+        </a-form>
+
+        <template #footer>
+          <a-space>
+            <a-button @click="modalVisible = false">取消</a-button>
+            <a-button type="primary" @click="updataByIdAndTOAddress">
+              保存修改
+            </a-button>
+          </a-space>
+        </template>
+      </a-modal>
+    </a-layout-content>
+  </a-layout>
 </template>
 
+
+
 <script>
 import ProjectItemResource from '../api/common/ProjectItemResource.js';
 import Common from '../common/Common.js';
 import ProjectItemAddressResource from '../api/wms/ProjectItemAddressResource.js';
 
-
-
-
-import vSelect from 'vue-select';
-import 'vue-select/dist/vue-select.css';
-
 export default {
-  components: {
-    
-    
-    'v-select': vSelect,
-    
+  components: {   
     
   },
   data: function() {
@@ -287,8 +158,8 @@ export default {
       projectItemList: [],
       ProjectItemAddressDtos: [],
       ProjectItemAddressDto: {},
-      projectItemDto: [],
-      projectItems: {},
+      projectItemDtoId: null,
+      selectedProjectItemId: null,
       pagination: {
         total: 0, //总页数
         per_page: 20, // 每页大小
@@ -296,6 +167,16 @@ export default {
         last_page: 10, // 最后一页编号
       },
       projectId: undefined,
+      columns: [
+        { title: '项目事件', dataIndex: 'projectItemName', width: 200 },
+        { title: '收货单位', dataIndex: 'toClient', width: 200 },
+        { title: '收货地址', dataIndex: 'toAddress', width: 200 },
+        { title: '收货联系人', dataIndex: 'toContractUser', width: 150 },
+        { title: '联系电话', dataIndex: 'toContractPhone', width: 150 },
+        { title: '操作', dataIndex: 'operation', width: 150 },
+        { title: '默认地址', dataIndex: 'defaultAddress', width: 150 },
+      ],
+      modalVisible: false,
     };
   },
   created: function() {},
@@ -310,13 +191,9 @@ export default {
   },
 
   methods: {
-    /**
-     * 下拉框给projectItemId赋值
-     */
-    projectItemIdAssignment: function(id) {
-      var _self = this;
-      _self.projectItemId = id;
-      _self.queryToAddress(id);
+    handleProjectChange(value) {
+      this.selectedProjectItemId = value;
+      this.queryToAddress(value);
     },
     /**
      * 保存地址
@@ -343,7 +220,7 @@ export default {
         return;
       }
       ProjectItemAddressResource.addReceivingAddress(
-        (_self.projectItemId = _self.projectItems.id),
+        (_self.projectItemId = _self.selectedProjectItemId),
         _self.toClient,
         _self.toAddress,
         _self.toContractUser,
@@ -442,18 +319,15 @@ export default {
     findAddress: function(item) {
       var _self = this;
       _self.ProjectItemAddressDto = item;
-      _self.projectItemDto = {
-        id: _self.ProjectItemAddressDto.projectItemId,
-        name: _self.ProjectItemAddressDto.projectItemName,
-      };
+      _self.projectItemDtoId = _self.ProjectItemAddressDto.projectItemId;
+      _self.modalVisible = true;
     },
     /**
      * 修改项目事件收货信息
      */
     updataByIdAndTOAddress: function() {
       var _self = this;
-      _self.ProjectItemAddressDto.projectItemId = _self.projectItemDto.id;
-      _self.ProjectItemAddressDto.projectItemName = _self.projectItemDto.name;
+      _self.ProjectItemAddressDto.projectItemId = _self.projectItemDtoId;
 
       ProjectItemAddressResource.updataByIdAndTOAddress(
         _self.ProjectItemAddressDto,
@@ -507,11 +381,10 @@ export default {
           if(successData.errorCode == 0) {
             _self.projectItemList = successData.datas;
             for (var i = 0; i < _self.projectItemList.length; i++) {
+              _self.projectItemList[i].label = _self.projectItemList[i].name;
+              _self.projectItemList[i].value = _self.projectItemList[i].id;
               if (projectItemId == _self.projectItemList[i].id) {
-                _self.projectItems = {
-                  id: _self.projectItemList[i].id,
-                  name: _self.projectItemList[i].name,
-                };
+                _self.selectedProjectItemId = _self.projectItemList[i].id;
               }
             }
           } else {
@@ -533,66 +406,28 @@ export default {
 };
 </script>
 <style scoped>
-.form-inline .form-group label {
-  width: 80px;
-  text-align: right;
-  padding-right: 5px;
+.header {
+  background: #fff;
+  padding: 0;
+  height: 64px;
 }
 
-.form-inline .form-group input,
-.form-inline .form-group select {
-  width: 200px;
+.content {
+  padding: 24px;
+  background: #fff;
 }
-</style>
 
-<style scoped>
-.flex-container {
-  display: flex;
-  /* 垂直*/
-  flex-direction: column;
-  width: 100%;
-  /*视口被均分为100单位的vh 占据整个窗口，扣掉顶部topNav的距离后，计算得到container的高度*/
-  height: calc(100vh - 30px);
+.form-container {
+  margin-bottom: 24px;
+  padding: 24px;
+  background: #fafafa;
+  border-radius: 4px;
 }
 
-.flex-header {
-  height: 200px;
-  /*放大缩小比例为0 */
-  flex: 0 0 100px;
-}
-
-.flex-footer {
-  margin-top: 0.8em;
-  height: 35px;
-  /*放大缩小比例为0 */
-  flex: 0 0 35px;
-}
-
-.flex-content {
-  flex: 1;
-  overflow: scroll;
-  width: 100%;
-  height: 0;
-}
-
-.image {
-  width: 40px;
-  height: 40px;
-}
-
-.modal-img-box {
-  width: 100%;
-  text-align: center;
-  overflow: auto;
-}
-
-.m-img {
-  width: 100%;
-}
-.table th,
-.table td {
-  text-align: center;
-  vertical-align: middle !important;
+.pagination-wrapper {
+  margin-top: 24px;
+  text-align: right;
 }
-</style>
 
+/* 删除所有bootstrap相关样式 */
+</style>

src/pick/StockOutPrepareLineProjectShippingAddress.vue

@@ -1,254 +1,143 @@
 <template>
-  <div>
-    <Navbar
-      title="项目事件发货地址维护"
-      is-go-back="true"
-    />
-    <div class="flex-container">
-      <!-- 保存发货地址 -->
-      <div class="flex-header">
-        <form class="form-horizontal">
-          <div class="form-group">
-            <label for="projectItems" class="col-sm-2 control-label">项目事件</label>
-            <div class="col-sm-10">
-              <v-select
-                id="projectItems"
-                v-model="projectItems"
-                :options="projectItemList"
-                :label="'name'"
-                @input="projectItemIdAssignment(projectItems.id)"
-              />
-            </div>
-          </div>
-          <div class="form-group">
-            <label for="toClient" class="col-sm-2 control-label">发货单位</label>
-            <div class="col-sm-10">
-              <input
-                id="fromClient"
-                v-model="fromClient"
-                autocomplete="off"
-                type="text"
-                class="form-control"
-                placeholder="发货单位"
-              />
-            </div>
-          </div>
-          <div class="form-group">
-            <label for="toAddress" class="col-sm-2 control-label">发货地址</label>
-            <div class="col-sm-10">
-              <input
-                id="fromAddress"
-                v-model="fromAddress"
-                autocomplete="off"
-                type="text"
-                class="form-control"
-                placeholder="发货地址"
-              />
-            </div>
-          </div>
-          <div class="form-group">
-            <label for="toContractUser" class="col-sm-2 control-label">发货联系人</label>
-            <div class="col-sm-10">
-              <input
-                id="fromContractUser"
-                v-model="fromContractUser"
-                autocomplete="off"
-                type="text"
-                class="form-control"
-                placeholder="发货联系人"
-              />
-            </div>
-          </div>
-          <div class="form-group">
-            <label for="toContractPhone" class="col-sm-2 control-label">发货联系电话</label>
-            <div class="col-sm-10">
-              <input
-                id="fromContractPhone"
-                v-model="fromContractPhone"
-                autocomplete="off"
-                type="text"
-                class="form-control"
-                placeholder="发货联系电话"
-              />
-            </div>
-          </div>
-          <div class="form-group">
-            <div class="col-sm-offset-2 col-sm-10">
-              <div class="checkbox">
-                <label>
-                  <input v-model="defaultAddress" autocomplete="off" type="checkbox" @click="isDefaultAddress()" /> 默认地址
-                </label>
-              </div>
-            </div>
-          </div>
-          <div class="form-group">
-            <div class="col-sm-offset-2 col-sm-10">
-              <button type="button" class="btn btn-default" @click="addBtn()">保存</button>
-            </div>
-          </div>
-        </form>
-      </div>
+  <a-layout>
+    <a-layout-header class="header">
+      <Navbar title="项目事件发货地址维护" :is-go-back="true" />
+    </a-layout-header>
 
-      <!-- 查询收货地址 -->
-      <div class="flex-content table-responsive" style="margin-top: 130px;">
-        <table class="text-nowrap table-bordered table-striped table">
-          <thead>
-            <tr>
-              <th style="width:200px;">项目事件</th>
-              <th style="width:200px;">发货单位</th>
-              <th style="width:200px;">发货地址</th>
-              <th style="width:200px;">发货联系人</th>
-              <th style="width:200px;">发货联系电话</th>
-              <th style="width:200px;">操作</th>
-              <th style="width:200px;">&nbsp;</th>
-            </tr>
-          </thead>
-          <tbody>
-            <tr v-for="item in ProjectItemAddressDtos" :key="item.id">
-              <td>{{ item.projectItemName }}</td>
-              <td>{{ item.fromClient }}</td>
-              <td>{{ item.fromAddress }}</td>
-              <td>{{ item.fromContractUser }}</td>
-              <td>{{ item.fromContractPhone }}</td>
-              <td>
-                <button
-                  type="button"
-                  data-toggle="modal"
-                  data-target="#myModal"
-                  class="btn-link"
-                  @click="findAddress(item)"
-                >
-                  修改
-                </button>
-                <button type="button" class="btn-link" @click="deleteAddress(item.id)">删除</button>
-              </td>
-              <td>
-                <a v-if="item.defaultAddress">默认地址</a>
-                <a v-else style="cursor:pointer;" @click="updateDefaultAddress(item.id)">设为默认地址</a>
-              </td>
-            </tr>
-          </tbody>
-        </table>
-        <!-- 模态框（Modal） -->
-        <div
-          id="myModal"
-          class="modal fade"
-          tabindex="-1"
-          role="dialog"
-          aria-labelledby="myModalLabel"
-          aria-hidden="true"
-        >
-          <div class="modal-dialog">
-            <div class="modal-content">
-              <div class="modal-header">
-                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
-                <h4 id="myModalLabel" class="modal-title">修改项目事件发货地址</h4>
-              </div>
-              <div class="modal-body">
-                <form class="form-horizontal">
-                  <div class="form-group">
-                    <label for="projectItemList" class="col-sm-2 control-label">项目事件</label>
-                    <div class="col-sm-10">
-                      <v-select
-                        id="projectItemList"
-                        v-model="projectItemDto"
-                        :options="projectItemList"
-                        :label="'name'"
-                      />
-                    </div>
-                  </div>
-                  <div class="form-group">
-                    <label for="toClient" class="col-sm-2 control-label">发货单位</label>
-                    <div class="col-sm-10">
-                      <input
-                        id="fromClient"
-                        v-model="ProjectItemAddressDto.fromClient"
-                        autocomplete="off"
-                        type="text"
-                        class="form-control"
-                        placeholder="发货单位"
-                      />
-                    </div>
-                  </div>
-                  <div class="form-group">
-                    <label for="toAddress" class="col-sm-2 control-label">发货地址</label>
-                    <div class="col-sm-10">
-                      <input
-                        id="fromAddress"
-                        v-model="ProjectItemAddressDto.fromAddress"
-                        autocomplete="off"
-                        type="text"
-                        class="form-control"
-                        placeholder="发货地址"
-                      />
-                    </div>
-                  </div>
-                  <div class="form-group">
-                    <label for="toContractUser" class="col-sm-2 control-label">发货联系人</label>
-                    <div class="col-sm-10">
-                      <input
-                        id="fromContractUser"
-                        v-model="ProjectItemAddressDto.fromContractPhone"
-                        autocomplete="off"
-                        type="text"
-                        class="form-control"
-                        placeholder="发货联系人"
-                      />
-                    </div>
-                  </div>
-                  <div class="form-group">
-                    <label for="toContractPhone" class="col-sm-2 control-label">发货联系电话</label>
-                    <div class="col-sm-10">
-                      <input
-                        id="fromContractPhone"
-                        v-model="ProjectItemAddressDto.fromContractUser"
-                        autocomplete="off"
-                        type="text"
-                        class="form-control"
-                        placeholder="发货联系电话"
-                      />
-                    </div>
-                  </div>
-                  <div class="form-group">
-                    <div class="col-sm-offset-2 col-sm-10">
-                      <div class="checkbox">
-                        <label>
-                          <input
-                            v-model="ProjectItemAddressDto.defaultAddress"
-                            autocomplete="off"
-                            type="checkbox"
-                            @click="isDefault()"
-                          /> 默认地址
-                        </label>
-                      </div>
-                    </div>
-                  </div>
-                </form>
-              </div>
-              <div class="modal-footer">
-                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
-                <button type="button" class="btn btn-primary" data-dismiss="modal" @click="updataByIdAndFRAddress()">保存</button>
-              </div>
-            </div>
-            <!-- /.modal-content -->
-          </div>
-          <!-- /.modal -->
-        </div>
-        <!-- 模态框 -->
-      </div>
-      <div class="flex-footer">
-        <div class="pull-left">
-          <span>第{{ (pagination.current_page-1)*pagination.per_page+1 }}-{{ pagination.current_page*pagination.per_page }}条,共计{{ pagination.total }}条,每页显示</span>
-        </div>
-        <div class="pull-right">
-          <VueBootstrapPagination
-            :pagination="pagination"
-            :callback="queryToAddress"
+    <a-layout-content class="content">
+      <!-- 表单区域 -->
+      <a-form :model="form" layout="vertical" class="form-container">
+        <a-form-item label="项目事件">
+          <a-select
+            v-model:value="selectedProjectItemId"
+            :options="projectItemList"
+            show-search
+            allow-clear
+            field-names="{ label: 'name', value: 'id' }"
+            @change="handleProjectChange"
           />
-        </div>
+        </a-form-item>
+
+        <!-- 发货信息表单 -->
+        <a-form-item label="发货单位">
+          <a-input v-model:value="fromClient" placeholder="请输入发货单位" />
+        </a-form-item>
+
+        <a-form-item label="发货地址">
+          <a-input v-model:value="fromAddress" placeholder="请输入发货地址" />
+        </a-form-item>
+
+        <a-form-item label="发货联系人">
+          <a-input v-model:value="fromContractUser" placeholder="请输入联系人" />
+        </a-form-item>
+
+        <a-form-item label="联系电话">
+          <a-input v-model:value="fromContractPhone" placeholder="请输入联系电话" />
+        </a-form-item>
+
+        <a-form-item>
+          <a-checkbox v-model:checked="defaultAddress" @change="isDefaultAddress">
+            设为默认地址
+          </a-checkbox>
+        </a-form-item>
+
+        <a-form-item>
+          <a-button type="primary" @click="addBtn">保存</a-button>
+        </a-form-item>
+      </a-form>
+
+      <!-- 表格区域 -->
+      <a-table
+        :columns="columns"
+        :data-source="projectItemAddressDtos"
+        :scroll="{ x: 1200 }"
+        :pagination="false"
+        row-key="id"
+        bordered
+      >
+        <template #bodyCell="{ column, record }">
+          <template v-if="column.dataIndex === 'operation'">
+            <a-space>
+              <a-button type="link" @click="findAddress(record)">编辑</a-button>
+              <a-popconfirm
+                title="确认删除该地址？"
+                @confirm="deleteAddress(record.id)"
+              >
+                <a-button type="link" danger>删除</a-button>
+              </a-popconfirm>
+            </a-space>
+          </template>
+          <template v-if="column.dataIndex === 'defaultAddress'">
+            <a-tag v-if="record.defaultAddress" color="green">默认地址</a-tag>
+            <a-button v-else type="link" @click="updateDefaultAddress(record.id)">
+              设为默认
+            </a-button>
+          </template>
+        </template>
+      </a-table>
+
+      <!-- 分页 -->
+      <div class="pagination-wrapper">
+        <a-pagination
+          v-model:current="pagination.current_page"
+          :total="pagination.total"
+          :page-size="pagination.per_page"
+          show-less-items
+          @change="queryFRAddress"
+        />
       </div>
-    </div>
-  </div>
+
+      <!-- 编辑模态框 -->
+      <a-modal
+        v-model:visible="modalVisible"
+        title="修改发货地址"
+        width="600px"
+        :destroy-on-close="true"
+      >
+        <a-form layout="vertical">
+          <a-form-item label="项目事件">
+            <a-select
+              v-model:value="projectItemAddressDto.projectItemId"
+              :options="projectItemList"
+              field-names="{ label: 'name', value: 'id' }"
+              show-search
+              option-filter-prop="label"
+            />
+          </a-form-item>
+          <a-form-item label="发货单位">
+            <a-input v-model:value="projectItemAddressDto.fromClient" placeholder="发货单位" />
+          </a-form-item>
+
+          <a-form-item label="发货地址">
+            <a-input v-model:value="projectItemAddressDto.fromAddress" placeholder="发货地址" />
+          </a-form-item>
+
+          <a-form-item label="发货联系人">
+            <a-input v-model:value="projectItemAddressDto.fromContractUser" placeholder="发货联系人" />
+          </a-form-item>
+
+          <a-form-item label="联系电话">
+            <a-input v-model:value="projectItemAddressDto.fromContractPhone" placeholder="联系电话" />
+          </a-form-item>
+
+          <a-form-item>
+            <a-checkbox 
+              v-model:checked="projectItemAddressDto.defaultAddress"
+              @change="isDefault"
+            >
+              默认地址
+            </a-checkbox>
+          </a-form-item>
+        </a-form>
+        <template #footer>
+          <a-space>
+            <a-button @click="modalVisible = false">取消</a-button>
+            <a-button type="primary" @click="updataByIdAndFRAddress">保存</a-button>
+          </a-space>
+        </template>
+      </a-modal>
+    </a-layout-content>
+  </a-layout>
 </template>
 
 <script>
@@ -256,35 +145,36 @@ import ProjectItemResource from '../api/common/ProjectItemResource.js';
 import Common from '../common/Common.js';
 import ProjectItemAddressResource from '../api/wms/ProjectItemAddressResource.js';
 
-
-
-
-import vSelect from 'vue-select';
-import 'vue-select/dist/vue-select.css';
-
 export default {
   components: {
     
     
-    'v-select': vSelect,
-    
-    
   },
   data: function() {
     this.Common = Common;
     return {
+      columns: [
+        { title: '项目事件', dataIndex: 'projectItemName', width: 200 },
+        { title: '发货单位', dataIndex: 'fromClient', width: 200 },
+        { title: '发货地址', dataIndex: 'fromAddress', width: 200 },
+        { title: '发货联系人', dataIndex: 'fromContractUser', width: 200 },
+        { title: '联系电话', dataIndex: 'fromContractPhone', width: 200 },
+        { title: '操作', dataIndex: 'operation', fixed: 'right', width: 150 },
+        { title: '默认地址', dataIndex: 'defaultAddress', width: 200 },
+      ],
+      modalVisible: false,
       projectItemId: undefined,
       fromClient: undefined,
       fromAddress: undefined,
       fromContractUser: undefined,
       fromContractPhone: undefined,
       defaultAddress: false,
-      ProjectItemAddressDtos: [],
+      projectItemAddressDtos: [],
       name: '',
       projectItemList: [],
-      ProjectItemAddressDto: {},
-      projectItemDto: [],
-      projectItems: {},
+      projectItemAddressDto: {},
+      projectItemDtoId: null,
+      selectedProjectItemId: null,
       pagination: {
         total: 0, //总页数
         per_page: 20, // 每页大小
@@ -304,13 +194,9 @@ export default {
   },
 
   methods: {
-    /**
-     * 下拉框给projectItemId赋值
-     */
-    projectItemIdAssignment: function(id) {
-      var _self = this;
-      _self.projectItemId = id;
-      _self.queryFRAddress(id);
+    handleProjectChange(value) {
+      this.selectedProjectItemId = value;
+      this.queryFRAddress(value);
     },
     /**
      * 保存地址
@@ -386,7 +272,7 @@ export default {
       ).then(
         successData => {
           if(successData.errorCode == 0) {
-            _self.ProjectItemAddressDtos = successData.datas;
+            _self.projectItemAddressDtos = successData.datas;
             _self.pagination.total = successData.total;
             _self.pagination.last_page = Math.ceil(
               successData.total / successData.length,
@@ -430,22 +316,18 @@ export default {
      */
     findAddress: function(item) {
       var _self = this;
-      _self.ProjectItemAddressDto = item;
-      _self.projectItemDto = {
-        id: _self.ProjectItemAddressDto.projectItemId,
-        name: _self.ProjectItemAddressDto.projectItemName,
-      };
+      _self.projectItemAddressDto = item;
+      _self.projectItemDtoId = _self.projectItemAddressDto.projectItemId;
+      _self.modalVisible = true;
     },
     /**
      * 修改项目事件发货信息
      */
     updataByIdAndFRAddress: function() {
       var _self = this;
-      _self.ProjectItemAddressDto.projectItemId = _self.projectItemDto.id;
-      _self.ProjectItemAddressDto.projectItemName = _self.projectItemDto.name;
 
       ProjectItemAddressResource.updataByIdAndFRAddress(
-        _self.ProjectItemAddressDto,
+        _self.projectItemAddressDto,
       ).then(
         successData => {
           if(successData.errorCode == 0) {
@@ -482,7 +364,7 @@ export default {
      */
     isDefault: function() {
       var _self = this;
-      _self.ProjectItemAddressDto.defaultAddress = !_self.ProjectItemAddressDto
+      _self.projectItemAddressDto.defaultAddress = !_self.projectItemAddressDto
         .defaultAddress;
     },
     /**
@@ -496,11 +378,10 @@ export default {
           if(successData.errorCode == 0) {
             _self.projectItemList = successData.datas;
             for (var i = 0; i < _self.projectItemList.length; i++) {
+              _self.projectItemList[i].label = _self.projectItemList[i].name;
+              _self.projectItemList[i].value = _self.projectItemList[i].id;
               if (projectItemId == _self.projectItemList[i].id) {
-                _self.projectItems = {
-                  id: _self.projectItemList[i].id,
-                  name: _self.projectItemList[i].name,
-                };
+                _self.selectedProjectItemId = _self.projectItemList[i].id;
               }
             }
           } else {
@@ -521,69 +402,38 @@ export default {
   },
 };
 </script>
-
 <style scoped>
-.form-inline .form-group label {
-  width: 80px;
-  text-align: right;
-  padding-right: 5px;
+/* 清除所有bootstrap相关样式 */
+.header {
+  background: #fff;
+  padding: 0;
+  height: 64px;
 }
 
-.form-inline .form-group input,
-.form-inline .form-group select {
-  width: 200px;
+.content {
+  padding: 24px;
+  background: #fff;
 }
-</style>
 
-<style scoped>
-.flex-container {
-  display: flex;
-  /* 垂直*/
-  flex-direction: column;
-  width: 100%;
-  /*视口被均分为100单位的vh 占据整个窗口，扣掉顶部topNav的距离后，计算得到container的高度*/
-  height: calc(100vh - 30px);
+.form-container {
+  margin-bottom: 24px;
+  padding: 24px;
+  background: #fafafa;
+  border-radius: 4px;
 }
 
-.flex-header {
-  height: 200px;
-  /*放大缩小比例为0 */
-  flex: 0 0 100px;
-}
-
-.flex-footer {
-  margin-top: 0.8em;
-  height: 35px;
-  /*放大缩小比例为0 */
-  flex: 0 0 35px;
-}
-
-.flex-content {
-  flex: 1;
-  overflow: scroll;
-  width: 100%;
-  height: 0;
-}
-
-.image {
-  width: 40px;
-  height: 40px;
+.pagination-wrapper {
+  margin-top: 24px;
+  text-align: right;
 }
 
-.modal-img-box {
-  width: 100%;
+/* 表格样式优化 */
+:deep(.ant-table-thead > tr > th) {
+  background: #fafafa;
   text-align: center;
-  overflow: auto;
-}
-
-.m-img {
-  width: 100%;
 }
 
-.table th,
-.table td {
+:deep(.ant-table-tbody > tr > td) {
   text-align: center;
-  vertical-align: middle !important;
 }
-</style>
-
+</style>

src/router/index.js

@@ -5,6 +5,7 @@ const GeneratePosition = () => import(/* webpackChunkName: "component-4" */ '../
 const InventoryPrint = () => import(/* webpackChunkName: "component-5" */ '../components/InventoryPrint.vue');
 const InventoryPrintScan = () => import(/* webpackChunkName: "component-6" */ '../components/InventoryPrintScan.vue');
 const StockOutPrepareLine = () => import(/* webpackChunkName: "component-7" */ '../pick/StockOutPrepareLine.vue');
+const StockOutPrepareLine1 = () => import(/* webpackChunkName: "component-7" */ '../pick/StockOutPrepareLine1.vue');
 const PickingCar = () => import(/* webpackChunkName: "component-8" */ '../pick/PickingCar.vue');
 const StockOutPrepareApproved = () => import(/* webpackChunkName: "component-9" */ '../pick/StockOutPrepareApproved.vue');
 const StockOutPrepateTemplate = () => import(/* webpackChunkName: "component-10" */ '../pick/StockOutPrepateTemplate.vue');
@@ -125,6 +126,19 @@ const routes = [
       ],
     },
   },
+  // 领用界面
+  {
+    path: '/wms/stockOutPrepareLine1', component: StockOutPrepareLine1,
+    meta: {
+      'loginRequired': true,
+      'functionAccessArray': [
+        {
+          'functionNo': '20220328_095537',
+          'itemNo': '5',
+        },
+      ],
+    },
+  },
 
   // 领料车界面
   {

webpack.dev.js

@@ -118,6 +118,10 @@ module.exports = WebpackMerge.merge(baseConfig, {
         secure:true,
       },
     },
+    client: {
+      logging: 'none',
+      overlay: false,
+    },
   },
 
   devtool: 'source-map',