|
|
|
@ -8,7 +8,7 @@ |
|
|
|
</view> |
|
|
|
<view class="lf-row-between lf-m-t-30"> |
|
|
|
<view>订购数</view> |
|
|
|
<view class="lf-color-black" v-if="item.material && item.purchase_number">{{ item.purchase_number }} <text class="lf-m-l-50">{{item.material.unit.unit_name}}</text></view> |
|
|
|
<view class="lf-color-black" v-if="item.material && item.purchase_number">{{ item.purchase_number }} <text class="lf-m-l-10">{{item.material.unit.unit_name}}</text></view> |
|
|
|
</view> |
|
|
|
<view class="lf-row-between lf-m-t-30"> |
|
|
|
<view>实到数</view> |
|
|
|
@ -25,13 +25,19 @@ |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view style="height: 120rpx;"></view> |
|
|
|
<view class="fixed-bottom"> |
|
|
|
<!-- 修饰底部 --> |
|
|
|
<view :style="upload_list.length ? 'height: 260rpx' : 'height: 140rpx'"></view> |
|
|
|
<!-- 凭证图 --> |
|
|
|
<view class="fixed-images" v-if="upload_list.length"> |
|
|
|
<image class="ms-img" :src="item" @click="lookImage(index)" v-for="(item, index) in upload_list" :key="index" v-if="index < 6"></image> |
|
|
|
</view> |
|
|
|
<view class="fixed-bottom" v-if="list.length"> |
|
|
|
<button class="btn btn1 lf-m-l-20" @click="is_show_voucher = true">上传凭证</button> |
|
|
|
<button class="btn" @click="comfirm">确认收货</button> |
|
|
|
</view> |
|
|
|
<!-- 弹出层-确认收货修改 TODO每个都应该是动态 --> |
|
|
|
<u-popup v-model="is_show_edit" mode="bottom" border-radius="20"> |
|
|
|
<view class="popup-box"> |
|
|
|
<view class="edit-popup-box"> |
|
|
|
<view class="popup-content"> |
|
|
|
<view> |
|
|
|
<view class="popup-item" hover-class="lf-opacity" :style="currentObj(1)?'border-bottom:none':''" @click="switchItem(1)"> |
|
|
|
@ -64,29 +70,37 @@ |
|
|
|
<u-button class="popup-btn" @click="comfirmEdit">确认修改</u-button> |
|
|
|
</view> |
|
|
|
</u-popup> |
|
|
|
<!-- 弹出层-上传凭证 --> |
|
|
|
<u-popup v-model="is_show_voucher" mode="center" border-radius="20"> |
|
|
|
<view class="voucher-popup-box"> |
|
|
|
<view class="popup-content"> |
|
|
|
<view class="popup-title">上传凭证信息</view> |
|
|
|
<view class="popup-desc">请在此处上传检验检疫凭证、售卖资质等证书</view> |
|
|
|
<view class="popup-images"> |
|
|
|
<view class="popup-image-item" v-for="(item, index) in voucher_list" :key="index" @click="lookImage(index, 'voucher_list')"> |
|
|
|
<image :src="item" mode="aspectFill"></image> |
|
|
|
<view class="remove-image" @click.stop="removeInage(index)"> |
|
|
|
<u-icon name="close-circle"></u-icon> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="popup-image-item popup-image-item-after" @click="uploadImage" v-if="voucher_list.length < 6"></view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="foot-btn"> |
|
|
|
<u-button class="popup-btn" @click="is_show_voucher = false">取消</u-button> |
|
|
|
<u-button class="popup-btn" @click="submitImage">确定</u-button> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</u-popup> |
|
|
|
</view> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import { uploadFile } from '@/common/uploadFile.js' |
|
|
|
export default { |
|
|
|
data(){ |
|
|
|
return { |
|
|
|
list: [{ |
|
|
|
title: '大白菜 / 长叶子 / 斤', |
|
|
|
orderNum: '300斤', |
|
|
|
realNum: '', |
|
|
|
receiptsNum: '' |
|
|
|
},{ |
|
|
|
title: '拌凉菜 / 好好次 / 斤', |
|
|
|
orderNum: '100斤', |
|
|
|
realNum: '', |
|
|
|
receiptsNum: '' |
|
|
|
},{ |
|
|
|
title: '你是真的菜 / 菜鸡 / 斤', |
|
|
|
orderNum: '1000吨', |
|
|
|
realNum: '', |
|
|
|
receiptsNum: '' |
|
|
|
}], |
|
|
|
list: [], |
|
|
|
is_show_edit: false, |
|
|
|
current_show: { |
|
|
|
type: 1, |
|
|
|
@ -111,7 +125,12 @@ |
|
|
|
order: {}, |
|
|
|
type: 4, |
|
|
|
reachNum: 0, |
|
|
|
receiveNum: 0 |
|
|
|
receiveNum: 0, |
|
|
|
is_show_voucher: false, |
|
|
|
voucher_count: 6, |
|
|
|
voucher_list: [], |
|
|
|
is_upload: false, // 是否上传了凭证 |
|
|
|
upload_list: [] |
|
|
|
} |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
@ -123,16 +142,95 @@ |
|
|
|
} |
|
|
|
}, |
|
|
|
onLoad(options){ |
|
|
|
// http://localhost:8081/pages/purchase/receipt?p_sn=P16281395178122 |
|
|
|
this.p_sn = options.p_sn || ''; |
|
|
|
this.getData(); |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
// 预览图片 |
|
|
|
lookImage(index){ |
|
|
|
this.$u.throttle(() => { |
|
|
|
uni.previewImage({ |
|
|
|
urls: this.upload_list, |
|
|
|
current: index |
|
|
|
}) |
|
|
|
}, 500); |
|
|
|
}, |
|
|
|
// 移除图片 |
|
|
|
removeInage(current){ |
|
|
|
this.voucher_list.splice(current, 1); |
|
|
|
}, |
|
|
|
// 上传凭证图片 |
|
|
|
uploadImage(){ |
|
|
|
let current_count = this.voucher_count - this.voucher_list.length; |
|
|
|
if(current_count == 0) return; |
|
|
|
uni.chooseImage({ |
|
|
|
count: current_count, |
|
|
|
complete: result => { |
|
|
|
this.voucher_list.push(...result.tempFilePaths); |
|
|
|
console.log(this.voucher_list) |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 用户点击确定，将图片上传至oss，并将url发送给后端 |
|
|
|
submitImage(){ |
|
|
|
let that = this; |
|
|
|
let voucher_list = that.voucher_list; |
|
|
|
if(voucher_list.length <= 0){ |
|
|
|
return that.$msg('您未上传图片哦'); |
|
|
|
}; |
|
|
|
that.is_show_voucher = false; |
|
|
|
uni.showLoading({ |
|
|
|
title: '正在上传中...' |
|
|
|
}) |
|
|
|
let http_list = []; |
|
|
|
voucher_list.map(item => { |
|
|
|
let itemP = new Promise((resolve, reject) => { |
|
|
|
uploadFile(item, (res) => { |
|
|
|
resolve(res); |
|
|
|
}, (err) => { |
|
|
|
reject(err); |
|
|
|
}, this); |
|
|
|
}) |
|
|
|
http_list.push(itemP); |
|
|
|
}) |
|
|
|
|
|
|
|
Promise.all(http_list).then(res => { |
|
|
|
let images = []; |
|
|
|
let show_images = []; |
|
|
|
res.map(item => { |
|
|
|
if(item.path){ |
|
|
|
images.push(item.path); |
|
|
|
} |
|
|
|
if(item.url){ |
|
|
|
show_images.push(item.url); |
|
|
|
} |
|
|
|
}); |
|
|
|
that.$http(that.API.API_SUPPLIER_PURCHASEUPLOADVOUCHER, { |
|
|
|
p_sn: that.p_sn, |
|
|
|
images: images, |
|
|
|
}).then(result => { |
|
|
|
uni.hideLoading(); |
|
|
|
that.voucher_list = []; |
|
|
|
that.is_upload = true; |
|
|
|
that.upload_list.push(...show_images); |
|
|
|
that.$msg('凭证已上传成功!') |
|
|
|
}).catch(err => uni.hideLoading()); |
|
|
|
|
|
|
|
}).catch(err => { |
|
|
|
uni.hideLoading(); |
|
|
|
uni.showModal({ |
|
|
|
title: '', |
|
|
|
content: JSON.stringify(err), |
|
|
|
showCancel: false, |
|
|
|
confirmColor: '#1833F2' |
|
|
|
}) |
|
|
|
}) |
|
|
|
}, |
|
|
|
getData(){ |
|
|
|
this.$http(this.API.API_CANTEEN_PURCHASEDETAIL, { |
|
|
|
p_sn: this.p_sn |
|
|
|
// p_sn: '802316269455228606' |
|
|
|
}).then(res => { |
|
|
|
console.log("xxx",res) |
|
|
|
this.order = res.data.order; |
|
|
|
this.list = res.data.order.items || []; |
|
|
|
this.list.forEach(item => { |
|
|
|
@ -146,17 +244,25 @@ |
|
|
|
this.list[current][key] = event.detail.value; |
|
|
|
}, |
|
|
|
comfirm(){ |
|
|
|
// 使用延迟器，以防input还没有赋值成功 |
|
|
|
|
|
|
|
let is_empty = false; |
|
|
|
let real_count_item = [] |
|
|
|
this.list.forEach(item => { |
|
|
|
if(!item.receiveNum || !item.reachNum){ |
|
|
|
is_empty = true; |
|
|
|
} |
|
|
|
real_count_item.push({ |
|
|
|
id:item.id, |
|
|
|
real_receive_number: item.receiveNum, |
|
|
|
real_reach_number: item.reachNum |
|
|
|
}) |
|
|
|
}) |
|
|
|
|
|
|
|
if(is_empty){ |
|
|
|
return this.$msg('请将收货数量填写完整'); |
|
|
|
} |
|
|
|
if(!this.is_upload){ |
|
|
|
return this.$msg('请上传凭证后再确认收货'); |
|
|
|
} |
|
|
|
return this.$msg('PASS'); |
|
|
|
this.$http(this.API.API_CONFIRM, { |
|
|
|
p_sn: this.p_sn, |
|
|
|
state: '已入库', |
|
|
|
@ -226,6 +332,30 @@ |
|
|
|
color: #222222; |
|
|
|
} |
|
|
|
} |
|
|
|
.fixed-images{ |
|
|
|
position: fixed; |
|
|
|
bottom: 98rpx; |
|
|
|
left: 0rpx; |
|
|
|
z-index: 99; |
|
|
|
width: 750rpx; |
|
|
|
height: 126rpx; |
|
|
|
background-color: #FFFFFF; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: center; |
|
|
|
.ms-img{ |
|
|
|
// 六张一行 |
|
|
|
width: 102rpx; |
|
|
|
height: 102rpx; |
|
|
|
// width: 146rpx; |
|
|
|
// height: 146rpx; |
|
|
|
margin-right: 14rpx; |
|
|
|
background-color: #EEEEEE; |
|
|
|
&:nth-of-type(6n){ |
|
|
|
margin-right: 0rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.fixed-bottom{ |
|
|
|
position: fixed; |
|
|
|
bottom: 0rpx; |
|
|
|
@ -250,6 +380,13 @@ |
|
|
|
border-radius: 40rpx; |
|
|
|
color: #FFFFFF; |
|
|
|
} |
|
|
|
.btn1{ |
|
|
|
border: 2rpx solid #555555; |
|
|
|
background-color: #FFFFFF; |
|
|
|
color: #555555; |
|
|
|
line-height: 80rpx; |
|
|
|
margin-right: 20rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
/deep/.placeholder-class{ |
|
|
|
@ -259,7 +396,8 @@ |
|
|
|
/deep/.u-hairline-border::after{ |
|
|
|
border: none; |
|
|
|
} |
|
|
|
.popup-box{ |
|
|
|
// 修改收货信息弹出层 |
|
|
|
.edit-popup-box{ |
|
|
|
width: 100%; |
|
|
|
min-height: 484rpx; |
|
|
|
max-height: 64vh; |
|
|
|
@ -297,4 +435,90 @@ |
|
|
|
margin-bottom: 30rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
// 上传凭证弹出层 |
|
|
|
.voucher-popup-box{ |
|
|
|
width: 686rpx; |
|
|
|
height: max-content; |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
flex-direction: column; |
|
|
|
.popup-content{ |
|
|
|
.popup-title{ |
|
|
|
font-size: 32rpx; |
|
|
|
font-weight: bold; |
|
|
|
color: #222222; |
|
|
|
text-align: center; |
|
|
|
margin-top: 40rpx; |
|
|
|
} |
|
|
|
.popup-desc{ |
|
|
|
font-size: 28rpx; |
|
|
|
color: #555555; |
|
|
|
text-align: center; |
|
|
|
margin-top: 20rpx; |
|
|
|
margin-bottom: 18rpx; |
|
|
|
} |
|
|
|
.popup-images{ |
|
|
|
display: flex; |
|
|
|
flex-wrap: wrap; |
|
|
|
padding: 22rpx; |
|
|
|
margin-bottom: 18rpx; |
|
|
|
.popup-image-item{ |
|
|
|
width: 198rpx; |
|
|
|
height: 198rpx; |
|
|
|
margin: 8rpx; |
|
|
|
background: #F5F5F5; |
|
|
|
border-radius: 10rpx; |
|
|
|
position: relative; |
|
|
|
image{ |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
} |
|
|
|
.remove-image{ |
|
|
|
position: absolute; |
|
|
|
right: -8rpx; |
|
|
|
top: -16rpx; |
|
|
|
color: #e74c3c; |
|
|
|
font-size: 40rpx; |
|
|
|
padding: 8rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
.popup-image-item-after::after{ |
|
|
|
content: '+'; |
|
|
|
position: absolute; |
|
|
|
left: 30%; |
|
|
|
top: 14%; |
|
|
|
font-size: 100rpx; |
|
|
|
color: #777777; |
|
|
|
} |
|
|
|
} |
|
|
|
.popup-input{ |
|
|
|
padding: 0 60rpx; |
|
|
|
box-sizing: border-box; |
|
|
|
height: 90rpx; |
|
|
|
font-size: 28rpx; |
|
|
|
color: #555555; |
|
|
|
input{ |
|
|
|
text-align: right; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.foot-btn{ |
|
|
|
height: 90rpx; |
|
|
|
width: 100%; |
|
|
|
border-top: 1rpx solid #E5E5E5; |
|
|
|
display: flex; |
|
|
|
box-sizing: border-box; |
|
|
|
.popup-btn{ |
|
|
|
width: 50%; |
|
|
|
height: 100%; |
|
|
|
border: none; |
|
|
|
border-radius: initial; |
|
|
|
&:last-child{ |
|
|
|
border-left: 1rpx solid #E5E5E5; |
|
|
|
color: #1833F2; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |
邓平艺
5 years ago