You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
648 lines
15 KiB
648 lines
15 KiB
<template> |
|
<!-- 顶部导航栏 --> |
|
<u-navbar title="库位查询" placeholder :autoBack="true" leftIconSize='35' bgColor='#d3832a' leftIconColor='#ffffff' |
|
titleStyle='color:#ffffff'></u-navbar> |
|
|
|
<view class="container"> |
|
<!-- 顶部搜索栏 --> |
|
<view class="header-search"> |
|
<view class="search"> |
|
<input class="searchInput" v-model="scancode" type="text"> |
|
</view> |
|
|
|
<view class="search"> |
|
<view class="searchType" @click="scandata"> |
|
搜索 |
|
</view> |
|
|
|
</view> |
|
</view> |
|
|
|
<view class="orderInfo"> |
|
<!-- 库位数据 --> |
|
<view class="orderInfo_title"> |
|
<view class="orderInfo_title_row"> |
|
<view class=""> |
|
<view class="row_title1"> |
|
托盘名称： |
|
</view> |
|
<view> |
|
{{info.trayInfo.palletName || '暂无数据'}} |
|
</view> |
|
</view> |
|
|
|
<view class=""> |
|
<view class="row_title2"> |
|
托盘码： |
|
</view> |
|
<view class=""> |
|
{{info.trayInfo.palletCode || '暂无数据'}} |
|
</view> |
|
</view> |
|
</view> |
|
|
|
<view class="orderInfo_title_row"> |
|
<view class=""> |
|
<text class="row_title1"> |
|
打托方式： |
|
</text> |
|
{{info.trayType || '暂无数据'}} |
|
</view> |
|
|
|
<view class=""> |
|
<text class=""> |
|
商场： |
|
</text> |
|
{{info.marketName || '暂无数据'}} |
|
</view> |
|
</view> |
|
|
|
<view class="orderInfo_title_row"> |
|
<view class=""> |
|
<text class="row_title1"> |
|
包件数： |
|
</text> |
|
{{info.totalNum || 0}} |
|
</view> |
|
|
|
<view class=""> |
|
<text class="row_title2"> |
|
订单包件总数： |
|
</text> |
|
{{info.orderTotalNum || 0}} |
|
</view> |
|
</view> |
|
|
|
<view class="orderInfo_title_row"> |
|
<view class=""> |
|
<text class="row_title1"> |
|
库存品数： |
|
</text> |
|
{{info.stockNum || 0}} |
|
</view> |
|
|
|
<view class=""> |
|
<text class="row_title2"> |
|
库存品订单总数： |
|
</text> |
|
{{info.stockTotalNum || 0}} |
|
</view> |
|
</view> |
|
</view> |
|
|
|
<view class="title"> |
|
<view @click="handleTabBarState(1)" :class="{'active': tabBarCode === 1}"> |
|
定制品 |
|
</view> |
|
<view @click="handleTabBarState(2)" :class="{'active': tabBarCode === 2}"> |
|
零担 |
|
</view> |
|
<view @click="handleTabBarState(3)" :class="{'active': tabBarCode === 3}"> |
|
库存品 |
|
</view> |
|
</view> |
|
|
|
<!-- 定制品 --> |
|
<view class="packagesList" v-if="tabBarCode === 1"> |
|
<!-- 控件 --> |
|
<view class="control"> |
|
<view v-if="!isBatchOperation"> |
|
<view class="batchOperationBtn" @click="isBatchOperation = true">批量操作</view> |
|
</view> |
|
<view v-else style="display: flex;"> |
|
<view class="batchOperationBtn" @click="batchPrint">打印</view> |
|
</view> |
|
</view> |
|
|
|
<scroll-view scroll-y="true" style="height: 60vh; margin-top: 10px;"> |
|
<uni-table type="selection" border stripe emptyText="暂无更多数据" |
|
@selection-change="({detail: {index}})=> selectionChange(index, 'order')"> |
|
<!-- 表头行 --> |
|
<uni-tr> |
|
<uni-th align="left">包条码</uni-th> |
|
<uni-th align="left">合同号</uni-th> |
|
<uni-th align="left">运单号</uni-th> |
|
<uni-th align="left">仓库</uni-th> |
|
<uni-th align="left">数量</uni-th> |
|
</uni-tr> |
|
<!-- 表格数据行 --> |
|
<block v-for="item in packageList"> |
|
<uni-tr> |
|
<!-- 包条码 --> |
|
<uni-td>{{item.orderPackageCode}}</uni-td> |
|
<!-- 合同号 --> |
|
<uni-td>{{item.orderCode}}</uni-td> |
|
<!-- 运单号 --> |
|
<uni-td>{{item.waybillNo}}</uni-td> |
|
<!-- 仓库 --> |
|
<uni-td>{{item.warehouseName}}</uni-td> |
|
<!-- 数量 --> |
|
<uni-td>{{item.num}}</uni-td> |
|
</uni-tr> |
|
</block> |
|
|
|
</uni-table> |
|
</scroll-view> |
|
</view> |
|
|
|
<!-- 零担 --> |
|
<view class="packagesList" v-else-if="tabBarCode === 2"> |
|
<scroll-view scroll-y="true" style="height: 60vh; margin-top: 10px;"> |
|
<uni-table type="selection" border stripe emptyText="暂无更多数据" |
|
@selection-change="({detail: {index}})=>selectionChange(index, 'zero')"> |
|
<!-- 表头行 --> |
|
<uni-tr> |
|
<uni-th align="left">运单号</uni-th> |
|
<uni-th align="left">合同号</uni-th> |
|
<uni-th align="left">仓库</uni-th> |
|
<uni-th align="center">数量</uni-th> |
|
</uni-tr> |
|
<!-- 表格数据行 --> |
|
<block v-for="item in zeroList"> |
|
<uni-tr> |
|
<!-- 运单号 --> |
|
<uni-td>{{item.waybillNo}}</uni-td> |
|
<!-- 合同号 --> |
|
<uni-td>{{item.orderCode}}</uni-td> |
|
<!-- 仓库 --> |
|
<uni-td>{{item.warehouseName}}</uni-td> |
|
<!-- 数量 --> |
|
<uni-td align="center">{{item.num}}</uni-td> |
|
</uni-tr> |
|
</block> |
|
</uni-table> |
|
</scroll-view> |
|
</view> |
|
|
|
<!-- 库存品 --> |
|
<view class="packagesList" v-else-if="tabBarCode === 3"> |
|
<scroll-view scroll-y="true" style="height: 60vh; margin-top: 10px;"> |
|
<uni-table type="selection" border stripe emptyText="暂无更多数据" |
|
@selection-change="({detail: {index}})=>selectionChange(index, 'stock')"> |
|
<!-- 表头行 --> |
|
<uni-tr> |
|
<uni-th align="left">批次号</uni-th> |
|
<uni-th align="left">物料编码</uni-th> |
|
<uni-th align="left">物料名称</uni-th> |
|
<uni-th align="left">商场名称</uni-th> |
|
<uni-th align="center">仓库</uni-th> |
|
<uni-th align="center">在库数</uni-th> |
|
</uni-tr> |
|
<!-- 表格数据行 --> |
|
<block v-for="item in stockList"> |
|
<uni-tr> |
|
<!-- 批次号 --> |
|
<uni-td>{{item.incomingBatch}}</uni-td> |
|
<!-- 物料编码 --> |
|
<uni-td>{{item.materialCode}}</uni-td> |
|
<!-- 物料名称 --> |
|
<uni-td>{{item.materialName}}</uni-td> |
|
<!-- 商场名称 --> |
|
<uni-td>{{item.marketName}}</uni-td> |
|
<!-- 仓库 --> |
|
<uni-td>{{item.warehouseName}}</uni-td> |
|
<!-- 数量 --> |
|
<uni-td align="center">{{item.num}}</uni-td> |
|
</uni-tr> |
|
</block> |
|
</uni-table> |
|
</scroll-view> |
|
</view> |
|
</view> |
|
</view> |
|
<tiplist ref="tiplists"></tiplist> |
|
<!-- #ifdef APP --> |
|
<saomiao2 :ishidestop="scanState !== 0"></saomiao2> |
|
<!-- #endif --> |
|
<BluetoothList ref="bluetoothList"></BluetoothList> |
|
</template> |
|
|
|
<script lang="ts" setup> |
|
import { ref, reactive, shallowRef, watch, nextTick, computed } from 'vue'; |
|
import { |
|
onShow, |
|
onHide, |
|
onLoad, |
|
onReachBottom, |
|
onPullDownRefresh |
|
} from '@dcloudio/uni-app' |
|
import utils from '@/utils/utils.js'; |
|
import { |
|
postFindTrayData, |
|
BatchPrintPackages |
|
} from '@/api/user.js' |
|
import useBluetoothStore from '@/store/useBluetoothStore.js'; |
|
import useSystemSettingsStore from '@/store/useSystemSettingsStore'; |
|
import { storeToRefs } from 'pinia'; |
|
const { scanState } = storeToRefs(useSystemSettingsStore()) |
|
const bluetoothList = ref(null) |
|
const bluetoothStore = useBluetoothStore() |
|
const { bluetoothInfo } = storeToRefs(bluetoothStore) |
|
|
|
// 订单详情 |
|
const dataInfo = shallowRef<any>({}) |
|
|
|
/** 是否开启批量操作 */ |
|
const isBatchOperation = ref<Boolean>(false) |
|
|
|
/** 是否显示定制品 */ |
|
const showArticleMadeToOrder = ref<Boolean>(true) |
|
|
|
/** 扫码码值 */ |
|
const scancode = ref<string>('') |
|
|
|
/** 包件列表 */ |
|
const packageList = shallowRef([]) |
|
|
|
/** 零担列表 */ |
|
const zeroList = shallowRef([]) |
|
|
|
/** 库存品列表 */ |
|
const stockList = shallowRef([]) |
|
|
|
/** 详情 */ |
|
const info = ref<any>({ trayInfo: {} }) |
|
|
|
// 订单状态字典 |
|
const orderStateDictionaries = reactive({ |
|
'10': '部分入库', |
|
'20': '已入库', |
|
'30': '部分出库', |
|
'40': '已出库', |
|
'50': '部分装车', |
|
'60': '已装车', |
|
'70': '部分签收', |
|
'80': '已签收', |
|
}) |
|
|
|
/** tabBar 激活 */ |
|
const tabBarCode = ref(1) |
|
|
|
/** 修改物料表单 */ |
|
const form = ref({}) |
|
|
|
/** 复选框选中的数据 */ |
|
const selectionList = ref([]) |
|
|
|
// 组件实例 |
|
const tiplists = ref(null) |
|
|
|
|
|
onLoad(() => { |
|
// #ifdef APP |
|
utils.ttsspke('库位查询, 请扫描或输入库位码') |
|
// #endif |
|
}) |
|
|
|
// 开启监听扫描 |
|
onShow(async () => { |
|
// #ifdef APP |
|
uni.$off('scancodedate') |
|
uni.$on('scancodedate', function (code) { |
|
if (code) { |
|
scancode.value = code |
|
|
|
scandata() |
|
} |
|
}) |
|
// #endif |
|
}) |
|
|
|
onPullDownRefresh(() => { |
|
const timer = setTimeout(() => { |
|
dataInfo.value = {} |
|
scancode.value = '' |
|
packageList.value = [] |
|
|
|
uni.stopPullDownRefresh() |
|
clearTimeout(timer) |
|
}, 300) |
|
}) |
|
|
|
async function scandata() { |
|
const res = await postFindTrayData({ trayCode: scancode.value }) |
|
console.log('res :>> ', res); |
|
const { code, data } = res |
|
|
|
if (code !== 200 || !data) return |
|
|
|
// 库位信息 |
|
info.value = data.trayTyprInfo || {} |
|
|
|
// 库位托盘信息 |
|
info.value.trayInfo = data.trayEntity || {} |
|
|
|
// 定制品 |
|
packageList.value = data.packageList |
|
|
|
// 零担 |
|
zeroList.value = data.zeroOrderList |
|
|
|
// 库存品 |
|
stockList.value = data.stockOrderList |
|
} |
|
|
|
/** 设置tabBar激活状态 */ |
|
const handleTabBarState = (code) => { |
|
selectionList.value = [] |
|
tabBarCode.value = code |
|
} |
|
|
|
/** 复选框改变时 */ |
|
const selectionChange = (list : [], type : string) => { |
|
console.log('list :>> ', list); |
|
selectionList.value = list |
|
} |
|
|
|
/** 打印 */ |
|
const batchPrint = async () => { |
|
if (selectionList.value.length === 0) return uni.showToast({ |
|
title: '最少选择一条数据', |
|
icon: 'none' |
|
}) |
|
|
|
const _idsArr = [] |
|
|
|
for (let i = 0; i < selectionList.value.length; i++) { |
|
// selectionList内存储的是被选中的索引 |
|
const index = selectionList.value[i] |
|
_idsArr.push(packageList.value[index].packageId) |
|
} |
|
|
|
const idsValue = _idsArr.join(',') |
|
|
|
const res = await BatchPrintPackages(idsValue) |
|
const { code, data } = res |
|
if (code !== 200) return |
|
console.log('res :>> ', res); |
|
tiplists.value.setdetails({ |
|
title: '请选择需要打印的包条码', |
|
isshow: true, |
|
tipstate: 2, |
|
list: [], |
|
inputtext: '', |
|
confirmTxt: '确认选择', |
|
isonecheck: true, |
|
success: () => { |
|
// if (deta.checklist.length == 0) { |
|
// uni.showToast({ |
|
// title: '请选择包条码', |
|
// icon: 'none' |
|
// }) |
|
// return |
|
// } |
|
console.log('data :>> ', data); |
|
// #ifdef APP |
|
if (!bluetoothInfo.value.name) return bluetoothList.value.setdetails({ isshow: true }) |
|
let _isReturn = false |
|
data.map(item => { |
|
if (_isReturn) return |
|
let text = '! 0 200 200 330 1\r\n' |
|
text += 'SETBOLD 1\r\n' |
|
text += `T 56 0 0 0 ${item.orderCode}\r\n` |
|
text += 'LINE 0 50 420 50 3\r\n' |
|
text += `T 55 0 0 60 客户\r\n` |
|
text += 'LINE 40 50 40 110 3\r\n' |
|
text += `T 55 0 50 60 ${item.customerName}\r\n` |
|
text += 'LINE 40 80 420 80 3\r\n' |
|
text += `T 55 0 50 90 ${item.customerAddress}\r\n` |
|
text += 'LINE 0 110 420 110 3\r\n' |
|
text += `T 55 0 0 120 物料\r\n` |
|
text += 'LINE 40 110 40 140 3\r\n' |
|
text += `T 55 0 50 120 ${item.materialName || item.category}\r\n` |
|
text += 'LINE 0 140 420 140 3\r\n' |
|
text += 'B QR 150 150 M 2 U 4\r\n' |
|
text += `MA,${item.qrCode}\r\n` |
|
text += 'ENDQR\r\n' |
|
text += `T 55 0 140 260 ${item.qrCode}\r\n` |
|
text += 'FORM\r\n' |
|
text += 'PRINT\r\n' |
|
utils.getbl(bluetoothInfo.value, text).catch(() => { |
|
bluetoothList.value.setdetails({ isshow: true }) |
|
_isReturn = true |
|
}) |
|
}) |
|
if (_isReturn) return |
|
// #endif |
|
tiplists.value.setdetails({ isshow: false }) |
|
}, |
|
cancel: (details) => { |
|
tiplists.value.setdetails({ isshow: false }) |
|
}, |
|
close: (details) => { |
|
tiplists.value.setdetails({ isshow: false }) |
|
} |
|
}) |
|
} |
|
</script> |
|
|
|
<style lang="scss" scoped> |
|
.w100 { |
|
width: 100%; |
|
} |
|
|
|
// 最外层容器 |
|
.container { |
|
padding: 20upx; |
|
font-size: 28upx; // 本页字体大小 |
|
} |
|
|
|
// 顶部搜索栏 |
|
.header-search { |
|
height: 60upx; |
|
padding: 0 0 20upx; |
|
// border-bottom: 1upx solid #aaa; |
|
display: flex; |
|
justify-content: space-between; |
|
|
|
} |
|
|
|
.search { |
|
position: relative; |
|
|
|
// 查询结果的列表 |
|
.searchResultList { |
|
position: absolute; |
|
top: 120%; |
|
width: 100%; |
|
background: #fff; |
|
z-index: 80; |
|
text-align: center; |
|
line-height: 60upx; |
|
max-height: 300upx; |
|
overflow-y: scroll; |
|
} |
|
} |
|
|
|
// 搜索输入框 |
|
.searchInput { |
|
background: #fff; |
|
width: 500upx; |
|
height: 100%; |
|
padding-left: 20upx; |
|
border: 1upx solid var(--subjectColor); |
|
border-radius: 30upx; |
|
} |
|
|
|
// 搜索类型 |
|
.searchType { |
|
height: 100%; |
|
display: flex; |
|
align-items: center; |
|
padding: 0 40upx; |
|
background: #fff; |
|
border: 1upx solid var(--subjectColor); |
|
border-radius: 10upx; |
|
color: var(--subjectColor); |
|
} |
|
|
|
// 数据详情 |
|
.dataInfo { |
|
display: flex; |
|
flex-wrap: wrap; |
|
// border-bottom: 1upx solid #aaa; |
|
background: #fff; |
|
} |
|
|
|
.dataInfo__item { |
|
flex: none; |
|
min-width: 50%; |
|
max-width: 100%; |
|
line-height: 60upx; |
|
display: inline-flex; |
|
|
|
.label { |
|
display: inline-block; |
|
width: 160upx; |
|
text-align: right; |
|
margin-right: 20rpx; |
|
} |
|
} |
|
|
|
// 订单列表信息 |
|
.orderInfo { |
|
// background: #fff; |
|
margin-top: 10upx; |
|
|
|
.orderInfo_title { |
|
background: #fff; |
|
font-size: 32upx; |
|
padding: 15upx; |
|
border-radius: 5upx; |
|
box-sizing: border-box; |
|
box-shadow: 0 0 10px #acc, 3px 3px #abb; |
|
font-size: 28upx; |
|
|
|
.row_title1 { |
|
display: inline-block; |
|
min-width: 140upx; |
|
} |
|
|
|
.row_title2 { |
|
display: inline-block; |
|
min-width: 200upx; |
|
} |
|
|
|
|
|
.orderInfo_title_row { |
|
display: flex; |
|
margin-top: 10upx; |
|
|
|
&>view { |
|
flex: 1; |
|
} |
|
} |
|
} |
|
|
|
// 头部统计 |
|
.title { |
|
display: flex; |
|
justify-content: space-around; |
|
font-size: 32upx; |
|
// font-weight: bold; |
|
margin: 10upx 0; |
|
|
|
&>view { |
|
padding: 15upx 0; |
|
flex: 1; |
|
text-align: center; |
|
position: relative; |
|
// background: #fff; |
|
transition: all 0.3s; |
|
border-radius: 10upx; |
|
|
|
// &::after { |
|
// content: ''; |
|
// display: block; |
|
// position: absolute; |
|
// height: 4upx; |
|
// width: 0; |
|
// // background: var(--subjectColor); |
|
// top: 100%; |
|
// left: 50%; |
|
// transition: all 0.5s; |
|
// } |
|
|
|
&.active { |
|
background: var(--subjectColor); |
|
color: #fff; |
|
|
|
&::after { |
|
width: 100%; |
|
left: 0; |
|
} |
|
} |
|
} |
|
} |
|
|
|
.title__number { |
|
color: var(--subjectColor); |
|
} |
|
|
|
// 批量操作按钮 |
|
.batchOperationBtn { |
|
border: 1upx solid var(--subjectColor); |
|
text-align: center; |
|
padding: 10upx 0; |
|
color: var(--subjectColor); |
|
border-radius: 10upx; |
|
width: 200upx; |
|
font-size: 28upx; |
|
margin: 0; |
|
margin-right: 10upx; |
|
} |
|
} |
|
|
|
// 控件 |
|
.control { |
|
background: #fff; |
|
padding: 10upx 0; |
|
} |
|
|
|
.uni-table-scroll { |
|
zoom: 0.9; |
|
} |
|
|
|
.uni-table-td, |
|
.uni-table-th { |
|
--borderColor: var(--subjectColor); |
|
color: var(--borderColor); |
|
padding: 10upx; |
|
|
|
font-size: 28upx; |
|
} |
|
|
|
.table--border { |
|
--borderColor: var(--subjectColor); |
|
border-color: var(--borderColor); |
|
} |
|
|
|
:deep(.checkbox.tr-table--border) { |
|
--borderColor: var(--subjectColor); |
|
border-color: var(--borderColor); |
|
|
|
.checkbox__inner { |
|
border-color: var(--borderColor); |
|
} |
|
} |
|
</style> |