Skip to content

梁建民 / wmsApp

Go to a project
Commit 5807a98f by liangjianmin
Options

feat(picking): 新增自营资料修改功能及相关样式优化 

- 添加“修改自营资料”按钮，支持打开编辑弹窗
- 新增编辑弹窗组件，实现包装方式、包装量、拣货方式等字段编辑
- 实现自营资料数据的获取和保存接口调用
- 增加多个字段和选项的表单绑定及数据双向更新
- 新增尺码输入样式及按钮组样式，提升用户交互体验
- 优化line-clamp属性兼容性，提升样式一致性
parent fbda17b4
Inline Side-by-side
Showing with 411 additions and 2 deletions
assets/css/picking/sort.scss
......@@ -176,6 +176,7 @@
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
line-clamp: 2;
}
}
......@@ -187,6 +188,16 @@
font-size: 15rpx;
color: #ffffff;
}
.btn-border {
width: 140rpx;
height: 30rpx;
background: #ffffff;
border: 1px solid #1969f9;
border-radius: 8rpx;
font-size: 15rpx;
color: #1969f9;
}
}
}
......@@ -379,6 +390,7 @@
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
line-clamp: 2;
}
}
}
......@@ -493,6 +505,7 @@
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
line-clamp: 2;
}
}
}
......@@ -730,3 +743,96 @@
}
}
}
.edit-form-row {
margin-bottom: 20rpx;
padding: 0 20rpx;
}
.edit-form-item {
width: 100%;
}
.edit-label {
font-size: 18rpx;
color: #484b59;
font-weight: bold;
margin-bottom: 12rpx;
}
.edit-input-box {
width: 100%;
height: 60rpx;
background: #ffffff;
border-radius: 10rpx;
border: 1px solid #1969f9;
display: flex;
align-items: center;
padding: 0 20rpx;
picker {
width: 100%;
height: 100%;
display: flex;
align-items: center;
view {
width: 100%;
}
}
.edit-picker-value {
font-size: 18rpx;
color: #484b59;
width: 525rpx;
display: flex;
.iconfont {
font-size: 24rpx;
color: #999;
margin-left: 10rpx;
}
}
.edit-input {
width: 100%;
height: 100%;
font-size: 18rpx;
color: #484b59;
}
}
.edit-btn-group {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
height: 75rpx;
display: flex;
background: #ffffff;
box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.1);
.edit-btn-cancel {
width: 30%;
height: 100%;
background: #ffe0d7;
font-size: 23rpx;
color: #ff3700;
font-weight: bold;
display: flex;
align-items: center;
justify-content: center;
}
.edit-btn-confirm {
width: 70%;
height: 100%;
background: #1969f9;
font-size: 23rpx;
color: #ffffff;
font-weight: bold;
display: flex;
align-items: center;
justify-content: center;
}
}
\ No newline at end of file
pages/picking/sort.vue
......@@ -144,6 +144,7 @@
</view>
<template v-if="item.lock_qty !== item.pick_qty">
<view class="row" style="width: 100%;justify-content: flex-end;">
<view class="btn-border row rowCenter verCenter" @click="showEditSkuDrawer(item)" v-if="item.sku_id > 0" style="margin-right: 20rpx;">修改自营资料</view>
<view class="btn row rowCenter verCenter" @click="showDrawer(1, item)">拣货</view>
</view>
</template>
......@@ -671,7 +672,134 @@
</view>
</view>
</uni-popup>
<!-- 修改自营资料弹窗 -->
<uni-drawer ref="editSkuDrawer" mode="right">
<view class="uni-drawer-picking" style="padding-bottom: 100rpx;">
<view class="title row rowCenter verCenter">
<text class="iconfont icon-juxing2" @click="closeEditSkuDrawer()"></text>
<text class="text">修改自营资料</text>
</view>
<scroll-view scroll-y="true" style="height: calc(100vh - 150rpx);">
<!-- 包装方式 -->
<view class="edit-form-row" style="margin-top: 30rpx;">
<view class="edit-form-item">
<view class="edit-label">包装方式：</view>
<view class="edit-input-box">
<picker @change="onPackingChange" :value="editSkuFormParams.packing_index" :range="packingOptions" range-key="label">
<view class="edit-picker-value row verCenter bothSide">
<text>{{ packingOptions[editSkuFormParams.packing_index].label }}</text>
<text class="iconfont icon-xialajiantou"></text>
</view>
</picker>
</view>
</view>
</view>
<!-- 标准包装量 -->
<view class="edit-form-row">
<view class="edit-form-item">
<view class="edit-label">标准包装量：</view>
<view class="edit-input-box">
<input type="number" class="edit-input" placeholder="请输入" v-model="editSkuFormParams.mpq" />
</view>
</view>
</view>
<!-- 拣货方式 -->
<view class="edit-form-row">
<view class="edit-form-item">
<view class="edit-label">拣货方式：</view>
<view class="edit-input-box">
<picker @change="onPickingModeChange" :value="editSkuFormParams.picking_mode_index" :range="pickingModeOptions" range-key="label">
<view class="edit-picker-value row verCenter bothSide">
<text>{{ pickingModeOptions[editSkuFormParams.picking_mode_index].label }}</text>
<text class="iconfont icon-xialajiantou"></text>
</view>
</picker>
</view>
</view>
</view>
<!-- 其他属性 -->
<view class="edit-form-row">
<view class="edit-form-item">
<view class="edit-label">其他属性：</view>
<view class="edit-input-box">
<picker @change="onOtherAttrChange" :value="editSkuFormParams.picking_other_attr_index" :range="otherAttrOptions" range-key="label">
<view class="edit-picker-value row verCenter bothSide">
<text>{{ otherAttrOptions[editSkuFormParams.picking_other_attr_index].label }}</text>
<text class="iconfont icon-xialajiantou"></text>
</view>
</picker>
</view>
</view>
</view>
<!-- 标准包装尺寸 -->
<view class="edit-form-row">
<view class="edit-form-item">
<view class="edit-label">标准包装长(cm)：</view>
<view class="edit-input-box">
<input type="number" class="edit-input" placeholder="请输入" v-model="editSkuFormParams.standard_length" />
</view>
</view>
</view>
<view class="edit-form-row">
<view class="edit-form-item">
<view class="edit-label">标准包装宽(cm)：</view>
<view class="edit-input-box">
<input type="number" class="edit-input" placeholder="请输入" v-model="editSkuFormParams.standard_width" />
</view>
</view>
</view>
<view class="edit-form-row">
<view class="edit-form-item">
<view class="edit-label">标准包装高(cm)：</view>
<view class="edit-input-box">
<input type="number" class="edit-input" placeholder="请输入" v-model="editSkuFormParams.standard_high" />
</view>
</view>
</view>
<!-- 单位尺寸 -->
<view class="edit-form-row">
<view class="edit-form-item">
<view class="edit-label">单位长(cm)：</view>
<view class="edit-input-box">
<input type="number" class="edit-input" placeholder="请输入" v-model="editSkuFormParams.unit_length" />
</view>
</view>
</view>
<view class="edit-form-row">
<view class="edit-form-item">
<view class="edit-label">单位宽(cm)：</view>
<view class="edit-input-box">
<input type="number" class="edit-input" placeholder="请输入" v-model="editSkuFormParams.unit_width" />
</view>
</view>
</view>
<view class="edit-form-row">
<view class="edit-form-item">
<view class="edit-label">单位高(cm)：</view>
<view class="edit-input-box">
<input type="number" class="edit-input" placeholder="请输入" v-model="editSkuFormParams.unit_high" />
</view>
</view>
</view>
</scroll-view>
<!-- 按钮 -->
<view class="edit-btn-group">
<view class="edit-btn-cancel" @click="closeEditSkuDrawer()">返回</view>
<view class="edit-btn-confirm" @click="saveEditSku()">保存</view>
</view>
</view>
</uni-drawer>
</view>
</template>
......@@ -740,7 +868,48 @@
print_language: '', //非自营仓打印标签 1中文，2英文
from_type: 1 //固定
},
stockInfoByBatchSn: {}
stockInfoByBatchSn: {},
// 修改自营资料相关数据
editSkuData: {},
editSkuFormParams: {
packing_index: 0,
packing: 0,
mpq: '',
picking_mode_index: 0,
picking_mode: 0,
picking_other_attr_index: 0,
picking_other_attr: 0,
standard_length: '',
standard_width: '',
standard_high: '',
unit_length: '',
unit_width: '',
unit_high: ''
},
packingOptions: [
{ label: '请选择', value: 0 },
{ label: '编带', value: 5 },
{ label: '袋', value: 6 },
{ label: '盒', value: 7 },
{ label: '管', value: 8 },
{ label: '托盘', value: 9 },
{ label: '卷', value: 10 },
{ label: '其它', value: 11 },
{ label: '剪切带', value: 12 },
{ label: '散装', value: 13 }
],
pickingModeOptions: [
{ label: '请选择', value: 0 },
{ label: '裁剪', value: 1 },
{ label: '称重', value: 2 },
{ label: '计数', value: 3 }
],
otherAttrOptions: [
{ label: '请选择', value: 0 },
{ label: '大盘', value: 1 },
{ label: '小盘', value: 2 },
{ label: '计数', value: 3 }
]
};
},
onNavigationBarButtonTap(e) {
......@@ -1526,6 +1695,130 @@
});
}
});
},
/**
* 打开修改自营资料弹窗
* @param {Object} item
*/
showEditSkuDrawer(item) {
this.editSkuData = { ...item };
// 调用API获取自营资料信息
this.request(API.getZyGoodsInfo, 'POST', { sku_id: item.sku_id }, true).then(res => {
if (res.code === 0) {
var goodsInfo = res.data || {};
// 初始化表单数据
this.editSkuFormParams = {
packing_index: 0,
packing: goodsInfo.packing || 0,
mpq: goodsInfo.mpq || '',
picking_mode_index: 0,
picking_mode: goodsInfo.picking_mode || 0,
picking_other_attr_index: 0,
picking_other_attr: goodsInfo.picking_other_attr || 0,
standard_length: goodsInfo.standard_length || '',
standard_width: goodsInfo.standard_width || '',
standard_high: goodsInfo.standard_high || '',
unit_length: goodsInfo.unit_length || '',
unit_width: goodsInfo.unit_width || '',
unit_high: goodsInfo.unit_high || ''
};
// 根据已有值设置选项索引
if (goodsInfo.packing) {
var packingIndex = this.packingOptions.findIndex(opt => opt.value === goodsInfo.packing);
if (packingIndex !== -1) {
this.editSkuFormParams.packing_index = packingIndex;
}
}
if (goodsInfo.picking_mode) {
var pickingModeIndex = this.pickingModeOptions.findIndex(opt => opt.value === goodsInfo.picking_mode);
if (pickingModeIndex !== -1) {
this.editSkuFormParams.picking_mode_index = pickingModeIndex;
}
}
if (goodsInfo.picking_other_attr) {
var otherAttrIndex = this.otherAttrOptions.findIndex(opt => opt.value === goodsInfo.picking_other_attr);
if (otherAttrIndex !== -1) {
this.editSkuFormParams.picking_other_attr_index = otherAttrIndex;
}
}
this.$refs.editSkuDrawer.open();
} else {
uni.showToast({
title: res.msg || '获取自营资料失败',
icon: 'none'
});
}
});
},
/**
* 关闭修改自营资料弹窗
*/
closeEditSkuDrawer() {
this.$refs.editSkuDrawer.close();
},
/**
* 包装方式变化
*/
onPackingChange(e) {
this.editSkuFormParams.packing_index = e.detail.value;
this.editSkuFormParams.packing = this.packingOptions[e.detail.value].value;
},
/**
* 拣货方式变化
*/
onPickingModeChange(e) {
this.editSkuFormParams.picking_mode_index = e.detail.value;
this.editSkuFormParams.picking_mode = this.pickingModeOptions[e.detail.value].value;
},
/**
* 其他属性变化
*/
onOtherAttrChange(e) {
this.editSkuFormParams.picking_other_attr_index = e.detail.value;
this.editSkuFormParams.picking_other_attr = this.otherAttrOptions[e.detail.value].value;
},
/**
* 保存自营资料
*/
saveEditSku() {
var params = {
sku_id: this.editSkuData.sku_id,
packing: this.editSkuFormParams.packing,
mpq: this.editSkuFormParams.mpq,
picking_mode: this.editSkuFormParams.picking_mode,
picking_other_attr: this.editSkuFormParams.picking_other_attr,
standard_length: this.editSkuFormParams.standard_length,
standard_width: this.editSkuFormParams.standard_width,
standard_high: this.editSkuFormParams.standard_high,
unit_length: this.editSkuFormParams.unit_length,
unit_width: this.editSkuFormParams.unit_width,
unit_high: this.editSkuFormParams.unit_high
};
this.request(API.updateZyGoods, 'POST', params, true).then(res => {
if (res.code === 0) {
uni.showToast({
title: '保存成功',
icon: 'success'
});
setTimeout(() => {
this.closeEditSkuDrawer();
this.getData();
}, 1500);
} else {
uni.showToast({
title: res.msg,
icon: 'none'
});
}
});
}
}
};
......
util/api.js
......@@ -453,7 +453,16 @@ const API = {
/**
* 三方质检-检后收货
* */
receiveAfterInspection: API_BASE + '/api/inspectionOrder/receiveAfterInspection'
receiveAfterInspection: API_BASE + '/api/inspectionOrder/receiveAfterInspection',
/**
* 保存自营货品信息
* */
updateZyGoods: API_BASE + '/api/zyGoods/updateZyGoods',
/**
* 获取自营货品信息
* */
getZyGoodsInfo: API_BASE + '/api/zyGoods/getZyGoodsInfo'
}
......
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