dcs
/
realty


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419
							<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport"
			content="width=device-width,initial-scale=0.4,minimum-scale=0.1,maximum-scale=1,user-scalable=yes">
		<meta name="mobile-web-app-capable" content="yes">
		<meta name="mobile-web-app-status-bar-style" content="black">
		<script type="text/javascript" src="./wx.js"></script>
		<script src="./vue.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="./axios.js" type="text/javascript" charset="utf-8"></script>
		<script src="./axiosRequest.js" type="text/javascript" charset="utf-8"></script>
		<link rel="stylesheet" href="./reset.css" />
		<title id="title">文档</title>
		<style>
			#app{
				border-top: 1px solid #d9d9d9;
			}
			.flow-document {
				position: relative;
				width: 100%;
				height: 100%;
				overflow: auto;
			}

			.html {
				margin: 0 auto;
				padding: 15px;
			}

			.sureSeal {
				position: relative;
				z-index: 999;
				padding: 5px 10px;
				text-align: center;
				background: rgba(97, 133, 214, 0);
				border-radius: 2px;
				border: 1px solid #ACADB3;
				cursor: pointer;
				color: #000;
				font-size: 14px;
				margin-bottom: 5px;
			}

			.seal-box {
				color: red;
				font-size: 14px;
				margin-bottom: 5px;
			}

			.seal-img {
				position: absolute;
				width: 120px;
				height: 120px;
				z-index: 998;
				top: 50%;
				margin-top: -60px;
				left: 50%;
				margin-left: -60px;
			}

			.DocDefaults {
				line-height: 1.5 !important;
			}

			.html-button {
				text-align: center;
				padding-bottom: 100px;
			}

			.html-btn-cancel,
			.html-btn {
				padding: 5px 20px;
				text-align: center;
				background: rgba(97, 133, 214, 0);
				border-radius: 8px;
				border: 1px solid #ACADB3;
				cursor: pointer;
				color: #000;
				font-size: 14px;
				display: inline-block;
				margin: 0 20px;
			}

			.html-btn {
				background: #08979c;
				border-color: #08979c;
				color: #fff;
			}
		</style>
	</head>
	<body>
		<div id="app">
			<div id="html" class="html" ref="html" v-html="html"></div>
			<!-- 	<div class="html-button">
				<div class="html-btn-cancel" @click="cancel">取消</div>
				<div class="html-btn" @click="submit">保存</div>
			</div> -->
		</div>
		<script src="./jquery.js"></script>
		<script type="text/javascript" src="./uni.webview.js"></script>
		<script type="text/javascript">
			function getQueryObject(url) {
				url = url == null ? window.location.href : url
				const search = url.substring(url.lastIndexOf('?') + 1)
				const obj = {}
				const reg = /([^?&=]+)=([^?&=]*)/g
				search.replace(reg, (rs, $1, $2) => {
					const name = decodeURIComponent($1)
					let val = decodeURIComponent($2)
					val = String(val)
					obj[name] = val
					return rs
				})
				return obj
			}

			document.addEventListener('UniAppJSBridgeReady', function() {
				let app = new Vue({
					el: '#app',
					data: {
						html: '',
						documentId: '',
						contextData: {},
						checkKeys: [],
						options: [],
						idsBox: [],
						sealDomId: '',
						userId: ''
					},
					created() {
						let query = getQueryObject(location.href);
						localStorage.setItem('token', query.token);
						this.documentId = query.id;
						this.contractId = query.contractId;
						this.userId = query.userId;
						this.$nextTick(() => {
							this.initDocument();
						});
					},
					methods: {
						initDocument() {
							$http.getDocumentById(this.documentId).then(res => {
								if (res.state) {
									let data = res.data,
										hasContext = false;
									for (var i = 0; i < data.elementDataList.length; i++) {
										let item = JSON.parse(data.elementDataList[i].data);
										if (item['context'] && item['context']['contractId'])
											hasContext = true;
									}
									if (!hasContext) {
										this.initContext(data.documentTemplateId, data.elementDataList,
											data.sealUsageList);
									} else {
										this.initTemplate(data.documentTemplateId, data.elementDataList,
											data.sealUsageList);
									}
									this.documentSealRegister(data.id);
								}
							})
						},
						initContext(templateId, elementData, sealData) {
							$http.getContractDetailById(this.contractId).then(res => {
								if (res.state) {
									let contractData = res.data;
									$http.getHouseTree(contractData.projectId).then(node => {
										if (node.state) {
											this.options = this.roomList(node.data
												.projectItemList || []);
											if (contractData.projectItemTargetRoomIds) {
												this.idsBox = contractData
													.projectItemTargetRoomIds
													.split(',');
												this.returnChecked(this.options);
											}
											this.setDocumentData(contractData);
											this.initTemplate(templateId, elementData, sealData);
										}
									});
								}
							})
						},
						initTemplate(templateId, elementData, sealData) {
							$http.getDocumentTemplateById(templateId).then(res => {
								if (res.state) {
									this.html = res.data.html;
									$('#title').text(res.data.name);
									this.renderTamplate(elementData, sealData);
								}
							})
						},
						renderTamplate(elementDataList, sealUsageList) {
							//整合模板
							this.$nextTick(() => {
								let documentElement = $('.documentElement');
								for (let i = 0; i < documentElement.length; i++) {
									let elem = documentElement[i];
									let inputtype = $(elem).attr('inputtype') == undefined ? '' : $(elem)
										.attr(
											'inputtype');
									let updatetype = inputtype.replace('@', '');
									$(elem).attr('updatetype', updatetype);
									this.domRender(updatetype, elem, elem.id);
								}
								if (elementDataList.length > 0) this.renderDocument(elementDataList);
								if (sealUsageList) this.filterSeal(sealUsageList);
								//申请印章
								let _self = this;
								$('.sureSeal').click(function() {
									let _this = this;
									wx.miniProgram.navigateTo({
										url: '/pages/requestSeal/requestSeal?documentId=' +
											_self.documentId + '&sealDomId=' + $(_this)
											.parent()[0].id
									});
								});
							});
						},
						domRender(type, elem, id) {
							switch (type) {
								case 'context':
									if (elem.innerHTML) return;
									$(elem).text(this.contextData[id] || '')
									break;
								case 'sign':
									elem.innerHTML =
										'<button class="sureAutograph el-button el-button--default el-button--medium">确认签名</button>';
									break;
								case 'seal':
									if (elem.innerHTML) return;
									elem.innerHTML = '<span class="sureSeal"">申请盖章</span>';
									break;
								default:
									break;
							}
						},
						renderDocument(data) {
							data.forEach(item => {
								let dataItem = JSON.parse(item.data);
								for (let i in dataItem) {
									for (let j in dataItem[i]) {
										this.renderDom(i, j, dataItem[i][j]);
									}
								}
							});
						},
						renderDom(i, j, text) {
							switch (i) {
								case 'seal':
									if (text == '') return;
									$('#' + j).addClass('seal-box');
									$('#' + j).html('已申请印章，请等待审核');
									break;
								case 'sealperson':
									break;
								case 'sign':
									$('#' + j + '[inputtype=' + i + ']').html('<img class="autograph" src="' +
										text + '">');
									break;
								case 'signQR':
									$('#' + j + '[inputtype=' + i + ']').html('<img class="autograph" src="' +
										text + '">');
									break;
								case 'copyImage':
									$('#' + j + '[inputtype=' + i + ']').html('<img  class="copy-img" src="' +
										text + '"/>');
									break;
								default:
									if (i.indexOf('.') == -1) {
										$('#' + j + '[inputtype=' + i + ']').text(text);
									}
									break;
							}
						},
						filterSeal(data) {
							//渲染印章
							let _self = this;
							data.forEach((item, index) => {
								$http.getRequestSealDetail(item.requestId).then(node => {
									if (node.state) {
										let data = node.data;
										if (data.status == 1) {
											$('#' + data.keyWord).css('position',
												'relative');
											$http.getSealDetailById(data.sealId).then(item => {
												if (item.state) {
													$('#' + data.keyWord).html(
														'<img id="' + data.keyWord +
														'" class="seal-img" src="' +
														item.data.fileNode
														.node.url + '"/>');
												}
											})
										}
									}
								})
							});
						},
						documentSealRegister(documentId) {
							$http.getSealRegisterKey(documentId).then(res => {
								if (res.state) {
									res.data.forEach(item => {
										$('#' + item.keyWord).css('position', 'relative');
										$('#' + item.keyWord).html(
											'<img id="' +
											item.keyWord +
											'" class="seal-img" src="' +
											(item.fileNode.node.url ||
												'https://file-node.oss-cn-shanghai.aliyuncs.com/youji/8b726641d0cc45fe91b5e59e4ea450c6'
											) +
											'"/>'
										);
									});
								}
							});
						},
						roomList(data) {
							let newArr = JSON.parse(JSON.stringify(data));
							let index = 1;
							newArr = newArr.map(item => {
								item['projectItemId'] = item['id'];
								item['id'] = index;
								item['projectItem'] = item;
								item['optionName'] = item['name'];
								index++;
								item['children'] = item.projectItemTargetList.map(target => {
									target['projectItemTargetId'] = target['id'];
									target['id'] = index;
									target['projectItem'] = item;
									target['optionName'] = target['name'];
									index++;
									target['children'] = target.projectItemTargetRoomList.map(
										room => {
											room['roomId'] = room['id'];
											room['id'] = index;
											room['projectItem'] = item;
											room['projectItemTarget'] = target;
											room['optionName'] = room['roomNumber'];
											index++;
											return room;
										})
									return target
								})
								return item;
							})
							return newArr;
						},
						returnChecked(data) {
							for (let i = 0; i < data.length; i++) {
								if (data[i]['roomId']) {
									if (this.idsBox.filter(node => node == data[i]['roomId']).length > 0) {
										this.checkKeys.push(data[i]);
									}
								}
								if (data[i].children) this.returnChecked(data[i].children);
							}
						},
						setDocumentData(data) {
							let signingDate = this.returnDate(data.signingDate),
								houseItems = this.returnAddress(this.checkKeys),
								startDate = this.returnDate(data.startDate),
								endDate = this.returnDate(data.endDate);
							this.contextData = {
								contractId: data.id,
								partya: data.organizationName,
								partyb: data.merchantName || data.clientName,
								signyear: signingDate.year,
								signmonth: signingDate.month,
								signday: signingDate.day,
								address: houseItems.address,
								area: houseItems.area,
								startyear: startDate.year,
								startmonth: startDate.month,
								startday: startDate.day,
								endyear: endDate.year,
								endmonth: endDate.month,
								endday: endDate.day,
								price: data.clauseList[0].unitPrice,
								deposit: data.clauseList[1].earnestMoney,
							}
							this.submit();
						},
						returnDate(date) {
							let dateStr = date.split('-');
							return {
								year: dateStr[0],
								month: dateStr[1],
								day: dateStr[2]
							}
						},
						returnAddress(data) {
							let address = [],
								area = [];
							for (let i = 0; i < data.length; i++) {
								address.push(data[i].projectItemName + '-' + data[i].projectItemTargetName +
									'-' + data[i].roomNumber);
								area.push(data[i].area);
							}
							return {
								address: address.join('、'),
								area: area.join('、'),
							}
						},
						submit() {
							$http.insertDocumentData({
								data: JSON.stringify({
									context: this.contextData
								}),
								documentId: this.documentId,
								userId: this.userId
							})
						},
					},
				})
			})
		</script>
	</body>
</html>