| <script setup>  | 
| import { ref, computed, reactive } from 'vue';  | 
| import { useRouter } from "vue-router";  | 
| import { get, post, postBlob } from '@/utils/request.js'  | 
| import { message, Modal } from 'ant-design-vue';  | 
| import { logout } from '@/config.js';  | 
| import { formatMessage } from '@/utils/localeUtils.js';  | 
| import useTableSearch from '@/utils/tableUtils.jsx';  | 
| import OrderOutBatchPreviewView from '@/components/orderOut/orderOutBatchPreview/index.vue';  | 
| import OrderOutMergePreviewView from '@/components/orderOut/orderOutMergePreview/index.vue';  | 
|   | 
| const router = useRouter();  | 
|   | 
| const emit = defineEmits(['pageReload'])  | 
|   | 
| const TABLE_KEY = 'table-order-detl';  | 
| let currentPage = 1;  | 
| let pageSize = 10;  | 
|   | 
| const {  | 
|     getColumnSearchProps,  | 
|     handleResizeColumn,  | 
| } = useTableSearch();  | 
|   | 
| let currentOrder = ref(null);  | 
| let searchInput = ref(null);  | 
| let tableData = ref([]);  | 
| const orderOutBatchPreviewChild = ref(null);  | 
| const orderOutMergePreviewChild = ref(null);  | 
| const checkedOrderKeys = ref([]);  | 
| getPage();  | 
|   | 
| const columns = [  | 
|     {  | 
|         title: formatMessage('db.man_order_detl.order_no', '订单编号'),  | 
|         dataIndex: 'orderNo',  | 
|         width: 140,  | 
|         ellipsis: true,  | 
|         ...getColumnSearchProps('orderNo'),  | 
|     },  | 
|     {  | 
|         title: formatMessage('db.man_order_detl.anfme', '数量'),  | 
|         dataIndex: 'anfme',  | 
|         width: 140,  | 
|         ellipsis: true,  | 
|         ...getColumnSearchProps('anfme'),  | 
|     },  | 
|     {  | 
|         title: formatMessage('db.man_order_detl.qty', '已完成数量'),  | 
|         dataIndex: 'qty',  | 
|         width: 140,  | 
|         ellipsis: true,  | 
|         ...getColumnSearchProps('qty'),  | 
|     },  | 
|     {  | 
|         title: formatMessage('db.man_order_detl.work_qty', '作业中数量'),  | 
|         dataIndex: 'workQty',  | 
|         width: 140,  | 
|         ellipsis: true,  | 
|         ...getColumnSearchProps('workQty'),  | 
|     },  | 
|     {  | 
|         title: formatMessage('db.man_order_detl.matnr', '商品编号'),  | 
|         dataIndex: ['mat$', 'matnr'],  | 
|         width: 140,  | 
|         ellipsis: true,  | 
|         ...getColumnSearchProps('matId$'),  | 
|     },  | 
|     {  | 
|         title: formatMessage('db.man_order_detl.batch', '批号'),  | 
|         dataIndex: 'batch',  | 
|         width: 140,  | 
|         ellipsis: true,  | 
|         ...getColumnSearchProps('batch'),  | 
|     },  | 
|   | 
|     // {  | 
|     //     title: formatMessage('common.operation', '操作'),  | 
|     //     name: 'oper',  | 
|     //     dataIndex: 'oper',  | 
|     //     key: 'oper',  | 
|     //     width: 140,  | 
|     // },  | 
| ];  | 
|   | 
| const state = reactive({  | 
|     selectedRowKeys: [],  | 
|     loading: false,  | 
| });  | 
| const onSelectChange = selectedRowKeys => {  | 
|     // console.log('selectedRowKeys changed: ', selectedRowKeys);  | 
|     state.selectedRowKeys = selectedRowKeys;  | 
| };  | 
|   | 
| function getPage() {  | 
|     if (currentOrder.value != null) {  | 
|         get('/api/orderDetl/orderId/' + currentOrder.value.id, {}).then((resp) => {  | 
|             let result = resp.data;  | 
|             if (result.code == 200) {  | 
|                 let data = result.data;  | 
|                 tableData.value = data;  | 
|             } else if (result.code === 401) {  | 
|                 message.error(result.msg);  | 
|                 logout()  | 
|             } else {  | 
|                 message.error(result.msg);  | 
|             }  | 
|         })  | 
|     }  | 
| }  | 
|   | 
| function handleTableReload(value) {  | 
|     getPage()  | 
| }  | 
|   | 
| let orderData = ref([]);  | 
| let searchOrder = ref("");  | 
| getOrderData()  | 
| function getOrderData() {  | 
|     post('/api/order/out/page', {  | 
|         current: currentPage,  | 
|         pageSize: pageSize,  | 
|         condition: searchOrder.value,  | 
|         orderOut: true,  | 
|     }).then((resp) => {  | 
|         let result = resp.data;  | 
|         if (result.code == 200) {  | 
|             let data = result.data.records;  | 
|             orderData.value = data  | 
|         } else if (result.code === 401) {  | 
|             message.error(result.msg);  | 
|             logout()  | 
|         } else {  | 
|             message.error(result.msg);  | 
|         }  | 
|     })  | 
| }  | 
|   | 
| const handleOrderSelected = (selectedKeys, e) => {  | 
|     currentOrder.value = e.selectedNodes[0];  | 
|     getPage()  | 
| }  | 
|   | 
| const handleSearchOrder = (e) => {  | 
|     getOrderData()  | 
| }  | 
|   | 
| const handleBatchOrderOut = () => {  | 
|     let data = state.selectedRowKeys;  | 
|     handleOrderOutPreview(data)  | 
| }  | 
|   | 
| const handleOrderOutPreview = (data) => {  | 
|     if (data.length == 0) {  | 
|         message.error(formatMessage("page.orderOut.batchOrderOut.error", "请选择至少一条出库明细"));  | 
|         return;  | 
|     }  | 
|   | 
|     orderOutBatchPreviewChild.value.open = true;  | 
|     orderOutBatchPreviewChild.value.records = data;  | 
| }  | 
|   | 
| const handleMergeOrderOut = () => {  | 
|     let orderIdList = [];  | 
|     checkedOrderKeys.value.forEach((idx) => {  | 
|         let index = parseInt(idx.split("-")[1]);  | 
|         orderIdList.push(orderData.value[index].id)  | 
|     })  | 
|   | 
|     if (orderIdList.length == 0) {  | 
|         message.error(formatMessage("page.orderOut.mergeOrderOut.error", "请选择至少一条订单"));  | 
|         return;  | 
|     }  | 
|   | 
|     orderOutMergePreviewChild.value.open = true;  | 
|     orderOutMergePreviewChild.value.records = orderIdList;  | 
| }  | 
|   | 
| const handleChildReload = () => {  | 
|     handleTableReload()  | 
| }  | 
|   | 
| const handleGenerateWave = () => {  | 
|     let orderIdList = [];  | 
|     checkedOrderKeys.value.forEach((idx) => {  | 
|         let index = parseInt(idx.split("-")[1]);  | 
|         orderIdList.push(orderData.value[index].id)  | 
|     })  | 
|   | 
|     if (orderIdList.length == 0) {  | 
|         message.error(formatMessage("page.orderOut.mergeOrderOut.error", "请选择至少一条订单"));  | 
|         return;  | 
|     }  | 
|   | 
|     post('/api/out/wave/generate', orderIdList).then((resp) => {  | 
|         let result = resp.data;  | 
|         if (result.code == 200) {  | 
|             message.success(formatMessage('page.add.success', '成功'));  | 
|             emit('pageReload', 'reload')  | 
|         } else {  | 
|             message.error(result.msg);  | 
|         }  | 
|     })  | 
| }  | 
|   | 
| </script>  | 
|   | 
| <script>  | 
| export default {  | 
|     name: '订单出库'  | 
| }  | 
| </script>  | 
|   | 
| <template>  | 
|     <div style="display: flex;">  | 
|         <a-card :title="formatMessage('common.order', '订单')" style="flex: 4;margin-right: 30px;">  | 
|             <div style="margin-bottom: 10px;display: flex;">  | 
|                 <!-- <div style="margin-right: 10px;">  | 
|                     <a-button @click="handleMergeOrderOut()">  | 
|                         {{ formatMessage('common.orderOut', '合并订单') }}  | 
|                     </a-button>  | 
|                 </div> -->  | 
|                 <div style="margin-right: 10px;">  | 
|                     <a-button @click="handleGenerateWave()">  | 
|                         {{ formatMessage('common.generateWave', '生成波次') }}  | 
|                     </a-button>  | 
|                 </div>  | 
|             </div>  | 
|             <a-input v-model:value="searchOrder" @change="handleSearchOrder"  | 
|                 :placeholder="formatMessage('page.input', '请输入')" style="margin-bottom: 8px" />  | 
|             <a-tree @select="handleOrderSelected" :tree-data="orderData" v-model:checkedKeys="checkedOrderKeys"  | 
|                 checkable blockNode>  | 
|                 <template #title="{ orderNo, createTime$ }">  | 
|                     <div style="display: flex;justify-content: space-between">  | 
|                         <div>{{ orderNo }}</div>  | 
|                         <div>{{ createTime$ }}</div>  | 
|                     </div>  | 
|                 </template>  | 
|             </a-tree>  | 
|         </a-card>  | 
|   | 
|         <a-card style="flex: 10;">  | 
|             <div class="table-header">  | 
|                 <!-- <a-button size="small" @click="handleBatchOrderOut()">  | 
|                     {{ formatMessage('common.orderOut', '批量出库') }}  | 
|                 </a-button> -->  | 
|             </div>  | 
|             <a-table :row-selection="{ selectedRowKeys: state.selectedRowKeys, onChange: onSelectChange }"  | 
|                 :data-source="tableData" :defaultExpandAllRows="false" :key="TABLE_KEY" rowKey="id"  | 
|                 :scroll="{ y: 768, scrollToFirstRowOnChange: true }" :columns="columns">  | 
|                 <template #bodyCell="{ column, text, record }">  | 
|                     <template v-if="column.dataIndex === 'oper'">  | 
|                         <div style="display: flex;justify-content: space-evenly;">  | 
|                             <a-button size="small" @click="handleOrderOutPreview([record.id])">  | 
|                                 {{ formatMessage('common.orderOut', '出库') }}  | 
|                             </a-button>  | 
|                         </div>  | 
|                     </template>  | 
|                 </template>  | 
|             </a-table>  | 
|         </a-card>  | 
|   | 
|         <OrderOutBatchPreviewView ref="orderOutBatchPreviewChild" @reload="handleChildReload" />  | 
|         <OrderOutMergePreviewView ref="orderOutMergePreviewChild" @reload="handleChildReload" />  | 
|     </div>  | 
| </template>  | 
|   | 
| <style></style>  |