FE_DQmini-code/guaranteePages/pages/paymentSee/paymentSee.vue

<template>
	<view class="letter-content">
		<view class="letter-header">
			<text>担保承诺函</text>
		</view>
		
		<view class="mat15 bank">
			<text>{{letterValue.bank}}</text>
		</view>
		
		<view class="letter-main mat15">
			<text v-show="operationType !== 2">
				根据<text class="letter-key">{{letterValue.name}}</text>的贷款申请，经我公司项目贷审会研究，同意为其在贵行申请的贷款提供担保，特向贵行提供承诺。本承诺系我公司同意与贵行签订保证合同的意向，一切权利义务以保证合同为准！
			</text>
			
			<!-- 查看担保函的文字 -->
			<text v-show="operationType === 2">
				根据<text class="letter-key">{{letterValue.name}}</text>的贷款申请，经我公司<text class="letter-key">{{letterValue.passingTime}}</text>项目贷审会研究，同意为其在贵行申请的贷款提供<text class="letter-key">{{letterValue.loanMoney}}</text>万元担保，期限<text class="letter-key">{{letterValue.loanTern}}</text>，特向贵行提供承诺。本承诺系我公司同意与贵行签订保证合同的意向，一切权利义务以保证合同为准！
			</text>
			
			<view v-show="operationType !== 2">
				<view class="mat15">
					<text>客户名称：{{letterValue.name}}</text>
				</view>
				<view class="mat15">
					<text>贷审会日期：{{letterValue.passingTime}}</text>
				</view>
				<view class="mat15">
					<text>担保金额(万元)：{{letterValue.loanMoney}} (大写：{{letterValue.guaranteeMoney}})</text>
				</view>
				<view class="mat15">
					<text>担保期限：{{letterValue.loanTern}}</text>
				</view>
			</view>
			
			<view class="mat40 letter-footer">
				<view class="mat15">
					<text>大庆市工商业融资担保有限公司</text>
				</view>
				<view class="mat15">
					<text>法定代表人：</text>
				</view>
				<view class="mat15">
					<text>或授权代理人：</text>
				</view>
				<view class="mat15">
					<text>&emsp;&emsp;年&emsp;&emsp;&emsp;月&emsp;&emsp;&emsp;日</text>
				</view>
			</view>
		</view>
		
		<view class="bottom-border">
			<view class="left-border"><text class="mgl10">附件</text></view>
		</view>
		<upload :files="filesArray" :handle="false"></upload>
		<!-- operationType !== 2 -->
		<view class="bottom-border" v-show="operationType !== 2">
			<view class="left-border"><text class="mgl10">上传银行回单</text></view>
		</view>
		<!-- 仅财务部可以上传 -->
		<upload @upload="uploadFile" :files="imgArray" :handle="operationType != 2&&letterValue.isFgJl !== 1"></upload>
		
		<uni-forms v-show="operationType != 2" :value="letterValue" ref="letterValue" validate-trigger="bind" err-show-type="toast">
			<uni-forms-item name="name" :label="operationType === 1 ? '审核' : '财务确认'">
				<uni-easyinput type="textarea" v-model="letterValue.auditOpinion" placeholder="请输入审核意见"></uni-easyinput>
			</uni-forms-item>
		</uni-forms>
		<view class="foot-btn btn-rig pad-bt margin-top">
			<button  v-show="operationType == 3" class="mini-btn round def-btn mar-lr" type="primary" size="mini" @tap="sumbitOpinion('提交',2)">提交</button>
			<button  v-show="operationType == 3" class="mini-btn round refuse-btn mar-lr" type="primary" size="mini" @tap="sumbitOpinion('驳回',4)">驳回</button> 
			<button plain class="mini-btn round plain-btn" type="primary" size="mini" @tap="back()">返回</button>			
		</view>
		
		<timeline></timeline>
	</view>
</template>

<script>
	import upload from '../../../components/pretty-uploadFile/pretty-uploadFile.vue'
	export default {
		components: {
			upload
		},
		data() {
			return {
				// fileList: [],
				// imgListT: [],
				operationType: '',
				letterValue: {},
				
				imgArray:[],// 展示用图片
				filesArray:[],// 展示用附件
				
				roleArr:[],
				
				getImg:[],// 获取上传图片
				isFgJl:''
				
			};
		},
		destroyed() {// 销毁组件操作
			uni.removeStorageSync('copyData')
		},
		onLoad(option) {
			// 判断来自待处理否
			if(uni.getStorageSync('decideIndex')){ // 仅有一个确认
				let data = JSON.parse(uni.getStorageSync('decideIndex'))
				this.paymentDetail(data)
				this.operationType = 3
				uni.removeStorageSync('decideIndex')
			}else if(uni.getStorageSync('copyData')){
				let data =JSON.parse(uni.getStorageSync('copyData')) 
				this.operationType = 2
				if(uni.getStorageSync('notCopy','查看')){
					this.paymentDetail(data)
				}else{
					this.letterValue = {
						name:data.clientName,
						passingTime:data.passingTime,
						loanMoney:data.loanMoney,
						loanTern:data.loanTern
					}
					if(data.file) this.filesArray = this.handleFiles(data.file.split(','))
					if(data.imgFile) this.imgArray = this.handleFiles(data.imgFile.split(','))
				}
			}else{
				this.roleArr = uni.getStorageSync('roleArr').split(",")
				// 附件信息
				if(option.fileList)this.filesArray = this.handleFiles(option.fileList.split(','))
				// 图片信息
				if(option.imgListT) this.imgArray = this.handleFiles(option.imgListT.split(','))
				if(option.imgListT) this.getImg = option.imgListT.split(',')
				// operationType 2查看，3确定
				this.operationType = option.operationType
				this.letterValue = JSON.parse(option.letterValue)
			}
		},
		methods: {
			// 详情接口--个人效率专用
			paymentDetail(data){
				this.$http.get('/api-guarantee/dg-payment-confirmation-consider/paymentConfirmationDetail',{id:data.detailId}).then(res=>{
					let that = this,data = res.data.data
					this.letterValue = {
						businessId: data.businessId,//业务id
						bank: data.bank,//银行
						name: data.clientName,//客户名称
						passingTime: data.passingTime,//贷审会日期
						loanMoney: data.loanMoney,//担保金额
						guaranteeMoney: that.core.fMoney3(data.loanMoney),//担保金额转格式
						file: '',//会议纪要
						loanTern: data.loanTern,//担保期限
						auditOpinion: '',//审核意见
						roleId: ''//角色id
					}
					if(data.file) this.filesArray = this.handleFiles(data.file.split(','))
					if(data.imgFile) this.imgArray = this.handleFiles(data.imgFile.split(','))
				})
			},
			//放大图片
			ViewImage(e) {
				uni.previewImage({
					urls: this.imgList,
					current: e.currentTarget.dataset.url
				});
			},
			
			// 提交审核意见
			sumbitOpinion(text,type){
				let _this = this
				uni.showModal({
				    title: '提示',
				    content: `确定要${text}该审核意见吗？`,
				    success: function (res) {
				        if (res.confirm) {
							if(type == 4 && _this.letterValue.auditOpinion == ''){
								return uni.showToast({title: '请先填写审核意见！',icon:'none'})
							}		
							// let imgFile = _this.imgArray.map(e =>e.url).join()
							_this.$http.post('/api-guarantee/dg-payment-confirmation-consider/updatePaymentConfirmation',{
								auditOpinion: _this.letterValue.auditOpinion,
								businessId: _this.letterValue.businessId,
								status: type,
								imgFile: _this.getImg.join()
							}).then(res => {
								uni.showToast({title: `${text}成功`,icon:'none'})
								_this.back()
							}).catch(()=>{

							})				       
				        } else if (res.cancel) {}
				    }
				});
			},
			// 传入 data 要处理的数据，格式['url1','url2']
			// 传入对应的index
			handleFiles(data,num){
				if(!data||!data.length) return []
				let arr = []
				data.map(e=>{
					if(e=='') return
					let obj = {},
					num= e.lastIndexOf("."),
					ext = e.substr(num+1);
					// 判断格式--图片或者其他
					if(e.toLowerCase().includes('jpg','jpeg','png','bmp','gif')){
						obj.book = 'img'
					}else{
						obj.book = "file"
						if(ext=='png'){
							obj.book = 'img'
						}
					}
					// 确定文件格式
					obj.ext = ext
					obj.url = e
					arr.push(obj)
					// // 接收的数组,1附件2图片
					// num==1?this.filesArray.push(obj):this.imgArray.push(obj)
				})
				return arr
			},
			/* 上传文件 */
			uploadFile(e) {
				let fileList = e.map(r => r.url)
				this.getImg = fileList
			},
		}
	}
</script>

<style lang="scss" scoped>
.letter-content{
	padding: 40rpx 40rpx;
	.letter-header{
		text-align: center;
		font-size: 32rpx;
		font-weight: 500;
		padding-bottom: 40rpx;
		border-bottom: 2rpx solid #e5e5e5;
	}
	.bank{
		font-weight: 700;
	}
	.letter-main{
		letter-spacing: 4rpx;
		text-indent: 60rpx;
	}
	.letter-key{
		font-weight: bold;
		margin: 0 10px;
	}
	.letter-footer{
		text-align: right;
		margin-right: 20rpx;
	}
}
</style>