Skip to content

梁建民 / wmsMin

Go to a project
Commit c6d5b1ec by LJM
Options

理货

parent 55b3459b
Inline Side-by-side
Showing with 1197 additions and 597 deletions
assets/css/tallyGoods/confirm.scss
.page-box { .page-box {
margin-top: 24rpx; margin-top: 24rpx;
padding: 0 24rpx; padding: 0 24rpx 24rpx 24rpx;
.scanBarcode { .scanBarcode {
height: 88rpx; height: 88rpx;
background: #ffffff; background: #ffffff;
...@@ -160,6 +160,7 @@ ...@@ -160,6 +160,7 @@
} }
} }
.model-upload-list { .model-upload-list {
border-top: 1rpx solid #e6edf0;
.box { .box {
height: 80rpx; height: 80rpx;
border-bottom: 1rpx solid #e6edf0; border-bottom: 1rpx solid #e6edf0;
...@@ -219,5 +220,8 @@ ...@@ -219,5 +220,8 @@
border-radius: 4rpx; border-radius: 4rpx;
font-size: 28rpx; font-size: 28rpx;
color: #ffffff; color: #ffffff;
&.disabled{
opacity: 0.7;
}
} }
} }
assets/css/tallyGoods/manualMerge.scss
...@@ -51,8 +51,10 @@ ...@@ -51,8 +51,10 @@
border-top: 1px solid #e6edf0; border-top: 1px solid #e6edf0;
padding-top: 24rpx; padding-top: 24rpx;
.t1 { .t1 {
width: 110rpx;
font-size: 22rpx; font-size: 22rpx;
color: #6e767a; color: #6e767a;
white-space: nowrap;
margin-right: 29rpx; margin-right: 29rpx;
} }
.t2 { .t2 {
......
assets/css/tallyGoods/originSplit.scss
...@@ -132,3 +132,86 @@ ...@@ -132,3 +132,86 @@
color: #ffffff; color: #ffffff;
} }
} }
.popup-content {
padding: 28rpx 24rpx 24rpx 24rpx;
.selected-items {
flex-wrap: wrap;
.box {
padding: 0 12rpx;
height: 44rpx;
background: #ffffff;
border-radius: 4rpx;
border: 1rpx solid #197adb;
margin-right: 16rpx;
margin-bottom: 16rpx;
.text {
font-size: 24rpx;
color: #197adb;
}
.close {
margin-left: 5rpx;
font-size: 36rpx;
color: #197adb;
}
}
}
.search-baar {
height: 88rpx;
background: #ffffff;
border-radius: 4rpx;
padding-left: 24rpx;
margin-bottom: 16rpx;
.iconfont {
font-size: 36rpx;
color: #6e767a;
}
.uni-input {
margin-left: 15rpx;
font-size: 28rpx;
color: #404547;
}
}
.data-list {
background: #ffffff;
border-radius: 4rpx;
margin-bottom: 22rpx;
max-height: 504rpx;
overflow-y: auto;
.box {
margin: 0 24rpx;
height: 84rpx;
border-bottom: 1rpx solid #e6edf0;
&:last-child {
border-bottom: none;
}
.text {
font-size: 26rpx;
color: #404547;
}
.check-ico {
width: 24rpx;
height: 25rpx;
background: url('https://img.ichunt.com/images/ichunt/202309/14/3743c01230310f62a2afa41a6c2eea96.png') no-repeat center;
background-size: contain;
display: block;
}
&.curr {
.text {
color: #197adb;
}
.check-ico {
background: url('https://img.ichunt.com/images/ichunt/202309/14/e651ddae61b5f02af4129f723b2cf74f.png') no-repeat center;
background-size: contain;
}
}
}
}
.pop-btn {
height: 88rpx;
background: #197adb;
border-radius: 4rpx;
font-size: 28rpx;
color: #ffffff;
}
}
pages.json
...@@ -67,7 +67,7 @@ ...@@ -67,7 +67,7 @@
}, { }, {
"path": "pages/goods/tally", "path": "pages/goods/tally",
"style": { "style": {
"navigationBarTitleText": "理货列表" "navigationBarTitleText": "异常理货"
} }
}, { }, {
"path": "pages/goods/tallyExectionDetail", "path": "pages/goods/tallyExectionDetail",
......
pages/goods/tally.vue
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
<view class="search-box"> <view class="search-box">
<view class="search-input row bothSide verCenter"> <view class="search-input row bothSide verCenter">
<text class="iconfont icon-a-riqi11"></text> <text class="iconfont icon-a-riqi11"></text>
<input type="text" @input="inputChange()" placeholder="请手动输入入仓号或扫描" class="uni-input" v-model="number" placeholder-style="color:#6e767a" /> <input type="text" @input="inputChange()" placeholder="请输入入仓号" class="uni-input" v-model="number" placeholder-style="color:#6e767a" />
<text class="scan iconfont icon-juxing6" @click="scanChange()"></text> <text class="scan iconfont icon-juxing6" @click="scanChange()"></text>
</view> </view>
</view> </view>
...@@ -92,7 +92,7 @@ export default { ...@@ -92,7 +92,7 @@ export default {
return { return {
currentIndex: 0, currentIndex: 0,
is_complete: false, is_complete: false,
textArr: ['等待理货', '理货异常'], textArr: ['等待回复', '商务已回复'],
number: '', number: '',
total: 0, total: 0,
page: 1, page: 1,
......
pages/tallyGoods/confirm.vue
<template> <template>
<view class="page-box"> <view class="page-box">
<div class="scanBarcode row rowCenter verCenter"> <div class="scanBarcode row rowCenter verCenter" @click="scanChange()">
<text class="iconfont icon-juxing6"></text> <text class="iconfont icon-juxing6"></text>
<text class="tt">扫描理货单二维码</text> <text class="tt">扫描理货单二维码</text>
</div> </div>
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
<view class="input-wrap row verCenter bothSide"> <view class="input-wrap row verCenter bothSide">
<view class="row verCenter"> <view class="row verCenter">
<text class="arrow"></text> <text class="arrow"></text>
<input type="text" v-model="form.erp_order_sn" class="uni-input" placeholder="请输入入仓号(必填)" placeholder-style="color:#404547;font-weight:bold;" /> <input type="text" @input="onInput()" v-model="form.erp_order_sn" class="uni-input" placeholder="请输入" placeholder-style="color:#404547;font-weight:bold;" />
</view> </view>
<text class="inspection row rowCenter verCenter">商检</text> <text class="inspection row rowCenter verCenter">商检</text>
</view> </view>
...@@ -44,41 +44,53 @@ ...@@ -44,41 +44,53 @@
</view> </view>
<view class="box row bothSide verCenter"> <view class="box row bothSide verCenter">
<text class="label">产地拆分（选填）</text> <text class="label">产地拆分（选填）</text>
<navigator class="input-wrap-width row verCenter" url="/pages/tallyGoods/originSplit" hover-class="none"> <navigator class="input-wrap-width row verCenter" :url="'/pages/tallyGoods/originSplit?erp_order_sn=' + form.erp_order_sn" hover-class="none">
<text class="text">请选择</text> <text class="text">{{ form.detail_json.length > 0 ? '已拆分' + form.detail_json.length : '请选择' }}</text>
<text class="iconfont icon-sanjiaoxing2"></text> <text class="iconfont icon-sanjiaoxing2"></text>
</navigator> </navigator>
</view> </view>
<view class="box row bothSide verCenter"> <view class="box row bothSide verCenter">
<text class="label">手动合箱（选填）</text> <text class="label">手动合箱（选填）</text>
<navigator class="input-wrap-width row verCenter" url="/pages/tallyGoods/manualMerge" hover-class="none"> <navigator class="input-wrap-width row verCenter" :url="'/pages/tallyGoods/manualMerge?erp_order_sn=' + form.erp_order_sn + '&fix_erp_order_sn=' + form.fix_erp_order_sn" hover-class="none">
<text class="text">请选择</text> <text class="text">{{ form.fix_erp_order_sn ? '已合箱' : '请选择' }}</text>
<text class="iconfont icon-sanjiaoxing2"></text> <text class="iconfont icon-sanjiaoxing2"></text>
</navigator> </navigator>
</view> </view>
</view> </view>
<view class="section"> <view class="section" v-if="list.length > 0">
<!-- 商检图片上传 -->
<view class="upload-box"> <view class="upload-box">
<view class="title row bothSide verCenter"> <view class="title row bothSide verCenter" v-if="goods_check_pic_list.length > 0">
<text class="tt-l">商检图片上传（仅商检必填）</text> <text class="tt-l">商检图片上传（仅商检必填）</text>
<text class="tt-r">1/3</text> <template v-if="goods_check_pic_list[2].length > 0">
<text class="tt-r">3/3</text>
</template>
<template v-else-if="goods_check_pic_list[1].length > 0">
<text class="tt-r">2/3</text>
</template>
<template v-else-if="goods_check_pic_list[0].length > 0">
<text class="tt-r">1/3</text>
</template>
<template v-else>
<text class="tt-r">0/3</text>
</template>
</view> </view>
<view class="model-upload-list"> <view class="model-upload-list">
<view class="box row bothSide verCenter curr"> <view class="box row bothSide verCenter" v-for="(item, index) in list" :key="index" :class="{ curr: goods_check_pic_list[index].length > 0 }">
<view class="file row verCenter"> <view class="file row verCenter">
<text class="t1">74VCX162244MTDX</text> <text class="t1">{{ item.model }}</text>
<text class="t2">已上传&nbsp;3张</text> <template v-if="goods_check_pic_list[index].length > 0">
<text class="clear">清空</text> <text class="t2" @click="previewChange(goods_check_pic_list[index], 0)">已上传&nbsp;{{ goods_check_pic_list[index].length }}张</text>
</view> <text class="clear" @click="clearFn(index)">清空</text>
<view class="file-btn row verCenter"> </template>
<text class="t1">继续上传</text>
<text class="iconfont icon-sanjiaoxing2"></text>
</view> </view>
</view> <view class="file-btn row verCenter" @click="uploadBusinessChange(index)">
<view class="box row bothSide verCenter"> <template v-if="goods_check_pic_list[index].length > 0">
<view class="file row verCenter"><text class="t1">74VCX</text></view> <text class="t1">继续上传</text>
<view class="file-btn row verCenter"> </template>
<text class="t1">上传图片</text> <template v-else>
<text class="t1">上传图片</text>
</template>
<text class="iconfont icon-sanjiaoxing2"></text> <text class="iconfont icon-sanjiaoxing2"></text>
</view> </view>
</view> </view>
...@@ -86,15 +98,16 @@ ...@@ -86,15 +98,16 @@
</view> </view>
</view> </view>
<view class="section" style="margin-bottom: 48rpx;"> <view class="section" style="margin-bottom: 48rpx;">
<!-- 采购单上传 -->
<view class="upload-box"> <view class="upload-box">
<view class="title row bothSide verCenter"> <view class="title row bothSide verCenter">
<text class="tt-l">采购单上传（选填）</text> <text class="tt-l">采购单上传（选填）</text>
<text class="tt-r">{{ form.pur_pic.length }}/4</text> <text class="tt-r">{{ image_list.length }}/4</text>
</view> </view>
<view class="upload-list row verCenter"> <view class="upload-list row verCenter">
<template v-if="form.pur_pic.length > 0"> <template v-if="image_list.length > 0">
<view class="pic-box" v-for="(v, index) in form.pur_pic" :key="index"> <view class="pic-box" v-for="(v, index) in image_list" :key="index">
<image :src="v" mode="aspectFill" lazy-load="true" @click="previewChange(form.pur_pic, index)"></image> <image :src="v" mode="aspectFill" lazy-load="true" @click="previewChange(image_list, index)"></image>
<view class="delete row rowCenter verCenter" @click="deletePic(index)"><text class="iconfont icon-shanchu"></text></view> <view class="delete row rowCenter verCenter" @click="deletePic(index)"><text class="iconfont icon-shanchu"></text></view>
</view> </view>
</template> </template>
...@@ -102,14 +115,13 @@ ...@@ -102,14 +115,13 @@
</view> </view>
</view> </view>
</view> </view>
<view class="btn row rowCenter verCenter" @click="submit()">确认提交</view> <view class="btn row rowCenter verCenter" @click="submit()" :class="{ disabled: disabled }">确认提交</view>
</view> </view>
</template> </template>
<script> <script>
import { API } from '@/util/api.js'; import { API } from '@/util/api.js';
import { titleCase } from '@/util/util.js'; import { titleCase } from '@/util/util.js';
import w_md5 from '../../js_sdk/zww-md5/w_md5.js';
export default { export default {
data() { data() {
...@@ -117,38 +129,218 @@ export default { ...@@ -117,38 +129,218 @@ export default {
noexebshowFalg: true, //控制是否会触发生命周期 noexebshowFalg: true, //控制是否会触发生命周期
customs_clearance_price_options: ['无', '有'], //清关费选项 customs_clearance_price_options: ['无', '有'], //清关费选项
currentIndex: 0, currentIndex: 0,
image_list: [], //图片列表
goods_check_pic_list: [], //商检图片列表
maxNum: 10, //最大上传图片数量
list: [], //商检型号列表
disabled: false,
form: { form: {
erp_order_sn: 'B123456', //入仓号 erp_order_sn: '', //入仓号
customs_clearance_price: '', //清关费 customs_clearance_price: 0, //清关费
box_num: '', //箱子 box_num: '', //箱子
board_num: '', //板子 board_num: '', //板子
gross_weight: '', //合计毛重 gross_weight: '', //合计毛重
detail_json: [], //产地拆分 && 商检图片 pic_json: [], //商检图片
detail_json: [], //产地拆分数据
fix_erp_order_sn: '', //手动合箱 fix_erp_order_sn: '', //手动合箱
pur_pic: '' //采购单上传 pur_pic: '' //采购单上传
} }
}; };
}, },
onLoad(options) {}, watch: {
image_list(arr) {
if (arr.length > 0) {
this.form.pur_pic = arr.join(',');
} else {
this.form.pur_pic = '';
}
}
},
onLoad() {
uni.removeStorageSync('paramsOrigin');
},
onShow() {
//更新合箱数据
uni.$on('updateData', data => {
if (data.length > 0) {
this.form.fix_erp_order_sn = data.join(',');
} else {
this.form.fix_erp_order_sn = '';
}
});
//更新产地拆分国家的数据
uni.$on('updateOriginData', data => {
if (data) {
this.form.detail_json = data.detail_json;
uni.removeStorageSync('paramsOrigin');
uni.setStorageSync('paramsOrigin', data);
}
});
},
methods: { methods: {
/**
* 扫描二维码
*/
scanChange() { scanChange() {
this.form.logistics_number = '';
uni.scanCode({ uni.scanCode({
success: res => { success: res => {
console.log(res); console.log(res);
if (res.errMsg == 'scanCode:ok') { if (res.errMsg == 'scanCode:ok') {
this.form.logistics_number = res.result; this.form.erp_order_sn = res.result;
this.checkErpOrderSnIsTally();
} }
}, },
fail: function(res) { fail: function(res) {
console.log(res); console.log(res);
uni.showToast({ uni.showToast({
title: '扫码失败', title: '扫码失败，请重试',
icon: 'error' icon: 'none'
}); });
} }
}); });
}, },
onInput() {
// 清除之前的定时器
clearTimeout(this.timer);
this.timer = setTimeout(() => {
this.checkErpOrderSnIsTally();
}, 800);
},
/**
* 检测入仓号是否理货
*/
checkErpOrderSnIsTally() {
this.request(API.checkErpOrderSnIsTally, 'GET', { erp_order_sn: this.form.erp_order_sn }, true).then(res => {
if (res.err_code === 0) {
this.getTallyGoods();
this.disabled = false;
} else {
this.disabled = true;
uni.showModal({
content: res.err_msg,
showCancel: false
});
}
});
},
/**
* 获取入仓号的理货数据
*/
getTallyGoods() {
this.request(API.getTallyGoods, 'GET', { erp_order_sn: this.form.erp_order_sn }, true).then(res => {
if (res.err_code === 0) {
this.list = res.data.entrys;
const length = res.data.entrys.length;
this.goods_check_pic_list = Array.from({ length }, () => []);
this.form.pic_json = res.data.entrys.map(item => ({
ptEntryID: item.ptEntryID,
goods_check_pic: ''
}));
} else {
this.list = [];
uni.showToast({
title: res.err_msg,
icon: 'none'
});
}
});
},
/**
* @param {Object} index
* 清空对应的商检图片
*/
clearFn(index) {
uni.showModal({
title: '提示',
content: '您确定清空嘛？',
showCancel: true,
cancelText: '取消',
confirmText: '确定',
success: res => {
if (res.confirm) {
// 用户点击了确定按钮，执行相关操作
this.goods_check_pic_list[index] = [];
this.form.pic_json[index].goods_check_pic = '';
this.$forceUpdate();
} else if (res.cancel) {
// 用户点击了取消按钮，取消操作
}
}
});
},
/**
*商检图片上传
*/
uploadBusinessChange(index) {
// 使用 chooseImage选择图片
uni.chooseImage({
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success: chooseImageRes => {
console.log('选择图片成功：', chooseImageRes);
// 显示loading
uni.showLoading({
title: '上传中...'
});
// 获取选择的图片路径数组
const imagePaths = chooseImageRes.tempFilePaths;
// 遍历图片路径数组，对每张图片进行压缩
imagePaths.forEach(imagePath => {
// 使用compressImage 压缩图片
uni.compressImage({
src: imagePath,
quality: 50, //压缩质量，范围0～100，数值越小，质量越低，压缩率越高
success: compressedRes => {
console.log('压缩图片成功：', compressedRes);
// 获取压缩后的图片路径
const compressedImagePath = compressedRes.tempFilePath;
// 在这里处理压缩后的图片，上传到服务器
uni.uploadFile({
url: API.uploadImage + '?sys_type=4',
filePath: compressedImagePath,
name: 'file',
header: {
'Content-Type': 'multipart/form-data'
},
success: uploadFileRes => {
console.log('服务器上传图片成功：', uploadFileRes);
uni.hideLoading();
let data = JSON.parse(uploadFileRes.data);
if (data.code === 0) {
this.goods_check_pic_list[index].push(data.data.oss_image_url);
this.form.pic_json[index].goods_check_pic = this.goods_check_pic_list[index].join(',');
this.$forceUpdate();
} else {
uni.showToast({
title: data.msg,
icon: 'none'
});
}
},
fail: error => {
console.log('上传图片失败：', error);
uni.hideLoading();
}
});
},
fail: err => {
console.log('压缩图片失败：', err);
}
});
});
}
});
},
/**
* 预览图片
* @param {Object} img
* @param {Object} index
*/
previewChange(img, index) { previewChange(img, index) {
this.noexebshowFalg = false; //不允许再次触发onshow这个生命周期 this.noexebshowFalg = false; //不允许再次触发onshow这个生命周期
uni.previewImage({ uni.previewImage({
...@@ -156,59 +348,88 @@ export default { ...@@ -156,59 +348,88 @@ export default {
urls: img urls: img
}); });
}, },
/**
* 删除图片
* @param {Object} index
*/
deletePic(index) { deletePic(index) {
this.form.check_in_pic.splice(index, 1); this.form.check_in_pic.splice(index, 1);
}, },
/**
* 选择图片
*/
chooseImageChange() { chooseImageChange() {
this.noexebshowFalg = false; //不允许再次触发onshow这个生命周期 this.noexebshowFalg = false;
var self = this; // 使用 chooseImage选择图片
var time = parseInt(new Date().getTime() / 1000);
uni.chooseImage({ uni.chooseImage({
count: 4, count: this.maxNum,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'], sourceType: ['album', 'camera'],
success: chooseImageRes => { success: chooseImageRes => {
console.log('选择图片成功：', chooseImageRes);
// 显示loading
uni.showLoading({ uni.showLoading({
title: '上传中...' title: '上传中...'
}); });
const tempFilePaths = chooseImageRes.tempFilePaths;
let maxNum = tempFilePaths.length * 1 + self.form.check_in_pic.length * 1; // 获取选择的图片路径数组
if (maxNum > 4) { const imagePaths = chooseImageRes.tempFilePaths;
// 判断选择的图片数量是否超过最大限制数量
let maxNum = Number(imagePaths.length) + Number(this.image_list.length); //当前上传的+已经上传的
if (maxNum > this.maxNum) {
uni.hideLoading(); uni.hideLoading();
uni.showToast({ uni.showToast({
title: '图片不超过4张' title: '图片不超过' + this.maxNum + '张',
icon: 'none'
}); });
return false; return false;
} }
for (let i = 0; i < tempFilePaths.length; i++) {
console.log(tempFilePaths[i]); // 遍历图片路径数组，对每张图片进行压缩
uni.uploadFile({ imagePaths.forEach(imagePath => {
url: API.upload, // 使用compressImage 压缩图片
filePath: tempFilePaths[i], uni.compressImage({
name: 'upload', src: imagePath,
formData: { quality: 50, //压缩质量，范围0～100，数值越小，质量越低，压缩率越高
source: '1', success: compressedRes => {
k1: time, console.log('压缩图片成功：', compressedRes);
k2: w_md5.hex_md5_32(w_md5.hex_md5_32(String(time)) + 'fh6y5t4rr351d2c3bryi') // 获取压缩后的图片路径
}, const compressedImagePath = compressedRes.tempFilePath;
success: uploadFileRes => {
uni.hideLoading(); // 在这里处理压缩后的图片，上传到服务器
var data = JSON.parse(uploadFileRes.data); uni.uploadFile({
console.log(data); url: API.uploadImage + '?sys_type=4',
if (data.code === 200) { filePath: compressedImagePath,
self.form.check_in_pic.push(data.data[0]); name: 'file',
} else { header: {
uni.showToast({ 'Content-Type': 'multipart/form-data'
title: data.message, },
icon: 'error' success: uploadFileRes => {
}); console.log('服务器上传图片成功：', uploadFileRes);
} uni.hideLoading();
let data = JSON.parse(uploadFileRes.data);
if (data.code === 0) {
this.image_list.push(data.data.oss_image_url);
} else {
uni.showToast({
title: data.msg,
icon: 'none'
});
}
},
fail: error => {
console.log('上传图片失败：', error);
uni.hideLoading();
}
});
}, },
fail: error => { fail: err => {
uni.hideLoading(); console.log('压缩图片失败：', err);
console.log(error);
} }
}); });
} });
} }
}); });
}, },
...@@ -232,8 +453,35 @@ export default { ...@@ -232,8 +453,35 @@ export default {
}); });
return false; return false;
} }
if (this.disabled) {
this.request(API.addCheckIn, 'POST', this.form, true).then(res => { uni.showModal({
content: '该入仓号已经理货,禁止重复理货',
showCancel: false
});
return false;
}
if (!this.form.box_num) {
uni.showModal({
content: '请填写箱子数',
showCancel: false
});
return false;
}
if (!this.form.board_num) {
uni.showModal({
content: '请填写板子数',
showCancel: false
});
return false;
}
if (!this.form.gross_weight) {
uni.showModal({
content: '请填写箱毛重',
showCancel: false
});
return false;
}
this.request(API.submitTallyGoods, 'POST', this.form, true).then(res => {
if (res.err_code === 0) { if (res.err_code === 0) {
uni.showModal({ uni.showModal({
title: '提示', title: '提示',
......
pages/tallyGoods/manualMerge.vue
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<view class="page-box"> <view class="page-box">
<view class="title row bothSide verCenter"> <view class="title row bothSide verCenter">
<text class="t1">当前入仓号</text> <text class="t1">当前入仓号</text>
<text class="t2">B123456</text> <text class="t2">{{ erp_order_sn }}</text>
</view> </view>
<view class="select-split"> <view class="select-split">
<view class="box"> <view class="box">
...@@ -14,39 +14,39 @@ ...@@ -14,39 +14,39 @@
<view class="uni-text" @click="open()">请选择</view> <view class="uni-text" @click="open()">请选择</view>
<text class="iconfont icon-sanjiaoxing1"></text> <text class="iconfont icon-sanjiaoxing1"></text>
</view> </view>
<view class="boxed_result row verCenter"> <view class="boxed_result row" v-if="filter_list.length > 0">
<text class="t1">合箱结果：</text> <text class="t1">合箱结果：</text>
<view class="row verCenter"> <view class="row verCenter" style="flex-wrap: wrap;">
<text class="t2">B123459</text> <block v-for="(item, index) in filter_list" :key="index">
<text class="t3">+</text> <text class="t2">{{ item }}</text>
<text class="t2">B123459</text> <text v-if="index < filter_list.length - 1" class="t3">+</text>
<text class="t3">+</text> </block>
<text class="t2">B123459</text>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<view class="btn row rowCenter verCenter" @click="submit()">确 认</view> <view class="btn row rowCenter verCenter" @click="submit()">确 认</view>
<view class="btn-reset row rowCenter verCenter" @click="submit()">重 置</view> <view class="btn-reset row rowCenter verCenter" @click="reset()">重 置</view>
<!-- 选择箱号 -->
<uni-popup ref="popup" background-color="#F1F4F6"> <uni-popup ref="popup" background-color="#F1F4F6">
<view class="popup-content"> <view class="popup-content">
<view class="selected-items row"> <view class="selected-items row">
<view class="box row verCenter" v-for="(item, index) in 10" :key="index"> <view class="box row verCenter" v-for="(item, index) in filter_list" :key="index">
<text class="text">B123456</text> <text class="text">{{ item }}</text>
<text class="close">×</text> <text class="close" @click="deleteChange(item)">×</text>
</view> </view>
</view> </view>
<view class="search-baar row verCenter"> <view class="search-baar row verCenter">
<text class="iconfont icon-a-riqi11"></text> <text class="iconfont icon-a-riqi11"></text>
<input type="text" class="uni-input" placeholder="请输入箱号" placeholder-style="font-size:26rpx;color:#6E767A;" /> <input type="text" class="uni-input" placeholder="请输入箱号" placeholder-style="font-size:26rpx;color:#6E767A;" @input="onInput" v-model="searchParams.erp_order_sn" />
</view> </view>
<view class="data-list"> <view class="data-list">
<view class="box row bothSide verCenter curr" v-for="(item, index) in 30" :key="index"> <view class="box row bothSide verCenter" v-for="(item, index) in list" :key="index" :class="{ curr: filter_status[index] }">
<text class="text">B0000{{ index }}</text> <text class="text">{{ item.name }}</text>
<view class="check-ico"></view> <view class="check-ico" @click="filterChange(index)"></view>
</view> </view>
</view> </view>
<view class="pop-btn row rowCenter verCenter">确 认</view> <view class="pop-btn row rowCenter verCenter" @click="confirmChange">确 认</view>
</view> </view>
</uni-popup> </uni-popup>
</view> </view>
...@@ -54,23 +54,77 @@ ...@@ -54,23 +54,77 @@
<script> <script>
import { API } from '@/util/api.js'; import { API } from '@/util/api.js';
import { createArray } from '@/util/util.js';
export default { export default {
data() { data() {
return { return {
goods_list_index: -1, erp_order_sn: '',
goods_list: ['1-2328702-0', '1-2328701'] list: [],
fix_erp_order_sn: '', //已选择的合箱数据
filter_list: [], //过滤处理的数据
filter_status: [], //控制状态
searchParams: {
erp_order_sn: ''
}
}; };
}, },
onLoad(options) {}, onLoad(options) {
this.erp_order_sn = options.erp_order_sn || '';
//携带的子箱号数据
this.fix_erp_order_sn = options.fix_erp_order_sn || '';
if (this.fix_erp_order_sn) {
this.filter_list = this.fix_erp_order_sn.split(',');
}
},
onShow() {
this.getData();
},
methods: { methods: {
open() { open() {
this.$refs.popup.open('bottom'); this.$refs.popup.open('bottom');
}, },
onInput() {
// 清除之前的定时器
clearTimeout(this.timer);
this.timer = setTimeout(() => {
this.list = []; //数组清空
this.getData();
}, 800);
},
/**
* 找出false对应的下标
* @param {Object} arr
* @param {Object} target
*/
findIndex(arr, target) {
const result = [];
arr.map((item, index) => {
if (item === target) {
result.push(index);
}
});
return result;
},
/**
*筛选过滤出选中的元素
*/
filterChange(index) {
this.$set(this.filter_status, index, (this.filter_status[index] = !this.filter_status[index]));
let filter_arr = this.findIndex(this.filter_status, true);
this.filter_list = filter_arr.map(i => this.list[i].name);
},
getData() { getData() {
this.request(API.getCheckInList, 'POST', { number: this.id }, this.loading).then(res => { this.request(API.getFixErpOrderSn, 'POST', { erp_order_sn: this.searchParams.erp_order_sn }, true).then(res => {
if (res.err_code === 0) { if (res.err_code === 0) {
this.form.checkIn = res.data[0]; this.list = res.data;
this.filter_status = createArray(this.list.length, false);
//携带的数据转化
if (this.fix_erp_order_sn) {
const fixSnArray = this.fix_erp_order_sn.split(',');
this.filter_status = this.list.map(item => fixSnArray.includes(item.name));
}
} else { } else {
uni.showToast({ uni.showToast({
title: res.err_msg, title: res.err_msg,
...@@ -79,7 +133,27 @@ export default { ...@@ -79,7 +133,27 @@ export default {
} }
}); });
}, },
submit() {} confirmChange() {
this.$refs.popup.close();
},
submit() {
uni.$emit('updateData', this.filter_list);
uni.navigateBack({
delta: 1
});
},
reset() {
this.filter_list = [];
this.filter_status.fill(false);
},
deleteChange(val) {
const matchingIndex = this.list.findIndex(item => item.name === val);
if (matchingIndex !== -1) {
this.filter_status[matchingIndex] = false;
this.filter_list = this.filter_list.filter(item => item !== val);
this.$forceUpdate();
}
}
} }
}; };
</script> </script>
......
pages/tallyGoods/originSplit.vue
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<view class="page-box"> <view class="page-box">
<view class="title row bothSide verCenter"> <view class="title row bothSide verCenter">
<text class="t1">入仓号</text> <text class="t1">入仓号</text>
<text class="t2">B123456</text> <text class="t2">{{ erp_order_sn }}</text>
</view> </view>
<view class="select-split"> <view class="select-split">
<view class="box"> <view class="box">
...@@ -11,8 +11,8 @@ ...@@ -11,8 +11,8 @@
<text class="t2">选择需要拆分型号</text> <text class="t2">选择需要拆分型号</text>
</view> </view>
<view class="pick-list row bothSide verCenter"> <view class="pick-list row bothSide verCenter">
<picker @change="bindPickerChange" :value="goods_list_index" :range="goods_list"> <picker @change="bindPickerChange($event, 1)" :value="goods_index" :range="goods_list" :range-key="'model'" style="width: 80%;">
<view class="uni-text">{{ goods_list[goods_list_index] || '请选择型号' }}</view> <view class="uni-text">{{ goods_list[goods_index].model || '请选择型号' }}</view>
</picker> </picker>
<text class="iconfont icon-sanjiaoxing1"></text> <text class="iconfont icon-sanjiaoxing1"></text>
</view> </view>
...@@ -23,83 +23,159 @@ ...@@ -23,83 +23,159 @@
<text class="t2">&nbsp;&nbsp;选择拆分数量</text> <text class="t2">&nbsp;&nbsp;选择拆分数量</text>
</view> </view>
<view class="pick-list row bothSide verCenter"> <view class="pick-list row bothSide verCenter">
<picker @change="bindPickerChange" :value="goods_list_index" :range="goods_list"> <picker @change="bindPickerChange($event, 2)" :value="index" :range="num_arr" style="width: 80%;">
<view class="uni-text">{{ goods_list[goods_list_index] || '请选择拆分数量' }}</view> <view class="uni-text">{{ num_arr[index] || '请选择拆分数量' }}</view>
</picker> </picker>
<text class="iconfont icon-sanjiaoxing1"></text> <text class="iconfont icon-sanjiaoxing1"></text>
</view> </view>
</view> </view>
</view> </view>
<view class="text-details"> <view class="text-details" v-if="tally_num > 0">
<view class="text-row row verCenter bothSide" style="margin-bottom: 20rpx;"> <view class="text-row row verCenter bothSide" style="margin-bottom: 20rpx;">
<view class="left"> <view class="left">
<text class="t1">原产国家：</text> <text class="t1">原产国家：</text>
<text class="t2">美国</text> <text class="t2">{{ goods_list[goods_index].origin || '' }}</text>
</view> </view>
<view class="right"></view> <view class="right"></view>
</view> </view>
<view class="text-row row verCenter bothSide"> <view class="text-row row verCenter bothSide">
<view class="left"> <view class="left">
<text class="t1">订单数量：</text> <text class="t1">订单数量：</text>
<text class="t2">1000</text> <text class="t2">{{ goods_list[goods_index].qty }}</text>
</view> </view>
<view class="right"> <view class="right">
<text class="t1">剩余拆分：</text> <text class="t1">剩余拆分：</text>
<text class="t2">10,000</text> <text class="t2">{{ goods_list[goods_index].qty }}</text>
</view> </view>
</view> </view>
</view> </view>
<view class="select-split-detail"> <view class="select-split-detail" v-if="tally_num > 0">
<view class="box"> <view class="box" v-for="(item, index) in tally_num" :key="index">
<view class="label">产地拆分1</view> <view class="label">产地拆分&nbsp;{{ index + 1 }}</view>
<view class="pick-list row bothSide verCenter"> <view class="pick-list row bothSide verCenter">
<view class="wrap row verCenter"> <view class="wrap row verCenter">
<picker @change="bindPickerChange" :value="goods_list_index" :range="goods_list"> <view class="uni-text" @click="open(index)">{{ detail_json[index].origin ? detail_json[index].origin : '请选择国家地区' }}</view>
<view class="uni-text">{{ goods_list[goods_list_index] || '请选择国家地区' }}</view>
</picker>
<text class="iconfont icon-sanjiaoxing1"></text> <text class="iconfont icon-sanjiaoxing1"></text>
</view> </view>
<view class="input-wrap"><input type="number" inputmode="numeric" placeholder="请输入拆分数量" class="uni-input" placeholder-style="color:#404547;font-weight:bold;" /></view> <view class="input-wrap"><input type="number" inputmode="numeric" placeholder="请输入拆分数量" class="uni-input" placeholder-style="color:#404547;font-weight:bold;" v-model="detail_json[index].tally_num" /></view>
</view> </view>
</view> </view>
<view class="box"> </view>
<view class="label">产地拆分2</view> <template v-if="tally_num > 0 && goods_index != -1">
<view class="pick-list row bothSide verCenter"> <view class="btn row rowCenter verCenter" @click="submit()">确认拆分</view>
<view class="wrap row verCenter"> </template>
<picker @change="bindPickerChange" :value="goods_list_index" :range="goods_list"> <template v-else>
<view class="uni-text">{{ goods_list[goods_list_index] || '请选择国家地区' }}</view> <view class="btn row rowCenter verCenter" @click="submit()" style="margin-top: 40rpx;">确认拆分</view>
</picker> </template>
<text class="iconfont icon-sanjiaoxing1"></text> <!-- 选择国家 -->
<uni-popup ref="popup" background-color="#F1F4F6">
<view class="popup-content">
<view class="search-baar row verCenter">
<text class="iconfont icon-a-riqi11"></text>
<input type="text" class="uni-input" placeholder="请输入国家或地区名称（支持中英文）" placeholder-style="font-size:26rpx;color:#6E767A;" @input="onInput" v-model="origin" style="width: 100%;" />
</view>
<view class="data-list">
<view class="box row bothSide verCenter" v-for="(item, index) in origin_list" :key="index" :class="{ curr: filter_status[index] }">
<text class="text">{{ item }}</text>
<view class="check-ico" @click="filterChange(index)"></view>
</view> </view>
<view class="input-wrap"><input type="number" inputmode="numeric" placeholder="请输入拆分数量" class="uni-input" placeholder-style="color:#404547;font-weight:bold;" /></view>
</view> </view>
<view class="pop-btn row rowCenter verCenter" @click="confirmChange">确 认</view>
</view> </view>
</view> </uni-popup>
<view class="btn row rowCenter verCenter" @click="submit()">确认拆分</view>
</view> </view>
</template> </template>
<script> <script>
import { API } from '@/util/api.js'; import { API } from '@/util/api.js';
import { createArray } from '@/util/util.js';
export default { export default {
data() { data() {
return { return {
goods_list_index: -1, curr: -1, //当前打开的是哪个产地
goods_list: ['1-2328702-0', '1-2328701'] erp_order_sn: '',
goods_index: -1,
goods_list: [],
num_arr: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
index: -1,
filter_status: [], //控制状态
origin_list: [], //产地
origin: '', //搜索国家携带的参数
tally_num: 0, //拆分数量
detail_json: [], //收集的数据
dataStates: {} // 用于记录数据状态的对象
}; };
}, },
onLoad(options) {}, onLoad(options) {
this.erp_order_sn = options.erp_order_sn || '';
// 从本地缓存中获取数据
const dataFromSourcePage = uni.getStorageSync('paramsOrigin');
// 使用Object.assign()将dataFromSourcePage的属性合并到data中
Object.assign(this.$data, dataFromSourcePage);
},
onShow() {
this.getData();
this.getOrigin();
},
methods: { methods: {
bindPickerChange: function(e) { open(index) {
this.curr = index;
this.filter_status.fill(false);
this.$refs.popup.open('bottom');
},
/**
* 找出false对应的下标
* @param {Object} arr
* @param {Object} target
*/
findIndex(arr, target) {
const result = [];
arr.map((item, index) => {
if (item === target) {
result.push(index);
}
});
return result;
},
onInput() {
// 清除之前的定时器
clearTimeout(this.timer);
this.timer = setTimeout(() => {
this.origin_list = []; //数组清空
this.getOrigin();
}, 800);
},
bindPickerChange: function(e, type) {
console.log('picker发送选择改变，携带值为', e.target.value); console.log('picker发送选择改变，携带值为', e.target.value);
this.index = e.target.value; if (type == 1) {
this.form.logistics_company = this.array[e.target.value]; this.goods_index = e.target.value;
} else if (type == 2) {
this.tally_num = parseInt(e.target.value) + 1;
this.index = e.target.value;
this.detail_json = Array.from({ length: this.tally_num }, () => ({ origin: '', tally_num: '', ptEntryID: this.goods_list[this.goods_index].ptEntryID }));
}
},
getOrigin() {
this.request(API.getOrigin, 'GET', { origin: this.origin }, true).then(res => {
if (res.err_code === 0) {
this.origin_list = Object.values(res.data);
this.filter_status = createArray(this.origin_list.length, false);
} else {
uni.showToast({
title: res.err_msg,
icon: 'error'
});
}
});
}, },
getData() { getData() {
this.request(API.getCheckInList, 'POST', { number: this.id }, this.loading).then(res => { this.request(API.getTallyGoods, 'GET', { erp_order_sn: this.erp_order_sn }, true).then(res => {
if (res.err_code === 0) { if (res.err_code === 0) {
this.form.checkIn = res.data[0]; if (res.data.entrys.length > 0) {
this.goods_list = res.data.entrys;
}
} else { } else {
uni.showToast({ uni.showToast({
title: res.err_msg, title: res.err_msg,
...@@ -108,7 +184,87 @@ export default { ...@@ -108,7 +184,87 @@ export default {
} }
}); });
}, },
submit() {} /**
*筛选过滤出选中的元素
*/
filterChange(index) {
this.$set(this.filter_status, index, (this.filter_status[index] = !this.filter_status[index]));
let filter_arr = this.findIndex(this.filter_status, true);
var name = filter_arr.map(i => this.origin_list[i]);
this.detail_json[this.curr].origin = name[0];
this.$forceUpdate();
this.$refs.popup.close();
},
confirmChange() {
this.$refs.popup.close();
},
/**
* 判断是否有重复的产地
*/
hasDuplicateOrigin(arr) {
const uniqueOrigins = new Set();
for (const item of arr) {
if (uniqueOrigins.has(item.origin)) {
return true;
}
uniqueOrigins.add(item.origin);
}
return false;
},
submit() {
if (this.goods_index == -1) {
uni.showToast({
title: '请选择型号',
icon: 'none'
});
return false;
}
if (this.tally_num == 0) {
uni.showToast({
title: '请选择拆分数量',
icon: 'none'
});
return false;
}
const shouldContinue = !this.detail_json.some(item => {
if (!item.origin) {
uni.showToast({
title: '请选择拆分国家',
icon: 'none'
});
return true;
}
return false;
});
const hasDuplicates = this.hasDuplicateOrigin(this.detail_json);
if (hasDuplicates) {
uni.showToast({
title: '不允许有相同产地，请重新选择产地',
icon: 'none'
});
return false;
}
if (shouldContinue) {
const totalTallyNum = this.detail_json.reduce((total, item) => total + parseInt(item.tally_num), 0);
const total = this.goods_list[this.goods_index].qty * 1;
if (totalTallyNum != total) {
uni.showModal({
title: '错误提示',
content: '拆分数量总和必须等于订单数量（不可大于或者小于）',
showCancel: false
});
return false;
}
}
uni.$emit('updateOriginData', this.$data);
uni.navigateBack({
delta: 1
});
}
} }
}; };
</script> </script>
......
uni_modules/uni-popup/components/uni-popup/uni-popup.vue
<template> <template>
<view v-if="showPopup" class="uni-popup" :class="[popupstyle, isDesktop ? 'fixforpc-z-index' : '']"> <view v-if="showPopup" class="uni-popup" :class="[popupstyle, isDesktop ? 'fixforpc-z-index' : '']">
<view @touchstart="touchstart"> <view @touchstart="touchstart">
<uni-transition key="1" v-if="maskShow" name="mask" mode-class="fade" :styles="maskClass" <uni-transition key="1" v-if="maskShow" name="mask" mode-class="fade" :styles="maskClass" :duration="duration" :show="showTrans" @click="onTap" />
:duration="duration" :show="showTrans" @click="onTap" /> <uni-transition key="2" :mode-class="ani" name="content" :styles="transClass" :duration="duration" :show="showTrans" @click="onTap">
<uni-transition key="2" :mode-class="ani" name="content" :styles="transClass" :duration="duration" <view class="uni-popup__wrapper" :style="{ backgroundColor: bg }" :class="[popupstyle]" @click="clear"><slot /></view>
:show="showTrans" @click="onTap"> </uni-transition>
<view class="uni-popup__wrapper" :style="{ backgroundColor: bg }" :class="[popupstyle]" @click="clear"> </view>
<slot /> <!-- #ifdef H5 -->
</view> <keypress v-if="maskShow" @esc="onTap" />
</uni-transition> <!-- #endif -->
</view> </view>
<!-- #ifdef H5 -->
<keypress v-if="maskShow" @esc="onTap" />
<!-- #endif -->
</view>
</template> </template>
<script> <script>
// #ifdef H5 // #ifdef H5
import keypress from './keypress.js' import keypress from './keypress.js';
// #endif // #endif
/** /**
* PopUp 弹出层 * PopUp 弹出层
* @description 弹出层组件，为了解决遮罩弹层的问题 * @description 弹出层组件，为了解决遮罩弹层的问题
* @tutorial https://ext.dcloud.net.cn/plugin?id=329 * @tutorial https://ext.dcloud.net.cn/plugin?id=329
* @property {String} type = [top|center|bottom|left|right|message|dialog|share] 弹出方式 * @property {String} type = [top|center|bottom|left|right|message|dialog|share] 弹出方式
* @value top 顶部弹出 * @value top 顶部弹出
* @value center 中间弹出 * @value center 中间弹出
* @value bottom 底部弹出 * @value bottom 底部弹出
* @value left 左侧弹出 * @value left 左侧弹出
* @value right 右侧弹出 * @value right 右侧弹出
* @value message 消息提示 * @value message 消息提示
* @value dialog 对话框 * @value dialog 对话框
* @value share 底部分享示例 * @value share 底部分享示例
* @property {Boolean} animation = [true|false] 是否开启动画 * @property {Boolean} animation = [true|false] 是否开启动画
* @property {Boolean} maskClick = [true|false] 蒙版点击是否关闭弹窗(废弃) * @property {Boolean} maskClick = [true|false] 蒙版点击是否关闭弹窗(废弃)
* @property {Boolean} isMaskClick = [true|false] 蒙版点击是否关闭弹窗 * @property {Boolean} isMaskClick = [true|false] 蒙版点击是否关闭弹窗
* @property {String} backgroundColor 主窗口背景色 * @property {String} backgroundColor 主窗口背景色
* @property {String} maskBackgroundColor 蒙版颜色 * @property {String} maskBackgroundColor 蒙版颜色
* @property {Boolean} safeArea 是否适配底部安全区 * @property {Boolean} safeArea 是否适配底部安全区
* @event {Function} change 打开关闭弹窗触发，e={show: false} * @event {Function} change 打开关闭弹窗触发，e={show: false}
* @event {Function} maskClick 点击遮罩触发 * @event {Function} maskClick 点击遮罩触发
*/ */
export default { export default {
name: 'uniPopup', name: 'uniPopup',
components: { components: {
// #ifdef H5 // #ifdef H5
keypress keypress
// #endif // #endif
}, },
emits: ['change', 'maskClick'], emits: ['change', 'maskClick'],
props: { props: {
// 开启动画 // 开启动画
animation: { animation: {
type: Boolean, type: Boolean,
default: true default: true
}, },
// 弹出层类型，可选值，top: 顶部弹出层；bottom：底部弹出层；center：全屏弹出层 // 弹出层类型，可选值，top: 顶部弹出层；bottom：底部弹出层；center：全屏弹出层
// message: 消息提示 ; dialog : 对话框 // message: 消息提示 ; dialog : 对话框
type: { type: {
type: String, type: String,
default: 'center' default: 'center'
}, },
// maskClick // maskClick
isMaskClick: { isMaskClick: {
type: Boolean, type: Boolean,
default: null default: null
}, },
// TODO 2 个版本后废弃属性 ，使用 isMaskClick // TODO 2 个版本后废弃属性 ，使用 isMaskClick
maskClick: { maskClick: {
type: Boolean, type: Boolean,
default: null default: null
}, },
backgroundColor: { backgroundColor: {
type: String, type: String,
default: 'none' default: 'none'
}, },
safeArea: { safeArea: {
type: Boolean, type: Boolean,
default: true default: true
}, },
maskBackgroundColor: { maskBackgroundColor: {
type: String, type: String,
default: 'rgba(0, 0, 0, 0.4)' default: 'rgba(0, 0, 0, 0.4)'
}, }
}, },
watch: { watch: {
/** /**
* 监听type类型 * 监听type类型
*/ */
type: { type: {
handler: function(type) { handler: function(type) {
if (!this.config[type]) return if (!this.config[type]) return;
this[this.config[type]](true) this[this.config[type]](true);
}, },
immediate: true immediate: true
}, },
isDesktop: { isDesktop: {
handler: function(newVal) { handler: function(newVal) {
if (!this.config[newVal]) return if (!this.config[newVal]) return;
this[this.config[this.type]](true) this[this.config[this.type]](true);
}, },
immediate: true immediate: true
}, },
/** /**
* 监听遮罩是否可点击 * 监听遮罩是否可点击
* @param {Object} val * @param {Object} val
*/ */
maskClick: { maskClick: {
handler: function(val) { handler: function(val) {
this.mkclick = val this.mkclick = val;
}, },
immediate: true immediate: true
}, },
isMaskClick: { isMaskClick: {
handler: function(val) { handler: function(val) {
this.mkclick = val this.mkclick = val;
}, },
immediate: true immediate: true
}, },
// H5 下禁止底部滚动 // H5 下禁止底部滚动
showPopup(show) { showPopup(show) {
// #ifdef H5 // #ifdef H5
// fix by mehaotian 处理 h5 滚动穿透的问题 // fix by mehaotian 处理 h5 滚动穿透的问题
document.getElementsByTagName('body')[0].style.overflow = show ? 'hidden' : 'visible' document.getElementsByTagName('body')[0].style.overflow = show ? 'hidden' : 'visible';
// #endif // #endif
} }
}, },
data() { data() {
return { return {
duration: 300, duration: 300,
ani: [], ani: [],
showPopup: false, showPopup: false,
showTrans: false, showTrans: false,
popupWidth: 0, popupWidth: 0,
popupHeight: 0, popupHeight: 0,
config: { config: {
top: 'top', top: 'top',
bottom: 'bottom', bottom: 'bottom',
center: 'center', center: 'center',
left: 'left', left: 'left',
right: 'right', right: 'right',
message: 'top', message: 'top',
dialog: 'center', dialog: 'center',
share: 'bottom' share: 'bottom'
}, },
maskClass: { maskClass: {
position: 'fixed', position: 'fixed',
bottom: 0, bottom: 0,
top: 0, top: 0,
left: 0, left: 0,
right: 0, right: 0,
backgroundColor: 'rgba(0, 0, 0, 0.4)' backgroundColor: 'rgba(0, 0, 0, 0.4)'
}, },
transClass: { transClass: {
position: 'fixed', position: 'fixed',
left: 0, left: 0,
right: 0 right: 0
}, },
maskShow: true, maskShow: true,
mkclick: true, mkclick: true,
popupstyle: this.isDesktop ? 'fixforpc-top' : 'top' popupstyle: this.isDesktop ? 'fixforpc-top' : 'top'
} };
}, },
computed: { computed: {
isDesktop() { isDesktop() {
return this.popupWidth >= 500 && this.popupHeight >= 500 return this.popupWidth >= 500 && this.popupHeight >= 500;
}, },
bg() { bg() {
if (this.backgroundColor === '' || this.backgroundColor === 'none') { if (this.backgroundColor === '' || this.backgroundColor === 'none') {
return 'transparent' return 'transparent';
} }
return this.backgroundColor return this.backgroundColor;
} }
}, },
mounted() { mounted() {
const fixSize = () => { const fixSize = () => {
const { const { windowWidth, windowHeight, windowTop, safeArea, screenHeight, safeAreaInsets } = uni.getSystemInfoSync();
windowWidth, this.popupWidth = windowWidth;
windowHeight, this.popupHeight = windowHeight + (windowTop || 0);
windowTop, // TODO fix by mehaotian 是否适配底部安全区 ,目前微信ios 、和 app ios 计算有差异，需要框架修复
safeArea, if (safeArea && this.safeArea) {
screenHeight, // #ifdef MP-WEIXIN
safeAreaInsets this.safeAreaInsets = screenHeight - safeArea.bottom;
} = uni.getSystemInfoSync() // #endif
this.popupWidth = windowWidth // #ifndef MP-WEIXIN
this.popupHeight = windowHeight + (windowTop || 0) this.safeAreaInsets = safeAreaInsets.bottom;
// TODO fix by mehaotian 是否适配底部安全区 ,目前微信ios 、和 app ios 计算有差异，需要框架修复 // #endif
if (safeArea && this.safeArea) { } else {
// #ifdef MP-WEIXIN this.safeAreaInsets = 0;
this.safeAreaInsets = screenHeight - safeArea.bottom }
// #endif };
// #ifndef MP-WEIXIN fixSize();
this.safeAreaInsets = safeAreaInsets.bottom // #ifdef H5
// #endif // window.addEventListener('resize', fixSize)
} else { // this.$once('hook:beforeDestroy', () => {
this.safeAreaInsets = 0 // window.removeEventListener('resize', fixSize)
} // })
} // #endif
fixSize() },
// #ifdef H5 // #ifndef VUE3
// window.addEventListener('resize', fixSize) // TODO vue2
// this.$once('hook:beforeDestroy', () => { destroyed() {
// window.removeEventListener('resize', fixSize) this.setH5Visible();
// }) },
// #endif // #endif
}, // #ifdef VUE3
// #ifndef VUE3 // TODO vue3
// TODO vue2 unmounted() {
destroyed() { this.setH5Visible();
this.setH5Visible() },
}, // #endif
// #endif created() {
// #ifdef VUE3 // this.mkclick = this.isMaskClick || this.maskClick
// TODO vue3 if (this.isMaskClick === null && this.maskClick === null) {
unmounted() { this.mkclick = true;
this.setH5Visible() } else {
}, this.mkclick = this.isMaskClick !== null ? this.isMaskClick : this.maskClick;
// #endif }
created() { if (this.animation) {
// this.mkclick = this.isMaskClick || this.maskClick this.duration = 300;
if (this.isMaskClick === null && this.maskClick === null) { } else {
this.mkclick = true this.duration = 0;
} else { }
this.mkclick = this.isMaskClick !== null ? this.isMaskClick : this.maskClick // TODO 处理 message 组件生命周期异常的问题
} this.messageChild = null;
if (this.animation) { // TODO 解决头条冒泡的问题
this.duration = 300 this.clearPropagation = false;
} else { this.maskClass.backgroundColor = this.maskBackgroundColor;
this.duration = 0 },
} methods: {
// TODO 处理 message 组件生命周期异常的问题 setH5Visible() {
this.messageChild = null // #ifdef H5
// TODO 解决头条冒泡的问题 // fix by mehaotian 处理 h5 滚动穿透的问题
this.clearPropagation = false document.getElementsByTagName('body')[0].style.overflow = 'visible';
this.maskClass.backgroundColor = this.maskBackgroundColor // #endif
}, },
methods: { /**
setH5Visible() { * 公用方法，不显示遮罩层
// #ifdef H5 */
// fix by mehaotian 处理 h5 滚动穿透的问题 closeMask() {
document.getElementsByTagName('body')[0].style.overflow = 'visible' this.maskShow = false;
// #endif },
}, /**
/** * 公用方法，遮罩层禁止点击
* 公用方法，不显示遮罩层 */
*/ disableMask() {
closeMask() { this.mkclick = false;
this.maskShow = false },
}, // TODO nvue 取消冒泡
/** clear(e) {
* 公用方法，遮罩层禁止点击 // #ifndef APP-NVUE
*/ e.stopPropagation();
disableMask() { // #endif
this.mkclick = false this.clearPropagation = true;
}, },
// TODO nvue 取消冒泡
clear(e) {
// #ifndef APP-NVUE
e.stopPropagation()
// #endif
this.clearPropagation = true
},
open(direction) { open(direction) {
// fix by mehaotian 处理快速打开关闭的情况 // fix by mehaotian 处理快速打开关闭的情况
if (this.showPopup) { if (this.showPopup) {
clearTimeout(this.timer) clearTimeout(this.timer);
this.showPopup = false this.showPopup = false;
} }
let innerType = ['top', 'center', 'bottom', 'left', 'right', 'message', 'dialog', 'share'] let innerType = ['top', 'center', 'bottom', 'left', 'right', 'message', 'dialog', 'share'];
if (!(direction && innerType.indexOf(direction) !== -1)) { if (!(direction && innerType.indexOf(direction) !== -1)) {
direction = this.type direction = this.type;
} }
if (!this.config[direction]) { if (!this.config[direction]) {
console.error('缺少类型：', direction) console.error('缺少类型：', direction);
return return;
} }
this[this.config[direction]]() this[this.config[direction]]();
this.$emit('change', { this.$emit('change', {
show: true, show: true,
type: direction type: direction
}) });
}, },
close(type) { close(type) {
this.showTrans = false this.showTrans = false;
this.$emit('change', { this.$emit('change', {
show: false, show: false,
type: this.type type: this.type
}) });
clearTimeout(this.timer) clearTimeout(this.timer);
// // 自定义关闭事件 // // 自定义关闭事件
// this.customOpen && this.customClose() // this.customOpen && this.customClose()
this.timer = setTimeout(() => { this.timer = setTimeout(() => {
this.showPopup = false this.showPopup = false;
}, 300) }, 300);
}, },
// TODO 处理冒泡事件，头条的冒泡事件有问题 ，先这样兼容 // TODO 处理冒泡事件，头条的冒泡事件有问题 ，先这样兼容
touchstart() { touchstart() {
this.clearPropagation = false this.clearPropagation = false;
}, },
onTap() { onTap() {
if (this.clearPropagation) { if (this.clearPropagation) {
// fix by mehaotian 兼容 nvue // fix by mehaotian 兼容 nvue
this.clearPropagation = false this.clearPropagation = false;
return return;
} }
this.$emit('maskClick') this.$emit('maskClick');
if (!this.mkclick) return if (!this.mkclick) return;
this.close() this.close();
}, },
/** /**
* 顶部弹出样式处理 * 顶部弹出样式处理
*/ */
top(type) { top(type) {
this.popupstyle = this.isDesktop ? 'fixforpc-top' : 'top' this.popupstyle = this.isDesktop ? 'fixforpc-top' : 'top';
this.ani = ['slide-top'] this.ani = ['slide-top'];
this.transClass = { this.transClass = {
position: 'fixed', position: 'fixed',
left: 0, left: 0,
right: 0, right: 0,
backgroundColor: this.bg backgroundColor: this.bg
} };
// TODO 兼容 type 属性 ，后续会废弃 // TODO 兼容 type 属性 ，后续会废弃
if (type) return if (type) return;
this.showPopup = true this.showPopup = true;
this.showTrans = true this.showTrans = true;
this.$nextTick(() => { this.$nextTick(() => {
if (this.messageChild && this.type === 'message') { if (this.messageChild && this.type === 'message') {
this.messageChild.timerClose() this.messageChild.timerClose();
} }
}) });
}, },
/** /**
* 底部弹出样式处理 * 底部弹出样式处理
*/ */
bottom(type) { bottom(type) {
this.popupstyle = 'bottom' this.popupstyle = 'bottom';
this.ani = ['slide-bottom'] this.ani = ['slide-bottom'];
this.transClass = { this.transClass = {
position: 'fixed', position: 'fixed',
left: 0, left: 0,
right: 0, right: 0,
bottom: 0, bottom: 0,
paddingBottom: this.safeAreaInsets + 'px', paddingBottom: this.safeAreaInsets + 'px',
backgroundColor: this.bg backgroundColor: this.bg,
} borderRadius: '20rpx'
// TODO 兼容 type 属性 ，后续会废弃 };
if (type) return // TODO 兼容 type 属性 ，后续会废弃
this.showPopup = true if (type) return;
this.showTrans = true this.showPopup = true;
}, this.showTrans = true;
/** },
* 中间弹出样式处理 /**
*/ * 中间弹出样式处理
center(type) { */
this.popupstyle = 'center' center(type) {
this.ani = ['zoom-out', 'fade'] this.popupstyle = 'center';
this.transClass = { this.ani = ['zoom-out', 'fade'];
position: 'fixed', this.transClass = {
/* #ifndef APP-NVUE */ position: 'fixed',
display: 'flex', /* #ifndef APP-NVUE */
flexDirection: 'column', display: 'flex',
/* #endif */ flexDirection: 'column',
bottom: 0, /* #endif */
left: 0, bottom: 0,
right: 0, left: 0,
top: 0, right: 0,
justifyContent: 'center', top: 0,
alignItems: 'center' justifyContent: 'center',
} alignItems: 'center'
// TODO 兼容 type 属性 ，后续会废弃 };
if (type) return // TODO 兼容 type 属性 ，后续会废弃
this.showPopup = true if (type) return;
this.showTrans = true this.showPopup = true;
}, this.showTrans = true;
left(type) { },
this.popupstyle = 'left' left(type) {
this.ani = ['slide-left'] this.popupstyle = 'left';
this.transClass = { this.ani = ['slide-left'];
position: 'fixed', this.transClass = {
left: 0, position: 'fixed',
bottom: 0, left: 0,
top: 0, bottom: 0,
backgroundColor: this.bg, top: 0,
/* #ifndef APP-NVUE */ backgroundColor: this.bg,
display: 'flex', /* #ifndef APP-NVUE */
flexDirection: 'column' display: 'flex',
/* #endif */ flexDirection: 'column'
} /* #endif */
// TODO 兼容 type 属性 ，后续会废弃 };
if (type) return // TODO 兼容 type 属性 ，后续会废弃
this.showPopup = true if (type) return;
this.showTrans = true this.showPopup = true;
}, this.showTrans = true;
right(type) { },
this.popupstyle = 'right' right(type) {
this.ani = ['slide-right'] this.popupstyle = 'right';
this.transClass = { this.ani = ['slide-right'];
position: 'fixed', this.transClass = {
bottom: 0, position: 'fixed',
right: 0, bottom: 0,
top: 0, right: 0,
backgroundColor: this.bg, top: 0,
/* #ifndef APP-NVUE */ backgroundColor: this.bg,
display: 'flex', /* #ifndef APP-NVUE */
flexDirection: 'column' display: 'flex',
/* #endif */ flexDirection: 'column'
} /* #endif */
// TODO 兼容 type 属性 ，后续会废弃 };
if (type) return // TODO 兼容 type 属性 ，后续会废弃
this.showPopup = true if (type) return;
this.showTrans = true this.showPopup = true;
} this.showTrans = true;
} }
} }
};
</script> </script>
<style lang="scss"> <style lang="scss">
.uni-popup { .uni-popup {
position: fixed; position: fixed;
/* #ifndef APP-NVUE */ /* #ifndef APP-NVUE */
z-index: 99; z-index: 99;
/* #endif */ /* #endif */
&.top, &.top,
&.left, &.left,
&.right { &.right {
/* #ifdef H5 */ /* #ifdef H5 */
top: var(--window-top); top: var(--window-top);
/* #endif */ /* #endif */
/* #ifndef H5 */ /* #ifndef H5 */
top: 0; top: 0;
/* #endif */ /* #endif */
} }
.uni-popup__wrapper { .uni-popup__wrapper {
/* #ifndef APP-NVUE */ border-radius: 20rpx 20rpx 0rpx 0rpx;
display: block; /* #ifndef APP-NVUE */
/* #endif */ display: block;
position: relative; /* #endif */
position: relative;
/* iphonex 等安全区设置，底部安全区适配 */ /* iphonex 等安全区设置，底部安全区适配 */
/* #ifndef APP-NVUE */ /* #ifndef APP-NVUE */
// padding-bottom: constant(safe-area-inset-bottom); // padding-bottom: constant(safe-area-inset-bottom);
// padding-bottom: env(safe-area-inset-bottom); // padding-bottom: env(safe-area-inset-bottom);
/* #endif */ /* #endif */
&.left, &.left,
&.right { &.right {
/* #ifdef H5 */ /* #ifdef H5 */
padding-top: var(--window-top); padding-top: var(--window-top);
/* #endif */ /* #endif */
/* #ifndef H5 */ /* #ifndef H5 */
padding-top: 0; padding-top: 0;
/* #endif */ /* #endif */
flex: 1; flex: 1;
} }
} }
} }
.fixforpc-z-index { .fixforpc-z-index {
/* #ifndef APP-NVUE */ /* #ifndef APP-NVUE */
z-index: 999; z-index: 999;
/* #endif */ /* #endif */
} }
.fixforpc-top { .fixforpc-top {
top: 0; top: 0;
} }
</style> </style>
util/api.js
//const API_BASE = 'https://api.ichunt.com'; // const API_BASE = 'https://api.ichunt.com';
// const API_BASE_OSS = 'https://image.ichunt.net'; //oss系统
const API_BASE = 'http://api.liexin.com'; const API_BASE = 'http://api.liexin.com';
const API_BASE_OSS = 'http://image.liexindev.net'; //oss系统
const API = { const API = {
/** /**
* 上传数据 * 上传数据
...@@ -26,6 +30,10 @@ const API = { ...@@ -26,6 +30,10 @@ const API = {
* */ * */
upload: API_BASE + '/oss/upload', upload: API_BASE + '/oss/upload',
/** /**
* 上传文件
* */
uploadImage: API_BASE_OSS + '/uploadImage',
/**
* 生成打印标签数据 * 生成打印标签数据
* */ * */
printLabel: API_BASE + '/supplywechatwms/printLabel', printLabel: API_BASE + '/supplywechatwms/printLabel',
...@@ -160,7 +168,32 @@ const API = { ...@@ -160,7 +168,32 @@ const API = {
/** /**
* 提交当前箱号的数据 * 提交当前箱号的数据
*/ */
submitBoxSnAndNum: API_BASE + '/supplywechatwms/submitBoxSnAndNum' submitBoxSnAndNum: API_BASE + '/supplywechatwms/submitBoxSnAndNum',
/**
* 获取入仓号的理货数据
*/
getTallyGoods: API_BASE + '/supplywechatwms/getTallyGoods',
/**
* 检测入仓号是否理货
*/
checkErpOrderSnIsTally: API_BASE + '/supplywechatwms/checkErpOrderSnIsTally',
/**
* 获取产地
*/
getOrigin: API_BASE + '/supplywechatwms/getOrigin',
/**
* 获取合箱子入仓号
*/
getFixErpOrderSn: API_BASE + '/supplywechatwms/getFixErpOrderSn',
/**
* 修改是否查看
*/
changeWatch: API_BASE + '/supplywechatwms/changeWatch',
/**
* 提交理货
*/
submitTallyGoods: API_BASE + '/supplywechatwms/submitTallyGoods'
} }
......
util/util.js
import API_BASE from '../util/api.js'
/** /**
* 请求封装 * 请求封装
*/ */
...@@ -88,9 +87,18 @@ const debounce = (fn, wait) => { ...@@ -88,9 +87,18 @@ const debounce = (fn, wait) => {
} }
/**
* 来创建指定长度且所有元素都被初始化为 false 的数组
*/
const createArray = (length, value) => {
return Array(length).fill(value);
}
module.exports = { module.exports = {
request, request,
getPlatform, getPlatform,
titleCase, titleCase,
debounce debounce,
createArray
} }
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment