<template>
	<view class="sign_content">
		<TopBar title="金融分期"/>
		<view :style="{'margin-top':'28rpx'}">
			<view class="apply_title">签署合同</view>
			<view class="apply_desc">请填写合同内详细信息</view>
		</view>
		<uni-collapse>
			<uni-collapse-item title="企业信息" :open="true">
				<view class="sign_title">企业名称</view>
				<view>
					<input type="text" class="sign_input">
				</view>
			</uni-collapse-item>
		</uni-collapse>
		<view class="agreement">
			关于
			<!-- <text>《谛宝多多金融分期协议》</text> -->
			<text>《xx产品分期采购合同》</text>
		</view>
		<view>
			<text class="sign_checkbox"></text>
			<text class="agree_title">我已阅读并同意</text>
		</view>
		<view class="sign_btn_box">
			<text class="prev_step">上一步</text>
			<text class="confirm_pay">缴纳定金
				<i class="arrow_icon"></i>
			</text>
		</view>
	</view>
</template>

<script>
	import uniCollapse from '@/components/uni-collapse/uni-collapse.vue';
	import uniCollapseItem from '@/components/uni-collapse-item/uni-collapse-item.vue';
	import TopBar from '@/components/TopBar/TopBar.vue';
	export default {
		data() {
			return {
				list: []
			}
		},
		components: {
			uniCollapse,
			uniCollapseItem,
			TopBar
		},
		onLoad() {
			this.loadData();
		},
		methods:{
			async loadData() {
				const value = uni.getStorageSync('installment');
				uni.request({
					url: `/uni/api/signcontract/GetContractField?equipment_id=${128}`,
					method: 'GET',
					dataType: 'json',
					success: (res) => {
						const {data} = res;
						if(data.code == 0){
							this.hot_list = data.data || [];
						}
					}
				})
			}
		}
	}
</script>

<style lang="less" scoped>
	.sign_content {
		background: #fff;
		padding:  80rpx 36rpx 0;
		.apply_title {
			font-size:32rpx;
			font-family:PingFangSC-Medium,PingFang SC;
			font-weight:500;
			line-height: 44rpx;
			color: #212121;
		}
		.apply_desc {
			font-size:24rpx;
			line-height: 34rpx;
			color: #979797;
			margin-top: 8rpx;
		}
		.sign_title {
			color: #464646;
			height:40rpx;
			font-size:28rpx;
			margin-top: 32rpx;
		}
		.sign_input {
			width:100%;
			height:72rpx;
			background:rgba(248,248,248,1);
			border-radius:16rpx;
			margin-top: 20rpx;
			line-height: 72rpx;
			padding: 0 20rpx;
			box-sizing: border-box;
			font-size: 28rpx;
			color: #212121;
		}
		.sign_flex {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-top: 32rpx;
		}
		.sign_btn_box {
			margin: 126rpx 0 40rpx;
			display: flex;
			justify-content: space-between;
			color: #212121;
			font-size: 28rpx;
			line-height: 80rpx;
			text-align: center;
			.prev_step {
				width: 244rpx;
				background: #F5F5F5;
				border-radius: 16rpx;
				height: 80rpx;
			}
			.confirm_pay {
				width: 416rpx;
				height: 80rpx;
				background: #FFCD00;
				border-radius: 16rpx;
			}
			.arrow_icon {
				display: inline-block;
				background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAAElBMVEUhISE5Mx08NR0/OB3ftAT/zQCuQjOCAAAAPklEQVQY02MIRQIMZHKCVZA4QYyuCE6IgAiSHkeoFEMokhTENKgUhBMioIqDg6wMxQBko1EsRXEOikMp8jYAjsJZhd56tsAAAAAASUVORK5CYII=');
				background-size: 100% 100%;
				background-repeat: no-repeat;
				width: 24rpx;
				height: 24rpx;
				position: relative;
				top: 1px;
			}
		}
		.agreement {
			font-size: 26rpx;
			color: #979797;
			margin-top: 34rpx;
			text {
				color: #718BCA;
			}
		}
		.agree_title {
			font-size: 26rpx;
			color: #7C7C7C;
		}
		.sign_checkbox {
			display: inline-block;
			width: 36rpx;
			height: 36rpx;
			background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAAAAADEa8dEAAAA4ElEQVQ4y73UuwqDMBSA4b7/K/06RBwEBxGcI0jIJOggdvGYDrW2thFOhzZb4MvtXHIJinH5FZLBO+cHOUerKxMASEq3xpE3QF41TZUDxkeQ1JDZ6T6ZbAa1vKNrQWqX5+LFphTXI5ICMx5vOxoKOaAaM78/fDbUr8iTjp/hGVP8E60GGwuixaw7cmRLDC0ZbkdlfKMQLOUDScIURxOJbKgnP0ttTr+hjuoMVXQbamnOUEP7DVIdp7q4KgSqYOrSokqwqlR0RacrX1Uj6FpK15zKNg8hBOm7tu16+dP/FB83GSPcKcU7y9kAAAAASUVORK5CYII=');
			background-size: 100% 100%;
			background-repeat: no-repeat;
			vertical-align: middle;
			margin-right: 4rpx;
		}
		.sign_checkbox.act {
			background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAMAAADW3miqAAACoFBMVEUhISEkIyArKR84Mx49Nh1cThhgURdiUxdqWRZwXhVzYBV+aROAahOihQ61kwu4lQu6lwq9mQrKpAjasAXwwQL3xgH9ywD/zQD/zQH/zQL/zgf/zgn/zwr/zxD/0BD/0BL/0BP/0RP/0RT/0RX/0h7/0x7/0x//0yP/1CT/1Cj/1Sf/1Sj/1Sr/1Sz/1jH/1zP/1zT/1zX/2Dn/2Dr/2T//2UD/2UL/2kH/2kT/2kX/20X/3E3/3E//3VL/3VT/3lT/3lf/3lj/31v/313/31//32H/4GH/4Gb/4Wb/4Wr/4Wz/4mn/4mv/4m3/43H/43L/43T/43X/5HP/5HT/5HX/5Hb/5Hf/5Hj/5Hn/5Hr/5Xn/5Xv/5X3/5oD/5oH/5oP/5oT/54P/54X/54b/54f/54n/6In/6Iv/6I7/6Y7/6Y//6ZL/6ZP/6ZT/6pf/6pj/6pn/65f/65n/65r/65v/657/65//7KD/7KP/7KT/7aP/7ab/7af/7aj/7an/7qr/7qv/7qz/7q3/763/767/76//77H/77P/8LT/8LX/8Lb/8Lf/8br/8bv/8b3/8r7/8sD/8sH/8sL/88L/88T/88X/88b/88n/9Mj/9Mn/9Mr/9Mv/9Mz/9M3/9c3/9c7/9dD/9dH/9tH/9tL/9tP/9tT/99b/99f/99j/99n/99r/99z/+Nv/+Nz/+N3/+N7/+N//+d7/+d//+eH/+eL/+eP/+eX/+uL/+uT/+uX/+ub/+uf/+uj/+un/+uv/++r/++v/++z/++3/++7/++//+/D//O7//O///PD//PH//PL//PP//PT//PX//fT//fX//fb//ff//fj//fn//fv//vb//vj//vn//vr//vv//vz//v3///z///3///7////If3C4AAACf0lEQVQ4y2O4TwRgQBe4BwR4FN27dfPyxfPnTp8+c+Hi5Zu372FRdO/m9bMn922ujg8Pj6/efujUhcu37qEpunfr+vljW1P0JcXBQNIgbcdxhDKIors3LxzdlSkvjgTks/acunbzHkLR7RvnD660EEcDlmuPXbhyF6bo7o3z+6doi2MA7RkHL1y5B1F07+b5/Yu1xLEAzeUHL4BsZAC6+cLBVabiWIHZ+uPXboMU3b58ZH2cOA6QtOXU5XtARTfPbZsli0uR3KK9F27dZ7h3/dCKYHGcIGzjicv3GG6d3zlLB1NSmFcETOsu2HvhNsONE2u6JTHUCDExcELCvm/z6TsMlw4sjsOmhoEbwkxecfgGw4VdM10hXAEWHjGEGlZRCNtjwf5rDGc2T3KAcNkYGLjE0NWIO03fdYHh9Lo+ewhXkBGiCkWNuOOUrVcZTq7ucYTy+cCqUNWIO0/ecgakyFccSRU7qhrxIJAioHXZEsiqUNVIFIOsAzq8RFUcWRWyGnG1KpDDgUFQYYMQ5GfmQFYjbtcACgJgYLamSOOKOpmMLlBgAqOlN88alyLb0kmgaAFFcE2COnY1Gukt4AgGJZWe/ABFbGqUIksngJMKKNHNbcn0UMBUo+iT27lkDyjRgZPv1JpUHxV0NWp+GU2zockXnBEmVqb5mUghK5EyD8monwbLCOAstWJSTUaUu5ESNOwllI29Y3Iap62DZSlI5lw1taUoKdTTxcJQT8/Qys0rIrW0fdZGROaEZPMN83vr8tNjI0L8/QOjEzNKmics3IKczaEFxso5fW01ZQWFhcXltR0T569GKzCgRc+2dUvnTJ3Q3z9x2rxlm3afQBQ9AO0gCIzNUhSlAAAAAElFTkSuQmCC');
		}
	}

</style>