Skip to content

梁建民 / wmsMin

Go to a project
Commit 2582084a by LJM
Options

供应链纸质单理货---作废后重新理货，支持选择之前的图片

parent d1556ccf
Inline Side-by-side
Showing with 263 additions and 0 deletions
assets/css/tallyGoods/historicalTally.scss 0 → 100644
.page-box {
height: 100vh;
overflow: hidden;
padding: 24rpx 24rpx 24rpx 24rpx;
.text {
.tt {
font-size: 28rpx;
color: #1e2021;
font-weight: bold;
margin-bottom: 14rpx;
.num {
margin-left: 12rpx;
color: #197adb;
}
}
}
.section {
background-color: #fff;
padding: 24rpx;
border: 1rpx solid #e6edf0;
.list {
.box {
margin-bottom: 24rpx;
.title {
font-weight: 600;
font-size: 24rpx;
color: #404547;
}
.img-list {
margin-top: 12rpx;
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20rpx;
justify-items: center;
.img-li {
position: relative;
width: 200rpx;
height: 200rpx;
.check-box-icon {
position: absolute;
top: 0;
left: 0;
z-index: 9;
width: 40rpx;
height: 40rpx;
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;
}
}
image {
width: 200rpx;
height: 200rpx;
}
}
}
}
}
}
.btn {
position: fixed;
bottom: 24rpx;
left: 0;
right: 0;
margin: 0 24rpx;
height: 88rpx;
background: #197adb;
border-radius: 4rpx;
font-size: 28rpx;
color: #ffffff;
}
}
pages/tallyGoods/historicalTally.vue 0 → 100644
<template>
<view class="page-box">
<view class="text column">
<view class="tt">{{erp_order_sn}}</view>
<view class="tt">{{model}}</view>
<view class="row bothSide verCenter">
<view class="tt">理货图片记录：</view>
<view class="tt" v-if="filter_id.length > 0">已选中<text class="num">{{filter_id.length}}</text></view>
</view>
</view>
<view class="section">
<scroll-view scroll-y="true" style="max-height: calc(100vh - 350rpx);">
<view class="list">
<view class="box" v-for="(item,index) in list" :key="index">
<view class="title">理货时间：{{item.time}}</view>
<view class="img-list">
<view class="img-li" v-for="(vo,i) in item.list" :key="i">
<view class="check-box-icon" @click="filterChange(index, i)" :class="{ curr: filter_list[getAbsoluteIndex(index, i)] }"></view>
<image mode="aspectFill" :src="vo.pic_address" @click="previewChange(item.list,i)"></image>
</view>
</view>
</view>
</view>
</scroll-view>
</view>
<view class="btn row rowCenter verCenter" @click="submit()">确认上传</view>
</view>
</template>
<script>
import { API } from '@/util/api.js';
import { createArray } from '@/util/util.js';
export default {
data() {
return {
noexebshowFalg: true, //控制是否会触发生命周期
erp_order_sn: '',
model: '',
index: '',
formParams: {
srcEntryID: '',
entryID: ''
},
list: [],
filter_list: [], //记录筛选已选中的列表
filter_id: [], //记录筛选的id数据
};
},
onLoad(options) {
this.erp_order_sn = options.erp_order_sn;
this.model = options.model;
this.index = options.index;
this.formParams.srcEntryID = decodeURIComponent(options.srcEntryID);
this.formParams.entryID = decodeURIComponent(options.entryID);
},
onShow() {
this.getData();
},
methods: {
getData() {
if (!this.noexebshowFalg) {
this.noexebshowFalg = true; // 重置标志位
return;
}
this.request(API.getHistoryPic, 'POST', this.formParams, true).then(res => {
if (res.err_code === 0) {
this.list = res.data;
// 计算所有图片的总数，并创建对应长度的状态数组
const totalImages = this.list.reduce((sum, item) => sum + item.list.length, 0);
this.filter_list = createArray(totalImages, false);
} else {
uni.showToast({
title: res.msg,
icon: 'none'
});
}
});
},
/**
* 预览图片
* @param {Object} img
* @param {Object} index
*/
previewChange(img, index) {
this.noexebshowFalg = false;
var arr = img.map(item => item.pic_address);
uni.previewImage({
current: index,
urls: arr
});
},
/**
* 计算绝对索引位置
* @param {number} outerIndex - 外层循环索引(时间组)
* @param {number} innerIndex - 内层循环索引(图片)
* @returns {number} - 在filter_list中的实际索引
*/
getAbsoluteIndex(outerIndex, innerIndex) {
let absoluteIndex = 0;
// 计算之前组的所有图片数量
for (let i = 0; i < outerIndex; i++) {
absoluteIndex += this.list[i].list.length;
}
// 加上当前组内的偏移量
return absoluteIndex + innerIndex;
},
/**
*处理图片选中状态和数据
* @param {number} outerIndex - 外层时间组索引
* @param {number} innerIndex - 内层图片索引
*/
filterChange(outerIndex, innerIndex) {
const absoluteIndex = this.getAbsoluteIndex(outerIndex, innerIndex);
const currentItem = this.list[outerIndex].list[innerIndex];
// 更新选中状态
this.$set(this.filter_list, absoluteIndex, !this.filter_list[absoluteIndex]);
if (this.filter_list[absoluteIndex]) {
// 选中：添加到 filter_id
this.filter_id.push({
entryID: currentItem.entryID,
pic_address: currentItem.pic_address
});
} else {
// 取消选中：从 filter_id 中移除
const removeIndex = this.filter_id.findIndex(item =>
item.pic_address === currentItem.pic_address &&
item.entryID === currentItem.entryID
);
if (removeIndex > -1) {
this.filter_id.splice(removeIndex, 1);
}
}
},
/**
* 确认上传
*/
submit() {
if (this.filter_id.length === 0) {
uni.showToast({
title: '请选择要上传的图片',
icon: 'none'
});
return;
}
// 获取所有选中图片的地址
const selectedImages = this.filter_id.map(item => item.pic_address);
// 获取上一页实例
const pages = getCurrentPages();
const prevPage = pages[pages.length - 2];
// 更新上一页的数据
if (prevPage) {
// 将选中的图片添加到对应索引的商检图片列表中
selectedImages.forEach(imageUrl => {
prevPage.$vm.goods_check_pic_list[this.index].push(imageUrl);
});
// 更新 pic_json 中对应索引的 goods_check_pic
prevPage.$vm.form.pic_json[this.index].goods_check_pic =
prevPage.$vm.goods_check_pic_list[this.index].join(',');
// 强制更新视图
prevPage.$vm.$forceUpdate();
}
// 返回上一页
uni.navigateBack({
delta: 1,
success: () => {
}
});
}
}
};
</script>
<style scoped lang="scss">
@import '@/assets/css/tallyGoods/historicalTally.scss';
</style>
\ 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