库区填报
FCD
3 weeks ago
parent
16630b4e9e
commit
aa2bca0904
@ -0,0 +1,494 @@
|
||||
<template>
|
||||
<view class="page-product-receipt">
|
||||
|
||||
<page-head title="库区填报" />
|
||||
|
||||
<u-form id="form" class="page-form" ref="form" label-width="180rpx" >
|
||||
<u-form-item required label="生产日期" >
|
||||
<u-input @click="clickShowCalendar(1)" placeholder="请选择日期" v-model="queryParams.beginDate" :clearable="true" readonly />
|
||||
<view style="margin-right: 30rpx">至</view>
|
||||
<u-input @click="clickShowCalendar(2)" placeholder="请选择日期" v-model="queryParams.endDate" :clearable="true" readonly />
|
||||
<u-icon name="close-circle-fill" @click="clearDate" color="rgb(96, 98, 102)" size="28"></u-icon>
|
||||
</u-form-item>
|
||||
|
||||
<u-form-item required label="工单编码">
|
||||
<u-input placeholder="请输入工单编码" v-model="queryParams.workOrderCode" :show-action="false"></u-input>
|
||||
</u-form-item>
|
||||
|
||||
<u-form-item required label="工单状态">
|
||||
<jPicker sureColor="#ff0000" moren="请选择" showKey="key" @bindpicker="selectStatus" valKey="value" :val="queryParams.status" :options="stateList" />
|
||||
<u-input placeholder="请输入工单状态" :show-action="false"></u-input>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
|
||||
<view class="search-view">
|
||||
<view class="search-btn" @click="clickSearch">
|
||||
查询
|
||||
</view>
|
||||
<view class="ada-btn" @click="clickAdd">
|
||||
新增
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<scroll-view id="list" scroll-y="true" :style="{ height: listHeight + 'px' }" :lower-threshold="50">
|
||||
<!-- 列表 -->
|
||||
<u-form class="list">
|
||||
<view v-if="list.length > 0">
|
||||
<view class="list-item" v-for="(item, index) in list" :key="index" @click="clickItem(index)" >
|
||||
<view v-if="item.type === 'add'" class="add-tag">新增</view>
|
||||
<lj-list-row label="工单号:" :value="item.workOrderCode" />
|
||||
<lj-list-row label="物料编码:" :value="item.materialCode" />
|
||||
<lj-list-row label="物料名称:" :value="item.materialName" />
|
||||
<lj-list-row label="批次号:" :value="item.batchCode" />
|
||||
<lj-list-row label="地点:" :value="item.location" />
|
||||
<lj-list-row label="区号:" :value="item.areaCode" />
|
||||
</view>
|
||||
</view>
|
||||
<view v-else> 暂无数据 </view>
|
||||
</u-form>
|
||||
</scroll-view>
|
||||
|
||||
<view class="bottom-bar" id="button">
|
||||
<u-row class="button-bar">
|
||||
<!-- 确定 -->
|
||||
<u-col :span="12">
|
||||
<u-button @click="onSubmit" type="primary">提交入库</u-button>
|
||||
</u-col>
|
||||
|
||||
</u-row>
|
||||
</view>
|
||||
|
||||
|
||||
<u-popup v-model="showPopupForm" mode="center" @close="cancelForm" width="580rpx" >
|
||||
|
||||
<u-form class="page-form">
|
||||
<u-form-item label="工单号:" label-width="20vw">
|
||||
<u-input v-model="popupForm.workOrderCode" :show-action="false"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="物料编码:" label-width="20vw">
|
||||
<u-input v-model="popupForm.materialCode" :show-action="false"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item v-if="popupType === 'edit'" label="物料名称:" label-width="20vw">
|
||||
<u-input v-model="popupForm.materialName" :show-action="false"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="批次号:" label-width="20vw">
|
||||
<u-input v-model="popupForm.batchCode" :show-action="false"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="地点:" label-width="20vw">
|
||||
<u-input placeholder="请填写地点" v-model="popupForm.location" :show-action="false"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="区号:" label-width="20vw">
|
||||
<u-input placeholder="请填写区号" v-model="popupForm.areaCode" :show-action="false"></u-input>
|
||||
</u-form-item>
|
||||
|
||||
</u-form>
|
||||
<view>
|
||||
<!-- 按钮区域 -->
|
||||
<view class="btn-group">
|
||||
<u-button
|
||||
@click="cancelForm"
|
||||
shape="circle"
|
||||
type="info"
|
||||
>
|
||||
取消
|
||||
</u-button>
|
||||
<u-button
|
||||
v-if="popupType === 'edit'"
|
||||
@click="submitForm"
|
||||
shape="circle"
|
||||
type="primary"
|
||||
>
|
||||
确认
|
||||
</u-button>
|
||||
<u-button
|
||||
v-if="popupType === 'add'"
|
||||
@click="addItem"
|
||||
shape="circle"
|
||||
type="primary"
|
||||
>
|
||||
确认
|
||||
</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
|
||||
<u-calendar v-model="showCalendar" :mode="'date'" @change="changeDate"></u-calendar>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import PageHead from "@/components/lanju/page-head/index.vue";
|
||||
import JPicker from "@/components/J-Picker/jPicker.vue";
|
||||
import {Component} from "vue-property-decorator";
|
||||
import {removeLeadingZeros} from "@/utils/tool";
|
||||
import LjListRow from "@/components/lanju/lj-list-row/index.vue";
|
||||
import {BasePage} from "@/components/base/page";
|
||||
import moment from 'moment';
|
||||
import {getStockAreaEntryList, submitMaterialEntry} from "@/pages/wms/product/StockAreaReporting/model";
|
||||
import {session} from "@/store/modules/session";
|
||||
|
||||
|
||||
interface Material{
|
||||
workOrderCode:string;
|
||||
materialCode:string;
|
||||
materialName:string;
|
||||
batchCode:string;
|
||||
location:string;
|
||||
areaCode:string;
|
||||
type:string
|
||||
}
|
||||
|
||||
@Component({
|
||||
methods: { removeLeadingZeros },
|
||||
components: {
|
||||
JPicker,
|
||||
LjListRow,
|
||||
PageHead
|
||||
},
|
||||
})
|
||||
export default class stockAreaReporting extends BasePage {
|
||||
showCalendar = false;
|
||||
|
||||
calendarType:number = undefined;
|
||||
|
||||
queryParams={
|
||||
beginDate:moment().format('YYYY-MM-DD'),
|
||||
endDate:moment().format('YYYY-MM-DD'),
|
||||
workOrderCode:undefined,
|
||||
status:"w1"
|
||||
};
|
||||
|
||||
stateList = [
|
||||
{
|
||||
key:"未派",
|
||||
value:"w0"
|
||||
},
|
||||
{
|
||||
key:"已派发",
|
||||
value:"w1"
|
||||
},
|
||||
{
|
||||
key:"活动",
|
||||
value:"w2"
|
||||
},
|
||||
{
|
||||
key:"报工",
|
||||
value:"w3"
|
||||
},
|
||||
{
|
||||
key:"暂停",
|
||||
value:"w4"
|
||||
},
|
||||
{
|
||||
key:"入库完成",
|
||||
value:"w6"
|
||||
},
|
||||
]
|
||||
|
||||
listHeight = 500;
|
||||
|
||||
list:Material[] = []
|
||||
|
||||
showPopupForm = false;
|
||||
|
||||
popupType = "edit"
|
||||
|
||||
popupForm: Material = {
|
||||
workOrderCode:undefined,
|
||||
materialCode:undefined,
|
||||
materialName:undefined,
|
||||
batchCode:undefined,
|
||||
location:undefined,
|
||||
areaCode:undefined,
|
||||
type:undefined
|
||||
}
|
||||
|
||||
addList:Material[] = []
|
||||
|
||||
popupFormRules = {
|
||||
"workOrderCode":"请填写工单号",
|
||||
"materialCode":"请填写物料编码",
|
||||
"batchCode":"请填写批次号",
|
||||
"location":"请填写地点",
|
||||
"areaCode":"请填写区号",
|
||||
}
|
||||
|
||||
|
||||
listIndex = 0
|
||||
|
||||
clickShowCalendar(calendarType : number){
|
||||
this.calendarType = calendarType;
|
||||
this.showCalendar = true;
|
||||
}
|
||||
|
||||
clearDate(){
|
||||
this.queryParams.beginDate = undefined;
|
||||
this.queryParams.endDate = undefined;
|
||||
this.showCalendar = false;
|
||||
}
|
||||
|
||||
changeDate(e : any){
|
||||
if (this.calendarType === 1){
|
||||
this.queryParams.beginDate = e.result;
|
||||
}else {
|
||||
this.queryParams.endDate = e.result;
|
||||
}
|
||||
}
|
||||
|
||||
selectStatus(res){
|
||||
this.queryParams.status = res.pickerName.value
|
||||
|
||||
}
|
||||
|
||||
clickSearch(){
|
||||
getStockAreaEntryList(this.queryParams).then((res)=>{
|
||||
if (res.data){
|
||||
this.list = res.data
|
||||
if (this.addList.length > 0){
|
||||
this.list = this.list.concat(this.addList)
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
clickAdd(){
|
||||
this.popupType = "add"
|
||||
this.showPopupForm = true
|
||||
}
|
||||
|
||||
clickItem(index){
|
||||
this.popupType = "edit"
|
||||
this.popupForm = this.list[index]
|
||||
this.listIndex = index
|
||||
this.showPopupForm = true
|
||||
}
|
||||
|
||||
cancelForm(){
|
||||
this.popupForm = {
|
||||
workOrderCode:undefined,
|
||||
materialCode:undefined,
|
||||
materialName:undefined,
|
||||
batchCode:undefined,
|
||||
location:undefined,
|
||||
areaCode:undefined,
|
||||
type:undefined
|
||||
}
|
||||
this.showPopupForm = false
|
||||
}
|
||||
|
||||
submitForm(){
|
||||
for(const key in this.popupForm){
|
||||
if (!this.popupForm[key] && this.popupFormRules[key]){
|
||||
uni.showToast({
|
||||
title: this.popupFormRules[key],
|
||||
icon: 'none'
|
||||
})
|
||||
return;
|
||||
}
|
||||
}
|
||||
this.cancelForm()
|
||||
}
|
||||
|
||||
addItem(){
|
||||
for(const key in this.popupForm){
|
||||
if (!this.popupForm[key] && this.popupFormRules[key]){
|
||||
uni.showToast({
|
||||
title: this.popupFormRules[key],
|
||||
icon: 'none'
|
||||
})
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
getStockAreaEntryList({
|
||||
materialCode:this.popupForm.materialCode
|
||||
}).then((res)=>{
|
||||
console.log()
|
||||
if (res.data && res.data.length > 0){
|
||||
this.popupForm.type = 'add'
|
||||
this.popupForm.materialName = res.data[0].materialName
|
||||
this.addList.push(this.popupForm)
|
||||
this.list.unshift(this.popupForm)
|
||||
this.cancelForm()
|
||||
}else {
|
||||
uni.showToast({
|
||||
title: "未查询到该物料",
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
|
||||
onSubmit(){
|
||||
|
||||
for (const item of this.list){
|
||||
if (!item.location){
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '物料'+ item.materialCode +'未填写地点',
|
||||
confirmText: '确认',
|
||||
showCancel: false,
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (!item.areaCode){
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '物料'+ item.materialCode +'未填写区号',
|
||||
confirmText: '确认',
|
||||
showCancel: false,
|
||||
});
|
||||
return;
|
||||
}
|
||||
item.factoryCode = session.FactoryCode
|
||||
item.status = "1"
|
||||
item.createBy = session.userName
|
||||
}
|
||||
|
||||
submitMaterialEntry(this.list).then(res=>{
|
||||
uni.showToast({
|
||||
title: "提交成功",
|
||||
icon: 'success'
|
||||
})
|
||||
this.list = []
|
||||
this.addList = []
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
onReady() {
|
||||
this.getListHeight()
|
||||
}
|
||||
|
||||
getListHeight() {
|
||||
//等待页面加载完成
|
||||
this.$nextTick(() => {
|
||||
let buttonTop = 0;
|
||||
//获取底部按钮信息
|
||||
const query = uni.createSelectorQuery().in(this);
|
||||
query
|
||||
.select('#button')
|
||||
.boundingClientRect((data) => {
|
||||
//获取底部按钮到顶部距离
|
||||
buttonTop = data.top;
|
||||
})
|
||||
.exec();
|
||||
//获取列表信息
|
||||
query
|
||||
.select('#list')
|
||||
.boundingClientRect((data) => {
|
||||
//获取列表到顶部距离
|
||||
const listTop = data.top;
|
||||
//
|
||||
this.listHeight = buttonTop - listTop - 10;
|
||||
})
|
||||
.exec();
|
||||
});
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
.search-view{
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.search-view .search-btn{
|
||||
background-color: #1078d1;
|
||||
color:white;
|
||||
font-weight: bold;
|
||||
width: 100rpx;
|
||||
padding:15rpx;
|
||||
font-size: 28rpx;
|
||||
margin-top:10rpx;
|
||||
margin-bottom:10rpx;
|
||||
margin-left:30rpx;
|
||||
text-align: center;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.search-btn:active {
|
||||
background-color: #209bfa;
|
||||
}
|
||||
|
||||
.search-view .ada-btn{
|
||||
background-color: #67c23a;
|
||||
color:white;
|
||||
font-weight: bold;
|
||||
width: 100rpx;
|
||||
padding:15rpx;
|
||||
font-size: 28rpx;
|
||||
margin-top:10rpx;
|
||||
margin-bottom:10rpx;
|
||||
margin-left:30rpx;
|
||||
text-align: center;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.ada-btn:active {
|
||||
background-color: #2c6b05;
|
||||
}
|
||||
|
||||
.list {
|
||||
background-color: #fff;
|
||||
margin-top: 20rpx;
|
||||
padding: 20rpx 20rpx 25rpx;
|
||||
border-radius: 10rpx;
|
||||
box-shadow: 0 0 20rpx 0 rgba(128, 128, 128, 0.2);
|
||||
color: #8d8989;
|
||||
|
||||
.list-item {
|
||||
margin-top: 10rpx;
|
||||
padding: 20rpx;
|
||||
position: relative; /* 关键：让标记相对于基于此定位 */
|
||||
}
|
||||
|
||||
/* 奇数行背景色 */
|
||||
.list-item:nth-child(odd) {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
/* 偶数行背景色 */
|
||||
.list-item:nth-child(even) {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
/* 右上角标记样式 */
|
||||
.add-tag {
|
||||
position: absolute;
|
||||
top: 10rpx;
|
||||
right: 0;
|
||||
background-color: #ff4d4f; /* 红色背景 */
|
||||
color: white;
|
||||
font-size: 24rpx; /* 小字体 */
|
||||
padding: 4rpx 12rpx;
|
||||
border-radius: 0 0 0 8rpx; /* 左下角圆角 */
|
||||
}
|
||||
}
|
||||
|
||||
.btn-group {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 10rpx;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
|
||||
.bottom-bar {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 99;
|
||||
background: #ffffff;
|
||||
box-shadow: 0 1rpx 20rpx 0 rgba(128, 128, 128, 0.2);
|
||||
padding: 20rpx;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,12 @@
|
||||
import http from '@/utils/request';
|
||||
import { url } from '@/utils/url';
|
||||
|
||||
export function getStockAreaEntryList(query: any): Promise<any> {
|
||||
return http.get(url.lanjuwms.product.OfflineStorage.wmsStockAreaEntryList, {
|
||||
params: query,
|
||||
});
|
||||
}
|
||||
|
||||
export function submitMaterialEntry(data: any): Promise<any> {
|
||||
return http.post(url.lanjuwms.product.OfflineStorage.submitMaterialEntry, data);
|
||||
}
|
||||
Loading…
Reference in New Issue