duantuihe/pages/index/genHuiBen/index.scss

	view {
		box-sizing: border-box;
	}
	::v-deep .u-upload__wrap__preview__image{
		width: calc(100vw - 128rpx)!important;
		height: 626rpx!important;
		border-radius: 20rpx!important;
		
	}
	::v-deep .u-upload__deletable{
		
		background: rgba(0,0,0,0)!important;
	}
	::v-deep .u-upload__deletable__icon{
		width: 40rpx!important;
		height: 40rpx!important;
		border-radius: 50%!important;
		display: flex!important;
		align-items: center!important;
		justify-content: center!important;
	}
	::v-deep .u-upload__wrap__preview{
		margin: 0!important;
	}
	::v-deep .u-upload__deletable__icon{
		// display: flex!important;
		// align-items: center!important;
		// justify-content: center!important;
	}
	::v-deep .u-icon__icon{
		font-size:40rpx!important;
	}
	
	::v-deep .u-upload__success{
		display: none!important;
	}
 
	.container {
		min-height: 100vh;
		
		position: relative;
		
 .topBox{
	height: 194rpx;
	// background: deepskyblue;
	border-radius: 0 0 40rpx 0;
	
	padding-top: 48rpx;
	padding-left: 48rpx;
	display: flex;
	
	background-size: cover;
	background-repeat: no-repeat;
	
	box-shadow: 0rpx -2rpx 20rpx 0rpx rgba(0,0,0,0.05);
	
	.left{
		.aiIcon{
			// width: 62rpx;
			// height: 52rpx;
			
			height: 78rpx;
			
			margin-top: -14rpx;
		}
	}
	.right{
		margin-left: -5rpx;
		.label1{
			// font-size: 40rpx;
			// font-family: DOUYUFont;
			// color: #FFFFFF;
			// text-shadow: 0px 4px 8px rgba(0,67,181,0.16);
			// width: 222rpx;
			height: 54rpx;
		}
		.label2{
			font-size: 32rpx;
			font-family: SourceHanSansCN, SourceHanSansCN;
			font-weight: bold;
			color: #FFFFFF;
			text-shadow: 0px 4px 8px rgba(0,67,181,0.16);
			padding-left: 6rpx;
		}
	}
		}
		
		.mainBox{
			margin-top:40rpx;
			padding: 0 30rpx;
			.titleBox{
				background: #F0F1F4;
				background: linear-gradient(90deg,#F0F1F4,#fff);
				height: 62rpx;
				width: 60%;
				border-radius: 32rpx 0rpx 0rpx 0rpx;
				font-size: 32rpx;
				font-family: SourceHanSansCN, SourceHanSansCN;
				font-weight: bold;
				color: #333333;
				display: flex;
				align-items: center;
				padding-left: 32rpx;
				
				position: relative;
				
				.starIcon{
					width: 24rpx;
					height: 24rpx;
					position: absolute;
					right: 0;
					top: 0;
				}
			}
			.uploadBox{
				padding: 40rpx 32rpx;
				min-height: 798rpx;
				background: #F0F1F4;
				border-radius: 0rpx 32rpx 32rpx 32rpx;
				.tipBox{
					height: 60rpx;
					background: #FFFFFF;
					border-radius: 8rpx;
					
					display: flex;
					align-items: center;
					padding-left: 24rpx;
					
					font-size: 24rpx;
					font-family: PingFang-SC, PingFang-SC;
					font-weight: bold;
					color: #333333;
					width: 90%;
					
					.tipIcon{
						width: 78rpx;
						height: 34rpx;
						margin-right: 12rpx;
					}
				}
				.selBox{
					width: 100%;
					margin-top: 32rpx;
					.myUpArea{
						font-size: 26rpx;
						font-family: PingFangSC, PingFang SC;
						font-weight: 400;
						color: #696969;
						
						display: flex;
						flex-direction: column;
						justify-content: center;
						align-items: center;
						
						height: 626rpx;
						width: calc(100vw - 128rpx);
						background: red;
						background: #FFFFFF;
						border-radius: 20rpx;
						
					}
					.upIcon{
						height: 96rpx;
						margin-bottom: 16rpx;
					}
				}
			}
		}
		
		.parmasBox{
			margin-top: 40rpx;
			padding: 0 30rpx;
				.titleBox{
					background: #F0F1F4;
					background: linear-gradient(90deg,#F0F1F4,#fff);
					height: 62rpx;
					width: 60%;
					border-radius: 32rpx 0rpx 0rpx 0rpx;
					font-size: 32rpx;
					font-family: SourceHanSansCN, SourceHanSansCN;
					font-weight: bold;
					color: #333333;
					display: flex;
					align-items: center;
					padding-left: 32rpx;
					position: relative;
					
					.starIcon{
						width: 24rpx;
						height: 24rpx;
						position: absolute;
						right: 150rpx;
						top: 0;
					}
				}
			
			
			.inputBox{
				width: 100%;
				min-height: 452rpx;
				background: #F0F1F4;
				border-radius: 0rpx 32rpx 32rpx 32rpx;
				padding: 40rpx 32rpx;
				
				font-size: 30rpx;
				font-family: PingFang-SC, PingFang-SC;
				font-weight: 500;
				// color: #CCCCCC;
				.selAndTileBox{
					display: flex;
					align-items: center;
					justify-content: space-between;
					.selBtn{
						width: 28%;
						height: 108rpx;
						background: #FFFFFF;
						border-radius: 20rpx;
						font-size: 30rpx;
						font-family: PingFang-SC, PingFang-SC;
						font-weight: 500;
						color: #333333;
						display: flex;
						align-items: center;
						justify-content: center;
					}
				}
				
				.nickname{
					height: 108rpx;
					background: #FFFFFF;
					border-radius: 20rpx;
					display: flex;
					align-items: center;
					justify-content: space-between;
					padding: 0 24rpx;
					width: 65%;
					.nackI{
					}
					.arrIcon{
						width: 12rpx;
						height: 20rpx;
					}
				}
				
			}
		}
	}
	
	.pos{
		height: 212rpx;
	}
	
	
	
	.btnBox{
		height: 188rpx;
		background: #FFFFFF;
		box-shadow: 0rpx -2rpx 20rpx 0rpx rgba(0,0,0,0.05);
		border-radius: 32rpx 32rpx 0rpx 0rpx;
		position: fixed;
		bottom: 0;
		width: 100%;
		z-index: 1;
		
		display: flex;
		align-items: center;
		justify-content: space-between;
		
		// padding-left: 66rpx;
		padding-right: 30rpx;
		.left{
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: flex-start;
			font-size: 20rpx;
			font-family: PingFang-SC, PingFang-SC;
			font-weight: 500;
			color: #333333;
			
			height: 108rpx;
			width: calc(100% - 552rpx);
			// background: red;
			padding-left: 66rpx;
			.kfIcon{
				width: 38rpx;
				height: 40rpx;
				margin-bottom: 4rpx;
			}
		}
		.right{
			width: 552rpx;
			height: 108rpx;
			background: linear-gradient(132deg, #0298FF 0%, #017AFF 100%);
			box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(0,122,255,0.2);
			border-radius: 54rpx;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			.top{
				font-size: 32rpx;
				font-family: SourceHanSansCN, SourceHanSansCN;
				font-weight: bold;
				color: #FFFFFF;
				margin-bottom: 10rpx;
			}
			.bot{
				font-size: 24rpx;
				font-family: PingFang-SC, PingFang-SC;
				font-weight: bold;
				color: #FFFFFF;
			}
		}
	}
	
	
	.topBar{
		display: flex;
		align-items: center;
		margin-top: 36rpx;
		padding: 0 28rpx;
		
		.left{
			width: 20%;
			font-size: 32rpx;
			font-family: PingFang-SC, PingFang-SC;
			font-weight: 500;
			color: #999999;
		}
		.mid{
			width: 60%;
			text-align: center;
			font-size: 32rpx;
			font-family: PingFangSC, PingFang SC;
			font-weight: 500;
			color: #080F18;
		}
		.right{
			width: 20%;
			text-align: right;
			font-size: 32rpx;
			font-family: PingFang-SC, PingFang-SC;
			font-weight: 500;
			color: #007AFF;
		}
	}
	::v-deep .u-popup__content{
		border-radius: 20rpx 20rpx 0rpx 0rpx!important;
	}
	
	::v-deep .u-picker__view__column__item{
		// color: #007AFF!important;
	}
	
	
	
	.otherBox{
		margin-top: 24rpx;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		
		// background: red;
		.item{
			height: 108rpx;
			background: #FFFFFF;
			border-radius: 20rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0 24rpx;
			width: 45%;
			margin-bottom: 24rpx;
			.nackI{
				
			}
			.arrIcon{
				width: 12rpx;
				height: 20rpx;
			}
		}
		.item:nth-child(3),.item:nth-child(4){
			margin-bottom: 0rpx;
		}
	
	}
	
	
	// .my-picker .active{
	//     background-color:#007AFF;
	//     color:#007AFF;
	// }
	
	
	
	::v-deep  .u-loading-page{
		position: absolute!important;
		width: 100vw;
		height: 100vh;
		z-index: 9999!important;
		background: #e8e8e8;
	}
	
	
	
	.loadingP{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		
		// background:#eee;
		background: white;
		height: 100vh;
		width: 100vw;
		
		position: absolute;
		z-index: 999999999999999999;
		
		.loadingPic{
			width: 150rpx;
			height: 150rpx;
			
			// transform: translateY(-50%);
			margin-top: -400rpx;
		}
		.loadingTxt{
			color: #999;
			font-size: 34rpx;
			margin-top: 20rpx;
		}
	}