397 lines
10 KiB
Vue
397 lines
10 KiB
Vue
<!-- <template>
|
||
<view class="create-container">
|
||
<custom-nav-bar :left="true" title="签收单新增">
|
||
<template v-slot:right>
|
||
<view class="fixed">
|
||
<view align="right" class="icon iconfont icon-scan" @click="toQRCode"></view>
|
||
<view align="right" class="icon iconfont icon-NFC1" @click="nfc"></view>
|
||
<view align="right" class="iconfont icon-jia icon" @click="add"></view>
|
||
</view>
|
||
</template>
|
||
</custom-nav-bar>
|
||
<uni-section title="基础信息" type="line">
|
||
<u--form labelPosition="left" :model="briefForm" :rules="rules" ref="form">
|
||
<u-line color="#D2D2D2"></u-line>
|
||
<u-form-item class="form-item" label="仓库" prop="storageInName" labelWidth="100px" required>
|
||
<u--input style="background: white" @click="showStorageIn=true" v-model="briefForm.storageInName"
|
||
border="none" disabled placeholder="请选择仓库" suffixIcon="arrow-right"
|
||
class="custom-input"></u--input>
|
||
</u-form-item>
|
||
<u-line color="#D2D2D2"></u-line>
|
||
<u-form-item class="form-item" label="单据日期" prop="billDate" labelWidth="100px" required>
|
||
<uni-datetime-picker v-model="briefForm.billDate" type="date" class="custom-input" />
|
||
</u-form-item>
|
||
<u-line color="#D2D2D2"></u-line>
|
||
<u-form-item class="form-item" label="操作人" prop="operUser" labelWidth="100px" required>
|
||
<u--input v-model.trim="briefForm.operUser" border="none" placeholder="" disabled
|
||
class="custom-input"></u--input>
|
||
</u-form-item>
|
||
<u-line color="#D2D2D2"></u-line>
|
||
</u--form>
|
||
</uni-section>
|
||
<uni-section title="明细清单" type="line">
|
||
<u-line color="#D2D2D2"></u-line>
|
||
<view class="item-container" v-for="item in dataList">
|
||
<view style="display: flex; align-items: center; justify-content: space-between;">
|
||
<view class="flex-text" style="margin: 15px;">
|
||
<view class="flex-text-one" style="color: black;">
|
||
{{ item.deviceCode }}：{{ item.deviceTypeName }}</view>
|
||
</view>
|
||
<view style="margin-right: 5px;">
|
||
<u-button type="success" text="删除" @click="deleteDetail(item)" />
|
||
</view>
|
||
</view>
|
||
<u-gap height="1" bgColor="#D2D2D2"></u-gap>
|
||
</view>
|
||
</uni-section>
|
||
<view class="buttons">
|
||
<u-button type="success" @click="submit">确认</u-button>
|
||
<u-button @click="cancel">取消</u-button>
|
||
</view>
|
||
<u-action-sheet :show="showStorageIn" :actions="deviceStorageInData" title="仓库" description=""
|
||
@close="showStorageIn = false" @select="onStorageInSelect"></u-action-sheet>
|
||
<u-modal title="手动输入" :show="showDeviceModal" showCancelButton buttonReverse height="300px"
|
||
@confirm="confirmDevice" @cancel="cancelDeviceInfo">
|
||
<view class="slot-content">
|
||
<u--form labelPosition="left" :model="deviceInfoData" ref="formDevice">
|
||
<u-form-item label="编号" prop="deviceCode" labelWidth="100px" required>
|
||
<u--input v-model="deviceInfoData.deviceCode" placeholder="请输入编号"></u--input>
|
||
</u-form-item>
|
||
</u--form>
|
||
</view>
|
||
</u-modal>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import store from "@/store"
|
||
import plugin from "@/plugins"
|
||
// import {
|
||
// getDeviceList
|
||
// } from "@/api/iot/device"
|
||
// import {
|
||
// getDeviceBillInfo,
|
||
// addDeviceBill,
|
||
// updateDeviceBill
|
||
// } from "@/api/iot/deviceBill"
|
||
// import {
|
||
// deleteDeviceBillWms
|
||
// } from "@/api/iot/deviceBillWms"
|
||
import {
|
||
initNFC,
|
||
closeNFC,
|
||
//类型
|
||
setNfcType
|
||
} from '@/utils/nfc.js';
|
||
export default {
|
||
data() {
|
||
return {
|
||
user: store.state.user.user,
|
||
type: "add",
|
||
billId: null,
|
||
form: null,
|
||
formDevice: null,
|
||
dataList: [],
|
||
briefForm: {},
|
||
addType: 1,
|
||
showStorageIn: false,
|
||
showDeviceModal: false,
|
||
storageInData: store.state.user.userStorage,
|
||
deviceStorageInData: [],
|
||
deviceInfoData: {
|
||
deviceCode: null
|
||
},
|
||
rules: {
|
||
storageInName: {
|
||
type: "string",
|
||
required: true,
|
||
message: "仓库不能为空",
|
||
trigger: ["blur", "change"]
|
||
},
|
||
operUser: [{
|
||
type: "string",
|
||
required: true,
|
||
message: "请填写操作人",
|
||
trigger: ["blur", "change"]
|
||
}],
|
||
billDate: [{
|
||
type: "string",
|
||
required: true,
|
||
message: "单据日期不能为空",
|
||
trigger: ["blur", "change"]
|
||
}]
|
||
},
|
||
editFlag: false
|
||
}
|
||
},
|
||
created() {
|
||
this.reset();
|
||
},
|
||
onLoad(options) {
|
||
initNFC(({
|
||
code,
|
||
data,
|
||
message
|
||
}) => {
|
||
if (code !== 200) {
|
||
uni.$u.toast(message);
|
||
return;
|
||
}
|
||
switch (data.type) {
|
||
case 'cardNo':
|
||
if (this.addType == 2) {
|
||
this.getDeviceInfo(data.id);
|
||
}
|
||
break;
|
||
case 'read':
|
||
uni.$u.toast(data.text);
|
||
break;
|
||
case 'write':
|
||
uni.$u.toast(message);
|
||
break;
|
||
default:
|
||
uni.$u.toast("未知属性");
|
||
}
|
||
});
|
||
if (options) {
|
||
if (options.type) {
|
||
this.type = options.type;
|
||
}
|
||
if (options.id) {
|
||
this.billId = options.id;
|
||
}
|
||
}
|
||
this.getDeviceStorageInData();
|
||
if (this.type == "edit") {
|
||
this.getDeviceBill();
|
||
}
|
||
},
|
||
onShow() {
|
||
setNfcType("cardNo");
|
||
},
|
||
methods: {
|
||
reset() {
|
||
this.briefForm = {
|
||
billId: null,
|
||
billTypeId: 2001,
|
||
storageInId: this.storageInData[0].id,
|
||
storageInName: this.storageInData[0].storageName,
|
||
billDate: this.getNowFormatDate(),
|
||
billTime: null,
|
||
sourceBillId: null,
|
||
sourceBillTypeId: null,
|
||
storageOutId: null,
|
||
operUser: this.user.userName,
|
||
operUserId: this.user.userId,
|
||
status: 0,
|
||
billTime: null,
|
||
deviceBillWmsVos: []
|
||
};
|
||
},
|
||
//删除明细
|
||
deleteDetail(item) {
|
||
let index = this.dataList.findIndex(x => x.deviceId == item.deviceId);
|
||
if (index != -1) {
|
||
this.dataList.splice(index, 1);
|
||
}
|
||
if (this.type == "edit") {
|
||
//明细时删除明细及更改设备仓库id及在库状态
|
||
deleteDeviceBillWms(item.billDetailId)
|
||
.then(res => {})
|
||
}
|
||
},
|
||
onStorageInSelect(e) {
|
||
this.briefForm.storageInId = e.id
|
||
this.briefForm.storageInName = e.name
|
||
},
|
||
//提交
|
||
submit() {
|
||
if (this.type == "edit") {
|
||
this.$refs["form"]
|
||
.validate()
|
||
.then(res => {
|
||
//修改接口
|
||
this.briefForm.deviceBillWmsVos = this.dataList;
|
||
updateDeviceBill(this.briefForm).then(res => {
|
||
plugin.modal.msgSuccess("修改成功")
|
||
this.cancel();
|
||
})
|
||
})
|
||
.catch(errors => {
|
||
uni.$u.toast("请补充摘要信息")
|
||
})
|
||
} else {
|
||
// 新增用户
|
||
this.$refs["form"]
|
||
.validate()
|
||
.then(res => {
|
||
//新增接口
|
||
this.briefForm.deviceBillWmsVos = this.dataList;
|
||
addDeviceBill(this.briefForm).then(res => {
|
||
plugin.modal.msgSuccess("新增成功"+res.msg)
|
||
this.cancel();
|
||
})
|
||
})
|
||
.catch(errors => {
|
||
uni.$u.toast("请补充摘要信息")
|
||
})
|
||
}
|
||
},
|
||
//返回
|
||
cancel() {
|
||
plugin.tab.navigateBack();
|
||
uni.$emit("cancelpage", "close")
|
||
},
|
||
//扫码
|
||
toQRCode() {
|
||
this.addType = 1;
|
||
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 == 1000) {
|
||
this.getDeviceInfo(ret.resp_result);
|
||
}
|
||
})
|
||
},
|
||
add: function() {
|
||
this.showDeviceModal = true;
|
||
this.addType = 1;
|
||
},
|
||
//nfc
|
||
nfc() {
|
||
this.addType = 2;
|
||
},
|
||
confirmDevice() {
|
||
this.addType = 1;
|
||
this.showDeviceModal = false;
|
||
this.getDeviceInfo(this.deviceInfoData.deviceCode);
|
||
},
|
||
cancelDeviceInfo() {
|
||
this.showDeviceModal = false;
|
||
},
|
||
//获取扫码或nfc查询设备
|
||
getDeviceInfo(code) {
|
||
let query = {};
|
||
if (this.addType == 1) {
|
||
query.deviceCode = code;
|
||
} else {
|
||
query.nfcCode = code;
|
||
}
|
||
|
||
getDeviceList(query).then(res => {
|
||
if (res && res.data && res.data.length) {
|
||
let index = this.dataList.findIndex(x => x.deviceId == res.data[0].id);
|
||
if (index == -1) {
|
||
let addObj = {}
|
||
addObj.deviceId = res.data[0].id;
|
||
addObj.deviceCode = res.data[0].deviceCode;
|
||
addObj.deviceTypeId = res.data[0].deviceTypeId;
|
||
addObj.deviceTypeName = res.data[0].deviceTypeName;
|
||
this.dataList.push(addObj);
|
||
}
|
||
} else {
|
||
uni.$u.toast("未查询到设备" + code)
|
||
}
|
||
})
|
||
},
|
||
getDeviceBill() {
|
||
getDeviceBillInfo(this.billId).then(res => {
|
||
if (res && res.data) {
|
||
this.briefForm = res.data;
|
||
if (this.briefForm) {
|
||
this.dataList = this.briefForm.deviceBillWmsVos;
|
||
}
|
||
}
|
||
})
|
||
},
|
||
getDeviceStorageInData() {
|
||
this.deviceStorageInData = this.storageInData.map(
|
||
item => {
|
||
return {
|
||
name: item.storageName,
|
||
id: item.id,
|
||
item: item
|
||
}
|
||
});
|
||
},
|
||
//获取当前日期
|
||
getNowFormatDate() {
|
||
let date = new Date();
|
||
let year = date.getFullYear();
|
||
let month = date.getMonth() + 1;
|
||
let d = date.getDate();
|
||
if (month < 10) {
|
||
month = "0" + month;
|
||
}
|
||
if (d < 10) {
|
||
d = "0" + d;
|
||
}
|
||
return year + "-" + month + "-" + d;
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
<style lang="scss">
|
||
.create-container {
|
||
background-color: #FFF;
|
||
|
||
.custom-input {
|
||
width: 280px;
|
||
}
|
||
|
||
.form-item {
|
||
width: 100%;
|
||
margin-left: 20px;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: flex-start;
|
||
}
|
||
|
||
.buttons {
|
||
margin: 10px 50px;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
button {
|
||
margin: 0px 20px;
|
||
}
|
||
}
|
||
|
||
.item-container {
|
||
margin: 10px 10px;
|
||
background-color: white;
|
||
padding-bottom: 10px;
|
||
border-radius: 10px;
|
||
box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.05);
|
||
}
|
||
|
||
.flex-text {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.flex-text-one {
|
||
color: #939393;
|
||
font-weight: bold;
|
||
}
|
||
}
|
||
|
||
.data {
|
||
margin: 10px 20px !important;
|
||
width: 100%;
|
||
|
||
.uni-col {
|
||
margin-bottom: 5px;
|
||
}
|
||
}
|
||
}
|
||
</style> --> |