guomao/guomaoUniapp/components/pages/beijing/contract/foreignContractDetail.vue

<template>
	<view style="margin: 25rpx 25rpx 75rpx 25rpx;">
		<uni-collapse>
			<u-form label-position = "left" label-width = "auto">
				<uni-collapse-item title="客户信息" :open="true" :showAnimation="true">
					<view style = "background-color: #ffffff;padding: 0px 12px;">
						<u-form-item label="客户名称:"><u-input v-model="form.sellName" /></u-form-item>
						<u-form-item label="贸易国:"><u-input v-model="form.TradingCountryDesc" /></u-form-item>
						<u-form-item label="签约日期:"><u-input v-model="form.chooseTime" /></u-form-item>
						<u-form-item label="原产国:"><u-input v-model="form.countryOriginDesc" /></u-form-item>
						<u-form-item label="剩余信用额度:"><u-input v-model="form.currentRemainingCreditLine" /></u-form-item>
					</view>
				</uni-collapse-item>
				<uni-collapse-item title="合同信息" :open="true" :showAnimation="true">
					<view style = "background-color: #ffffff;padding: 0px 12px;">
						<u-form-item label="合同号:"><u-input v-model="form.contractNo" /></u-form-item>
						<u-form-item label="贸易方式:"><u-input v-model="form.modeTradeDesc" /></u-form-item>
						<u-form-item label="合同周期:"><u-input v-model="form.contractPeriod" /></u-form-item>
						<u-form-item label="价格条款:"><u-input v-model="form.priceTermsDesc" /></u-form-item>
						<u-form-item label="备注:"><u-input v-model="form.remark" /></u-form-item>
					</view>
				</uni-collapse-item>
				<uni-collapse-item title="装运信息" :open="true" :showAnimation="true">
					<view style = "background-color: #ffffff;padding: 0px 12px;">
						<u-form-item label="运输方式:"><u-input v-model="form.typeShippingDesc" /></u-form-item>
						<u-form-item label="起运港:"><u-input v-model="form.portDeparture" /></u-form-item>
						<u-form-item label="卸货港:"><u-input v-model="form.portDischarge" /></u-form-item>
						<u-form-item label="溢短装:"><u-input v-model="form.overAndShort" /></u-form-item>
						<u-form-item label="最迟装运日期:"><u-input v-model="form.latestShipmentDate" /></u-form-item>
					</view>
				</uni-collapse-item>
				<uni-collapse-item title="付款信息" :open="true" :showAnimation="true">
					<view style = "background-color: #ffffff;padding: 0px 12px;">
						<u-form-item label="付款方式:"><u-input v-model="form.payWay" /></u-form-item>
						<u-form-item label="币种:"><u-input v-model="form.currencyDesc" /></u-form-item>
						<u-form-item label="汇率:"><u-input v-model="form.rate" /></u-form-item>
						<u-form-item label="是否预付:"><u-input v-model="form.isPrepaidDesc" /></u-form-item>
						<u-form-item label="合同重量:"><u-input v-model="form.contractWeight" /></u-form-item>
						<u-form-item label="合同原币金额:"><u-input v-model="form.originalCurrency" /></u-form-item>
						<u-form-item label="合同本币金额:"><u-input v-model="form.localCurrency" /></u-form-item>
					</view>
				</uni-collapse-item>
				<uni-collapse-item title="费用预算" :open="true" :showAnimation="true">
					<view style = "background-color: #ffffff;padding: 0px 12px;">
						<u-form-item label="总成本:"><u-input v-model="form.totalCost" /></u-form-item>
						<u-form-item label="预计保费:"><u-input v-model="form.premium" /></u-form-item>
						<u-form-item label="预计海运费:"><u-input v-model="form.seaFreight" /></u-form-item>
						<u-form-item label="预计港杂费:"><u-input v-model="form.hiddenFees" /></u-form-item>
						<u-form-item label="其他:"><u-input v-model="form.otherFees" /></u-form-item>
					</view>
				</uni-collapse-item>
				<uni-collapse-item title="附件信息" :open="true" :showAnimation="true">
					<view style = "background-color: #ffffff;padding: 0px 12px;">
						<u-form-item label="附件路径:">
							<view v-if="!!fileUrl" style="color: #ff0f07;" @click="downLoadFile()">点击查看附件</view>
							<view v-else >无</view>
						</u-form-item>
					</view>
				</uni-collapse-item>
			</u-form>
			<uni-collapse-item title="商品信息" :open="true" :showAnimation="true">
					<view style = "background-color: #ffffff;">
						<wyb-table :headers="headers" :contents="tableList" :width="tableWidth" :font-size="[20]" :default-col-width="120"></wyb-table>
					</view>
			</uni-collapse-item>
		</uni-collapse>
	</view>
</template>

<script>
	import wybTable from '@/components/wyb-table/wyb-table.vue'
	export default {
		components:{wybTable},
		props:['businessKey', 'parentForm'],
		data() {
			return {
				form : {},
				tableList : [],
				headers: [{
							label: '商品名称',
							key: 'productName'
						}, {
							label: '商品分类',
							key: 'aciName'
						}, {
							label: '规格',
							key: 'specName'
						}, {
							label: '重量',
							key: 'weight'
						}, {
							label: '原币单价',
							key: 'originalPrice'
						}, {
							label: '原币金额',
							key: 'originalAmount'
						}, {
							label: '本币单价',
							key: 'localPrice'
						}, {
							label: '本币金额',
							key: 'localAmount'
						}, {
							label: '单价成本',
							key: 'priceCost'
						}, {
							label: '预计关税',
							key: 'expectedTariff'
						}, {
							label: '增值税',
							key: 'vat'
						}, {
							label: '备注',
							key: 'remark'
						}, {
							label: '价格变动记录',
							key: 'historyPrice'
						}],
				tableWidth : uni.getSystemInfoSync().screenWidth - 20 + 'px',
				fileUrl : '',
			}
		},
		beforeMount() {
			let self = this;
			// 克隆父组件数据
			this.form = JSON.parse(JSON.stringify(this.parentForm));
			// 付款方式
			if (!!uni.getStorageSync('PAYMENT_METHOD_OUT')) {
				self.payWayInit(uni.getStorageSync('PAYMENT_METHOD_OUT'))
			} else {
				self.admRequest({
					action : 'AppParamAction/getAppparList',
					data : {
						code : 'PAYMENT_METHOD_OUT'
					},
					success(r){
						var payWayList = r.data.data;
						if (!!payWayList) {
							uni.setStorageSync('PAYMENT_METHOD_OUT', payWayList);
						}
						self.payWayInit(payWayList)
					}
				})
			}
			
			// 起运港
			if (!!uni.getStorageSync('PORT_DEPARTURE')) {
				self.portDepartureInit(uni.getStorageSync('PORT_DEPARTURE'));
			} else {
				self.admRequest({
					action : 'AppParamAction/getAppparList',
					data : {
						code : 'PORT_DEPARTURE'
					},
					success(r){
						var portDepartureList = r.data.data;
						if (!!portDepartureList) {
							uni.setStorageSync('PORT_DEPARTURE', portDepartureList);
						}
						self.portDepartureInit(portDepartureList);
					}
				})
			}
			
			
			// 卸货港
			if (!!uni.getStorageSync('PORT_DISCHARGE')) {
				self.portDischargeInit(uni.getStorageSync('PORT_DISCHARGE'));
			} else {
				self.admRequest({
					action : 'AppParamAction/getAppparList',
					data : {
						code : 'PORT_DISCHARGE'
					},
					success(r){
						var portDischargeList = r.data.data;
						if (!!portDischargeList) {
							uni.setStorageSync('PORT_DISCHARGE', portDischargeList);
						}
						self.portDischargeInit(portDischargeList);
					}
				})
			}
			
			// 信用额度
			self.admRequest({
				action : 'DomesticContractManageAction/selectCustomerCreditline',
				data : {
					customerId : self.form.sellId
				},
				success(r){
					self.form.currentRemainingCreditLine = r.data.remainingCreditLine;
					self.$forceUpdate();
				}
			})
			
			// 商品信息
			this.admRequest({
				action : 'CommonAction/queryContractDetail',
				data : {
					contractId : this.businessKey,
					payAmt : false
				},
				success(r){
					self.tableList = r.data.data;
				}
			})
			
			// 附件信息
			this.admRequest({
				action : 'ContractManageAction/selectContractResource',
				data : {
					contractId : this.businessKey
				},
				success(r){
					self.fileUrl = r.data.url;
				}
			})
		},
		methods:{
			payWayInit(payWayList){
				for (let p of payWayList) {
					if (p.value == this.form.payWay) {
						this.form.payWay = p.showmsg;
					}
				}
			},
			portDepartureInit(portDepartureList) {
				let portDepartureCheckList = this.form.portDeparture.split(",");
				for (let i = 0; i < portDepartureCheckList.length; i ++) {
					let pc = portDepartureCheckList[i];
					for (let p of portDepartureList) {
						if (p.value == pc) {
							portDepartureCheckList[i] = p.showmsg;
							break;
						}
					}
				}
				this.form.portDeparture = portDepartureCheckList.toString();
			},
			portDischargeInit(portDischargeList){
				let portDischargeCheckList = this.form.portDischarge.split(",");
				for (let i = 0; i < portDischargeCheckList.length; i ++) {
					let pc = portDischargeCheckList[i];
					for (let p of portDischargeList) {
						if (p.value == pc) {
							portDischargeCheckList[i] = p.showmsg;
							break;
						}
					}
				}
				this.form.portDischarge = portDischargeCheckList.toString();
			},
			downLoadFile(){
				let self = this;
				uni.showLoading({
					title:"加载中..."
				})
				uni.downloadFile({
					url : self.fileUrl,
					success: (res) => {
						let filePath = res.tempFilePath;
						if (res.statusCode === 200) {
							uni.openDocument({
								filePath: filePath,
								success: function (r) {
									console.log('打开文档成功');
								}
							});
						}
					},
					complete: (res)=> {
						uni.hideLoading();
					}
				})
			}
		}
	}
</script>

<style>
</style>