<template>
|
<div class="scan-container">
|
<el-card class="scan-card">
|
<div slot="header" class="clearfix">
|
<span>待上架扫描上架</span>
|
</div>
|
<el-form ref="form" :model="formData" label-width="120px" class="scan-form">
|
<el-form-item label="待上架单号">
|
<el-input ref="shelveCode" v-model="formData.shelveCode" class="input-300" autofocus @keyup.enter.native="getData()"></el-input>
|
<span class="sub-item">
|
<span class="sub-label">物料校验:</span>
|
<el-switch v-model="formData.isCheckProductModel" @change="changeIsCheckProductModel"></el-switch>
|
</span>
|
</el-form-item>
|
<el-form-item v-if="formData.isCheckProductModel" label="物料条码">
|
<el-input ref="productModel" v-model="formData.productModel" class="input-300" @keyup.native.enter.stop="checkPackingBarcode"></el-input>
|
<span class="sub-item">
|
<span class="sub-label">扫描数量:</span>
|
<el-input-number v-model="formData.scanQty" class="input-100" controls-position="right" @change="setScanQty"></el-input-number>
|
</span>
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary" @click.native="save">确认上架</el-button>
|
<el-button @click="onReset">重置</el-button>
|
</el-form-item>
|
</el-form>
|
</el-card>
|
<el-card class="scan-card body-no-padding">
|
<div slot="header" class="clearfix">
|
<span class="padding-top-10">扫描结果</span>
|
<el-button type="text" class="floatRight" @click="setting.visible=true">字段设置</el-button>
|
</div>
|
<el-table ref="scan-table" :data="tableData" :row-class-name="rowClass" stripe style="width: 100%" class="scan-table" @row-dblclick="setCurrent">
|
<template v-for="(item, index) in setting.fields">
|
<template v-if="'unFinishedQuantity,finishedQuantity'.indexOf(item.prop)>=0">
|
<el-table-column v-if="item.visible" :key="index" :prop="item.prop" :label="item.label" :width="item.width">
|
<template slot-scope="scope">
|
<template v-if="!formData.isCheckProductModel">
|
<el-input-number v-model="scope.row[item.prop]" :disabled="true" size="mini" class="w-100pc" controls-position="right"></el-input-number>
|
</template>
|
<template v-else>
|
{{ scope.row[item.prop] }}
|
</template>
|
</template>
|
</el-table-column>
|
</template>
|
<template v-else-if="['shelvePositionName'].indexOf(item.prop)>=0">
|
<el-table-column v-if="item.visible" :key="index" :prop="item.prop" :label="item.label" :width="item.width">
|
<template slot-scope="scope">
|
<input-select ref="shelvePositionName" v-model="scope.row.shelvePositionName" :options="scope.row.choosePositionNameArray" label="货位" input-width="120px" trigger="focus" @on-item-click="elDropdownSelect(scope, arguments[1])" @on-row-change="elDropdownChange(scope, arguments[1])" @on-key-up="elDropdownKeyup(scope,arguments[1])">
|
</input-select>
|
</template>
|
</el-table-column>
|
</template>
|
<template v-else-if="['scanWeight'].indexOf(item.prop)>=0">
|
<el-table-column v-if="item.visible" :key="index" :prop="item.prop" :label="item.label" :width="item.width">
|
<template slot-scope="scope">
|
<template>
|
<el-input v-model="scope.row[item.prop]" size="mini" class="w-100pc"></el-input>
|
</template>
|
</template>
|
</el-table-column>
|
</template>
|
<template v-else-if="'produceDate,limitDate'.indexOf(item.prop)>=0">
|
<el-table-column v-if="item.visible" :key="index" :prop="item.prop" :label="item.label" :width="item.width">
|
<template slot-scope="scope">
|
<template>
|
<el-date-picker v-model="scope.row[item.prop]" size="mini" type="date" placeholder="选择日期" class="w-110" value-format="yyyy-MM-dd">
|
</el-date-picker>
|
</template>
|
</template>
|
</el-table-column>
|
</template>
|
<template v-else>
|
<el-table-column v-if="item.visible" :key="index" :prop="item.prop" :label="item.label" :width="item.width">
|
</el-table-column>
|
</template>
|
</template>
|
</el-table>
|
</el-card>
|
|
<scan-setting-dialog ref="setting-dialog" :visible.sync="setting.visible" :fields="setting.fields" :name="setting.name">
|
</scan-setting-dialog>
|
|
<!--声音文件-->
|
<audio ref="sound_error" controls="controls" style="display:none;">
|
<source src="@/assets/sounds/error2.mp3" type="audio/mpeg" />
|
</audio>
|
<audio ref="sound_correct" controls="controls" style="display:none;">
|
<source src="@/assets/sounds/feixin.mp3" type="audio/mpeg" />
|
</audio>
|
<audio controls="controls" style="display:none;">
|
<source ref="sound_scan" src="@/assets/sounds/saomiao.wav" type="audio/mpeg" />
|
</audio>
|
</div>
|
</template>
|
|
<script>
|
import YrtScanMixins from "@/components/common/yrtScanMixins.vue";
|
import InputSelect from "@/components/base/InputSelect";
|
import ScanSettingDialog from "@/components/common/components/scanSettingDialog.vue";
|
|
export default {
|
name: "inbound-scan-shelve-order",
|
components: {
|
ScanSettingDialog,
|
InputSelect
|
},
|
mixins: [YrtScanMixins],
|
data() {
|
return {
|
formData: {
|
shelveCode: null,
|
productModel: "",
|
scanQty: ""
|
},
|
// 扫描明细数据集合
|
tableData: [],
|
// 当前正在扫描的数据
|
currentRow: null,
|
// 已经找到的数据
|
existRows: [],
|
// 配置参数
|
config: {
|
// 支持一品多码
|
sku_productToMultiBarcode: true,
|
caseMode: 0
|
},
|
// 扫描列设置对话框参数
|
setting: {
|
visible: false,
|
name: "inbound-scan-shelve-order",
|
fields: [
|
{
|
prop: "productModel",
|
label: "条形码",
|
visible: true,
|
width: 130,
|
order: 1
|
},
|
{
|
prop: "positionName",
|
label: "推荐货位",
|
visible: true,
|
width: 130,
|
order: 1
|
},
|
{
|
prop: "shelvePositionName",
|
label: "上架货位",
|
visible: true,
|
width: 140,
|
order: 1
|
},
|
{
|
prop: "quantity",
|
label: "入库数量",
|
visible: true,
|
width: 80,
|
order: 2
|
},
|
{
|
prop: "shelvedQuantity",
|
label: "已上架数量",
|
visible: true,
|
width: 90,
|
order: 3
|
},
|
{
|
prop: "finishedQuantity",
|
label: "已扫描数量",
|
visible: true,
|
width: 90,
|
order: 4
|
},
|
{
|
prop: "unFinishedQuantity",
|
label: "未扫描数量",
|
visible: true,
|
width: 90,
|
order: 5
|
},
|
{
|
prop: "productCode",
|
label: "物料编号",
|
visible: false,
|
width: 130,
|
order: 6
|
},
|
{
|
prop: "smallUnit",
|
label: "单位",
|
visible: true,
|
width: 50,
|
order: 7
|
},
|
{
|
prop: "produceDate",
|
label: "生产日期",
|
visible: true,
|
width: 130,
|
order: 9
|
},
|
{
|
prop: "limitDate",
|
label: "到期日期",
|
visible: false,
|
width: 130,
|
order: 10
|
},
|
{
|
prop: "purchasePrice",
|
label: "单价",
|
visible: false,
|
width: 80,
|
order: 11
|
},
|
{
|
prop: "productSpec",
|
label: "物料规格",
|
visible: true,
|
width: 80,
|
order: 12
|
},
|
{
|
prop: "weight",
|
label: "单位毛重",
|
visible: false,
|
width: 80,
|
order: 13
|
},
|
{
|
prop: "totalWeight",
|
label: "合计重量",
|
visible: false,
|
width: 80,
|
order: 14
|
},
|
{
|
prop: "scanWeight",
|
label: "已扫重量",
|
visible: false,
|
width: 80,
|
order: 15
|
},
|
{
|
prop: "productName",
|
label: "物料名称",
|
visible: true,
|
width: null,
|
order: 16
|
}
|
]
|
}
|
};
|
},
|
created() {
|
this.formData = {
|
storage_Id: "",
|
targetPositionName: "",
|
originalPositionName: "",
|
isCheckProductModel: true,
|
productModel: "",
|
scanQty: 1
|
};
|
// 一次扫描的数量
|
this.scanCount = 1;
|
// 扫描明细数据集合
|
this.tableData = [];
|
// 当前正在扫描的数据
|
this.currentRow = null;
|
// 已经找到的数据
|
this.existRows = [];
|
// 配置参数
|
this.config = {
|
// 支持一品多码
|
sku_productToMultiBarcode: true,
|
caseMode: 0
|
};
|
},
|
mounted() {
|
// 字段设置
|
const setting = localStorage[this.setting.name + "-setting"];
|
if (setting) {
|
this.setting.fields = JSON.parse(setting);
|
}
|
},
|
methods: {
|
elDropdownSelect(scope, data) {
|
scope.row.shelvePositionName = data;
|
},
|
elDropdownChange(scope, data) {
|
scope.row.shelvePositionName = data;
|
},
|
elDropdownKeyup(scope, data) {
|
try {
|
if (!data) {
|
scope.row.choosePositionNameArray = scope.row.shelvePositionNameArray.filter(item => {
|
return true;
|
});
|
return;
|
}
|
const filterItems = scope.row.shelvePositionNameArray.filter(item => {
|
if (!item.label) return false;
|
return item.label.indexOf(data) >= 0;
|
});
|
scope.row.choosePositionNameArray = filterItems;
|
} catch (error) {
|
// console.log(error.message);
|
}
|
},
|
// 获取订单数据
|
getData() {
|
if (!this.formData.shelveCode) {
|
this.$message("待上架单号不能为空!");
|
return;
|
}
|
this.formData.shelveCode = this.formData.shelveCode.trim();
|
var url = "/api/inbound/shelveScan/getData";
|
var params = {
|
shelveCode: this.formData.shelveCode
|
};
|
this.common.ajax(
|
url,
|
params,
|
res => {
|
this.common.showMsg(res);
|
if (res.result) {
|
this.currentRow = null;
|
res.data.forEach(element => {
|
element.sortIndex = 0;
|
element.shelvePositionName = "";
|
element.scanWeight = element.totalWeight;
|
element.finishedQuantity = Math.Round(this.formData.isCheckProductModel ? 0 : element.quantity, 4);
|
element.unFinishedQuantity = Math.Round(this.formData.isCheckProductModel ? element.quantity : 0, 4);
|
if (Array.isArray(element.shelvePositionNameList)) {
|
element.shelvePositionNameArray = element.shelvePositionNameList.map(val => {
|
return { label: val.name };
|
});
|
element.choosePositionNameArray = element.shelvePositionNameList.map(val => {
|
return { label: val.name };
|
});
|
element.shelvePositionName = element.shelvePositionNameList[0] ? element.shelvePositionNameList[0].name : "";
|
} else {
|
element.choosePositionNameArray = [];
|
}
|
if (!element.choosePositionNameArray.length) {
|
element.choosePositionNameArray.push({ label: element.positionName, id: -1 });
|
}
|
element.shelvePositionName = element.choosePositionNameArray[0] ? element.choosePositionNameArray[0].label : "";
|
});
|
this.tableData = res.data;
|
if (this.$refs.productModel) {
|
this.$refs.productModel.focus();
|
this.$refs.productModel.select();
|
}
|
} else {
|
this.tableData = [];
|
}
|
},
|
true
|
);
|
},
|
// 改变是否扫描物料校验
|
changeIsCheckProductModel() {
|
this.tableData.forEach(element => {
|
element.sortIndex = 0;
|
element.shelvePositionName = "";
|
element.scanWeight = element.totalWeight;
|
element.finishedQuantity = Math.Round(this.formData.isCheckProductModel ? 0 : element.quantity, 4);
|
element.unFinishedQuantity = Math.Round(this.formData.isCheckProductModel ? element.quantity : 0, 4);
|
element.shelvePositionNameArray = element.shelvePositionNameList.map(val => {
|
return { label: val.name };
|
});
|
element.choosePositionNameArray = element.shelvePositionNameList.map(val => {
|
return { label: val.name };
|
});
|
element.shelvePositionName = element.shelvePositionNameList[0] ? element.shelvePositionNameList[0].label : "";
|
});
|
},
|
checkPackingBarcode(evt) {
|
this.checkPackingProductModel();
|
},
|
// 提交数据
|
save() {
|
var the = this;
|
const productModelList = the.tableData.filter(f => f.finishedQuantity > 0);
|
if (the.tableData.find(f => !f.shelvePositionName)) {
|
this.$message.error("请选择货位");
|
return false;
|
}
|
the
|
.$confirm("您确定要[上架]扫描的数据吗?", "待上架扫描", {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning"
|
})
|
.then(() => {
|
var url = "/api/inbound/shelveScan/shelveSave";
|
var params = {
|
shelveCode: the.formData.shelveCode,
|
productModelList: productModelList
|
};
|
the.common.ajax(
|
url,
|
params,
|
res => {
|
the.common.showMsg(res);
|
if (res.result) {
|
this.onReset();
|
the.formData.productModel = "";
|
}
|
},
|
true
|
);
|
})
|
.catch(() => {
|
the.$message({
|
type: "info",
|
message: "已取消"
|
});
|
});
|
},
|
// 重置onReset
|
onReset() {
|
this.formData = {
|
targetPositionName: null,
|
isValidateProductCode: true, // 是否校验物料
|
positionName: null,
|
productModel: null,
|
scanQty: 0,
|
isCheckProductModel: true
|
};
|
this.tableData = [];
|
this.$refs.shelveCode.focus();
|
}
|
}
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
@import "../../../styles/scan.scss";
|
</style>
|