984 lines
32 KiB
Vue
984 lines
32 KiB
Vue
<template>
|
||
<!-- 编码出库-->
|
||
<view class="page-container">
|
||
<!-- 表单信息区域 -->
|
||
<scroll-view scroll-y style="height: 100vh">
|
||
<view class="form-section">
|
||
<view class="section-header" @tap="toggleForm">
|
||
<text class="title">任务信息</text>
|
||
<text class="toggle-icon" :class="{ 'is-expanded': isExpanded }">›</text>
|
||
</view>
|
||
<view class="form-content" :class="{ 'is-expanded': isExpanded }">
|
||
<uni-forms :model="formData" label-width="100" :border="true">
|
||
<uni-forms-item label="领料单位：" name="leaseUnit">
|
||
<span class="form-view">{{ queryParams.leaseUnit }}</span>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="领料工程：" name="leaseProject">
|
||
<span class="form-view">{{ queryParams.leaseProject }}</span>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="物资类型：" name="maTypeName">
|
||
<span class="form-view">{{ queryParams.maTypeName }}</span>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="规格型号：" name="typeName">
|
||
<span class="form-view">{{ queryParams.typeName }}</span>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="预领数量：" name="preNum">
|
||
<span class="form-view">{{ queryParams.preNum }}</span>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="待出库数量：" name="maxNum">
|
||
<span class="form-view">{{ maxNum }}</span>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="" name="" v-if="checkedIds.length > 0">
|
||
<div
|
||
style="
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
max-height: 98px;
|
||
overflow-y: auto;
|
||
"
|
||
>
|
||
<div
|
||
v-for="(item, index) in checkedIds"
|
||
style="margin: 0 5px"
|
||
v-show="item.checked"
|
||
>
|
||
<span
|
||
>{{ item.maCode }}
|
||
<uni-icons
|
||
type="close"
|
||
size="18"
|
||
color="red"
|
||
@click="handleItemChecked(item)"
|
||
></uni-icons
|
||
></span>
|
||
</div>
|
||
</div>
|
||
</uni-forms-item>
|
||
</uni-forms>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="table-list-item">
|
||
<uni-row :gutter="24" style="display: flex; align-items: center">
|
||
<uni-col :span="6">出库方式：</uni-col>
|
||
<uni-col :span="6">
|
||
<view class="coding-btn" @tap="onCodeIdentify">OCR识别</view>
|
||
</uni-col>
|
||
<uni-col :span="6">
|
||
<view class="coding-btn" @tap="scanStart">二维码出库</view>
|
||
</uni-col>
|
||
<uni-col :span="6">
|
||
<view class="coding-btn" @tap="boxScan">标准箱出库</view>
|
||
</uni-col>
|
||
</uni-row>
|
||
</view>
|
||
<ScanQrCode
|
||
ref="scanQrCodeRef"
|
||
@scanSuccess="handleScanSuccess"
|
||
@scanError="handleScanError"
|
||
/>
|
||
<ScanQrCodeBox
|
||
ref="scanQrCodeRefBox"
|
||
@scanSuccessBox="handleScanSuccessBox"
|
||
@scanErrorBox="handleScanErrorBox"
|
||
/>
|
||
<view class="table-list-item">
|
||
<uni-row :gutter="24" style="display: flex; align-items: center">
|
||
<uni-col :span="6">
|
||
<view> 设备编码 </view>
|
||
</uni-col>
|
||
<uni-col :span="12">
|
||
<view>
|
||
<uni-easyinput
|
||
v-model="queryCodeParams.maCode"
|
||
placeholder="请输入内容"
|
||
/>
|
||
</view>
|
||
</uni-col>
|
||
<uni-col :span="6">
|
||
<view class="coding-btn search-btn" @tap="onCodeSearch">编码检索</view>
|
||
</uni-col>
|
||
</uni-row>
|
||
</view>
|
||
<scroll-view
|
||
scroll-y
|
||
@scrolltolower="onScrollTolower"
|
||
style="padding-bottom: 90rpx; height: 70vh"
|
||
>
|
||
<view class="table-list-item" v-for="item in codeDeviceList" :key="item.maId">
|
||
<uni-row :gutter="24">
|
||
<uni-col :span="8">物资类型：</uni-col>
|
||
<uni-col :span="12">
|
||
<view class="cont">{{ item.materialName }}</view>
|
||
</uni-col>
|
||
<uni-col :span="4">
|
||
<checkbox-group @change="onChangeChecked(item)">
|
||
<label>
|
||
<checkbox
|
||
color="#409eff"
|
||
borderColor="#409eff"
|
||
activeBorderColor="#409eff"
|
||
:checked="item.checked"
|
||
:disabled="
|
||
(maxNum === isSelectNum && !item.checked) ||
|
||
(isWithinOneMonth(item.nextCheckTime) && item.jiJuType == 2 && item.isCheck == '1')
|
||
"
|
||
style="transform: scale(0.7)"
|
||
/>
|
||
</label>
|
||
</checkbox-group>
|
||
</uni-col>
|
||
</uni-row>
|
||
<uni-row :gutter="24">
|
||
<uni-col :span="8">规格型号：</uni-col>
|
||
<uni-col :span="14">
|
||
<view class="cont">{{ item.materialModel }}</view>
|
||
</uni-col>
|
||
</uni-row>
|
||
<uni-row :gutter="24">
|
||
<uni-col :span="8">设备编码：</uni-col>
|
||
<uni-col :span="14">
|
||
<view class="cont">{{ item.maCode }}</view>
|
||
</uni-col>
|
||
</uni-row>
|
||
<uni-row :gutter="24">
|
||
<uni-col :span="8">设备状态：</uni-col>
|
||
<uni-col :span="14">
|
||
<view class="cont">{{ item.statusName }}</view>
|
||
</uni-col>
|
||
</uni-row>
|
||
<uni-row :gutter="24">
|
||
<uni-col :span="8">设备数量：</uni-col>
|
||
<uni-col :span="14">
|
||
<view class="cont">1</view>
|
||
</uni-col>
|
||
</uni-row>
|
||
<uni-row :gutter="24">
|
||
<uni-col :span="8">本次检验时间：</uni-col>
|
||
<uni-col :span="14">
|
||
<view class="cont">{{ item.thisCheckTime || '暂无' }}</view>
|
||
</uni-col>
|
||
</uni-row>
|
||
<uni-row :gutter="24">
|
||
<uni-col :span="8">下次检验时间：</uni-col>
|
||
<uni-col :span="14">
|
||
<view
|
||
class="cont"
|
||
:style="{
|
||
color: isWithinOneMonth(item.nextCheckTime) ? 'red' : '',
|
||
}"
|
||
>{{ item.nextCheckTime || '暂无' }}</view
|
||
>
|
||
</uni-col>
|
||
</uni-row>
|
||
</view>
|
||
|
||
<view class="loading-text">
|
||
{{ finish ? '没有更多数据了~' : '正在加载...' }}
|
||
</view>
|
||
</scroll-view>
|
||
</scroll-view>
|
||
<view class="outbound-btn" @tap="onHandleOutbound"> 出库 </view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref, computed, onUnmounted } from 'vue'
|
||
import { onLoad, onShow } from '@dcloudio/uni-app'
|
||
import {
|
||
getCodeDetailAPI,
|
||
getCodeDeviceListAPI,
|
||
setOutboundNumAPI,
|
||
getCodeScanAPI,
|
||
} from '@/services/picking/outbound.js'
|
||
import { getBoxBindByCode } from '@/services/standard.js'
|
||
import { debounce } from 'lodash-es'
|
||
import ScanQrCode from '@/pages/devicesSearch/ScanQrCode.vue'
|
||
import ScanQrCodeBox from '@/pages/devicesSearch/ScanQrCodeBox.vue'
|
||
// const query = defineProps() // 获取上级页面传递的路由参数
|
||
// const queryParams = JSON.parse(query.queryParams)
|
||
const loading = ref(false)
|
||
const scanQrCodeRef = ref(null)
|
||
const scanQrCodeRefBox = ref(null)
|
||
const queryParams = ref({})
|
||
const formData = ref({})
|
||
const codeDeviceList = ref([])
|
||
const maxNum = ref(0)
|
||
const total = ref(0)
|
||
const boxCode = ref('')
|
||
const boxInfo = ref({})
|
||
const checkedIds = ref([])
|
||
// 编码设备列表查询参数
|
||
const queryCodeParams = ref({
|
||
pageNum: 1,
|
||
pageSize: 10,
|
||
typeId: '',
|
||
maStatus: 1,
|
||
maCode: '',
|
||
})
|
||
const qrCodeScan = ref('')
|
||
const codeData = ref({})
|
||
|
||
// 控制表单展开收起
|
||
const isExpanded = ref(false)
|
||
|
||
// 切换表单展开状态
|
||
const toggleForm = () => {
|
||
isExpanded.value = !isExpanded.value
|
||
}
|
||
|
||
// 页面加载完毕
|
||
onLoad((options) => {
|
||
queryParams.value = JSON.parse(options.queryParams)
|
||
console.log('🚀 ~ queryParams.value:', queryParams.value)
|
||
getCodeDetailData(queryParams.value.id, queryParams.value.publishTask, queryParams.value.typeId) //获取详情
|
||
})
|
||
|
||
onShow(() => {
|
||
uni.$once('paramsReceived', (data) => {
|
||
console.log('🚀 ~ onShow ~ data:', data)
|
||
// 如果data.maId 不在 checkedIds 中 就往里面添加
|
||
if (!checkedIds.value.some(item => item.maId === data.maId)) {
|
||
checkedIds.value.push(data)
|
||
getCodeDeviceListData()
|
||
}
|
||
})
|
||
console.log(queryParams.value)
|
||
// getCodeDetailData(queryParams.value.id, queryParams.value.publishTask, queryParams.value.typeId) //获取详情
|
||
})
|
||
|
||
const handleItemChecked = (item) => {
|
||
console.log('🚀 ~ handleItemChecked ~ item:', item)
|
||
checkedIds.value = checkedIds.value.filter((el) => el.maId !== item.maId)
|
||
|
||
codeDeviceList.value.forEach((el) => {
|
||
if (el.maId === item.maId) {
|
||
el.checked = !el.checked
|
||
}
|
||
})
|
||
}
|
||
|
||
const isWithinOneMonth = (dateStr) => {
|
||
if (!dateStr) return false
|
||
|
||
const inputDate = new Date(dateStr)
|
||
const today = new Date()
|
||
today.setHours(0, 0, 0, 0) // 清除时分秒
|
||
|
||
const diffTime = inputDate.getTime() - today.getTime()
|
||
const diffDays = diffTime / (1000 * 60 * 60 * 24)
|
||
|
||
return diffDays <= 90
|
||
}
|
||
|
||
// 获取编码列表
|
||
const getCodeDetailData = async (id, publishTask, typeId) => {
|
||
console.log('yyyyyyyyyy', id, publishTask, typeId)
|
||
const res = await getCodeDetailAPI({ id: id, publishTask: publishTask, typeId: typeId })
|
||
console.log('zzzzzzzzz', res)
|
||
formData.value = res.data
|
||
console.log('xxxxxxxxxxxxxx', formData.value, maxNum.value)
|
||
maxNum.value = formData.value.preNum - formData.value.alNum
|
||
|
||
queryParams.value.jiJuType = res.data.jiJuType
|
||
queryCodeParams.value.typeId = queryParams.value.typeId
|
||
queryCodeParams.value.pageNum = 1
|
||
codeDeviceList.value = []
|
||
getCodeDeviceListData() //获取编码列表
|
||
}
|
||
|
||
// 获取编码列表
|
||
const getCodeDeviceListData = async () => {
|
||
const ids = checkedIds.value.map((item) => item.maId)
|
||
const checkedIdSet = new Set(ids)
|
||
const res = await getCodeDeviceListAPI(queryCodeParams.value)
|
||
console.log('🚀 ~ getCodeDeviceListData ~ res:', res)
|
||
const newRows = res.rows || []
|
||
const map = new Map()
|
||
|
||
// 先放入旧数据（保留滚动加载场景）
|
||
codeDeviceList.value.forEach((item) => {
|
||
map.set(item.maId, item)
|
||
})
|
||
|
||
// 再放入新数据，设置 checked 状态
|
||
newRows.forEach((item) => {
|
||
map.set(item.maId, {
|
||
...item,
|
||
checked: checkedIdSet.has(item.maId),
|
||
})
|
||
})
|
||
|
||
// 更新最终列表：已勾选的排在最前面
|
||
const allItems = Array.from(map.values())
|
||
codeDeviceList.value = [
|
||
...allItems.filter(item => item.checked), // 勾选的
|
||
...allItems.filter(item => !item.checked) // 未勾选的
|
||
]
|
||
total.value = res.total || 0
|
||
}
|
||
|
||
// 编码搜索按钮
|
||
const onCodeSearch = () => {
|
||
queryCodeParams.value.pageNum = 1
|
||
codeDeviceList.value = []
|
||
getCodeDeviceListData()
|
||
}
|
||
|
||
// 滚动触底事件
|
||
const onScrollTolower = debounce(() => {
|
||
// console.log('滚动触底--')
|
||
if (total.value > codeDeviceList.value.length) {
|
||
queryCodeParams.value.pageSize += 5
|
||
getCodeDeviceListData()
|
||
}
|
||
}, 500)
|
||
|
||
// 判断数<E696AD><E695B0>是否加载完毕
|
||
const finish = computed(() => {
|
||
if (total.value === codeDeviceList.value.length) return true
|
||
})
|
||
|
||
// 复选框事件
|
||
const onChangeChecked = (item) => {
|
||
item.checked = !item.checked
|
||
if (item.checked) {
|
||
checkedIds.value.push(item)
|
||
} else {
|
||
checkedIds.value = checkedIds.value.filter((check) => check.maId !== item.maId)
|
||
}
|
||
}
|
||
|
||
// 计算已选择数量
|
||
const isSelectNum = computed(() => {
|
||
const isSelectList = codeDeviceList.value.filter((e) => e.checked === true)
|
||
if (maxNum.value === isSelectList.length) {
|
||
uni.showToast({
|
||
title: '勾选设备已达到最大待出库数量！',
|
||
icon: 'none',
|
||
})
|
||
}
|
||
return isSelectList.length
|
||
})
|
||
|
||
// 出库按钮
|
||
const onHandleOutbound = async () => {
|
||
const isSelect = checkedIds.value.length > 0
|
||
if (!isSelect) {
|
||
uni.showToast({
|
||
title: '请勾选需要出库的设备',
|
||
icon: 'none',
|
||
})
|
||
return
|
||
}
|
||
if (loading.value) {
|
||
uni.showToast({
|
||
title: '请勿重复提交!',
|
||
icon: 'none',
|
||
})
|
||
return
|
||
}
|
||
uni.showLoading()
|
||
loading.value = true
|
||
// 解构所需要的数据
|
||
const { typeId, parentId, publishTask } = queryParams.value
|
||
// 组装出库参数
|
||
const paramsList = []
|
||
checkedIds.value.map((e) => {
|
||
paramsList.push({
|
||
leaseType: 0,
|
||
maId: e.maId,
|
||
maCode: e.maCode,
|
||
manageType: 0,
|
||
outNum: 1,
|
||
parentId,
|
||
typeId,
|
||
publishTask,
|
||
jiJuType: e.jiJuType,
|
||
publishTask: queryParams.value.publishTask,
|
||
leaseProject: queryParams.value.leaseProject,
|
||
leaseProjectId: queryParams.value.leaseProjectId,
|
||
leaseUnit: queryParams.value.leaseUnit,
|
||
leaseUnitId: queryParams.value.leaseUnitId,
|
||
taskId: queryParams.value.taskId,
|
||
})
|
||
})
|
||
console.log('mmmmmmmmmmmmmmmm', paramsList)
|
||
try {
|
||
const res = await setOutboundNumAPI({ leaseOutDetailsList: paramsList })
|
||
loading.value = false
|
||
uni.hideLoading()
|
||
if (res.code === 200) {
|
||
uni.showToast({
|
||
title: '出库成功！',
|
||
icon: 'none',
|
||
})
|
||
// getCodeDetailData(
|
||
// queryParams.value.id,
|
||
// queryParams.value.publishTask,
|
||
// queryParams.value.typeId,
|
||
// ) //获取详情
|
||
uni.navigateBack()
|
||
}
|
||
} catch (error) {
|
||
console.log('🚀 ~ onHandleOutbound ~ error:', error)
|
||
loading.value = false
|
||
}
|
||
}
|
||
|
||
// 标准箱识别
|
||
const boxScan = async () => {
|
||
if (maxNum.value == 0) {
|
||
uni.showToast({
|
||
title: '待出库数量已为0！',
|
||
icon: 'none',
|
||
})
|
||
} else {
|
||
boxCode.value = ''
|
||
// var mpaasScanModule = uni.requireNativePlugin('Mpaas-Scan-Module')
|
||
// mpaasScanModule.mpaasScan(
|
||
// {
|
||
// // 扫码识别类型，参数可多选，qrCode、barCode，不设置，默认识别所有
|
||
// scanType: ['qrCode', 'barCode'],
|
||
// // 是否隐藏相册，默认false不隐藏
|
||
// hideAlbum: false,
|
||
// //ios需要设置这个参数，只支持中英文 zh-Hans、en，默认中文
|
||
// language: 'en',
|
||
// //相册选择照片识别错误提示(ios)
|
||
// failedMsg: '未识别到二维码，请重试',
|
||
// //Android支持全屏需要设置此参数
|
||
// screenType: 'full',
|
||
// },
|
||
// (ret) => {
|
||
// if (ret.resp_code == 10) {
|
||
// uni.showToast({ title: '用户取消', icon: 'none' })
|
||
// }
|
||
// if (ret.resp_code == 11) {
|
||
// uni.showToast({ title: '扫码失败', icon: 'none' })
|
||
// }
|
||
// if (ret.resp_code == 1000) {
|
||
// boxCode.value = ret.resp_result
|
||
// if (boxCode.value == '') {
|
||
// uni.showToast({ title: '扫码识别失败', icon: 'none' })
|
||
// } else {
|
||
// boxOut()
|
||
// }
|
||
// }
|
||
// },
|
||
// )
|
||
if (scanQrCodeRefBox.value) {
|
||
scanQrCodeRefBox.value.scanQrCode()
|
||
}
|
||
}
|
||
}
|
||
|
||
// 处理扫描成功事件
|
||
const handleScanSuccessBox = (result) => {
|
||
console.log('🚀 ~ handleScanSuccessBox ~ result:', result)
|
||
boxCode.value = result?.data?.split('?qrcode=')[1] || result?.data || ''
|
||
if (boxCode.value === '') {
|
||
uni.showToast({ title: '扫码识别失败', icon: 'none' })
|
||
} else {
|
||
boxOut()
|
||
}
|
||
}
|
||
|
||
// 处理扫描失败事件
|
||
const handleScanErrorBox = (error) => {
|
||
console.error('扫描出错:', error.message)
|
||
uni.showToast({ title: error.message, icon: 'none' })
|
||
}
|
||
|
||
// 标准箱出库确认
|
||
const boxOut = async () => {
|
||
console.log(queryParams)
|
||
if (boxCode.value == '') {
|
||
uni.showToast({ title: '扫码识别失败', icon: 'none' })
|
||
} else {
|
||
let param = {
|
||
boxCode: boxCode.value,
|
||
maTypeId: queryParams.value.typeId,
|
||
}
|
||
console.log(param)
|
||
const res = await getBoxBindByCode(param)
|
||
console.log(res)
|
||
if (res.code == 200) {
|
||
boxInfo.value = res.data
|
||
if (boxInfo.value.recordList && boxInfo.value.recordList.length > 0) {
|
||
if (boxInfo.value.recordList.length > maxNum.value) {
|
||
uni.showToast({ title: '标准箱绑定设备数量多于待出库数量！', icon: 'none' })
|
||
} else {
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: boxInfo.value.msg,
|
||
confirmText: '确定',
|
||
cancelText: '取消',
|
||
success: async (res) => {
|
||
if (res.confirm) {
|
||
boxOutBound()
|
||
}
|
||
},
|
||
})
|
||
}
|
||
} else {
|
||
uni.showToast({ title: '标准箱未绑定设备！', icon: 'none' })
|
||
}
|
||
} else {
|
||
uni.showToast({ title: '扫码识别失败', icon: 'none' })
|
||
}
|
||
}
|
||
}
|
||
// 标准箱出库确认
|
||
const boxOutBound = async () => {
|
||
// 解构所需要的数据
|
||
const { typeId, parentId, publishTask } = queryParams.value
|
||
// 组装出库参数
|
||
const paramsList = []
|
||
boxInfo.value.recordList.map((e) => {
|
||
paramsList.push({
|
||
leaseType: 0,
|
||
boxId: e.boxId,
|
||
maId: e.maId,
|
||
maCode: e.maCode,
|
||
manageType: 0,
|
||
outType: 3, // 出库方式 0数量，1编码，2二维码，3标准箱
|
||
outNum: 1,
|
||
parentId,
|
||
typeId,
|
||
publishTask,
|
||
})
|
||
})
|
||
console.log(paramsList)
|
||
const res = await setOutboundNumAPI({ leaseOutDetailsList: paramsList })
|
||
if (res.code === 200) {
|
||
uni.showToast({
|
||
title: '出库成功！',
|
||
icon: 'none',
|
||
})
|
||
getCodeDetailData(
|
||
queryParams.value.id,
|
||
queryParams.value.publishTask,
|
||
queryParams.value.typeId,
|
||
) //获取详情
|
||
}
|
||
}
|
||
|
||
// 编码识别按钮
|
||
const onCodeIdentify = () => {
|
||
console.log('编码识别--')
|
||
if (maxNum.value == 0) {
|
||
uni.showToast({
|
||
title: '待出库数量已为0！',
|
||
icon: 'none',
|
||
})
|
||
} else {
|
||
uni.navigateTo({
|
||
url: `/pages/picking/outbound/codeOutScan?params=${JSON.stringify(
|
||
queryParams.value,
|
||
)}`,
|
||
})
|
||
}
|
||
}
|
||
|
||
// 扫码识别按钮
|
||
const scanStart = () => {
|
||
// qrCodeScan.value = '202401-00006'
|
||
// getMaInfoScan()
|
||
if (maxNum.value == 0) {
|
||
uni.showToast({
|
||
title: '待出库数量已为0！',
|
||
icon: 'none',
|
||
})
|
||
} else {
|
||
// var mpaasScanModule = uni.requireNativePlugin("Mpaas-Scan-Module")
|
||
// mpaasScanModule.mpaasScan({
|
||
// // 扫码识别类型，参数可多选，qrCode、barCode，不设置，默认识别所有
|
||
// 'scanType': ['qrCode','barCode'],
|
||
// // 是否隐藏相册，默认false不隐藏
|
||
// 'hideAlbum': false,
|
||
// //ios需要设置这个参数，只支持中英文 zh-Hans、en，默认中文
|
||
// 'language' : 'en',
|
||
// //相册选择照片识别错误提示(ios)
|
||
// 'failedMsg': '未识别到二维码，请重试',
|
||
// //Android支持全屏需要设置此参数
|
||
// 'screenType': 'full'
|
||
// },(ret) => {
|
||
// if(ret.resp_code==10){
|
||
// uni.showToast({ title: '用户取消', icon: 'none' })
|
||
// }
|
||
// if(ret.resp_code==11){
|
||
// uni.showToast({ title: '扫码失败', icon: 'none' })
|
||
// }
|
||
// if(ret.resp_code==1000){
|
||
// // uni.showToast({ title: '成功', icon: 'none' })
|
||
// console.log('444444444444444',ret)
|
||
// qrCodeScan.value = ret.resp_result
|
||
// if (qrCodeScan.value=="") {
|
||
// uni.showToast({ title: '扫码识别失败', icon: 'none'})
|
||
// }else{
|
||
// getMaInfoScan()
|
||
// }
|
||
// }
|
||
// })
|
||
if (scanQrCodeRef.value) {
|
||
scanQrCodeRef.value.scanQrCode()
|
||
}
|
||
}
|
||
}
|
||
|
||
// 处理扫描成功事件
|
||
const handleScanSuccess = (result) => {
|
||
console.log('🚀 ~ handleScanSuccess ~ result:', result)
|
||
qrCodeScan.value = result?.data?.split('?qrcode=')[1] || result?.data
|
||
console.log('🚀 ~ handleScanSuccess ~ qrCodeScan.value:', qrCodeScan.value)
|
||
if (qrCodeScan.value === '') {
|
||
uni.showToast({ title: '扫码识别失败', icon: 'none' })
|
||
} else {
|
||
getMaInfoScan()
|
||
}
|
||
}
|
||
|
||
// 处理扫描失败事件
|
||
const handleScanError = (error) => {
|
||
console.error('扫描出错:', error.message)
|
||
uni.showToast({ title: error.message, icon: 'none' })
|
||
}
|
||
|
||
//查看是否是该规格型号
|
||
const getMaInfoScan = async () => {
|
||
let param = {
|
||
qrCode: qrCodeScan.value,
|
||
}
|
||
const res = await getCodeScanAPI(param)
|
||
console.log(res)
|
||
if (res.code == 200) {
|
||
if (res.data && res.data.recordList.length > 0) {
|
||
if (res.data.recordList[0].typeModelName != queryParams.value.typeName) {
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '当前扫描到的物资规格与当前任务规格不一致, 请仔细检查核对',
|
||
confirmText: '关闭',
|
||
confirmColor: '#FF0000',
|
||
showCancel: false,
|
||
})
|
||
return
|
||
}
|
||
codeData.value = res.data.recordList[0]
|
||
// confirmCodeOutBound()
|
||
uni.showModal({
|
||
title: '确认出库',
|
||
content: `物资类型：${res.data.recordList[0].typeName}\n规格型号：${res.data.recordList[0].typeModelName}\n设备编码：${res.data.recordList[0].maCode}`,
|
||
confirmText: '确定',
|
||
cancelText: '取消',
|
||
success: async (res) => {
|
||
if (res.confirm) {
|
||
confirmCodeOutBound()
|
||
}
|
||
},
|
||
})
|
||
} else {
|
||
uni.showToast({ title: res.data.msg, icon: 'none' })
|
||
}
|
||
} else {
|
||
uni.showToast({ title: res.data.msg, icon: 'none' })
|
||
}
|
||
}
|
||
// 二维码出库确认
|
||
const confirmCodeOutBound = async () => {
|
||
// 解构所需要的数据
|
||
const { typeId, parentId, publishTask } = queryParams.value
|
||
// 组装出库参数
|
||
const paramsList = []
|
||
paramsList.push({
|
||
leaseType: 0,
|
||
maId: codeData.value.maId,
|
||
maCode: codeData.value.maCode,
|
||
manageType: 0,
|
||
// 出库方式 0数量，1编码，2二维码，3标准箱
|
||
outType: 2,
|
||
outNum: 1,
|
||
parentId,
|
||
typeId,
|
||
typeName: codeData.value.typeName,
|
||
typeModelName: codeData.value.typeModelName,
|
||
publishTask,
|
||
})
|
||
const res = await setOutboundNumAPI({ leaseOutDetailsList: paramsList })
|
||
console.log('333333333333', res)
|
||
if (res.code === 200) {
|
||
uni.showToast({
|
||
title: '出库成功！',
|
||
icon: 'none',
|
||
})
|
||
getCodeDetailData(
|
||
queryParams.value.id,
|
||
queryParams.value.publishTask,
|
||
queryParams.value.typeId,
|
||
) //获取详情
|
||
setTimeout(() => {
|
||
scanStart()
|
||
}, 800)
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.page-container {
|
||
display: flex;
|
||
height: 100%;
|
||
flex-direction: column;
|
||
background-color: #f7f8fa;
|
||
padding: 24rpx;
|
||
|
||
.table-list-item {
|
||
background: #fff;
|
||
padding: 15rpx 32rpx;
|
||
border-radius: 20rpx;
|
||
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
|
||
margin-bottom: 24rpx;
|
||
|
||
// 表单样式
|
||
:deep(.uni-forms) {
|
||
.uni-forms-item {
|
||
margin-bottom: 24rpx;
|
||
padding: 0;
|
||
|
||
&:last-child {
|
||
margin-bottom: 0;
|
||
}
|
||
|
||
.uni-forms-item__label {
|
||
color: #8c8c8c;
|
||
font-size: 28rpx;
|
||
font-weight: 500;
|
||
padding: 0;
|
||
line-height: 1.8;
|
||
}
|
||
|
||
.uni-forms-item__content {
|
||
display: flex;
|
||
align-items: center;
|
||
min-height: unset;
|
||
}
|
||
}
|
||
}
|
||
|
||
// 编码按钮组
|
||
.coding-btn {
|
||
padding: 16rpx 0;
|
||
background: linear-gradient(135deg, #4b8eff 0%, #3784fb 100%);
|
||
border-radius: 12rpx;
|
||
text-align: center;
|
||
color: #fff;
|
||
font-size: 28rpx;
|
||
font-weight: 600;
|
||
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
|
||
transition: all 0.3s ease;
|
||
|
||
&:active {
|
||
transform: scale(0.98);
|
||
opacity: 0.9;
|
||
}
|
||
|
||
// 编码检索按钮特殊样式
|
||
&.search-btn {
|
||
padding: 12rpx 0;
|
||
background: #fff;
|
||
color: #ff9800;
|
||
border: 2rpx solid rgba(255, 152, 0, 0.5);
|
||
background: linear-gradient(
|
||
to bottom,
|
||
rgba(255, 152, 0, 0.05),
|
||
rgba(255, 152, 0, 0.1)
|
||
);
|
||
box-shadow: none;
|
||
font-weight: 600;
|
||
letter-spacing: 1rpx;
|
||
|
||
&:active {
|
||
background: rgba(255, 152, 0, 0.15);
|
||
border-color: rgba(255, 152, 0, 0.6);
|
||
transform: translateY(1rpx);
|
||
}
|
||
}
|
||
}
|
||
|
||
// 编码列表样式
|
||
:deep(.uni-row) {
|
||
// margin-bottom: 20rpx;
|
||
|
||
&:last-child {
|
||
margin-bottom: 0;
|
||
}
|
||
|
||
.uni-col-6 {
|
||
color: #8c8c8c;
|
||
font-size: 28rpx;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.cont {
|
||
color: #262626;
|
||
font-size: 28rpx;
|
||
font-weight: 500;
|
||
line-height: 1.8;
|
||
}
|
||
}
|
||
|
||
// 输入框样式
|
||
:deep(.uni-easyinput__content) {
|
||
background-color: #f7f8fa;
|
||
border: 2rpx solid #e8e8e8;
|
||
border-radius: 12rpx;
|
||
height: 75rpx;
|
||
transition: all 0.3s ease;
|
||
|
||
&:focus-within {
|
||
border-color: #3784fb;
|
||
box-shadow: 0 0 0 2rpx rgba(55, 132, 251, 0.1);
|
||
}
|
||
|
||
.uni-easyinput__content-input {
|
||
font-size: 28rpx;
|
||
color: #262626;
|
||
}
|
||
}
|
||
|
||
// 复选框样式
|
||
:deep(checkbox) {
|
||
.wx-checkbox-input {
|
||
width: 36rpx;
|
||
height: 36rpx;
|
||
border-radius: 8rpx;
|
||
border: 2rpx solid #e8e8e8;
|
||
background: transparent;
|
||
|
||
&.wx-checkbox-input-checked {
|
||
background: #3784fb;
|
||
border-color: #3784fb;
|
||
|
||
&::before {
|
||
font-size: 28rpx;
|
||
color: #fff;
|
||
}
|
||
}
|
||
|
||
&.wx-checkbox-input-disabled {
|
||
background: #f5f5f5;
|
||
border-color: #e8e8e8;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
// 底部出库按钮
|
||
.outbound-btn {
|
||
position: fixed;
|
||
bottom: 40rpx;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
width: 90%;
|
||
height: 88rpx;
|
||
background: linear-gradient(135deg, #4b8eff 0%, #3784fb 100%);
|
||
text-align: center;
|
||
line-height: 88rpx;
|
||
color: #fff;
|
||
border-radius: 12rpx;
|
||
font-size: 32rpx;
|
||
font-weight: 600;
|
||
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
|
||
transition: all 0.3s ease;
|
||
|
||
&:active {
|
||
transform: translateX(-50%) scale(0.98);
|
||
opacity: 0.9;
|
||
}
|
||
}
|
||
}
|
||
|
||
// 加载提示文字
|
||
.loading-text {
|
||
text-align: center;
|
||
font-size: 26rpx;
|
||
color: #8c8c8c;
|
||
padding: 32rpx 0;
|
||
letter-spacing: 1rpx;
|
||
}
|
||
|
||
.form-section {
|
||
background: #fff;
|
||
border-radius: 20rpx;
|
||
margin-bottom: 24rpx;
|
||
overflow: hidden;
|
||
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
|
||
|
||
// 头部样式
|
||
.section-header {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
padding: 24rpx 32rpx;
|
||
background: #fff;
|
||
cursor: pointer;
|
||
transition: all 0.3s ease;
|
||
|
||
&:active {
|
||
background: #f7f8fa;
|
||
}
|
||
|
||
.title {
|
||
font-size: 32rpx;
|
||
font-weight: 600;
|
||
color: #262626;
|
||
}
|
||
|
||
.toggle-icon {
|
||
font-size: 40rpx;
|
||
color: #8c8c8c;
|
||
transform: rotate(90deg);
|
||
transition: transform 0.3s ease;
|
||
display: inline-block;
|
||
|
||
&.is-expanded {
|
||
transform: rotate(-90deg);
|
||
}
|
||
}
|
||
}
|
||
|
||
// 表单内容区域
|
||
.form-content {
|
||
max-height: 0;
|
||
overflow: hidden;
|
||
transition: max-height 0.3s ease-out;
|
||
|
||
&.is-expanded {
|
||
max-height: 1000rpx; // 根据实际内容调整
|
||
}
|
||
|
||
:deep(.uni-forms) {
|
||
padding: 0 32rpx 32rpx;
|
||
}
|
||
|
||
:deep(.uni-forms-item) {
|
||
margin-bottom: 24rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
&:last-child {
|
||
margin-bottom: 0;
|
||
}
|
||
|
||
.uni-forms-item__label {
|
||
color: #8c8c8c;
|
||
}
|
||
|
||
.form-view {
|
||
color: #262626;
|
||
font-size: 28rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style>
|