bonus-material-app/src/pages/repair/testedInBound/codeScan.vue

<template>
    <view class="accept page-common"> 
        <div class="card" style="margin-top: 10px;">
            <uni-row :gutter="24">
                <uni-col :span="6">入库方式：</uni-col>
                <uni-col :span="6">
                    <view class="coding-btn" @click="codeScan">编码识别</view>
                </uni-col>
                <uni-col :span="6">
                    <view class="coding-btn" @click="codeScan">二维码识别</view>
                </uni-col>
                <uni-col :span="6">
                    <view class="coding-btn" >标准箱识别</view>
                </uni-col>
            </uni-row>
        </div>
 
        <div class="card" style="margin-top: 10px;">  
			<div style="font-size: 32rpx;font-weight: 600;margin-bottom: 20rpx;">设备信息</div>
			<uni-row :gutter="24" style="display: flex; align-items: center;margin-bottom: 10px;">
				<uni-col :span="8">退料单位：</uni-col>
				<uni-col :span="16">
					{{ maInfo.backUnit }}
				</uni-col>
			</uni-row> 
			<uni-row :gutter="24" style="display: flex; align-items: center;margin-bottom: 10px;">
			    <uni-col :span="8">退料工程：</uni-col>
			    <uni-col :span="16">
			        {{ maInfo.backPro }}
			    </uni-col>
			</uni-row>
			<uni-row :gutter="24" style="display: flex; align-items: center;margin-bottom: 10px;">
				<uni-col :span="8">二维码编号：</uni-col>
				<uni-col :span="16">
					{{ maInfo.qrCode }}
				</uni-col>
			</uni-row>
			<uni-row :gutter="24" style="display: flex; align-items: center;margin-bottom: 10px;">
				<uni-col :span="8">设备编码：</uni-col>
				<uni-col :span="16">
					{{ maInfo.maCode }}
				</uni-col>
			</uni-row>
			<uni-row :gutter="24" style="display: flex; align-items: center;margin-bottom: 10px;">
				<uni-col :span="8">物资类型：</uni-col>
				<uni-col :span="16">
					{{ maInfo.typeName }}
				</uni-col>
			</uni-row>
			<uni-row :gutter="24" style="display: flex; align-items: center;margin-bottom: 10px;">
			    <uni-col :span="8">规格型号：</uni-col>
			    <uni-col :span="16">
			        {{  maInfo.typeModelName }}
			    </uni-col>
			</uni-row>
			<uni-row :gutter="24" style="display: flex; align-items: center;margin-bottom: 10px;">
			    <uni-col :span="8">维修单号：</uni-col>
			    <uni-col :span="16">
			        {{  maInfo.repairCode }}
			    </uni-col>
			</uni-row>
			<uni-row :gutter="24" style="display: flex; align-items: center;margin-bottom: 10px;">
				<uni-col :span="8">入库单号：</uni-col>
				<uni-col :span="16">
					{{  maInfo.inputCode }}
				</uni-col>
			</uni-row>
          
            <uni-row :gutter="24" style="display: flex; align-items: center;margin-bottom: 10px;">
                <uni-col :span="8">设备状态：</uni-col>
                <uni-col :span="16">
                    {{ maInfo.statusName }}
                </uni-col>
            </uni-row> 
        </div>

       <div class="btn">
            <button class="btn-cont" @click="cinfirmCodeInBound">入库</button>
            <button class="btn-cont" @click="cancelPage">取消</button>
        </div>
    </view>
</template>

<script setup>
import { ref, reactive } from 'vue'
import { onLoad } from '@dcloudio/uni-app'   
import { getCodeListApi,repairInputWarehouseApi,rejectWarehouseApi,getInfoByQrcodeApi } from '@/services/repair/testedInBound.js'
const taskInfo = ref({})    
const maId = ref("")  //编码
const maCode = ref("")  //编码
const typeName = ref("")//物资类型
const materialName = ref("")  //规格型号
const typeId = ref("")  //类型id
const maStatusName = ref("")  //状态   
const qrCode = ref("")  //二维码  
const maInfo = ref({})  //二维码  
  

// 二维码扫码
const codeScan = async () => { 
    qrCode.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) => {
		console.log(ret)
		if(ret.resp_code==10){
			uni.showToast({ title: '用户取消', icon: 'none' })
			maInfo.value = {}
		}
		if(ret.resp_code==11){
			uni.showToast({ title: '扫码失败', icon: 'none' })
		}
		if(ret.resp_code==1000){
			// uni.showToast({ title: '扫码成功', icon: 'none' })
			qrCode.value = ret.resp_result.split("qrcode=")[1];
			codeInBound()
		}
		// uni.showModal({
		// 	title: "弹窗标题",
		// 	// 返回值中，resp_code 表示返回结果值，10：用户取消，11：其他错误，1000：成功
		// 	// 返回值中，resp_message 表示返回结果信息
		// 	// 返回值中，resp_result 表示扫码结果，只有成功才会有返回
		// 	content: JSON.stringify(ret),
		// 	showCancel: false,
		// 	confirmText: "确定"
		// })
	}) 
}
// 二维码入库
const codeInBound = async () => { 
	if(qrCode.value==""){
	    uni.showToast({ title: '扫码识别失败', icon: 'none'})
	}else{
	    let param = {
	        qrCode: qrCode.value, 
	    }
		//通过二维码获取相绑定的设备编码
	    const res = await getInfoByQrcodeApi(param)
	    console.log(res)
	    if(res.data.code==200){
	        maInfo.value = res.data[0] 
			if(maInfo.value.maCode!=undefined&&maInfo.value.maCode!=""){ 
			}else{
				uni.showToast({ title: '扫码二维码未绑定设备编码！', icon: 'none'})
			} 
	    }else{
	        uni.showToast({ title: res.data.msg, icon: 'none'})
	    }
	} 
}
// 二维码入库确认
const cinfirmCodeInBound = async () => {
	if(maInfo.value.taskId==''&&maInfo.value.typeId==''){
		uni.showToast({
			title: '请先扫码！',
			icon: 'none',
		})     
	}else{
		let arr=[{"maCode":maInfo.value.maCode,"maId":maInfo.value.maId}]
		let param = {
			taskId: maInfo.value.taskId,
			typeId:	maInfo.value.typeId, 
			agreementId: maInfo.value.agreementId, 
			maCodeList: arr,
		} 
		const res = await repairInputWarehouseApi(param)
		if (res.code === 200) {
		   uni.showToast({
			   title: '入库成功！',
			   icon: 'none',
		   })    
		   setTimeout(() => { 
			codeScan()  
		   }, 800)
		}
	} 
}

 

const cancelPage = () => {
    uni.navigateBack({
        delta: 1 // 返回到已存在的页面
    });
}
onLoad((options)=>{
	console.log(options)
	// taskInfo.value = JSON.parse(options.taskInfo) 
})
</script>

<style lang="scss">
.accept {
    padding: 10px;
    height: 100%;
    word-break: break-all;
}
.card {
    padding: 10px;
    background-color: #fff;
    border-radius: 6px;
    box-shadow: 0 2upx 4upx 0 rgba(0, 0, 0, 0.1);
}
.coding-btn {
    padding: 5rpx 0;
    background-color: #409eff;
    border-radius: 6rpx;
    text-align: center;
    color: #fff;
    font-size: 14px;
}
.upload {
    width: 80px;
    height: 80px;
    background-color: #f5f5f5;
    border-radius: 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    color: #ccc;
    margin-top: 10px;
}
.btn {
    display: flex;
    justify-content: space-around;
    margin-top: 30px;

    .btn-cont {
        width: 40%;
        height: 40px;
        line-height: 40px;
        text-align: center;
        background-color: #3784fb;
        color: #fff;
        border-radius: 10rpx;
        // 取消按钮淡蓝色
        &:last-child {
            background-color: #aacefb;
        }
    }
}
</style>