货无忧
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.
 
 
 
 
 

600 lines
13 KiB

<template>
<BasicContainer ref="basicContainer" :option="option" :leftClick="option.leftClick">
<!-- 头部 -->
<template #head>
<view class="headtop">
<view>
<input v-model="scancode" placeholder="请输入托盘码" />
</view>
<view @click="scandata">查询</view>
</view>
<view class="schbox">
<view>分拣日期:</view>
<view @click='showCalendar' class="inputsr">
<input :value='datatime' disabled placeholder="请选择时间" />
<view @click.stop.prevent>
<u-icon @click='showCalendar' style="margin-right: 10upx;" v-if="!datatime" name="calendar"
color="#999999" size="50"></u-icon>
<u-icon @click="cleartime" style="margin-right: 10upx;" v-else name="close-circle" color="#999999"
size="40"></u-icon>
</view>
</view>
</view>
</template>
<!-- 主体 -->
<template #body>
<view class="maxboxs">
<view class="items" v-for="item in datalist">
<view class="headtopv">
<view>
<image src="/pagesHome/static/tpicon.png"></image>
<view>{{`${item.trayName} ( ${item.trayCode} )`}}</view>
</view>
<view @click="goorderdetail(item)">继续分拣</view>
</view>
<view class="contentbx">
<view class="unames">
<view class="mb10">
<view>
<image src="/pagesHome/static/uname.png"></image>
<view>名称</view>
</view>
<view>{{item.marketName}}{{item.filterValue}}</view>
</view>
<view class="mb10">
<view>
<image src="/pagesHome/static/dttype.png"></image>
<view>打托方式</view>
</view>
<view>{{item.trayTypeName}}</view>
</view>
<view class="mb10">
<view>
<image src="/pagesHome/static/dttype.png"></image>
<view>备注</view>
</view>
<view>{{item.remark}}</view>
</view>
</view>
<view class="numbox">
<view>
<view>订单数</view>
<view>{{item.totalNum}}</view>
</view>
<view>
<view>订单总数</view>
<view>{{item.orderTotalNum}}</view>
</view>
<view>
<view>库存品数</view>
<view>{{item.stockNum}}</view>
</view>
<view>
<view>库存品总数</view>
<view>{{item.stockTotalNum}}</view>
</view>
</view>
</view>
</view>
</view>
</template>
</BasicContainer>
<view class="footer">
<view class="footer_container">
<view class="button" @click="handleCreateTray">
生成新托盘
</view>
</view>
</view>
<tips ref="tip" />
<BluetoothList ref="bluetoothList"></BluetoothList>
<l-calendar v-model:value="show" :initStartDate='date[0]' :initEndDate='date[1]' @hide='showCalendar'
@change="onConfirm"></l-calendar>
<saomiao2 :ishidestop="scanState !== 0"></saomiao2>
</template>
<script lang="ts" setup>
import {
warehouseTrayTypeorderPageList,
warehouseTrayTypeorderScanTrayCode,
postCreateTray
} from '@/api/user.js'
import {
onLoad,
onShow,
onHide,
} from '@dcloudio/uni-app'
import { reactive, ref, toRefs, watchEffect, nextTick } from "vue";
import utils from '@/utils/utils.js'
import useSystemSettingsStore from '@/store/useSystemSettingsStore';
import { storeToRefs } from 'pinia';
const { scanState } = storeToRefs(useSystemSettingsStore())
import useBluetoothStore from '@/store/useBluetoothStore.js';
const bluetoothList = ref(null)
const bluetoothStore = useBluetoothStore()
const { bluetoothInfo } = storeToRefs(bluetoothStore)
// 组件配置
const option = reactive({
leftClick() {
uni.reLaunch({
url: "/pages/index/index"
})
},
// 标题
title: '分拣列表',
// 下拉刷新回调函数
async pullDownRefreshInitPage() {
// 重置页码
details.pageNum = 1
// 重置渲染列表
details.datalist = []
// 重置渲染列表数据请求是否结束状态
option.isEnd = false
// 重置是否有数据
option.haveData = true
await initpage()
if (datalist.value.length === 0) {
uni.showToast({
title: '暂时没有数据',
icon: 'error'
})
option.haveData = false
}
if (option.isEnd) {
return uni.showToast({
icon: 'success',
title: '数据已加载完毕'
})
}
return null
},
// 触底加载回到函数
reachBottomInitPage: () => {
details.pageNum += 1
return initpage()
},
haveData: true,
isEnd: false,
isFixed: true
})
const basicContainer = ref()
const tip = ref()
// 触底加载
function reachBottomInitPage() {
// 触发触底回调
details.pageNum += 1
return initpage()
}
let details = reactive({
show: false,
datatime: '',
pageType: 1,
pageNum: 1,
pageSize: 10,
datalist: [],
scancode: ''
})
onLoad((op) => {
details.pageType = op.type
// #ifdef APP
utils.ttsspke('请扫描或输入托盘码')
// #endif
})
onShow(async () => {
// 初始化关闭监听
uni.$off('scancodedate')
// init()
uni.$on('scancodedate', function (code) {
console.log('code :>> ', code);
if (code) {
console.log(code);
details.scancode = code
scandata()
}
})
await nextTick()
// initpage()
basicContainer.value.startPullDownRefresh()
})
const date = ref<(string | number)[]>([])
async function scandata() {
let data = {
trayCode: details.scancode
}
let res = await warehouseTrayTypeorderScanTrayCode(data)
if (res.code !== 200) return
console.log('res', res);
if (Number(res.data.isHasData) === 0) {
// utils.ttsspke('请选择分拣方式')
uni.setStorageSync('trayCodeType', res.data.data)
uni.navigateTo({
url: '/pagesHome/pages/ScanSortingType/ScanSortingType?trayCode=' + details.scancode
})
} else {
uni.navigateTo({
url: '/pagesHome/pages/OrderSortingDetail/OrderSortingDetail?trayCode='
+ res.data.data.trayCode + '&trayType='
+ res.data.data.trayType
})
}
}
async function initpage() {
try {
let submitData = {
pageNum: details.pageNum,
pageSize: details.pageSize,
createDateStart: date.value[0] || '',
createDateEnd: date.value[1] || '',
}
const res = await warehouseTrayTypeorderPageList(submitData)
if (res.code !== 200) return
const { code, data } = res
if (code === 200 && data) details.datalist = [...details.datalist, ...data.records]
if (data && data.pages <= details.pageNum) option.isEnd = true
console.log('details.datalist :>> ', details.datalist);
return res
} catch (err) {
//TODO handle the exception
console.log('err :>> ', err);
}
}
function goorderdetail(item : any) {
// 去详情页
uni.navigateTo({
url: '/pagesHome/pages/OrderSortingDetail/OrderSortingDetail?trayCode='
+ item.trayCode + '&trayType='
+ item.trayType
})
if (Number(details.pageType) == 2) {
uni.navigateTo({
url: '/pagesHome/pages/PeopleSortingDetail/PeopleSortingDetail?trayCode='
+ item.trayCode + '&trayType='
+ item.trayType
})
}
}
// 显示时间选择
function showCalendar() {
details.show = !details.show
}
// 时间确认
function onConfirm(e : any) {
console.log(e);
date.value[0] = e.startDate
date.value[1] = e.endDate
details.datatime = date.value[0] + ' 至 ' + date.value[1]
basicContainer.value.startPullDownRefresh()
}
// 清空时间
function cleartime() {
details.datatime = ''
date.value = []
basicContainer.value.startPullDownRefresh()
}
const print = (data, isJump = false) => {
// #ifdef APP
const handlePrint = () => {
let text = '! 0 200 200 333 1\r\n'
text += 'SETBOLD 1\r\n'
text += `T 56 0 140 0 托盘码\r\n`
text += 'B QR 140 60 M 4 U 4\r\n'
text += `MA,${data.palletCode}\r\n`
text += 'ENDQR\r\n'
text += `T 56 0 40 200 托盘码: ${data.palletCode}\r\n`
text += `T 56 0 40 240 托盘名称: ${data.palletName}\r\n`
text += 'FORM\r\n'
text += 'PRINT\r\n'
const res = utils.getbl(bluetoothInfo.value, text)
res.then(() => {
if (isJump) uni.navigateTo({
url: '/pagesHome/pages/ScanSortingType/ScanSortingType?trayCode=' + data.palletCode
})
})
res.catch(() => {
bluetoothList.value.setdetails({ isshow: true, success() { handlePrint() } })
})
}
if (!bluetoothInfo.value.name) return bluetoothList.value.setdetails({ isshow: true, success() { handlePrint() } })
handlePrint()
// #endif
}
/** 生成新托盘 */
const handleCreateTray = () => {
tip.value.setdetails({
isshow: true,
title: '提示',
content: '是否生成新托盘码',
isshowcancel: true,
cancelTxt: '取消',
confirmTxt: '确认',
success: async () => {
const res = await postCreateTray()
const { code, data } = res
if (code !== 200) return
tip.value.setdetails({
isshow: true,
title: '提示',
content: '是否打印并分拣',
isshowcancel: true,
cancelTxt: '打印',
confirmTxt: '打印并分拣',
success: () => {
print(data, true)
tip.value.setdetails({ isshow: false })
},
cancel: () => {
print(data)
tip.value.setdetails({ isshow: false })
},
close: () => tip.value.setdetails({ isshow: false })
})
},
cancel: () => {
tip.value.setdetails({ isshow: false })
},
close: () => tip.value.setdetails({ isshow: false })
})
}
const {
show,
datatime,
datalist,
scancode,
} = toRefs(details)
</script>
<style lang="scss">
.inputsr {
width: 550upx !important;
height: 75upx;
background: #F5F5F6;
border-radius: 8upx;
border: 2upx solid #EEEEEE;
padding: 16upx 18upx;
box-sizing: border-box;
padding-right: 0;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 26upx;
font-weight: 400;
color: #092C4D;
>input {
flex: 1;
font-size: 26upx;
}
}
.schbox {
display: flex;
align-items: center;
justify-content: flex-start;
padding: 15upx 32upx;
box-sizing: border-box;
background-color: #ffffff;
>view:nth-of-type(1) {
// width: 150upx;
font-size: 28upx;
font-weight: 400;
flex: none;
color: #092C4D;
}
>view:nth-of-type(2) {
width: 380upx;
// height: 64upx;
}
>view:nth-of-type(3) {
width: 128upx;
height: 64upx;
background: #D3832A;
border-radius: 8upx;
display: flex;
align-items: center;
justify-content: center;
font-size: 32upx;
font-weight: 400;
color: #FFFFFF;
}
}
.headtop {
display: flex;
align-items: center;
justify-content: space-between;
background-color: #FFFFFF;
padding: 20upx 30upx;
box-sizing: border-box;
>view:nth-of-type(1) {
width: 540upx;
border: 2upx solid #00000020;
padding: 10upx 20upx;
box-sizing: border-box;
>input {
flex: 1;
font-size: 28upx;
}
}
>view:nth-of-type(2) {
width: 128upx;
height: 64upx;
background: #D3832A;
border-radius: 8upx;
display: flex;
align-items: center;
justify-content: center;
font-size: 32upx;
font-weight: 400;
color: #FFFFFF;
}
}
.maxboxs {
padding: 20upx;
>.items {
display: flex;
flex-direction: column;
background-color: #ffffff;
margin-bottom: 20upx;
padding: 16upx 30upx;
box-sizing: border-box;
.contentbx {
.unames {
padding: 15upx 0;
>view {
display: flex;
align-items: center;
font-size: 28upx;
>view:nth-of-type(1) {
width: 180upx;
display: flex;
align-items: center;
justify-content: flex-start;
}
image {
width: 42upx;
height: 42upx;
margin-right: 15upx;
}
}
}
.numbox {
height: 160upx;
background: #F5F7FB;
border-radius: 8upx;
display: flex;
align-items: center;
justify-content: space-between;
>view {
display: flex;
flex-direction: column;
align-items: center;
>view:nth-of-type(1) {
font-size: 28upx;
font-weight: 400;
color: #AFB4BA;
margin-bottom: 20upx;
}
>view:nth-of-type(2) {
font-size: 36upx;
font-weight: 400;
color: #020B18;
}
}
}
}
.headtopv {
display: flex;
align-items: center;
justify-content: space-between;
padding: 14upx 0;
border-bottom: 2upx solid #EEEEEE;
>view:nth-of-type(1) {
display: flex;
align-items: center;
justify-content: center;
color: #020B18;
font-size: 32upx;
>image {
width: 32upx;
height: 32upx;
margin-right: 10upx;
}
}
>view:last-child {
width: 192upx;
height: 72upx;
background: #D3832A;
border-radius: 8upx 8upx 8upx 8upx;
opacity: 1;
display: flex;
align-items: center;
justify-content: center;
font-size: 28upx;
font-weight: 400;
color: #FFFFFF;
}
}
}
}
// 底部
.footer {
$height: 120upx;
height: $height;
.footer_container {
height: inherit;
position: fixed;
width: 100vw;
background-color: #fff;
bottom: 0;
right: 0;
padding-top: 10upx;
.button {
$buttonHeight: 80upx;
height: $buttonHeight;
line-height: $buttonHeight;
background-color: var(--subjectColor);
color: #fff;
width: 70%;
margin: 0 auto;
text-align: center;
border-radius: calc($buttonHeight / 2);
box-shadow: 0 10upx 5upx 0upx #d3832a60;
}
}
}
</style>