|
|
|
@ -31,12 +31,18 @@ |
|
|
|
<view>联系电话</view> |
|
|
|
<view class="lf-font-bold">{{order.deliver_phone}}</view> |
|
|
|
</view> |
|
|
|
<view class="list" v-if="order.voucher && order.voucher.length"> |
|
|
|
<view>证明材料</view> |
|
|
|
<view class="list"> |
|
|
|
<view>证明材料-供应端</view> |
|
|
|
<view class="lf-flex-wrap lf-m-t-10"> |
|
|
|
<image :src="item.voucher_pic" @click="lookImage(index)" class="ms-img" v-for="(item, index) in order.voucher" :key="item.id"></image> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="list" v-if="voucher_list.length"> |
|
|
|
<view>证明材料-食堂端</view> |
|
|
|
<view class="lf-flex-wrap lf-m-t-10"> |
|
|
|
<image :src="item" @click="lookPopupImage(index)" class="ms-img" v-for="(item, index) in voucher_list" :key="index"></image> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<self-line></self-line> |
|
|
|
<view class="lf-m-t-30 lf-m-l-32"> |
|
|
|
@ -55,7 +61,7 @@ |
|
|
|
</view> |
|
|
|
<view v-else-if="type == '已发货'" class="lf-row-flex-end"> |
|
|
|
<button class="btn btn1">退单</button> |
|
|
|
<button class="btn btn1 lf-m-l-20">上传凭证</button> |
|
|
|
<button class="btn btn1 lf-m-l-20" @click="is_show_voucher = true">上传凭证</button> |
|
|
|
<button class="btn btn2" @click="$url('/pages/purchase/receipt?p_sn='+ order.p_sn)">确认收货</button> |
|
|
|
</view> |
|
|
|
<view v-else-if="type == '已收货' || type == '已入库'" class="lf-row-between"> |
|
|
|
@ -63,6 +69,28 @@ |
|
|
|
<view class="lf-font-32" style="color: #11D189;">已完成</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<!-- 弹出层-上传凭证 --> |
|
|
|
<u-popup v-model="is_show_voucher" mode="center" border-radius="20"> |
|
|
|
<view class="popup-box"> |
|
|
|
<view class="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="lookPopupImage(index)"> |
|
|
|
<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> |
|
|
|
|
|
|
|
@ -89,17 +117,92 @@ |
|
|
|
contents: [], |
|
|
|
order: {}, |
|
|
|
p_sn: '', |
|
|
|
type: 4 |
|
|
|
type: 4, |
|
|
|
is_show_voucher: false, |
|
|
|
voucher_list: [] |
|
|
|
} |
|
|
|
}, |
|
|
|
onLoad(options){ |
|
|
|
// TODO 1、凭证上传流程变动:当采购单状态为已发货状态时,食堂可以上传凭证图片; |
|
|
|
// TODO 2、食堂收货时,实到数、实收数默认填充采购数量; |
|
|
|
// todo 上传凭证参考页面:/uniapp-supplychain/supplier/pages/gonghuo/detail |
|
|
|
this.p_sn = options.p_sn || ''; |
|
|
|
// TODO 显示车辆等信息,显示table信息 |
|
|
|
this.getData(); |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
// 预览图片 |
|
|
|
lookPopupImage(current){ |
|
|
|
if(this.voucher_list.length <= 0) return; |
|
|
|
this.$u.throttle(() => { |
|
|
|
uni.previewImage({ |
|
|
|
urls: this.voucher_list, |
|
|
|
current: current |
|
|
|
}) |
|
|
|
}, 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); |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 用户点击确定,将图片上传至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 => { |
|
|
|
console.log("上传完毕", res); |
|
|
|
let images = res.map(item => item.url); |
|
|
|
|
|
|
|
// todo 图片上传url给后端 |
|
|
|
// that.$http(that.API.API_SUPPLIER_PURCHASESAVEVOUCHER, { |
|
|
|
// p_sn: that.p_sn, |
|
|
|
// images: images, |
|
|
|
// }).then(result => { |
|
|
|
// uni.hideLoading(); |
|
|
|
// that.voucher_list = []; |
|
|
|
// 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 |
|
|
|
@ -223,4 +326,89 @@ |
|
|
|
margin-right: 0rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.popup-box{ |
|
|
|
width: 686rpx; |
|
|
|
height: max-content; |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
flex-direction: column; |
|
|
|
.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> |