alhj/pages/alldeatil/billdetail.vue

<template>
	<view>
		<view class="boxcon">
			<text class="titlename">汇票{{index+1}}</text>
			<view class="container">
				<view class="titleall">
					<text class="pl">汇票名称</text>
					<text class="pr">{{msg.name}}</text>
				</view>
				<view class="titleall">
					<text class="pl">汇票号码</text>
					<text class="pr">{{msg.draftNo}}</text>
				</view>
				<view class="titleall">
					<text class="pl">承兑人</text>
					<text class="pr">{{msg.acceptorName}}</text>
				</view>
				<view class="titleall">
					<text class="pl">出票人</text>
					<text class="pr">{{msg.drawersName}}</text>
				</view>
				<view class="titleall">
					<text class="pl">金额</text>
					<text class="pr">{{msg.money}}</text>
				</view>
				<view class="titleall">
					<text class="pl">承兑日期</text>
					<text class="pr">{{msg.acceptDate}}</text>
				</view>
				<view class="titleall">
					<text class="pl">出票日期</text>
					<text class="pr">{{msg.issueDate}}</text>
				</view>
				<view class="titleall">
					<text class="pl">汇票到期日</text>
					<text class="pr">{{msg.expireDate}}</text>
				</view>
				<view class="titleall">
					<text class="pl">预计贴现日</text>
					<text class="pr">{{msg.expectDiscountDate}}</text>
				</view>
				<view class="titleall bod">
					<text class="pl">最高贷款额度</text>
					<text class="pr">{{msg.loanLimit}}</text>
				</view>
				<view class="titleall " style="padding-top: 30rpx !important; ">
					<text class="pl">服务费率</text>
					<text class="pr">{{msg.serviceRate?msg.serviceRate:''}}%</text>
				</view>
				<view class="titleall" >
					<text class="pl">服务费</text>
					<text class="pr">{{msg.serviceMoney}}</text>
				</view>
				<view class="titleall ">
					<text class="pl">利率</text>
					<text class="pr">{{msg.interestRate?msg.interestRate:''}}%</text>
				</view>
				<view class="titleall ">
					<text class="pl">利息</text>
					<text class="pr">{{msg.interest?msg.interest:''}}</text>
				</view>
				<view class="titleall bod">
					<text class="pl">发票附件</text>
					<view class="uppic">
						<view class="picbox"  v-for="item in msg.picList">
							<image :src="item" mode="aspectFill" @click="prviewPic(item)"></image>
						</view>
					</view>
				</view>
				<view class="titleall ptin">
					<text class="pl">汇票状态</text>
					<text class="pr cls">{{msg.statusText}}</text>
				</view>
				<view class="titleall "    style="display: flex;flex-direction: column;">
					<text class="pl">审核反馈</text>
					<textarea :placeholder="placehodertitle" style="background-color: #F6F6F6;width: 675rpx;height: 200rpx;border-radius: 20rpx;padding: 20rpx;box-sizing: border-box;margin:20rpx 0;margin-bottom: 30rpx;" v-model="feedback" :disabled="disabled"></textarea>
				</view>
				<!-- <view class="titleall " v-else>
					<text class="pl">审核反馈</text>
					<view >
						<textarea placeholder="请输入审核反馈"
							style="background-color: #F6F6F6;width: 540rpx;height: 200rpx;border-radius: 20rpx;padding: 20rpx;box-sizing: border-box;margin:20rpx 0;margin-bottom: 30rpx;margin-top: 0;"
							v-model="feedback" disabled></textarea>
					</view>
				</view> -->
				
				<view class="titleall " style="justify-content: flex-start;">
					<text class="pl psa ">反馈截图</text>
					<view class="fanuppic">
						<view class="picbox"  v-if="state==0">
							<u-upload :fileList="fileList4" @afterRead="afterRead" @delete="deletePic" name="4" multiple
								:maxCount="6" :disabled="disabled" :deletable="delablepic"></u-upload>
						</view>
						<view class="picbox"  v-if="state==1">
							<u-upload :fileList="fileList4" @afterRead="afterRead" @delete="deletePic" name="4" multiple
								:maxCount="fileList4.length" :disabled="disabled" :deletable="delablepic"></u-upload>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view style="width: 100%;height: 140rpx;"></view>
		<view class="newbill flex1"  v-if="state==0&&!statusText=='待审核'">
		<view class="choosebtn">
			<view class="delbtn flex1" @click="examineFail()">审核失败</view>
			<view class="succbtn flex1" @click="examineSuccess()">审核成功</view>
		</view>
		
		</view>
		<!-- <view class="newbill flex1" @click="tryAgain" v-if="msg.statusText=='未通过'&&state==1">
			<view class="newbillbtn">
				<text>重新提交</text>
			</view>
		</view> -->
		<view class="newbill flex1" v-if="msg.statusText=='未通过'&&state==1">
			<view class="choosebtn">
				<view class="delbtn flex1" @click="tryAgain()">重新提交</view>
				<view class="succbtn flex1" @click="addBill()">新增汇票</view>
			</view>
		
		</view>
	</view>
</template>

<script>
	let that
	import {
		mainUrl
	} from '@/http/baseUrl.js';
	export default {
		data() {
			return {
				id:'',
				msg:'',
				index:'',
				state:0,
				fileList4:[],
				feedback:'',
				disabled:false,
				delablepic:true,
				placehodertitle:'请输入审核反馈',
				contractId:'',
				statusText:''
			}
		},
		onLoad(o) {
			that=this
			this.state = this.$store.state.admin
			if(this.state==1){
				this.disabled=true
				this.delablepic=false
			}
			
			if(o.obj){
				let obj=JSON.parse(o.obj)
				this.id=obj.id
				console.log(obj,6464654)
				this.index=obj.index
				this.contractId=obj.contractId
				this.statusText=obj.statusText
			}
			this.init()
		},
		methods: {
			init(){
				let id=this.id
				uni.showLoading()
				uni.$u.http.get(`/api/Contract/contractDraft/${id}`,
					{
						custom: {
							auth: true
						}
					}).then((res) => {
					uni.hideLoading()
					this.msg=res
					if(res.feedbackPicList){
						const newData4 = res.feedbackPicList.map((item) => {
							return {
								url: item,
							}
						})
						
						this.fileList4 = newData4
					}
					if(this.state==1){
						if(res.feedback.length>0){
							this.feedback=res.feedback
						}else{
							this.feedback="无"
						}
					}else{
						if(res.feedback.length>0){
							this.feedback=res.feedback
						}else{
							this.placehodertitle="请输入审核反馈"
						}
					}
					
					
					
				}).catch((err) => {
					uni.hideLoading()
					this.$toast(err.msg)
				})
			},
			prviewPic(item) {
				let pics=[]
				pics.push(item)
				uni.previewImage({
					urls: pics,
				});
			},
			tryAgain(){
				let obj={
					contractId:this.contractId,
					id:this.id,
					contractDrafts:[this.msg]
					
				}

				uni.navigateTo({
					url:"/pages/alldeatil/addbill?obj="+JSON.stringify(obj)
				})
			},
			addBill() {
				uni.navigateTo({
					url: "/pages/alldeatil/addbill"
				})
			},
			examineSuccess() {
				// let ids = []
				// ids.push(this.id)
			
				
				uni.showModal({
					title: '提示',
					content: "是否审核成功？",
					success: function(res) {
						if (res.confirm) {
							
							let form={
								id:Number(that.id),
								approveStatus: 1
							}
							if(that.fileList4.length>0){
								let feedbackPicList=[]
								that.fileList4.forEach(item=>{
									feedbackPicList.push(item.url)
								})
								form.feedbackPicList=feedbackPicList
							}
							let feedback=that.feedback
							if(feedback.length>0){
								form.feedback=feedback
							}
							// ={
							// 	feedback:feedback,
							// 	feedbackPicList:feedbackPicList
							// }
							uni.showLoading()
							uni.$u.http.post('api/Contract/approveContractDraft',form, {
								custom: {
									auth: true
								}
							}).then((res) => {
								uni.hideLoading()
								that.editall = false
								that.quan = false
								that.$toast("操作成功")
								setTimeout(() => {
									that.init()
								}, 500)
			
							}).catch((err) => {
								uni.hideLoading()
								that.$toast(err.msg)
							})
			
						} else if (res.cancel) {
			
						}
					}
				})
			
			},
			examineFail() {
				uni.showModal({
					title: '提示',
					content: "是否审核失败？",
					success: function(res) {
						if (res.confirm) {
							
							let form={
								id:Number(that.id),
								approveStatus: 2
							}
							if(that.fileList4.length>0){
								let feedbackPicList=[]
								that.fileList4.forEach(item=>{
									feedbackPicList.push(item.url)
								})
								form.feedbackPicList=feedbackPicList
							}
							let feedback=that.feedback
							if(feedback.length>0){
								form.feedback=feedback
							}
							
							uni.showLoading()
							uni.$u.http.post('api/Contract/approveContractDraft',form, {
								custom: {
									auth: true
								}
							}).then((res) => {
								uni.hideLoading()
								that.editall = false
								that.quan = false
								that.$toast("操作成功")
								setTimeout(() => {
									that.init()
								}, 500)
				
							}).catch((err) => {
								uni.hideLoading()
								that.$toast(err.msg)
							})
				
						} else if (res.cancel) {
				
						}
					}
				})
				
			
			},
			// 删除图片
			deletePic(event) {
				this[`fileList${event.name}`].splice(event.index, 1)
			},
			// 新增图片
			async afterRead(event) {
				// 当设置 mutiple 为 true 时, file 为数组格式，否则为对象格式
				let lists = [].concat(event.file)
				let fileListLen = this[`fileList${event.name}`].length
				lists.map((item) => {
					this[`fileList${event.name}`].push({
						...item,
						status: 'uploading',
						message: '上传中'
					})
				})
				for (let i = 0; i < lists.length; i++) {
					const result = await this.uploadFilePromise(lists[i].url)
					let item = this[`fileList${event.name}`][fileListLen]
					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
						status: 'success',
						message: '',
						url: result
					}))
					fileListLen++
				}
			},
			uploadFilePromise(url) {
				return new Promise((resolve, reject) => {
					let a = uni.uploadFile({
						url:mainUrl + '/api/File', // 仅为示例，非真实的接口地址
						filePath: url,
						name: 'File',
						header: {
							"User-Agent": "apifox/1.0.0 (https://www.apifox.cn)"
						},
						formData: {
							File: JSON.stringify(url),
						},
						success: (res) => {
							let request = JSON.parse(res.data)
							setTimeout(() => {
								resolve(request.data.file)
							}, 1000)
						}
					});
				})
			},
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #F6F6F6 !important;
	}

	.boxcon {
		margin: 20rpx 20rpx;
		padding: 50rpx 20rpx;
		border-radius: 20rpx;
		background: #fff;
	
		.titlename {
			font-size: 36rpx;
			font-weight: 600;
			padding-bottom: 30rpx;
			display: block;
			margin-bottom: 30rpx;
			border-bottom: 1rpx solid #E8E8E8;
		}

		.container {
			.bod {
				border-bottom: 1rpx solid #E8E8E8;
				box-sizing: border-box;
			}

			.ptin {
				padding-top: 50rpx;
			}

			.plas {
				padding-left: 65rpx;
				word-wrap: wrap;
				box-sizing: border-box;
			}

			.ds {
				padding-top: 30rpx;
			}
			.psa{
				padding-right: 30rpx;
			}
			.cls{
				color: #68625B;
			}
			.titleall {
				display: flex;
				justify-content: space-between;
				font-size: 28rpx;
				padding-bottom: 30rpx;

				.pl {
					// width: 180rpx;
					color: #BEBDBB;
					flex-shrink: 0;
					// margin-right: 30rpx;
				}

				.pr {
					word-wrap: wrap;
					display: block;
					display: -webkit-box;
				}
				
				.uppic {
					display: flex;
					flex-wrap: wrap;
					justify-content: flex-end;

					
				}
				.picbox {
					width: 150rpx;
					height: 150rpx;
					margin-left: 20rpx;
					border-radius: 20rpx;
					overflow: hidden;
					image {
						width: 100%;
						height: 100%;
					}
				}
				.fanuppic{
					display: flex;
					flex-wrap: wrap;
				}
			}

		}
	}
</style>