<template>
|
<view>
|
<view class="nav_item form-container">
|
<form :modelValue="formData">
|
<view class="form-group">
|
<label class="form-label">物料编码:</label>
|
<input class="form-input" placeholder="请输入物料编码" type="text" v-model="formData.itemNo"
|
@confirm="getItem" />
|
</view>
|
<view class="form-group">
|
<label class="form-label">物料名称:</label>
|
<input class="form-input" disabled="true" type="text" v-model="formData.itemName" />
|
</view>
|
<view class="form-group">
|
<label class="form-label">物料规格:</label>
|
<input class="form-input" disabled="true" type="text" v-model="formData.itemModel" />
|
</view>
|
<view class="form-group">
|
<text class="form-label">组织:</text>
|
<picker class="picker form-input" name="selector" :range="orgNameList" @change="onOrgNameChange">
|
<text>{{ orgNameList[orgNameIndex] }}</text>
|
</picker>
|
</view>
|
<view class="form-group">
|
<text class="form-label">货主:</text>
|
<picker class="picker form-input" name="selector" :range="orgOwnerList" @change="onOrgOwnerChange">
|
<text>{{ orgOwnerList[orgOwnerIndex] }}</text>
|
</picker>
|
</view>
|
<view class="form-group">
|
<label class="form-label">物料数量:</label>
|
<input class="form-input" type="number" v-model="formData.itemNum" />
|
</view>
|
<view class="form-group">
|
<label class="form-label">条码张数:</label>
|
<input class="form-input" type="number" v-model="formData.printnumn" />
|
</view>
|
</form>
|
</view>
|
<view class="plus-button">
|
<button type="warn" @click="SaveBarCodes">确认</button>
|
</view>
|
</view>
|
</template>
|
<script>
|
export default {
|
data() {
|
return {
|
formData: {
|
itemNo: "",
|
itemName: "",
|
itemModel: "",
|
itemNum: "",
|
printnumn: ""
|
},
|
organizationList: [],
|
orgNameIndex: -1,
|
orgNameList: [],
|
orgOwnerIndex: -1,
|
orgOwnerList: [],
|
printList: []
|
}
|
},
|
methods: {
|
SaveBarCodes() {
|
this.formData.userName = this.$loginInfo.account;
|
|
if (!this.formData.itemNo) {
|
this.$showMessage("物料编码不允许为空");
|
}
|
if (!this.formData.orgName) {
|
this.$showMessage("组织不允许为空");
|
return;
|
}
|
if (!this.formData.orgOwner) {
|
this.$showMessage("货主不允许为空");
|
return;
|
}
|
if (!this.formData.itemNum && this.formData.itemNum > 0) {
|
this.$showMessage("物料数量不允许为空");
|
return;
|
}
|
if (!this.formData.printnumn && this.formData.printnumn > 0) {
|
this.$showMessage("条码张数不允许为空");
|
return;
|
}
|
|
this.$post({
|
url: "/Organize/GetBarcodeQcok",
|
data: this.formData
|
}).then(res => {
|
this.printList = res.data.tbBillList
|
})
|
},
|
getOrgName() {
|
this.$post({
|
url: "/Organize/GetOrganizes"
|
}).then(res => {
|
this.organizationList = res.data.tbBillList;
|
this.orgNameList = this.organizationList.map(s => s.fname);
|
this.orgOwnerList = this.organizationList.map(s => s.fname);
|
});
|
},
|
getItem() {
|
this.$post({
|
url: "/MesItems/GetItemQcPrint",
|
data: {
|
factory: 1000,
|
company: 1000,
|
itemNo: this.formData.itemNo
|
}
|
}).then(res => {
|
let data = res.data.tbBillList;
|
if (!data) {
|
this.$showMessage("物料条码不存在");
|
return;
|
}
|
this.formData.itemName = data.itemName;
|
this.formData.itemModel = data.itemModel;
|
console.log(this.formData);
|
});
|
},
|
onOrgNameChange(event) {
|
this.orgNameIndex = event.mp.detail.value;
|
this.formData.orgName = this.organizationList[this.orgNameIndex].id;
|
},
|
onOrgOwnerChange(event) {
|
this.orgOwnerIndex = event.mp.detail.value;
|
this.formData.orgOwner = this.organizationList[this.orgOwnerIndex].id;
|
}
|
},
|
onLoad() {
|
this.getOrgName();
|
},
|
}
|
</script>
|
<style lang="scss">
|
.form-group {
|
display: flex;
|
align-items: center;
|
border-bottom: 1px solid #c9c9c9;
|
}
|
|
.form-label {
|
margin-bottom: 0;
|
padding: 5px;
|
}
|
|
.form-input {
|
flex: 1;
|
margin-bottom: 0;
|
padding: 5px;
|
}
|
|
.picker {
|
flex: 1;
|
margin-bottom: 0;
|
padding: 5px;
|
font-size: 12px;
|
}
|
|
.uni-form-item {
|
display: flex;
|
border-bottom: 1px solid #c9c9c9;
|
}
|
|
.edit {
|
background-color: white;
|
}
|
|
/* 默认样式 */
|
.list-container {
|
height: 60vh;
|
/* 设置列表容器的高度为剩余空间，并减去表单容器的高度 */
|
overflow-y: auto;
|
/* 允许列表容器垂直滚动 */
|
padding: 10px;
|
/* 可选：添加一些内边距，使列表内容更美观 */
|
}
|
|
/* 在小屏幕设备上，重置高度为适应屏幕 */
|
@media (max-width: 768px) {
|
.list-container {
|
height: calc(100vh - 500px);
|
/* 适当调整高度 */
|
}
|
}
|
|
.form-container {
|
padding: 10px;
|
/* 可选：添加一些内边距，使表单内容更美观 */
|
}
|
|
.th {
|
background-color: lightskyblue;
|
color: #FFFFFF;
|
}
|
|
.text {
|
background-color: #ffee6f;
|
}
|
|
.plus-button {
|
line-height: 59px;
|
font-size: 24px;
|
cursor: pointer;
|
z-index: 1000;
|
margin-bottom: 10px;
|
}
|
|
.overlay {
|
position: fixed;
|
top: 0;
|
left: 0;
|
width: 100%;
|
height: 100%;
|
background-color: rgba(0, 0, 0, 0.5);
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
}
|
|
.popup {
|
background-color: #fff;
|
padding: 20px;
|
border: 1px solid #ccc;
|
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
width: 68vw;
|
/* 设置宽度为视口宽度的80% */
|
height: 25vh;
|
/* 设置高度为视口高度的80% */
|
}
|
|
.container {
|
display: flex;
|
flex-direction: column;
|
}
|
|
.tab-bar {
|
display: flex;
|
justify-content: space-around;
|
background-color: #f5f5f5;
|
padding: 10px;
|
border-bottom: 1px solid #ccc;
|
}
|
|
.tab-item {
|
flex: 1;
|
text-align: center;
|
padding: 10px;
|
border-radius: 5px;
|
background-color: #fff;
|
color: #007aff;
|
cursor: pointer;
|
font-size: 16px;
|
transition: background-color 0.3s, color 0.3s;
|
}
|
|
.tab-item.active {
|
background-color: #007aff;
|
color: #fff;
|
font-weight: bold;
|
}
|
|
.content {
|
flex: 1;
|
padding: 10px;
|
}
|
|
.tab-content {
|
padding: 10px;
|
}
|
</style>
|
