283 lines
8.0 KiB
Vue
283 lines
8.0 KiB
Vue
<template>
|
||
<view>
|
||
<uni-collapse style="width: 100%;">
|
||
<uni-forms ref="form" :modelValue="getCode" class="form">
|
||
<uni-easyinput type="text" prefixIcon="scan"
|
||
class="Number"
|
||
placeholder="请扫描销售工业条码!"
|
||
placeholderStyle="color:black"
|
||
v-model="getCode.Industry"
|
||
@iconClick="iconClick('industry')"
|
||
@confirm="getIndustry"
|
||
:focus="focusFoIndustry"
|
||
clearable
|
||
/>
|
||
<uni-collapse-item :disabled="open" :open="!open" class="uniCollapse">
|
||
<form class="form" >
|
||
<uni-table border stripe emptyText="暂无更多数据" >
|
||
<!-- 表格数据行 -->
|
||
<uni-tr>
|
||
<uni-td align="center" width="30">物料编码</uni-td>
|
||
<uni-td align="center" width="70">{{form.materialCode}}</uni-td>
|
||
</uni-tr>
|
||
<uni-tr>
|
||
<uni-td align="center" width="30">工业条码</uni-td>
|
||
<uni-td align="center" width="70">{{form.Industry}}</uni-td>
|
||
</uni-tr>
|
||
<uni-tr>
|
||
<uni-td align="center" width="30">物料名称</uni-td>
|
||
<uni-td align="center" width="70">{{form.materialName}}</uni-td>
|
||
</uni-tr>
|
||
<uni-tr>
|
||
<uni-td align="center" width="30">规格</uni-td>
|
||
<uni-td align="center" width="70">{{form.specification1}}</uni-td>
|
||
</uni-tr>
|
||
</uni-table>
|
||
<br />
|
||
<uni-easyinput type="text" prefixIcon="scan"
|
||
class="Number"
|
||
placeholder="请扫描组件二维码!"
|
||
placeholderStyle="color:black"
|
||
v-model="getCode.computed"
|
||
@iconClick="iconClick('subassembly')"
|
||
@confirm="getSubassembly"
|
||
:focus="focusComputed"
|
||
clearable
|
||
/>
|
||
<uni-table border stripe emptyText="暂无更多数据" >
|
||
<!-- 表头行 -->
|
||
<uni-tr>
|
||
<uni-th align="center" width="70">编码</uni-th>
|
||
<uni-th align="center" width="30">操作</uni-th>
|
||
</uni-tr>
|
||
<!-- 表格数据行 -->
|
||
<uni-tr v-for="(item,index) in form.list" :key="index">
|
||
<uni-td align="center">{{item.componentCode}}</uni-td>
|
||
<uni-td align="center">
|
||
<u-button @click="deleteList(item)">删除</u-button>
|
||
</uni-td>
|
||
</uni-tr>
|
||
</uni-table>
|
||
</form>
|
||
</uni-collapse-item>
|
||
</uni-forms>
|
||
</uni-collapse>
|
||
<uni-popup ref="alertDialog" type="dialog">
|
||
<uni-popup-dialog cancelText="关闭" confirmText="同意" title="通知" :content="'是否删除编码为'+item.componentCode+'的单子'" @confirm="dialogConfirm"
|
||
@close="dialogClose"></uni-popup-dialog>
|
||
</uni-popup>
|
||
<!-- 提示信息弹窗 -->
|
||
<uni-popup ref="message" type="message">
|
||
<uni-popup-message :type="msgType" :message="messageText" :duration="2000"></uni-popup-message>
|
||
</uni-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
getMaterial,
|
||
} from "@/api/mes/material.js";
|
||
import {
|
||
getSubassembly,
|
||
insertSubassembly,
|
||
deletSubassembly
|
||
} from "@/api/mes/wmsPieceOutRecord.js"
|
||
export default {
|
||
data() {
|
||
return {
|
||
//工业条码自动聚焦
|
||
focusFoIndustry:true,
|
||
focusComputed:false,
|
||
//解析的码数据
|
||
getCode:{
|
||
//工业条码
|
||
Industry:null,
|
||
//组件
|
||
computed:null,
|
||
},
|
||
//控制明细区是否展开
|
||
open:true,
|
||
//获取到的数据
|
||
form:{
|
||
list:[{
|
||
name:1,
|
||
id:3
|
||
},{
|
||
name:2,
|
||
id:4
|
||
}]
|
||
},
|
||
//要删除的信息
|
||
item:{},
|
||
//提示信息
|
||
messageText:null,
|
||
msgType:'info'
|
||
}
|
||
},
|
||
methods: {
|
||
/**
|
||
* 扫码方法
|
||
* @param {Object} value {industry || number }
|
||
*/
|
||
iconClick(value){
|
||
const _this = this;
|
||
uni.scanCode({
|
||
// 是否只能从相机扫码，不允许从相册选择图片
|
||
onlyFromCamera:true,
|
||
// 扫码类型
|
||
scanType: ['barCode', 'qrCode'],
|
||
success: function(res) {
|
||
value === 'industry' ? _this.getIndustry(res.result) : value;
|
||
value === 'subassembly' ? _this.getSubassembly(res.result) : value;
|
||
}
|
||
})
|
||
},
|
||
/**
|
||
* 扫描工业条码
|
||
* @param {Object} pieceBarcode 解析到的条码数据
|
||
*/
|
||
async getIndustry(pieceBarcode){
|
||
const _self = this;
|
||
//判断工业条码里面是否有,号，逗号后面是九位数
|
||
_self.focusComputed = false;
|
||
if(pieceBarcode ==undefined || pieceBarcode == null|| pieceBarcode.length < 11) return
|
||
if(pieceBarcode.indexOf(',') === -1 ||pieceBarcode.split(',').length !=2 ||pieceBarcode.split(',')[1].length != 9){
|
||
this.updateMessage('error','该工业条码不符合规范')
|
||
return
|
||
}
|
||
try{
|
||
|
||
//获取物料信息
|
||
const {materialCode,materialName,specification1} = await fnGetMaterial(pieceBarcode);
|
||
//获取组件信息
|
||
const list = await this.getSubassemblyList(pieceBarcode)
|
||
//把所有信息存入form中
|
||
_self.form = Object.assign({},{materialCode,materialName,specification1,list,Industry:pieceBarcode})
|
||
_self.open = false
|
||
_self.focusComputed = true;
|
||
}catch(e){
|
||
//TODO handle the exception
|
||
_self.updateMessage('error','未查到相关数据')
|
||
_self.form = Object.assign({})
|
||
}
|
||
|
||
/**
|
||
* 通过id获取物料信息
|
||
* @param {Object} pieceBarcode 扫描的工业条码
|
||
*/
|
||
async function fnGetMaterial(pieceBarcode){
|
||
//从pieceBarcode截取逗号前面的数据用作id
|
||
const id = parseInt(pieceBarcode.split(',')[0]);
|
||
let data = [];
|
||
await getMaterial(id).then(function(res){
|
||
data = res.data
|
||
})
|
||
return data;
|
||
}
|
||
},
|
||
/**
|
||
* 扫描组件条码
|
||
* @param {Object} code
|
||
*/
|
||
async getSubassembly(componentCode){
|
||
const _self = this;
|
||
// _self.focusComputed = false;
|
||
//判断条码是否符合规范
|
||
if(componentCode === null || componentCode ==='' ||componentCode === undefined) return _self.focusComputed = true
|
||
|
||
//查询组件表是否有这个组件，没有则添加，有则结束
|
||
if(!await fnInsertSubassembly(this.form.Industry,componentCode)) {
|
||
_self.focusComputed = true
|
||
return _self.updateMessage('warn','该组件已被扫描')
|
||
}
|
||
//重新查询数据
|
||
const list = await _self.getSubassemblyList(_self.form.Industry)
|
||
|
||
//把所有信息存入form中
|
||
_self.form = Object.assign({},_self.form,{list});
|
||
_self.getCode.computed = null;
|
||
_self.focusComputed = true
|
||
/**
|
||
* 查询组件表是否有这个组件，没有则添加
|
||
* @param {Object} Industry
|
||
* @param {Object} componentCode
|
||
*/
|
||
async function fnInsertSubassembly(Industry,componentCode){
|
||
let data = false;
|
||
await insertSubassembly(Industry,componentCode).then(res=>{
|
||
data = true
|
||
})
|
||
return data
|
||
}
|
||
},
|
||
/**
|
||
* 通过工业条码查询组件信息
|
||
* @param {Object} pieceBarcode
|
||
*/
|
||
async getSubassemblyList(pieceBarcode){
|
||
let data = [];
|
||
await getSubassembly(pieceBarcode).then(res => {
|
||
data = res.data
|
||
})
|
||
return data
|
||
},
|
||
/**
|
||
* 删除明细
|
||
* @param {Object} 要删除明细的数据
|
||
*/
|
||
deleteList(item){
|
||
this.item = item
|
||
this.$refs.alertDialog.open()
|
||
},
|
||
/**
|
||
* 弹出框确认按钮
|
||
*/
|
||
async dialogConfirm(){
|
||
const _self = this;
|
||
await deletSubassembly(this.item.id).then(async res => {
|
||
this.$refs.alertDialog.close()
|
||
this.updateMessage('success','删除成功')
|
||
//重新查询数据
|
||
const list = await this.getSubassemblyList(_self.form.Industry)
|
||
|
||
//把所有信息存入form中
|
||
_self.form = Object.assign({},_self.form,{list})
|
||
})
|
||
},
|
||
/**
|
||
* 弹出框取消按钮
|
||
*/
|
||
dialogClose(){
|
||
this.updateMessage('info','取消删除')
|
||
},
|
||
/**控制提示框的类型和文字
|
||
* @param {Object} type {'info'：消息，'success'：'成功‘，'error':'失败','warn':'警告'}
|
||
* @param {Object} text
|
||
*/
|
||
updateMessage(type,text){
|
||
this.messageText = text
|
||
this.msgType = type
|
||
this.$refs.message.open()
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
page{
|
||
padding-top: 10px;
|
||
background-color: #ffffff ;
|
||
}
|
||
</style>
|
||
<style scoped lang="scss">
|
||
.form {
|
||
width: 90%;
|
||
margin: 0 auto;
|
||
color: black;
|
||
font-size:40rpx;
|
||
}
|
||
.form text {
|
||
margin-left: 20%;
|
||
}
|
||
|
||
</style> |