Skip to content

梁建民 / wmsApp

Go to a project
Commit 0d21ecbc by LJM
Options

增加分货登记记录页（按操作时间倒序排列）

parent da2d0d9a
Inline Side-by-side
Showing with 889 additions and 1 deletions
assets/css/arrivalRegister/splitGoodsRecord.scss 0 → 100644
.splitGoodsRecord {
padding: 15rpx 22rpx;
.search-box {
height: 60rpx;
background: #ffffff;
border-radius: 10rpx;
padding: 0 18rpx 0 0;
.sn {
width: 164rpx;
height: 35rpx;
border-right: 1px solid #f0f0f2;
.uni-input {
font-size: 18rpx;
color: #292b33;
font-weight: bold;
}
.uni-arrow {
width: 14rpx;
height: 9rpx;
background: url('https://img.ichunt.com/images/ichunt/202304/10/e4c72319ad41ce1425f71cc6ec35f111.png') no-repeat center;
background-size: contain;
margin-left: 12rpx;
}
}
.search-bar {
width: calc(100% - 164rpx);
.icon-juxing1 {
font-size: 30rpx;
color: #919399;
margin-left: 17rpx;
margin-right: 13rpx;
}
.uni-input {
font-size: 18rpx;
color: #484b59;
}
.icon-a-juxing11 {
font-size: 30rpx;
color: #c6c7cc;
}
}
}
.search-params {
margin-top: 15rpx;
.sn {
width: 47%;
height: 60rpx;
background: #ffffff;
border-radius: 10rpx;
.uni-input {
font-size: 18rpx;
color: #292b33;
font-weight: bold;
}
.uni-arrow {
width: 14rpx;
height: 9rpx;
background: url('https://img.ichunt.com/images/ichunt/202304/10/e4c72319ad41ce1425f71cc6ec35f111.png') no-repeat center;
background-size: contain;
margin-left: 12rpx;
}
}
}
.list {
margin-top: 15rpx;
padding-bottom: 100rpx;
.box {
position: relative;
padding: 15px 17rpx 18rpx 17rpx;
background: #ffffff;
box-shadow: 0px 3rpx 3rpx 0px rgba(198, 199, 204, 0.3);
border-radius: 10rpx;
margin-bottom: 15rpx;
flex-wrap: wrap;
border: 1px solid transparent;
.check-box-icon {
position: absolute;
right: 18rpx;
top: 17rpx;
width: 20rpx;
height: 20rpx;
background: url('https://img.ichunt.com/images/ichunt/202304/11/0bf30da3e8ce6c476c210173b5f13d51.png') no-repeat center;
background-size: contain;
display: block;
}
&.curr {
border: 1px solid #1969f9;
.check-box-icon {
background: url('https://img.ichunt.com/images/ichunt/202304/11/71a74e52e94bcf2e89f8df9817d494c6.png') no-repeat center;
background-size: contain;
}
}
.input-box {
margin-bottom: 11rpx;
flex: 0 0 50%;
.bor {
height: 1px;
background-color: #f0f0f2;
color: #f0f0f2;
margin-bottom: 10rpx;
}
.label {
width: 114rpx;
font-size: 17rpx;
color: #919399;
white-space: nowrap;
}
.text {
font-size: 17rpx;
color: #484b59;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.desc {
font-size: 17rpx;
color: #484b59;
word-break: break-all;
text-overflow: ellipsis;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.tt {
font-size: 17rpx;
color: #1969f9;
}
.pick_img_list {
flex-wrap: wrap;
.default {
width: 120rpx;
height: 120rpx;
background: #f5f5f7;
border-radius: 10rpx;
margin-right: 15rpx;
.iconfont {
font-size: 60rpx;
color: #c6c7cc;
}
}
.img_list {
position: relative;
width: 120rpx;
height: 120rpx;
background: #f5f5f7;
border-radius: 10rpx;
margin-right: 15rpx;
margin-bottom: 15rpx;
image {
width: 120rpx;
height: 120rpx;
}
.iconfont {
position: absolute;
right: 0;
top: 0;
font-size: 30rpx;
color: #ff3700;
z-index: 9;
}
}
}
}
.btn-box {
position: absolute;
right: 17rpx;
bottom: 13rpx;
.btn1 {
width: 75rpx;
height: 30rpx;
background: #fff;
border-radius: 8rpx;
font-size: 15rpx;
color: #f00;
border: 1px solid #f00;
margin-right: 10rpx;
}
.btn2 {
width: 68rpx;
height: 30rpx;
background: #1969f9;
border-radius: 8rpx;
font-size: 15rpx;
color: #ffffff;
}
}
.status-box {
position: absolute;
right: 50rpx;
top: 5rpx;
.staus_type_val {
font-size: 17rpx;
color: #1969f9;
border: 1px solid #f0f0f2;
width: 40rpx;
height: 40rpx;
border-radius: 50%;
margin-right: 10rpx;
}
}
}
}
.fix-btn {
position: fixed;
bottom: 0;
width: 100%;
left: 0;
z-index: 999;
.btn1 {
width: 128rpx;
height: 75rpx;
background: #ffffff;
border-right: 1px solid #f0f0f2;
.check-box-icon {
width: 20rpx;
height: 20rpx;
background: url('https://img.ichunt.com/images/ichunt/202304/11/0bf30da3e8ce6c476c210173b5f13d51.png') no-repeat center;
background-size: contain;
display: block;
&.curr {
background: url('https://img.ichunt.com/images/ichunt/202304/11/71a74e52e94bcf2e89f8df9817d494c6.png') no-repeat center;
background-size: contain;
}
}
.text {
margin-left: 10rpx;
font-size: 20rpx;
color: #484b59;
}
}
.btn2 {
width: calc(100% - 128rpx);
height: 75rpx;
background: #1969f9;
font-size: 23rpx;
color: #ffffff;
}
}
}
::v-deep .uni-drawer__content {
width: 85% !important;
}
.uni-drawer-layer {
width: 100%;
background-color: #ffffff;
padding: 22rpx 22rpx 0 22rpx;
.tip {
color: red;
font-size: 17rpx;
margin-top: 28rpx;
}
.title {
position: relative;
.iconfont {
position: absolute;
left: 0;
top: 0;
font-size: 30rpx;
color: #292b33;
}
.text {
font-size: 23rpx;
color: #292b33;
font-weight: bold;
}
}
.p-text {
margin-top: 38rpx;
margin-bottom: 25rpx;
.tt {
font-size: 20rpx;
color: #484b59;
}
.ed {
font-weight: bold;
font-size: 20rpx;
color: #1969f9;
}
}
.pp {
font-size: 20rpx;
color: #292b33;
font-weight: bold;
margin-bottom: 17rpx;
margin-top: 35rpx;
transition: all 0.2s ease;
&.pt {
margin-bottom: 35rpx;
}
text:first-child {
margin-right: 32rpx;
}
.curr {
position: relative;
color: #1969f9;
font-weight: bold;
&::after {
content: '';
background-color: #1969f9;
width: 51%;
height: 2px;
position: absolute;
bottom: -10rpx;
left: 0;
right: 0;
margin: 0 auto;
}
}
}
.field-item {
flex-wrap: wrap;
margin-top: 16rpx;
.item {
flex: 0 0 50%;
margin-bottom: 8rpx;
.label {
font-size: 16rpx;
color: #919399;
white-space: nowrap;
}
.text {
font-size: 16rpx;
color: #1969f9;
margin-left: 6rpx;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
max-width: 176rpx;
}
.tt {
font-size: 17rpx;
color: #484b59;
margin-left: 6rpx;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
max-width: 176rpx;
}
}
}
.btn {
position: absolute;
bottom: 0;
left: 0;
right: 0;
width: 100%;
.btn1 {
height: 75rpx;
background: #1969f9;
font-size: 23rpx;
color: #ffffff;
}
.btn2 {
height: 75rpx;
background: #ffe0d7;
font-size: 23rpx;
color: #ff3700;
font-weight: bold;
}
}
.input-wrap {
margin-bottom: 25rpx;
.label-title {
font-size: 17rpx;
color: #484b59;
font-weight: bold;
margin-bottom: 10rpx;
}
.input-box {
.uni-arrow {
width: 14rpx;
height: 9rpx;
background: url('https://img.ichunt.com/images/ichunt/202304/10/e4c72319ad41ce1425f71cc6ec35f111.png') no-repeat center;
background-size: contain;
margin-left: 12rpx;
}
.uni-input {
height: 55rpx;
background: #ffffff;
border-radius: 10rpx;
border: 1px solid #1969f9;
font-size: 17rpx;
padding-left: 18rpx;
}
.uni-textarea {
width: 100%;
height: 110rpx;
background: #ffffff;
border-radius: 10px;
border: 1px solid #1969f9;
font-size: 17rpx;
padding: 18rpx;
}
}
.select-box {
background: #ffffff;
border-radius: 10rpx;
border: 1px solid #1969f9;
.wrap {
padding-left: 15rpx;
padding-right: 25rpx;
height: 40rpx;
}
.uni-input {
font-size: 17rpx;
color: #484b59;
}
.uni-arrow {
width: 14rpx;
height: 9rpx;
background: url('https://img.ichunt.com/images/ichunt/202304/10/e4c72319ad41ce1425f71cc6ec35f111.png') no-repeat center;
background-size: contain;
margin-left: 12rpx;
}
}
}
.pack {
.h2 {
font-size: 17rpx;
color: #484b59;
font-weight: bold;
margin-bottom: 10rpx;
.tt {
font-size: 17rpx;
color: #919399;
font-weight: normal;
}
.num {
.t1 {
font-size: 13rpx;
color: #1969f9;
}
.t2 {
font-size: 13rpx;
color: #919399;
}
}
}
.icon-box {
width: 75rpx;
height: 55rpx;
border-radius: 10rpx;
border: 1px solid #c6c7cc;
.iconfont {
font-size: 30rpx;
color: #56585e;
}
}
.pic-list {
flex-wrap: wrap;
margin-bottom: 18rpx;
.default {
width: 120rpx;
height: 120rpx;
background: #f5f5f7;
border-radius: 10rpx;
margin-right: 15rpx;
.iconfont {
font-size: 60rpx;
color: #c6c7cc;
}
}
.box {
position: relative;
width: 120rpx;
height: 120rpx;
background: #f5f5f7;
border-radius: 10rpx;
margin-right: 15rpx;
margin-bottom: 15rpx;
image {
width: 120rpx;
height: 120rpx;
}
.iconfont {
position: absolute;
right: 0;
top: 0;
font-size: 30rpx;
color: #ff3700;
z-index: 9;
}
}
}
.textarea-box {
width: 100%;
textarea {
width: 100%;
height: 85rpx;
padding: 10rpx 15rpx;
background: #f5f5f7;
border-radius: 10rpx;
font-size: 16rpx;
box-sizing: border-box;
}
}
.print {
margin-bottom: 27rpx;
.check-box-icon {
width: 20rpx;
height: 20rpx;
background: url('https://img.ichunt.com/images/ichunt/202304/11/0bf30da3e8ce6c476c210173b5f13d51.png') no-repeat center;
background-size: contain;
display: block;
&.curr {
background: url('https://img.ichunt.com/images/ichunt/202304/11/71a74e52e94bcf2e89f8df9817d494c6.png') no-repeat center;
background-size: contain;
}
}
.tt {
font-size: 17rpx;
color: #484b59;
margin-left: 10rpx;
}
}
}
}
pages.json
...@@ -421,7 +421,24 @@ ...@@ -421,7 +421,24 @@
}, { }, {
"path": "pages/arrivalRegister/splitGoods", "path": "pages/arrivalRegister/splitGoods",
"style": { "style": {
"navigationBarTitleText": "分货" "navigationBarTitleText": "分货",
"app-plus": {
"titleNView": {
"buttons": [{
"index": "0",
"text": "分货登记记录",
"fontSize": "15px",
"color": "#1969F9",
"float": "right",
"width": "100px"
}]
}
}
}
}, {
"path": "pages/arrivalRegister/splitGoodsRecord",
"style": {
"navigationBarTitleText": "分货登记记录"
} }
}, { }, {
"path": "pages/preCheck/list", "path": "pages/preCheck/list",
......
pages/arrivalRegister/splitGoods.vue
...@@ -261,6 +261,13 @@ ...@@ -261,6 +261,13 @@
} }
}; };
}, },
onNavigationBarButtonTap(e) {
if (e.index == 0) {
uni.navigateTo({
url: '/pages/arrivalRegister/splitGoodsRecord'
});
}
},
watch: { watch: {
image_list(arr) { image_list(arr) {
if (arr.length > 0) { if (arr.length > 0) {
......
pages/arrivalRegister/splitGoodsRecord.vue 0 → 100644
<template>
<view class="splitGoodsRecord">
<!-- 搜索参数 -->
<view class="search-box row bothSide verCenter">
<view class="sn row rowCenter verCenter">
<picker @change="bindPickerChange($event,1)" :value="index" :range="array">
<view class="row verCenter">
<view class="uni-input">{{ array[index] }}</view>
<view class="uni-arrow"></view>
</view>
</picker>
</view>
<view class="search-bar row bothSide verCenter">
<view class="row verCenter" style="width: 100%;">
<text class="iconfont icon-juxing1"></text>
<input class="uni-input" placeholder="请输入物流单号查询" placeholder-style="color:#919399" :focus="is_focus" v-model="searchParams.logistics_sn" @input="handleInput" style="width: 100%;" />
</view>
<text class="iconfont icon-a-juxing11" @click="clearInput()" v-if="input_flag"></text>
</view>
</view>
<view class="search-params row bothSide verCenter">
<view class="sn row rowCenter verCenter">
<picker @change="bindPickerChange($event,3)" :value="status_index" :range="status" :range-key="'name'">
<view class="row verCenter">
<view class="uni-input">{{ status_index === -1 ? '预检单状态' : status[status_index].name }}</view>
<view class="uni-arrow"></view>
</view>
</picker>
</view>
<view class="sn row rowCenter verCenter">
<picker @change="bindPickerChange($event,4)" :value="logistics_company_index" :range="logistics_company" :range-key="'name'">
<view class="row verCenter">
<view class="uni-input">{{ logistics_company_index === -1 ? '请选择物流公司' : logistics_company[logistics_company_index].name }}</view>
<view class="uni-arrow"></view>
</view>
</picker>
</view>
</view>
<!-- 列表区 -->
<view class="list" v-if="list.length > 0">
<view class="box row" v-for="(item, index) in list" :key="index" :class="{ curr: filter_list[index] }">
<view class="check-box-icon" @click="filterChange(index)"></view>
<view class="status-box row">
<view class="staus_type_val row rowCenter verCenter" v-if="item.is_look_str == '是'">看</view>
<view class="staus_type_val row rowCenter verCenter" v-if="item.is_qc">检</view>
</view>
<view class="input-box row verCenter curr" style="flex: 0 0 100%;">
<text class="label">到货时间：</text>
<text class="text">{{ item.register_time_cn }}</text>
<template v-if="item.stock_in_separate_register_status == 3">
<text class="tt" style="margin-left: 50px;width: 100rpx;color: red;">{{item.stock_in_separate_register_status_cn}}</text>
</template>
<template v-else>
<text class="tt" style="margin-left: 50px;width: 100rpx;">{{item.stock_in_separate_register_status_cn}}</text>
</template>
</view>
<view class="input-box row verCenter curr" style="flex: 0 0 100%;">
<text class="label">物流公司：</text>
<text class="text">{{ item.logistics_company }}</text>
</view>
<view class="input-box row verCenter">
<text class="label">物流单号：</text>
<text class="text">{{ item.logistics_sn }}</text>
</view>
<view class="input-box row verCenter">
<text class="label">件数：</text>
<text class="text">{{ item.num }}</text>
</view>
<view class="input-box row verCenter">
<text class="label">操作人：</text>
<text class="text">{{ item.register_name }}</text>
</view>
<view class="input-box row verCenter">
<text class="label">操作时间：</text>
<text class="text">{{ item.create_time_cn }}</text>
</view>
<view class="input-box row" style="flex: 0 0 100%;">
<text class="label">登记照片：</text>
<view class="pick_img_list row">
<template v-if="item.register_pic">
<view class="img_list" v-for="(v, i) in item.register_pic.split(',')" :key="i">
<image :src="v" mode="aspectFill" @click="previewChange(item.register_pic.split(','),i)"></image>
</view>
</template>
</view>
</view>
</view>
</view>
<!-- 无数据展示 -->
<view class="no-date column rowCenter verCenter" v-else>
<text class="iconfont icon-a-juxing21"></text>
<text class="text">查不到当前数据</text>
</view>
<!-- 底部操作按钮 -->
<view class="fix-btn row verCenter">
<view class="btn1 row rowCenter verCenter" @click="allChnage()">
<text class="check-box-icon" :class="{ curr: filter_list.length > 0 && filter_list.length == filter_id.length }"></text>
<text class="text">{{ filter_id.length == 0 ? '全选' : filter_id.length }}</text>
</view>
<view class="btn2 row rowCenter verCenter" @click="delSeparateStockInRegister">作废</view>
</view>
</view>
</template>
<script>
import { API } from '@/util/api.js';
import { createArray } from '@/util/util.js';
import debounce from 'lodash/debounce';
export default {
data() {
return {
is_focus: true, //获取焦点动态化
index: 0,
detail: {}, //详情
array: ['全量搜索'],
noexebshowFalg: true, //控制是否会触发生命周期
input_flag: false,
all_flag: false, //全选标记
page: 1,
limit: 30,
hasMoreData: true, //是否分页加载
list: [],
filter_list: [], //筛选已选中的列表
filter_id: [], //过滤id
logistics_company: [
{ name: '全部', value: '' },
{ name: '联邦快递', value: '联邦快递' },
{ name: 'DHL国际快递', value: '国际快递' },
{ name: '顺丰速运', value: '顺丰速运' },
{ name: '供应商配送', value: '供应商配送' },
{ name: '快递送货', value: '快递送货' },
{ name: '韵达快递', value: '韵达快递' },
{ name: '速尔快递', value: '速尔快递' },
{ name: 'TNT快递', value: '快递' },
{ name: '自提', value: '自提' },
{ name: '京东快递', value: '京东快递' },
{ name: '优速物流', value: '优速物流' },
{ name: '顺丰特惠', value: '顺丰特惠' },
{ name: 'UPS', value: 'UPS' },
{ name: 'Air', value: 'Air' },
{ name: '其他', value: '其他' }
],
logistics_company_index: -1,
searchParams: {
logistics_sn: '', //物流单号
logistics_company: '', //物流公司
register_time: '' //到货时间
}
};
},
onReachBottom() {
if (!this.hasMoreData) {
return;
}
this.page++;
this.getData();
},
onShow() {
if (this.noexebshowFalg) {
this.resetChange();
this.getData();
}
},
methods: {
bindPickerChange: function(e, type) {
console.log('picker发送选择改变，携带值为', e.detail.value);
if (type == 1) {
this.index = e.detail.value;
this.clearInputAndFocus();
} else if (type == 2) {
this.to_shipping_index = e.detail.value;
this.stockPreCheckDeliverParams.to_shipping_id = this.to_shipping[e.detail.value].value;
} else if (type == 3) {
this.status_index = e.detail.value;
this.searchParams.status = this.status[e.detail.value].value;
this.resetChange();
this.getData();
} else if (type == 4) {
this.logistics_company_index = e.detail.value;
this.searchParams.logistics_company = this.logistics_company[e.detail.value].value;
this.resetChange();
this.getData();
}
},
/**
* 全选
*/
allChnage() {
this.all_flag = !this.all_flag;
this.filter_list = createArray(this.list.length, this.all_flag);
if (this.all_flag) {
this.filter_id = this.list.map(function(item) {
return item.id;
});
} else {
this.filter_id = [];
}
},
/**
* 找出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_list, index, (this.filter_list[index] = !this.filter_list[index]));
let filter_arr = this.findIndex(this.filter_list, true);
this.filter_id = filter_arr.map(i => this.list[i].skinserr_id);
},
/**
* 清空数据
*/
clearInput() {
this.resetChange();
this.searchParams.logistics_sn = '';
this.input_flag = false;
this.clearInputAndFocus();
this.getData();
},
/**
* 全量搜索
* @param {Object} event
*/
handleInput: debounce(function(event) {
this.resetChange();
var val = event.target.value;
this.searchParams.logistics_sn = val;
if (val) {
this.input_flag = true;
} else {
this.input_flag = false;
}
this.getData();
}, 500),
/**
* 获取列表数据
*/
getData() {
this.request(API.separateStockInRegisterList, 'GET', { page: this.page, limit: this.limit, ...this.searchParams }, true).then(res => {
if (res.code === 0) {
if (res.data.list.length > 0) {
this.hasMoreData = true;
this.list = this.list.concat(res.data.list);
this.filter_list = createArray(this.list.length, false);
} else {
this.hasMoreData = false;
}
} else {
uni.showToast({
title: res.msg,
icon: 'error'
});
}
});
},
/**
* 作废分货登记
*/
delSeparateStockInRegister() {
if (this.filter_id.length == 0) {
uni.showToast({
title: '请勾选货物',
icon: 'error'
});
return false;
}
this.request(API.delSeparateStockInRegister, 'POST', { skinserr_id: this.filter_id.join(',') }, true).then(res => {
if (res.code === 0) {
uni.showToast({
title: '作废成功',
icon: 'success'
});
setTimeout(() => {
this.resetChange();
this.getData();
}, 2000)
} else {
uni.showToast({
title: res.msg,
icon: 'none'
});
}
});
},
/**
* 预览图片
* @param {Object} img
* @param {Object} index
*/
previewChange(arr, index) {
this.noexebshowFalg = false;
uni.previewImage({
current: index,
urls: arr
});
},
/**
* 重置
*/
resetChange() {
this.list = [];
this.page = 1;
this.filter_id = [];
},
/**
* 再次获取焦点
*/
clearInputAndFocus() {
this.input_flag = false; //关闭叉叉
this.is_focus = false;
setTimeout(() => {
this.is_focus = true;
}, 200);
}
}
};
</script>
<style scoped lang="scss">
@import '@/assets/css/arrivalRegister/splitGoodsRecord.scss';
</style>
\ No newline at end of file
util/api.js
...@@ -369,6 +369,15 @@ const API = { ...@@ -369,6 +369,15 @@ const API = {
* */ * */
getStockPreCheckList: API_BASE + '/api/stockIn/stockPreCheck/getStockPreCheckList', getStockPreCheckList: API_BASE + '/api/stockIn/stockPreCheck/getStockPreCheckList',
/** /**
* 获取分货登记列表
* */
separateStockInRegisterList: API_BASE + '/api/stockIn/stockInRegister/separateStockInRegisterList',
/**
* 作废分货登记
* */
delSeparateStockInRegister: API_BASE + '/api/stockIn/stockInRegister/delSeparateStockInRegister',
/**
/**
* 预检单-取消理货 * 预检单-取消理货
* */ * */
stockPreCheckCancelTally: API_BASE + '/api/stockIn/stockPreCheck/stockPreCheckCancelTally', stockPreCheckCancelTally: API_BASE + '/api/stockIn/stockPreCheck/stockPreCheckCancelTally',
......
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