fix:所有下拉选择页面可参考的页面实现;修复原材料dn收货单点下拉问题;

优化重写页面业务逻辑
修复详细页面跳转多级问题(其它页面可参考)
master
zhoulei 4 years ago
parent d6309c5d8f
commit 3ca4594c0d

@ -5,31 +5,21 @@
{{ listData[nSel][showKey] || listData[nSel] }}
</view>
<view style="color: #7d7d7d" v-else>
{{ $t("message.workArea_Selelct") }}
{{ $t('message.workArea_Selelct') }}
</view>
</view>
<view
class="pickerMask"
v-if="pickerVisable"
@click="pickerVisable = false"
>
<view class="pickerMask" v-if="pickerVisable" @click="pickerVisable = false">
<view class="alertArea JAnimateBtmIn" @click.stop="doNothing">
<view class="searchInput" v-if="searchPosition == 'top'">
<view class="clickArea">
<input
class="jInput"
placeholder-style="color:#ffffff"
@input="filterOp"
/>
<input class="jInput" placeholder-style="color:#ffffff" @input="filterOp" />
<!-- <image class="searchLogo" src="../../static/search.png"></image> -->
<icon class="searchLogo" type="search" />
</view>
</view>
<view class="pickerTop">
<view class="lefBtn" @click="cancelSel"
>{{ $t("message.product_Cancel") }}
</view>
<view class="lefBtn" @click="cancelSel">{{ $t('message.product_Cancel') }} </view>
<view class="midInput">
<template v-if="searchPosition == 'middle'">
<input class="searchArea" @input="filterOp" />
@ -37,17 +27,9 @@
<icon class="searchIcon" type="search" />
</template>
</view>
<view class="rigBtn" @click="sureSelect"
>{{ $t("message.workArea_Confirm") }}
</view>
<view class="rigBtn" @click="sureSelect">{{ $t('message.workArea_Confirm') }} </view>
</view>
<picker-view
:value="[nSel]"
class="pickerView"
:mask-style="'background-color:' + bgColor"
:indicator-style="selStyle"
@change="selChange"
>
<picker-view :value="[nSel]" class="pickerView" :mask-style="'background-color:' + bgColor" :indicator-style="selStyle" @change="selChange">
<picker-view-column>
<view class="opItem" v-for="(item, index) in listData" :key="index">
{{ item[showKey] || item }}
@ -59,7 +41,7 @@
</view>
</template>
<script>
<script lang="ts">
/**
* 选择组件
* @property {Array} options 选择数组
@ -72,29 +54,20 @@
* @example <jPicker :disabled="false" class="cont" @sure="bindPickerChange($event,'TYPE')" showKey="Name" valKey="Value" :val="CurrentType" :options="FilterArray" />
*/
export default {
name: "jPicker",
name: 'jPicker',
data() {
return {
listData: this.options,
nSel: -1,
pickerVisable: false,
searchPosition: "middle",
searchPosition: 'middle',
//picker
// unSelStyle:'',
//'background-color:rgba(0, 74, 255, 0.44);',//'background-color:rgba(220, 250, 9, 0.44);',rgba(250, 9, 9, 0.44)
selStyle: "height:50px;",
selStyle: 'height:50px;',
};
},
props: [
"options",
"showKey",
"valKey",
"val",
"position",
"disabled",
"bgColor",
"sureColor",
],
props: ['options', 'showKey', 'valKey', 'val', 'position', 'disabled', 'bgColor', 'sureColor'],
//,,,,,
watch: {
options(n) {
@ -141,14 +114,13 @@ export default {
this.pickerVisable = false;
if (this.listData.length == 0) {
uni.showToast({
title: "未选中",
title: '未选中',
});
this.$emit("sure", {});
this.$emit('sure', {});
} else {
let obj = {
pickerVal: this.nSel,
pickerName:
this.nSel == -1 ? this.listData[0] : this.listData[this.nSel],
pickerName: this.nSel == -1 ? this.listData[0] : this.listData[this.nSel],
};
// if (this.valKey) {
// // obj=this.nSel == -1?this.listData[0]:this.listData[this.nSel];
@ -162,8 +134,8 @@ export default {
// obj.pickerVal = obj[this.valKey];
// }
// }
console.log("子组件要传的值", obj);
this.$emit("bindpicker", obj);
console.log('子组件要传的值', obj);
this.$emit('bindpicker', obj);
}
},
selChange(e) {
@ -172,7 +144,7 @@ export default {
filterOp(e) {
//console.log(e.detail.value);
let keyWord = e.detail.value;
if (keyWord != "") {
if (keyWord != '') {
keyWord = keyWord.toLowerCase();
let oldArr = this.options;
this.listData = [];
@ -273,7 +245,7 @@ export default {
}
}
&:before {
content: "";
content: '';
position: absolute;
top: 0;
left: 0;

@ -1,30 +1,31 @@
<!--
* @Author: zhou lei
* @Date: 2021-12-14 09:59:02
* @LastEditTime: 2021-12-15 14:45:16
* @LastEditors: zhou lei
* @Description:
* @FilePath: /wms_haiwai_app/src/pages/raw/ingoods/dnReceipt/Local-details.vue
* 联系方式:910592680@qq.com 18669792120 科海达信息技术有限公司
-->
<template>
<view class="page-receipt-detail">
<view class="header">
<view class="left">
<u-icon class="icon" name="arrow-left" @click="uni.navigateBack()" />
<u-icon class="icon" name="arrow-left" @click="uni.navigateBack({})" />
</view>
<view class="title">{{ $t("message.Pi_QueryResults") }}</view>
<view class="title">{{ $t('message.Pi_QueryResults') }}</view>
<view class="right"></view>
</view>
<view class="table-wrapper">
<wyb-table
class="table"
ref="table"
width="100%"
show-left-and-right-border
:headers="headers"
:contents="model.DNdetailedList"
:show-vert-border="false"
></wyb-table>
<wyb-table class="table" ref="table" width="100%" show-left-and-right-border :headers="headers" :contents="model.DNdetailedList" :show-vert-border="false"></wyb-table>
</view>
</view>
</template>
<script lang="ts">
import { Component } from "vue-property-decorator";
import { BasePage } from "@/components/base/page";
import { headers } from "./config";
import model from "./model";
import { Component } from 'vue-property-decorator';
import { BasePage } from '@/components/base/page';
import { headers } from './config';
import model from './model';
@Component
export default class RawReceiptDetail extends BasePage {
@ -34,8 +35,7 @@ export default class RawReceiptDetail extends BasePage {
</script>
<style lang="scss" scoped>
.page-receipt-detail {
background: #f2f2f2
linear-gradient(0deg, #f2f2f2 0%, #4a78ea 51%, #1753ea 100%) no-repeat;
background: #f2f2f2 linear-gradient(0deg, #f2f2f2 0%, #4a78ea 51%, #1753ea 100%) no-repeat;
background-size: 100% 600rpx;
padding: 30rpx;
min-height: 100%;

@ -23,14 +23,14 @@
<view class="Purchase-title">
<view class="Purchase">
<view>{{ $t('message.Purchase') }}</view>
<jPicker sureColor="#ff0000" style="width: 260rpx" @bindpicker="poListChoice" showKey="value" valKey="value" :val="poNoCode" class="search" :options="poList" />
<jPicker sureColor="#ff0000" style="width: 260rpx" @bindpicker="poListChoice" showKey="value" valKey="value" :val="poNo" class="search" :options="poList" />
</view>
</view>
<!-- 物料 -->
<view class="material">
<view class="material-left">
<view>{{ $t('message.Materiel') }}</view>
<jPicker sureColor="#ff0000" style="width: 260rpx" @bindpicker="materialChoice" showKey="value" valKey="value" :val="wlCode" class="search" :options="materialList" />
<jPicker sureColor="#ff0000" style="width: 260rpx" @bindpicker="materialChoice" showKey="value" valKey="value" :val="every.materialCode" class="search" :options="materialList" />
</view>
<view class="material-right">
<view class="material-right-title">{{ $t('message.CommissionedMaterielDesc') }}</view>
@ -89,7 +89,7 @@
<u-button type="primary" @click="onSubmit">{{ $t('message.po_Submit') }}</u-button>
</u-col>
<u-col :span="4">
<u-button type="error" @click="back">{{ $t('message.po_Return') }}</u-button>
<u-button type="error" @click="uni.navigateBack({})">{{ $t('message.po_Return') }}</u-button>
</u-col>
</u-row>
</view>
@ -132,7 +132,8 @@ export default class dnReceiptDom extends BasePage {
wlCode: any = '';
//
poNo: any = '';
poNoCode: any = '';
//
requestAmount = null;
//
upload: any = [];
//
@ -172,7 +173,7 @@ export default class dnReceiptDom extends BasePage {
localStorage.removeItem('list');
this.material = JSON.parse(list);
this.poList = [...this.material]; //
let arr = this.removeDuplicates(this.poList);
let arr = this.removeDuplicates(this.poList, 'poNo');
//
arr.forEach((item: any) => {
item.label = item.poNo;
@ -181,27 +182,28 @@ export default class dnReceiptDom extends BasePage {
this.poList = arr;
}
//
removeDuplicates(list) {
// list valueKey
//
removeDuplicates(list, valueKey: string) {
let temp = {};
let arr = [];
arr = list.reduce(function (item, next) {
temp[next.poNo] ? '' : (temp[next.poNo] = true && item.push(next));
temp[next[valueKey]] ? '' : (temp[next[valueKey]] = true && item.push(next));
return item;
}, []);
return arr;
}
// ADD
totalLocation(list: []) {
const receiptAmount = list.reduce((total: number, nextItem: any): any => {
return total + +nextItem.receiptAmount;
}, 0);
return receiptAmount;
}
//
poListChoice(e: any) {
console.log('选择采购单后触发的回调事件::', 'poListChoice:::', e);
//
this.poList.some((item, index) => {
if (item.poNo === e.pickerName.value) {
this.poNoCode = index;
return true;
}
});
this.poNo = e.pickerName.value;
this.materialList = this.removeDuplicates(this.material);
this.materialList = JSON.parse(JSON.stringify(this.removeDuplicates(this.material, 'materialCode')));
this.materialList.forEach((item: any) => {
if (item.poNo == e.pickerName.value) {
item.label = item.materialCode;
@ -211,21 +213,16 @@ export default class dnReceiptDom extends BasePage {
}
// receiptAmount requestAmount
materialChoice(e: any) {
//
this.every = e.pickerName;
this.materialList.some((item, index) => {
if (item.poNo === e.pickerName.value) {
this.wlCode = index;
return true;
}
});
}
//
LocationChoice(e: any) {
console.log('e>>>>>>>>>>>>>>>>>>>>>>>>', e);
this.wlCode = e.pickerName;
this.wlCode = e.pickerName.value;
}
//
Add() {
const count = this.totalLocation(this.LocationList);
if (this.receiptAmount == '' || this.wlCode == '') {
uni.showToast({
icon: 'none',
@ -240,40 +237,30 @@ export default class dnReceiptDom extends BasePage {
});
return;
}
if (parseFloat(this.receiptAmount) > this.every.requestAmount) {
if (parseFloat(this.receiptAmount) > this.every.requestAmount || +this.receiptAmount + count > this.every.requestAmount) {
uni.showToast({
icon: 'none',
title: this.$t('message.Commission_tips4') as any,
});
return;
}
let isTrue = true;
if (this.sendSpotList.length != 0) {
this.sendSpotList.forEach((item: any) => {
if (this.wlCode.sendSpot != item) {
isTrue = false;
}
});
}
if (isTrue != true) {
// return
let isTrue = this.LocationList.some((item) => item.wlCode !== this.wlCode);
if (isTrue) {
uni.showToast({
icon: 'none',
title: this.$t('message._tips5') as any,
});
return;
}
let objString = JSON.stringify(this.every);
let TEM = JSON.parse(objString);
TEM.wllist = null;
TEM.receiptAmount = this.receiptAmount;
TEM.wlCode = this.wlCode.label;
this.sendSpotList.push(this.wlCode.sendSpot);
console.log('this.sendSpotList', this.sendSpotList);
console.log('TEM', TEM);
this.LocationList.push(TEM);
const loc = this.Location.find((item) => item.value === this.wlCode);
this.LocationList.push({
...loc,
receiptAmount: this.receiptAmount,
wlCode: this.wlCode,
});
this.every.wllist = this.LocationList;
console.log('表格数据', this.LocationList);
console.log('要上传的数据', this.every);
this.receiptAmount = '';
isTrue = true;
this.business();
@ -315,7 +302,7 @@ export default class dnReceiptDom extends BasePage {
dnNo: this.form.documentNo,
};
await this.model.querydetaildlist(content);
this.redirectTo(this.page.raw.ingoods.dnReceipt.Local);
this.toPage(this.page.raw.ingoods.dnReceipt.Local);
}
//
business() {
@ -325,7 +312,6 @@ export default class dnReceiptDom extends BasePage {
});
this.Cumulative = num;
this.every.receiptAmount = num;
console.log('this.every', this.every);
}
}
</script>

Loading…
Cancel
Save