Merge branch 'feature_UI调整' of http://101.231.166.56:3000/elab-damai-h5/h5-webgl-program into feature_UI调整

src/App.vue

@@ -20,7 +20,7 @@
 <script>
 	import {
 		getStorage,
-		removeItem
+		pxoveItem
 	} from '@/utils/localStorage';
 	export default {
 		name: "App",
@@ -132,13 +132,6 @@
 		background: #181C28;
 	}
 
-	.el-tooltip__popper.is-light {
-		backdrop-filter: blur(10.36rem) !important;
-		background-color: rgba(255, 255, 255, 0.4) !important;
-		border: none !important;
-		color: #ffffff !important;
-	}
-
 
 	.el-tooltip__popper .popper__arrow,
 	.el-tooltip__popper .popper__arrow::after {
@@ -156,57 +149,6 @@
 	.el-picker-panel__body .el-picker-panel__content .el-date-table th {
 		color: #FFFFFF;
 	}
-
-	.dropdown-view-menu {
-		font-size: 14px;
-		color: var(--themeColor9);
-		/* width: 336rem; */
-		box-sizing: border-box;
-		padding: 15rem !important;
-		margin-top: 3rem;
-		backdrop-filter: blur(60px);
-		border: none !important;
-		background-color: rgba(255, 255, 255, 0.15) !important;
-		white-space: nowrap;
-		overflow: hidden;
-		text-overflow: ellipsis;
-	}
-
-	.dropdown-view-menu .active {
-		color: #CEF7D1;
-	}
-
-	.dropdown-view-text {
-		font-family: "Verdana Bold";
-		font-weight: 700;
-		text-decoration: underline;
-		font-size: 14px;
-		color: #fff;
-	}
-
-	.select-julangview {
-		display: none;
-	}
-
-	.popper-class-qr {
-		padding: 0px !important;
-	}
-
-	.BMap_cpyCtrl {
-		display: none;
-	}
-
-	.anchorBL {
-		display: none;
-	}
-
-	.amap-logo img {
-		display: none;
-	}
-
-	.amap-copyright {
-		opacity: 0;
-	}
 </style>
 <style lang="scss" scoped>
 	@import "./assets/common.scss";

src/assets/common.css

@@ -92,548 +92,6 @@ div {
     z-index: 1000!important;
     cursor: pointer;
 }
-
-.project-content {
-    position: relative;
-    /* float: left; */
-    /* width: auto; */
-    width: 300rem;
-    padding: 15rem 20rem;
-    box-sizing: border-box;
-    /* background: linear-gradient(90deg,#000000 1%, rgba(0,0,0,0.00));
-	backdrop-filter: blur(30.24rem); */
-    padding-bottom: 4rem;
-    cursor: pointer;
-}
-
-.filter-view {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    ;
-    left: 0rem;
-    top: 0rem;
-    filter: blur(30rem);
-    background: linear-gradient(90deg, #000000 1%, rgba(0, 0, 0, 0.00));
-    border-radius: 12px;
-    backdrop-filter: blur(10.02px);
-    z-index: -1;
-}
-
-.project-head {
-    width: 40rem;
-    height: 40rem;
-    line-height: 40rem;
-    background: rgba(0, 0, 0, 0.00);
-    border: 1rem solid rgba(255, 255, 255, 0.33);
-    border-radius: 50%;
-    margin-right: 8rem;
-    font-size: 18px;
-    font-family: Verdana, Verdana-Bold;
-    font-weight: 700;
-    text-align: center;
-    color: #ffffff;
-    object-fit: cover;
-}
-
-.project-name {
-    height: 28rem;
-    line-height: 28rem;
-    font-size: 20px;
-    font-family: Verdana, Verdana-Bold;
-    font-weight: 700;
-    text-align: left;
-    color: #ffffff;
-}
-
-.project-address {
-    height: 17rem;
-    line-height: 17rem;
-    opacity: 0.5;
-    font-size: 12px;
-    font-family: Verdana, Verdana-Bold;
-    font-weight: 400;
-    text-align: left;
-    color: #ffffff;
-}
-
-.project-tips {
-    width: 40rem;
-    height: 22rem;
-    background: rgba(255, 255, 255, 0.2);
-    border-radius: 4rem;
-    font-size: 14px;
-    font-family: FontName, FontName-Regular;
-    font-weight: 400;
-    text-align: center;
-    color: #ffffff;
-    line-height: 22rem;
-    font-style: italic;
-    margin-left: 10rem;
-}
-
-.project-area {
-    margin-top: 6rem;
-    height: 20rem;
-    line-height: 20rem;
-    font-size: 14px;
-    font-family: Verdana, Verdana-Bold;
-    font-weight: 700;
-    text-align: left;
-    color: #ffffff;
-    overflow: hidden;
-}
-
-.project-footer {
-    position: relative;
-    width: 100%;
-    height: 10rem;
-    margin-top: 10rem;
-    overflow: hidden;
-}
-
-.project-footer-top {
-    width: 100%;
-    height: 4rem;
-    background: linear-gradient(90deg, var(--themeColor4) 1%, transparent);
-}
-
-.project-footer-left {
-    position: absolute;
-    top: 0rem;
-    border-width: 10rem;
-    border-top-color: transparent;
-    border-right-color: transparent;
-    border-bottom-color: transparent;
-    border-left-color: var(--themeColor4);
-    border-style: solid;
-    border-left-width: 5rem;
-    border-top-width: 0rem;
-}
-
-.polyon-content {
-    float: left;
-    width: auto;
-    font-size: 14px;
-    white-space: nowrap;
-    font-family: Verdana, Verdana-Bold;
-    font-weight: 700;
-    text-align: center;
-    color: var(--themeColor1);
-    text-shadow: 0rem 0rem #000000;
-}
-
-.competitionProjectHide {
-    display: none !important;
-}
-
-.competitionProjectShow {
-    display: flex;
-}
-
-.infoWindowUnSelected .project-head {
-    display: none;
-}
-
-.infoWindowUnSelected .project-name {
-    height: 20rem;
-    line-height: 20rem;
-    font-size: 14px;
-}
-
-.infoWindowSelected .project-tips,
-.infoWindowUnSelected .project-tips {
-    display: none;
-}
-
-.infoWindowHtml.infoWindowSelected {
-    z-index: 1001!important;
-}
-
-.infoWindowUnSelected .project-address {
-    display: none;
-}
-
-.infoWindowUnSelected .project-area {
-    height: 17rem;
-    line-height: 17rem;
-    opacity: 0.6;
-    font-size: 12px;
-    margin-top: 0rem;
-}
-
-.infoWindowUnSelected .project-footer {
-    margin-top: 8rem;
-}
-
-.competitionUnSelected .project-name {
-    height: 20rem;
-    line-height: 20rem;
-    font-size: 14px;
-}
-
-.competitionUnSelected .project-area {
-    display: none;
-}
-
-
-/* 项目竞品状态 */
-
-.competitionProject .project-name {
-    height: 20rem;
-    line-height: 20rem;
-    font-size: 14px;
-}
-
-.competitionProject .project-head,
-.competitionProject .project-area,
-.competitionProject .project-address {
-    display: none;
-}
-
-
-/* 圆柱样式 */
-
-.cricleColumn-view {
-    position: relative;
-    width: 90rem;
-    height: 152rem;
-    cursor: pointer;
-}
-
-.cricleColumn-img {
-    width: 90rem;
-    height: 152rem;
-}
-
-.cricleColumn-text {
-    position: absolute;
-    bottom: 0rem;
-    left: 0rem;
-    width: 100%;
-    height: 37rem;
-    font-size: 14px;
-    font-family: DIN Alternate, DIN Alternate-Bold;
-    font-weight: 700;
-    text-align: center;
-    color: #ffdf80;
-    line-height: 14rem;
-}
-
-.cricleColumn1-view {
-    position: relative;
-    width: 82rem;
-    height: 152rem;
-    cursor: pointer;
-}
-
-.cricleColumn1-img {
-    width: 82rem;
-    height: 152rem;
-}
-
-.cricleColumn2-view {
-    width: 60px;
-    height: 60px;
-}
-
-.cricleColumn2-img {
-    width: 100%;
-    height: 100%;
-}
-
-.cricleColumn1-text {
-    position: absolute;
-    bottom: 14rem;
-    left: 0rem;
-    width: 100%;
-    font-size: 14px;
-    font-family: DIN Alternate, DIN Alternate-Bold;
-    font-weight: 700;
-    text-align: center;
-    color: #fff;
-    line-height: 20rem;
-}
-
-.project-plate2{
-    display: flex;
-    flex-direction: column;
-    width: 40px;
-    height: 58px;
-    align-items: center;
-}
-
-
-.plate-point-icon2{
-    width: 10rem;
-    height: 10rem;
-    min-height: 10rem;
-    background: #FFDB89;
-    border-radius: 50%;
-    margin-top: 15rem;
-}
-
-.plate-point-name-img2{
-    width: 35px;
-    height: 35px;
-    border-radius: 50%;
-    transform: rotate(45deg);
-}
-
-.plate-point-name2{
-    background: #FFDB89;
-    width: 40px;
-    min-width: 40px;
-    height: 40px;
-    min-height: 40px;
-    border-top-left-radius: 50%;
-    border-top-right-radius: 50%;
-    border-bottom-right-radius: 50%;
-    border-bottom-left-radius: 3px;
-    transform: rotate(-45deg);
-    display: flex;
-    align-items: center;
-    justify-content: center;
-}
-.plate-point-name-txt2 {
-    font-size: 18px;
-    font-family: Verdana, Verdana-Bold;
-    text-align: center;
-    color: #ffffff;
-    transform: rotate(45deg);
-    overflow: hidden;
-    white-space: nowrap;
-    width: 40px;
-}
-
-.el-picker-panel__content .el-date-table td.disabled div{
-    background: transparent;
-}
-
-.el-date-table td.current:not(.disabled) span{
-    background-color: var(--themeColor1);
-}
-.el-date-table td.today span{
-    color: var(--themeColor1);
-}
-.el-date-table td:hover{
-    color: var(--themeColor1);
-}
-
-.project-plate {
-    display: flex;
-    flex-direction: row;
-    width: 265px;
-    height: 58px;
-    align-items: center;
-}
-
-.plate-point-icon {
-    width: 10rem;
-    height: 10rem;
-    background: #fede7f;
-    border-radius: 50%;
-    margin-left: 20rem;
-}
-
-.plate-point-name {
-    font-size: 16px;
-    font-family: Verdana, Verdana-Bold;
-    font-weight: 700;
-    text-align: left;
-    color: #ffffff;
-    margin-left: 10rem;
-    background: #181C28;
-    border-radius: 6rem;
-    padding: 6rem 10rem;
-}
-
-.plate-point-name-img {
-    width: 35px;
-    height: 35px;
-    border-radius: 50%;
-    transform: rotate(45deg);
-}
-
-.plate-point-name-txt {
-    font-size: 18px;
-    font-family: Verdana, Verdana-Bold;
-    font-weight: 700;
-    text-align: center;
-    color: #ffffff;
-    transform: rotate(45deg);
-    overflow: hidden;
-    white-space: nowrap;
-    width: 40px;
-}
-
-.cricleColumn2-text {
-    position: absolute;
-    left: 50%;
-    top: 50%;
-    transform: translate(-50%, -50%);
-    width: 100%;
-    font-size: 12px;
-    font-family: DIN Alternate, DIN Alternate-Bold;
-    text-align: center;
-    color: #fff;
-}
-
-.poi-view {
-    position: relative;
-    width: max-content;
-    height: 30rem;
-    background: rgba(255, 255, 255, 0.2);
-    border-radius: 15rem;
-    backdrop-filter: blur(30rem);
-    cursor: pointer;
-}
-
-.poi-view-radius {
-    width: 24rem;
-    height: 24rem;
-    line-height: 22rem;
-    background: rgba(118, 188, 255, 0.50);
-    border: 1px solid #76bcff;
-    border-radius: 50%;
-    font-size: 12px;
-    font-family: Verdana, Verdana-Regular;
-    font-weight: 400;
-    text-align: center;
-    color: #ffffff;
-    margin-left: 4rem;
-}
-
-.poi-view-text {
-    font-size: 14px;
-    font-family: Verdana, Verdana-Regular;
-    font-weight: 400;
-    text-align: left;
-    color: #ffffff;
-    margin-left: 5rem;
-    margin-right: 10rem;
-}
-
-.poi-point {
-    border-radius: 50%;
-    width: 10rem;
-    height: 10rem;
-    background: #ffad5c;
-    border: 1rem solid #fff;
-}
-
-.poi-view-poi {
-    position: relative;
-    width: max-content;
-    background: rgba(255, 255, 255, 0.2);
-    border-radius: 5rem;
-    backdrop-filter: blur(30rem);
-    cursor: pointer;
-    padding: 10rem;
-    display: flex;
-    align-items: center;
-}
-
-.poi-view-poi-num {
-    width: 24rem;
-    min-width: 24rem;
-    height: 24rem;
-    background: var(--themeColor2_2);
-    border: 1px solid var(--themeColor2);
-    font-size: 12px;
-    text-align: center;
-    color: #fff;
-    line-height: 24rem;
-    border-radius: 50%;
-    margin-right: 10rem;
-}
-
-.poi-view-info {
-    font-size: 14px;
-    font-family: Verdana, Verdana-Regular;
-    font-weight: 400;
-    text-align: left;
-    color: #ffffff;
-    margin-left: 5rem;
-    margin-right: 10rem;
-}
-
-.poi_sanjiao {
-    position: absolute;
-    bottom: -12rem;
-    width: 0rem;
-    height: 0;
-    border: 6rem solid;
-    border-color: rgba(255, 255, 255, 0.2) transparent transparent;
-    left: calc((100% - 12rem) / 2);
-
-}
-
-.poiUnSelected .poi-view {
-    background: unset;
-    backdrop-filter: unset;
-}
-
-.poiUnSelected .poi-view-text {
-    opacity: 0;
-}
-
-.trafficPoint-view {
-    width: 24rem;
-    height: 24rem;
-    background: rgba(255, 255, 255, 0.00);
-    border: 1px solid var(--themeColor2);
-    border-radius: 50%;
-    font-size: 12px;
-    font-family: Verdana, Verdana-Regular;
-    font-weight: 400;
-    color: var(--themeColor2);
-    text-align: center;
-    line-height: 24rem;
-}
-
-
-/* 预览视图里面的拖拽样式 */
-
-.custom-content-marker {
-    position: relative;
-    width: 206px;
-    height: 206px;
-    /*border-radius: 50%;*/
-    /*border: var(--themeColor3) solid 1px;*/
-    /*background: var(--themeColor3_2);*/
-    box-sizing: border-box;
-}
-
-.custom-content-img {
-    width: 32px;
-    height: 32px;
-}
-
-.project-view {
-    position: absolute;
-    right: 0rem;
-    top: 0rem;
-    width: 690rem;
-    height: calc(100% - 50rem);
-    padding: 20rem 20rem 20rem 0;
-    transition: 0.3s;
-    transform: translateX(0rem);
-    z-index: 11 !important;
-}
-
-.project-view-content {
-    min-height: 240rem;
-    position: relative;
-    width: 100%;
-    height: calc(100% - 100rem);
-    border-radius: 10rem;
-    padding: 20rem;
-    backdrop-filter: blur(10.36rem);
-    color: azure;
-    margin-top: 10rem;
-}
-
 .project-view-content-scroll {
     overflow: auto;
 }

src/assets/common.scss

@@ -8,8 +8,8 @@
 }
 
 .loadData{
-    min-width:110px;
-    height:110px;
+    min-width:200px;
+    height:150px;
     position: absolute;
     left: 50%;
     top:50%;
@@ -30,97 +30,9 @@
         color: rgba(255, 255, 255, 0.83);
         margin: 10px;
 		margin-top: 0px;
-		font-size: 18rem;
+		font-size: 18px;
     }
 }
-.account-view{
-	width: 500rem;
-	// height: 362rem;
-	padding:30rem 40rem;
-	box-sizing:border-box;
-	background-color: rgba(255, 255, 255, 0.9);
-	border-radius: 20rem;
-	// backdrop-filter: blur(30px);
-	.title-icon{
-		width:18rem;
-		margin-right:10rem;
-	}
-	.close{
-		.close-img{
-			font-size: 16rem;
-			font-weight: bold;
-			color:#000;
-			cursor: pointer;
-		}
-	}
-	.content{
-		width: 100%;
-		color: #0b0b0b;
-		font-size: 14rem;
-		.content-main-view{
-			height: 250rem;
-			border-radius: 6rem;
-			background: #fff;
-			box-sizing:border-box;
-			padding: 18rem;
-			overflow: auto;
-			.selcect-view{
-				position: relative;
-				width: 16rem;
-				height: 16rem;
-				border-radius: 100%;
-				background: transparent;
-				border: 1rem solid #ef863f;
-				box-sizing:border-box;
-			}
-			.selcect-view::after{
-				content: '';
-				position: absolute;
-				top: 50%;
-				left: 50%;
-				transform: translate(-50%,-50%);
-				width: 10rem;
-				height: 10rem;
-				border-radius: 100%;
-				background: #ef863f;
-				box-sizing:border-box;
-			}
-			.unselcect-view{
-				width: 16rem;
-				height: 16rem;
-				border-radius: 8rem;
-				background: rgba(249, 249, 249, 0.2);
-				border: 1rem solid rgba(0, 0, 0, 0.2);
-			}
-			.gougou-icon{
-				color: #EF863F;
-			}
-		}
-	}
-	.auth-btn-view{
-		.auth-btn{
-			width: 120rem;
-			height: 40rem;
-			border-radius: 10rem;
-			cursor: pointer;
-		}
-		.style1{
-			font-family: "Verdana Bold";
-			font-weight: 700;
-			font-size: 14rem;
-			color: #151515;
-			background: #d5d5d5;
-		}
-		.style2{
-			font-family: "Verdana Bold";
-			font-weight: 700;
-			font-size: 14rem;
-			color: #fff;
-			background: #ef863f;
-			box-shadow: 0 12px 24px rgba(239, 134, 63, 0.2);
-		}
-	}
-}
 .overflow{
     overflow: hidden;
     text-overflow:ellipsis;
@@ -146,7 +58,6 @@ body,html{
     padding: 0;
     position: relative;
     background-color: #f4f4f4;
-    // font-size: 13px;
 }
 #app{
     width:100%;

src/assets/css/common.css

@@ -67,245 +67,4 @@ body{
 	background: linear-gradient(90deg,#000000 1%, rgba(0,0,0,0.00));
 	z-index: -1;
 }
-.project-head{
-	width: 40rem;
-	height: 40rem;
-    line-height: 40rem;
-	background: rgba(0,0,0,0.00);
-	border: 1rem solid rgba(255,255,255,0.33);
-	border-radius: 50%;
-	margin-right: 8rem;
-    font-size: 18px;
-	font-family: Verdana, Verdana-Bold;
-	font-weight: 700;
-	text-align: center;
-	color: #ffffff;
-    object-fit: cover;
-}
-.project-name{
-	height: 28rem;
-	line-height: 28rem;
-	font-size: 20px;
-	font-family: Verdana, Verdana-Bold;
-	font-weight: 700;
-	text-align: left;
-	color: #ffffff;
-}
-.project-address{
-	height: 17rem;
-	line-height: 17rem;
-	opacity: 0.5;
-	font-size: 12px;
-	font-family: Verdana, Verdana-Bold;
-	font-weight: 400;
-	text-align: left;
-	color: #ffffff;
-}
-.project-tips{
-	width: 40rem;
-	height: 22rem;
-	background: rgba(255,255,255,0.2);
-	border-radius: 4rem;
-	font-size: 14px;
-	font-family: FontName, FontName-Regular;
-	font-weight: 400;
-	text-align: center;
-	color: #ffffff;
-	line-height: 22rem;
-	font-style: italic;
-	margin-left: 10rem;
-}
-.project-area{
-	margin-top: 6rem;
-	height: 20rem;
-	line-height: 20rem;
-	font-size: 14px;
-	font-family: Verdana, Verdana-Bold;
-	font-weight: 700;
-	text-align: left;
-	color: #ffffff;
-    overflow: hidden;
-}
-.project-footer{
-	position: relative;
-	width: 100%;
-	height: 10rem;
-	margin-top: 10rem;
-    overflow: hidden;
-}
-.project-footer-top{
-	width: 100%;
-	height: 4rem;
-	background: linear-gradient(90deg,var(--themeColor4) 1%, transparent);
-}
-.project-footer-left{
-	position: absolute;
-	top: 0rem;
-	border-width:10rem;
-	border-top-color: transparent;
-	border-right-color: transparent;
-	border-bottom-color: transparent;
-	border-left-color: var(--themeColor4);
-	border-style:solid;
-	border-left-width: 5rem;
-	border-top-width: 0rem;
-}
-.polyon-content{
-	float: left;
-	width: auto;
-	font-size: 14px;
-    white-space: nowrap;
-	font-family: Verdana, Verdana-Bold;
-	font-weight: 700;
-	text-align: center;
-	color: var(--themeColor1);
-	text-shadow: 0rem 0rem #000000;
-}
-.infoWindowUnSelected .project-head{
-	display: none;
-}
-.infoWindowUnSelected .project-name{
-    height: 20rem;
-	line-height: 20rem;
-    font-size: 14px;
-}
-.infoWindowSelected .project-tips,.infoWindowUnSelected .project-tips{
-	display: none;
-}
-.infoWindowHtml.infoWindowSelected{
-    z-index: 1001!important;
-}
-.infoWindowUnSelected .project-address{
-	display: none;
-}
-.infoWindowUnSelected .project-area{
-    height: 17rem;
-	line-height: 17rem;
-    opacity: 0.6;
-    font-size: 12px;
-	margin-top: 0rem;
-}
-.infoWindowUnSelected .project-footer{
-	margin-top: 8rem;
-}
-.competitionUnSelected .project-name{
-    height: 20rem;
-	line-height: 20rem;
-    font-size: 14px;
-}
-.competitionUnSelected .project-area{
-    display: none;
-}
-/* 项目竞品状态 */
-.competitionProject .project-name{
-    height: 20rem;
-	line-height: 20rem;
-    font-size: 14px;
-}
-.competitionProject .project-head,.competitionProject .project-area,.competitionProject .project-address{
-	display: none;
-}
-/* 圆柱样式 */
-.cricleColumn-view{
-	position: relative;
-	width: 90rem;
-	height: 152rem;
-    cursor: pointer;
-}
-.cricleColumn-img{
-	width: 90rem;
-	height: 152rem;
-}
-.cricleColumn-text{
-	position: absolute;
-	bottom: 0rem;
-	left: 0rem;
-	width: 100%;
-	height: 37rem;
-	font-size: 14px;
-	font-family: DIN Alternate, DIN Alternate-Bold;
-	font-weight: 700;
-	text-align: center;
-	color: #ffdf80;
-	line-height: 14rem;
-}
-.cricleColumn1-view{
-	position: relative;
-	width: 82rem;
-	height: 152rem;
-    cursor: pointer;
-}
-.cricleColumn1-img{
-	width: 82rem;
-	height: 152rem;
-}
-.cricleColumn1-text{
-	position: absolute;
-	bottom: 14rem;
-	left: 0rem;
-	width: 100%;
-	font-size: 14px;
-	font-family: DIN Alternate, DIN Alternate-Bold;
-	font-weight: 700;
-	text-align: center;
-	color: #fff;
-	line-height: 20rem;
-}
-
-.poi-view{
-	position: relative;
-	width: max-content;
-	height: 30rem;
-	background: rgba(255,255,255,0.2);
-	border-radius: 15rem;
-	backdrop-filter: blur(30rem);
-    cursor: pointer;
-}
-.poi-view-radius{
-	width: 24rem;
-	height: 24rem;
-	line-height: 22rem;
-	background: rgba(118,188,255,0.50);
-	border: 1px solid #76bcff;
-	border-radius: 50%;
-	font-size: 12px;
-	font-family: Verdana, Verdana-Regular;
-	font-weight: 400;
-	text-align: center;
-	color: #ffffff;
-	margin-left: 4rem;
-}
-.poi-view-text{
-	font-size: 14px;
-	font-family: Verdana, Verdana-Regular;
-	font-weight: 400;
-	text-align: left;
-	color: #ffffff;
-	margin-left: 5rem;
-	margin-right: 10rem;
-}
-.poiUnSelected .poi-view{
-	background:unset;
-	backdrop-filter:unset;
-}
-.poiUnSelected .poi-view-text{
-	opacity: 0;
-}
-.trafficPoint-view{
-    width: 24rem;
-    height: 24rem;
-    background: rgba(255,255,255,0.00);
-    border: 1px solid var(--themeColor2);
-    border-radius: 50%;
-    font-size: 12px;
-    font-family: Verdana, Verdana-Regular;
-    font-weight: 400;
-    color: var(--themeColor2);
-    text-align: center;
-    line-height: 24rem;
-}
-
-.auto-height{
-	height: auto;
-}
 

src/assets/css/style.css

@@ -1,135 +1,3 @@
 div{
 	box-sizing: border-box;
 }
-.project-view{
-	position: absolute;
-	right: 0rem;
-	top: 0rem;
-	width: 690rem;
-	height: calc(100% - 50rem);
-	padding: 20rem 20rem 20rem 0;
-    transition: 0.3s;
-    transform: translateX(0rem);
-    z-index: 11 !important;
-}
-.project-view-content{
-    min-height: 240rem;
-	position: relative;
-	width: 100%;
-    height: calc(100% - 100rem);
-	border-radius: 10rem;
-	padding: 20rem;
-	backdrop-filter: blur(10.36rem);
-	color: azure;
-    margin-top: 20rem;
-}
-.project-view-content-scroll{
-    overflow:auto;
-}
-.competition-top{
-	color: #cccccc;
-}
-.competition-top-btnlist{
-	border-radius: 8rem;
-	border: #7FFFD4 1rem solid;
-	height: 30rem;
-	line-height: 30rem;
-	overflow: hidden;
-}
-.btn-item{
-	font-size: 13px;
-	padding: 0rem 10rem;
-	background-color: transparent;
-}
-.btn-item.active{
-	background-color: rgb(188,223,139);
-	color: white;
-}
-.competition-info{
-	margin-top: 60rem;
-}
-.info-item-text{
-	font-size: 24px;
-	color: rgb(188,223,139);
-}
-.chart-view{
-	position: relative;
-	margin-top: 20rem;
-	width: 100%;
-	height: 300rem;
-}
-.chart{
-	/* width: 100%; */
-	/* height: 100%; */
-    width: 570rem;
-    height: 300rem;
-}
-.change-echarts{
-	position: absolute;
-	right: 0rem;
-	top: 0rem;
-	height: 20rem;
-	line-height: 20rem;
-}
-.echarts-item{
-	position: relative;
-	color: #F0FFFF;
-	font-size: 12px;
-	margin-right: 20rem;
-	cursor: pointer;
-}
-
-.foot-view{
-    position: absolute;
-	bottom: 0rem;
-	width: 1400rem;
-	height: 40rem;
-    margin: 10rem 20rem;
-}
-
-.view-bg{
-	border-radius: 20rem;
-	padding: 20rem;;
-	box-shadow: 0rem 4rem 16rem 0rem rgba(255,177,136,0.30);
-	backdrop-filter: blur(10.36rem);
-	color: azure;
-}
-
-.point-circle{
-    width: 240rem;
-    height: 240rem;
-    border-radius: 50%;
-    background-color: #ffaa5199;
-    border: 1rem solid #ff7151;
-    align-items: center;
-    justify-content: center;
-}
-
-.point-img{
-    width:60rem;
-    height: 60rem;
-}
-.menceng{
-    position: absolute;
-    top:0;
-    bottom: 0;
-    left: 0;
-    right: 0;
-}
-
-.pointer{
-    cursor:pointer
-}
-.custom-content-marker{
-	position: relative;
-	width: 206px;
-	height: 206px;
-	/*border-radius: 50%;*/
-	/*border: var(--themeColor3) solid 1px;*/
-	/*background: var(--themeColor3_2);*/
-	box-sizing: border-box;
-}
-.custom-content-img{
-	width: 32px;
-	height: 32px;
-}

src/components/mynavbar/mynavbar.scss

@@ -21,7 +21,7 @@
 .nav-title {
   position: absolute;
   text-align: center;
-  max-width: 400rem;
+  max-width: 400px;
   /* overflow: hidden; */
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -31,15 +31,15 @@
   bottom: 0;
   margin: auto;
   color: #fff;
-  font-size: 32rem;
+  font-size: 32px;
   font-weight: bold;
 }
 .nav-capsule {
   position: absolute;
   display: flex;
   align-items: center;
-  /*margin-left: 30rem;*/
-  width: 180rem;
+  /*margin-left: 30px;*/
+  width: 180px;
   justify-content: space-between;
   height: 100%;
   z-index: 4;
@@ -61,12 +61,12 @@
   /*background-color: #2ab4ff;*/
 }
 .back-pre {
-  width: 24rem;
-  height: 24rem;
-  border-top: 4rem solid #fff;
-  border-left: 4rem solid #fff;
+  width: 24px;
+  height: 24px;
+  border-top: 4px solid #fff;
+  border-left: 4px solid #fff;
   transform: rotate(-45deg);
-  margin-left: 30rem;
+  margin-left: 30px;
 }
 .nav-padding {
   width: 100%;
@@ -74,8 +74,8 @@
   position: relative;
 }
 .icon_xiala{
-  width: 16rem;
-  height: 10rem;
+  width: 16px;
+  height: 10px;
   position: absolute;
   right: 0px;
   top: 50%;
@@ -83,22 +83,22 @@
 }
 .icon-gengduo1{
     transform: rotate(90deg);
-    font-size: 20rem;
+    font-size: 20px;
     color: #fff;
     display: inline-block;
 }
 .icon-weizhibai1{
-    font-size: 26rem;
+    font-size: 26px;
 }
 .noticeBtnContainer{
   position: absolute;
-  left: 70rem;
+  left: 70px;
 }
 .noticeBtn{
-  width: 140rem;
-  height:60rem;
+  width: 140px;
+  height:60px;
   background:rgba(255,255,255,0.3);
-  border-radius:30rem;
+  border-radius:30px;
 }
 .justContentCenter{
   display:flex;
@@ -108,59 +108,59 @@
 }
 .adver-name{
 	font-weight: 400;
-	font-size: 30rem;
+	font-size: 30px;
 	text-align: center;
 	color: #212121;
 }
 .adver-head{
-	font-size: 0rem;
-	margin-right: 20rem;
+	font-size: 0px;
+	margin-right: 20px;
 	position: relative;
 }
 .head-img{
-	width: 50rem;
-	height: 50rem;
+	width: 50px;
+	height: 50px;
 	border-radius: 50%;
 }
 .adver-online{
 	position: absolute;
-	width: 32rem;
-	height: 32rem;
-	right: -5rem;
-	bottom: -2rem;
+	width: 32px;
+	height: 32px;
+	right: -5px;
+	bottom: -2px;
 	box-sizing: border-box;
 	background: #75cf4a;
-	border: 4rem solid #fff;
+	border: 4px solid #fff;
 	border-radius: 50%;
 }
 .adver-tag{
-	width: 120rem;
-	height: 36rem;
-	border-radius: 18rem;
+	width: 120px;
+	height: 36px;
+	border-radius: 18px;
 	background: #3e87f7;
 	font-weight: 600;
-	font-size: 22rem;
+	font-size: 22px;
 	color: #fff;
 	box-sizing: border-box;
-	margin-left: 20rem;
+	margin-left: 20px;
 	justify-content: center;
 }
 .adver-status{
 	font-weight: 400;
-	font-size: 28rem;
-	letter-spacing: 0.08rem;
+	font-size: 28px;
+	letter-spacing: 0.08px;
 	text-align: left;
 	color: rgba(0, 0, 0, 0.3);
-	line-height: 28rem;
+	line-height: 28px;
 }
 
 
 /* 朋友页面头部样式 */
 .friend-tab{
-  width: 750rem;
+  width: 750px;
   height: 100%;
   text-align: center;
-  border-bottom: 1rem solid #ededed;
+  border-bottom: 1px solid #ededed;
   box-sizing: border-box;
 }
 .tab-area{
@@ -168,14 +168,14 @@
   align-items: center;
   justify-content: space-between;
   background: transparent;
-  width: 300rem;
+  width: 300px;
   height: 100%;
   margin: auto;
 }
 .tab-item{
   position: relative;
   font-family: "Verdana";
-  font-size: 30rem;
+  font-size: 30px;
   color: rgba(22, 23, 34,0.5);
   height: 100%;
   display: flex;
@@ -192,7 +192,7 @@
   bottom: 0;
   content: ' ';
   width: 100%;
-  height: 4rem;
+  height: 4px;
   background-color: #161722;
   left: 0;
 }

src/components/newBottomCom/viewCareful/viewCareful.html

@@ -16,7 +16,7 @@
 						</div>
 					</div>
 					<div class="item-slider" :class="{active:selectIndex==index}">
-						<el-slider style="margin:20rem 16rem" :disabled="overChange" v-model="carefulItem.area"
+						<el-slider class="slider-style" :disabled="overChange" v-model="carefulItem.area"
 							@change="sliderChange($event,index)" :step="0.1" :show-tooltip="false"
 							:min='carefulItem.minArea' :max='carefulItem.maxArea' ></el-slider>
 					</div>

src/components/newBottomCom/viewCareful/viewCareful.scss

@@ -7,13 +7,13 @@
 .grid{
 	display: grid;
 	grid-template-columns: repeat(2, 1fr);;
-	grid-row-gap: 20rem;
-	grid-column-gap:50rem;
+	grid-row-gap: 20px;
+	grid-column-gap:50px;
 }
 .careful-list{
 	width: 100%;
-	max-height:600rem;
-	margin-top:30rem;
+	max-height:600px;
+	margin-top:30px;
 }
 .item-top{
 	width: 100%;
@@ -24,28 +24,28 @@
 .careful-item .item-top {
 	font-family: "Verdana Bold";
 	font-weight: 700;
-	font-size: 28rem;
+	font-size: 28px;
 	color: #585858;
 	.index-view{
 		// font-family: "DINCondensed-Bold";
 		font-family: "Verdana";
-		margin-right:10rem;
+		margin-right:10px;
 	}
 	.name-view{
-		max-width:150rem;
-		margin-right:15rem;
+		max-width:150px;
+		margin-right:15px;
 	}
 	.percent-view{
 		font-family: "DINCondensed-Bold";
 		opacity: 0.3;
-		font-size:24rem;
+		font-size:24px;
 	}
 	
 	.area-view{
 		font-family: "DINCondensed-Bold";
 		font-weight: 700;
 		color: #8D8D8D;
-		font-size:26rem;
+		font-size:26px;
 	}
 }
 .item-top.active {
@@ -57,14 +57,17 @@
 
 .item-slider{
 	width: 100%;
+	.slider-style{
+		margin:20px 16px
+	}
 }
 .ai-btn{
-	width: 80rem;
-	height: 84rem;
-	border-radius: 8rem;
+	width: 80px;
+	height: 84px;
+	border-radius: 8px;
 	background-image:linear-gradient(124deg, rgba(245, 201, 82, 0.2) 0%, rgba(239, 149, 57, 0.2) 100%);
 	font-weight: 400;
-	font-size: 24rem;
+	font-size: 24px;
 	color: #f59d40;
 }
 
@@ -74,7 +77,7 @@
 	}
 	.el-slider__button{
 		background: #A5A5A5;
-		border: 2px solid #fff;
+		border: 4px solid #fff;
 	}
 }
 .active{
@@ -84,7 +87,7 @@
 		}
 		.el-slider__button{
 			background: #FF9B0A;
-			border: 2px solid #fff;
+			border: 4px solid #fff;
 		}
 	}
 }

src/components/newBottomCom/viewMask/viewMask.html

@@ -51,7 +51,7 @@
 		</div>
 		<!-- 点赞喜欢 -->
 		<div class="likeBtn columns" @click.stop="changeAIImg" :class="{like:checked}">
-			<div class="iconfont icon-qeuren" style="margin-bottom:10rem;font-size:30rem;"></div>
+			<div class="iconfont icon-qeuren"></div>
 			喜欢
 		</div>
 	</div>
@@ -93,10 +93,10 @@
 			</div> -->
 			<div class="btn-list rows rows-between" >
 				<div class="btn houseType rows justify-center up1" @click.stop="goback">
-					<div class="iconfont icon-huxingjianshang" style="margin-right:17rem;"></div>户型空间
+					<div class="iconfont icon-huxingjianshang style1"></div>户型空间
 				</div>
 				<div class="btn AiBtn rows justify-center up2" @click.stop="aiSubmit(1)">
-					<div class="iconfont icon-a-lujing35039" style="margin-right:17rem;"></div>{{aiImagesList && aiImagesList.length>0?'继续生成':'AI精软装'}}
+					<div class="iconfont icon-a-lujing35039 style1"></div>{{aiImagesList && aiImagesList.length>0?'继续生成':'AI精软装'}}
 				</div>
 			</div>
 		</div>

src/components/newBottomCom/viewMask/viewMask.scss

@@ -1,12 +1,12 @@
 .mask-view{
 	position: absolute;
-	bottom:0rem;
+	bottom:0px;
 	width:100vw; 
 	height:100vh;
 	box-sizing: border-box;
 	z-index: 12;
 	font-family: "Verdana Bold";
-	font-size: 0rem;
+	font-size: 0px;
 	background: transparent;
 	pointer-events: none;
 }
@@ -16,7 +16,7 @@
 .swiper{
 	position: relative;
 	width: 100%;
-	height:calc(100vh - 408rem);
+	height:calc(100vh - 408px);
 	z-index: 12;
 	pointer-events: auto;
 	/deep/.el-image__preview{
@@ -24,33 +24,33 @@
 	}
 }
 /deep/.el-carousel__container{
-	height:calc(100vh - 408rem);
+	height:calc(100vh - 408px);
 }
 .btn-view{
 	position: absolute;
-	bottom: 620rem;
-	left: 30rem;
-	width: 72rem;
+	bottom: 620px;
+	left: 30px;
+	width: 72px;
 	z-index: 13;
 	pointer-events: auto;
 	.change-angle{
 		position: relative;
-		width: 72rem;
-		height: 160rem;
-		border-radius: 36rem;
-		padding:20rem 10rem;
+		width: 72px;
+		height: 160px;
+		border-radius: 36px;
+		padding:20px 10px;
 		background: rgba(0, 0, 0, 0.5);
 		box-sizing: border-box;
 		font-family: "Verdana Bold";
 		font-weight: 700;
-		font-size: 24rem;
+		font-size: 24px;
 		color: #fff;
 		text-align: center;
 		justify-content:unset;
 		z-index: 13;
 		.camera{
-			width: 43.07rem;
-			height: 49.22rem;
+			width: 43.07px;
+			height: 49.22px;
 		}
 		pointer-events: auto;
 	}
@@ -63,70 +63,74 @@
 		align-items: center;
 		pointer-events: auto;
 		z-index:11;
-		width: 72rem;
-		height: 72rem;
+		width: 72px;
+		height: 72px;
 	}
 	.likeBtn{
-		width: 72rem;
-		height: 132rem;
-		border-radius: 36rem;
-		padding:30rem 10rem;
+		width: 72px;
+		height: 132px;
+		border-radius: 36px;
+		padding:30px 10px;
 		background: rgba(0, 0, 0, 0.5);
 		box-sizing: border-box;
 		font-family: "Verdana Bold";
 		font-weight: 700;
-		font-size: 24rem;
+		font-size: 24px;
 		color: #fff;
 		text-align: center;
 		justify-content:unset;
 		z-index: 13;
 		pointer-events: auto;
+		.icon-qeuren{
+			margin-bottom:10px;
+			font-size:30px;
+		}
 	}
 	.like{
 		background: rgba(249, 193, 102, 0.5);
 	}
 	.btn1{
-		margin-bottom:20rem;
+		margin-bottom:20px;
 	}
 	.compareIcon {
-		width: 42rem;
-		height: 44rem;
+		width: 42px;
+		height: 44px;
 	}
 	.down{
-		width: 40rem;
-		height: 39rem;
+		width: 40px;
+		height: 39px;
 	}
 }
 
 .layout-view{
 	position: absolute;
-	bottom:0rem;
-	left:0rem;
+	bottom:0px;
+	left:0px;
 	width: 100vw;
-	height: 600rem;
-	border-radius: 40rem 40rem 0 0;
+	height: 600px;
+	border-radius: 40px 40px 0 0;
 	background: #fff;
-	box-shadow: 0 -6rem 12rem rgba(0, 0, 0, 0.12);
+	box-shadow: 0 -6px 12px rgba(0, 0, 0, 0.12);
 	z-index: 15;
-	padding:0rem 60rem;
+	padding:0px 60px;
 	box-sizing: border-box;
 	pointer-events: auto;
 	.signscoll-block{
 		position: absolute;
-		width: 90rem;
-		height: 10rem;
-		border-radius: 5rem;
+		width: 90px;
+		height: 10px;
+		border-radius: 5px;
 		background: #707070;
 		opacity: 0.6;
-		top: 10rem;
-		left:330rem;
+		top: 10px;
+		left:330px;
 	}
 }
 .grid{
 	display: grid;
 	grid-template-columns: repeat(4, 1fr);;
-	grid-row-gap: 20rem;
-	grid-column-gap:50rem;
+	grid-row-gap: 20px;
+	grid-column-gap:50px;
 }
 .aiEdit {
 	position: relative;
@@ -134,52 +138,52 @@
 	display: flex;
 	flex-direction: column;
 	align-items: center;
-	margin-top:60rem;
+	margin-top:60px;
 	.aiStyleList {
 		width: 100%;
-		// height: 220rem;
+		// height: 220px;
 		/* background: #333; */
 		flex-shrink: 0;
 		// white-space: nowrap;
 
 		.scrollViewItem {
-			width: 120rem;
-			height: 168rem;
+			width: 120px;
+			height: 168px;
 			// display: inline-block;
-			// margin: 0rem 10rem;
+			// margin: 0px 10px;
 		}
 
 		.scrollViewItem:first-child {
-			// margin-left: 30rem;
+			// margin-left: 30px;
 		}
 
 		.scrollViewItem:last-child {
-			// margin-right: 30rem;
+			// margin-right: 30px;
 		}
 
 		.styleItem {
 			position: absolute;
-			width: 120rem;
+			width: 120px;
 			// height: 100%;
 			display: flex;
 			flex-direction: column;
 			align-items: center;
 			.styleIcon {
-				width: 120rem;
-				height: 120rem;
+				width: 120px;
+				height: 120px;
 				background: #5c5c5c;
-				border-radius: 12rem;
-				border: 2rem solid #fff;
+				border-radius: 12px;
+				border: 2px solid #fff;
 				box-sizing: border-box;
 				object-fit: cover;
 			}
 
 			.styleTitle {
-				margin-top: 8rem;
-				height:40rem;
+				margin-top: 8px;
+				height:40px;
 				font-family: "Verdana";
 				font-weight: 400;
-				font-size: 28rem;
+				font-size: 28px;
 				text-align: center;
 				color: #4e4e4e;
 			}
@@ -187,7 +191,7 @@
 
 		.styleItemSelected {
 			.styleIcon {
-				border: 2rem solid #ff9c38;
+				border: 2px solid #ff9c38;
 			}
 
 			.styleTitle {
@@ -206,43 +210,43 @@
 
 	.aiTool {
 		width: 100%;
-		height: 100rem;
+		height: 100px;
 		display: flex;
 		flex-direction: row;
 		align-items: center;
 		justify-content: center;
 		/* background: red; */
-		// margin: 0rem 30rem;
-		margin-top: 10rem;
-		padding: 0rem 30rem;
+		// margin: 0px 30px;
+		margin-top: 10px;
+		padding: 0px 30px;
 		box-sizing: border-box;
 		.changeBtn {
-			width: 320rem;
-			height: 100rem;
-			border-radius: 50rem;
+			width: 320px;
+			height: 100px;
+			border-radius: 50px;
 			background: rgba(255, 156, 56, 0.15);
-			margin-right: 30rem;
-			line-height: 100rem;
+			margin-right: 30px;
+			line-height: 100px;
 			text-align: center;
 			font-family: "DIN Alternate Bold";
 			font-weight: 700;
-			font-size: 32rem;
+			font-size: 32px;
 			color: #ff9f36;
 		}
 
 		.submitBtn {
-			width: 460rem;
-			border-radius: 50rem;
+			width: 460px;
+			border-radius: 50px;
 			background: rgba(255, 156, 56, 0.15);
 			text-align: center;
 			height: 100%;
-			line-height: 100rem;
+			line-height: 100px;
 			font-family: "DIN Alternate Bold";
 			font-weight: 700;
-			font-size: 28rem;
+			font-size: 28px;
 			color: #fff;
-			box-shadow: 0 6rem 20rem rgba(242, 152, 2, 0.2);
-			backdrop-filter: blur(40rem);
+			box-shadow: 0 6px 20px rgba(242, 152, 2, 0.2);
+			backdrop-filter: blur(40px);
 			background-color: rgba(255, 255, 255, 0.15);
 			background-image:linear-gradient(124deg, rgba(245, 201, 82, 1) 0%, rgba(239, 149, 57, 1) 100%);
 		}
@@ -251,18 +255,18 @@
 			background-image: unset;
 		}
 		.continue{
-			width: 330rem;
+			width: 330px;
 			background: #fab060;
 		}
 		.right-icon{
-			width: 34rem;
-			height: 34rem;
-			margin-right:10rem;
+			width: 34px;
+			height: 34px;
+			margin-right:10px;
 		}
 		.magic-icon{
-			width: 40.6rem;
-			height: 40.56rem;
-			margin-right:10rem;
+			width: 40.6px;
+			height: 40.56px;
+			margin-right:10px;
 		}
 	}
 }
@@ -270,15 +274,15 @@
 	position: relative;
 	width: 100%;
 	box-sizing: border-box;
-	margin-top:26rem;
+	margin-top:26px;
 	.btn{
-		height: 100rem;
-		border-radius: 50rem;
+		height: 100px;
+		border-radius: 50px;
 		backdrop-filter:blur(40px);
 		--webkit-backdrop-filter: blur(40px);
 		font-family: "Verdana Bold";
 		font-weight: 700;
-		font-size: 32rem;
+		font-size: 32px;
 		color: #272727;
 		box-sizing: border-box;
 	}
@@ -292,49 +296,52 @@
 	}
 	
 	.houseType{
-		width: 320rem;
-		margin-left: -14rem;
-		box-shadow: 0 6rem 20rem #f2980233;
+		width: 320px;
+		margin-left: -14px;
+		box-shadow: 0 6px 20px #f2980233;
+	}
+	.style1{
+		margin-right:17px;
 	}
 	.AiBtn{
-		width: 320rem;
-		margin-right: -14rem;
-		box-shadow: 0 6rem 20rem #f2980233;
+		width: 320px;
+		margin-right: -14px;
+		box-shadow: 0 6px 20px #f2980233;
 	}
 }
 .connect-view{
 	position: absolute;
-	width: 139rem;
-	height: 184rem;
+	width: 139px;
+	height: 184px;
 	background: transparent;
-	bottom: 605rem;
-	right:24rem; 
+	bottom: 605px;
+	right:24px; 
 	box-sizing: border-box;
 	z-index: 13;
 	pointer-events: auto;
 	.defaultHead{
-		width: 139rem;
-		height: 184rem;
+		width: 139px;
+		height: 184px;
 	}
 }
 .indicator-view{
 	position: absolute;
 	z-index: 12;
-	bottom: 620rem;
+	bottom: 620px;
 	left:50%;
 	transform: translateX(-50%);
 	.indicator-item{
-		width: 12rem;
-		height: 12rem;
+		width: 12px;
+		height: 12px;
 		background: #fff;
 		opacity: 0.52;
-		margin-right:6rem;
+		margin-right:6px;
 		border-radius: 50%;
 		&.active{
 			opacity:1;
 		}
 		&:last-child{
-			margin-right:0rem;
+			margin-right:0px;
 		}
 	}
 }
@@ -342,17 +349,17 @@
 	position: absolute;
 	width: 100%;
 	z-index: 12;
-	bottom: 640rem;
+	bottom: 640px;
 	display: flex;
 	align-items: center;
 	justify-content: center;
 	z-index: 25;
 	color:#fff;
-	font-size:28rem;
+	font-size:28px;
 	.loading_img {
-		width: 40rem;
-		height: 40rem;
-		margin-right: 10rem;
+		width: 40px;
+		height: 40px;
+		margin-right: 10px;
 
 		-webkit-animation: rotation 1s linear infinite;
 		animation: rotation 1s linear infinite;
@@ -369,13 +376,13 @@
 	}
 
 	.loading_text {
-		height: 40rem;
+		height: 40px;
 	}
 
 }
 .loadData{
-    min-width:110px;
-    height:110px;
+    min-width:200px;
+    height:150px;
     position: absolute;
     left: 50%;
     top:50%;
@@ -388,7 +395,7 @@
     flex-direction: column;
     align-items: center;
     justify-content:center;
-	font-size:18rem;
+	font-size:18px;
     img{
         width:90px;
 		margin-top: 10px;

src/components/newBottomCom/viewMask/viewMask.vue

@@ -137,10 +137,10 @@
 			this.screenWidth = window.screen.width;
 			this.screenHeight = window.screen.height;
 			if(window.innerWidth && window.screen.width){
-				screenWidth = Math.min(window.innerWidth,window.screen.width)
+				this.screenWidth = Math.min(window.innerWidth,window.screen.width)
 			}
 			if(window.innerHeight && window.screen.height){
-				screenHeight = Math.min(window.innerHeight,window.screen.height)
+				this.screenHeight = Math.min(window.innerHeight,window.screen.height)
 			}
 		},
 		// 页面被展示时执行
@@ -539,6 +539,7 @@
 					this.showToast("渲染失败，请重试");
 					this.aiFlag = false;
 					this.aiImage = "";
+					this.myloading = false;
 					return false;
 				}
 				let session_hash = data.session_hash;
@@ -557,6 +558,7 @@
 					this.showToast("渲染失败，请重试");
 					this.aiFlag = false;
 					this.aiImage = "";
+					this.myloading = false;
 					return false;
 				}
 				data.model = "t2iadapter_seg_sd14v1 [6387afb5]";
@@ -573,6 +575,7 @@
 					this.showToast("渲染失败，请重试");
 					this.aiFlag = false;
 					this.aiImage = "";
+					this.myloading = false;
 					return false;
 				}
 				const prompt = this.styleList[this.curStyleIndex].prompt;

src/components/newBottomCom/viewShell/viewShell.html

@@ -1,7 +1,7 @@
 <!-- 弹出层的壳子 -->
-<div class="shell-view" :class="pageType==2?'shell-view2':''" :style="{'height':shellHeight}">
+<div class="shell-view" :class="styleType==2?'shell-view2':''">
 	<!-- 楼层 -->
-	<div class="floor-view" v-if="pageType==1 && floorList&&floorList.length>1" :style="{'top':'calc( -' + floorList.length*60 + 'rem - 30rem)'}">
+	<div class="floor-view" v-if="pageType==1 && floorList&&floorList.length>1">
 		<div class="floor-item rows justify-center" :class="floorId==floor.id?'active':''" 
 			v-for="(floor,index) in floorList" :key="index" @click="floorChange(floor)">
 			{{floor.houseFloor?floor.houseFloor+'F':''}}

src/components/newBottomCom/viewShell/viewShell.scss

@@ -3,71 +3,70 @@
 }
 .shell-view{
 	position: fixed;
-	left: 0rem;
-	bottom: 0rem;
+	left: 0px;
+	bottom: 0px;
 	width: 100vw;
-	height: 200rem;
-	border-radius: 40rem 40rem 0 0;
+	height: 200px;
+	border-radius: 40px 40px 0 0;
 	background: #fff;
-	box-shadow: 0 -6rem 12rem #0000001f;
+	box-shadow: 0 -6px 12px #0000001f;
 	box-sizing: border-box;
 	z-index: 315;
-	padding:0rem 40rem;
-	padding-top:30rem;
-	padding-bottom:60rem;
+	padding:0px 40px;
+	padding-top:30px;
+	padding-bottom:60px;
 	transition: height 1s;
 }
 .shell-view2{
-	height: 448rem;
-	padding-left:0rem;
-	padding-right:0rem;
+	height: 800px;
 }
 .shell-signscoll{
 	position: absolute;
-	top:-50rem;
-	left:275rem;
-	width:200rem;
-	height: 100rem;
+	top:-50px;
+	left:275px;
+	width:200px;
+	height: 100px;
 	z-index: 120;
-	/* padding-top:50rem; */
+	/* padding-top:50px; */
 	box-sizing: border-box;
 }
 .signscoll-block{
 	position: absolute;
-	width: 90rem;
-	height: 10rem;
-	border-radius: 5rem;
+	width: 90px;
+	height: 10px;
+	border-radius: 5px;
 	background: #707070;
 	opacity: 0.6;
-	bottom: 30rem;
+	bottom: 30px;
 }
 .floor-view{
 	position: absolute;
-	left:30rem;
-	width: 72rem;
-	border-radius: 12rem;
+	transform: translateY(-150%);
+	left:30px;
+	width: 72px;
+	border-radius: 12px;
 	background: rgba(0, 0, 0, 0.4);
 	overflow: hidden;
 }
 .floor-item{
-	height: 60rem;
+	height: 60px;
 	color: #fff;
-	font-size: 28rem;
+	font-size: 28px;
 }
 .floor-item.active{
 	color: #faa040;
 	background: #fff;
-	border-radius: 12rem;
+	border-radius: 12px;
 }
 .tips-view{
 	position: absolute;
 	left:50%;
 	transform:translateX(-50%);
-	top:-50rem;
+	top:-50px;
 	font-family: "Verdana";
 	font-weight: 400;
-	font-size: 26rem;
-	line-height: 30rem;
+	font-size: 26px;
+	line-height: 30px;
 	text-align: center;
 	color: #2b2b2b;
 	opacity: 0.5;
@@ -76,26 +75,26 @@
 
 .zoom-view{
 	position: fixed;
-	top:42rem;
-	right:30rem;
-	width: 52rem;
-	height: 52rem;
+	top:42px;
+	right:30px;
+	width: 52px;
+	height: 52px;
 }
 .zoom-view .icon {
-	width: 52rem;
-	height: 52rem;
+	width: 52px;
+	height: 52px;
 }
 .connect-view{
 	position: absolute;
-	width: 139rem;
-	height: 184rem;
+	width: 139px;
+	height: 184px;
 	background: transparent;
-	top:-190rem;
-	right:24rem; 
+	top:-190px;
+	right:24px; 
 	box-sizing: border-box;
 	.defaultHead{
-		width: 139rem;
-		height: 184rem;
+		width: 139px;
+		height: 184px;
 	}
 }
 button{

src/components/newBottomCom/viewShell/viewShell.vue

@@ -25,7 +25,7 @@
 					}
 				],
 				floorId:0,//楼层选中的id
-				shellHeight:'200rem',
+				shellHeight:'200px',
 				isShare: false,
 				shareVideoItem:null,
 				styleType:1,	//当前底部组件的状态
@@ -85,13 +85,13 @@
 							return false;
 						}
 						if(newVal==1){//变更为初始状态
-							this.shellHeight = '200rem';
+							this.shellHeight = '200px';
 							_endHeight = 200;
 						}else if(newVal==2){//变更为展开状态
-							this.shellHeight = '800rem';
+							this.shellHeight = '800px';
 							_endHeight = 800;
 						}else if(newVal==3){//变更为最小状态
-							this.shellHeight = '200rem';
+							this.shellHeight = '200px';
 							_endHeight = 200;
 						}
 						// let currPage = getCurrentPages()[getCurrentPages().length - 1] ? getCurrentPages()[getCurrentPages().length - 1].$vm : null;
@@ -118,10 +118,7 @@
 		},
 		// mixins: [touchHandle],
 		async mounted() {
-			// await this.getCityHouseList();
-			if(this.pageType==2){
-				this.shellHeight = '448rem';
-			}			
+			// await this.getCityHouseList();		
 			console.warn("***viewShell***",this.houseList)
 		},
 		// 页面被展示时执行

src/components/newBottomCom/viewStyle/viewStyle.html

@@ -13,8 +13,8 @@
 		</scroll-view>
 		<div class="aiTool">
 			<div class="changeBtn" v-if="showAIFlag" @click="changeAIImg">
-				<span v-if="checked==false" class="iconfont icon-xingzhuang-tuoyuanxing" style="margin-right:10rpx;font-size:36rpx;"></span>
-				<span v-else class="iconfont icon-ziyuan" style="margin-right:10rpx;font-size:36rpx;color:#FAB060"></span>
+				<span v-if="checked==false" class="iconfont icon-xingzhuang-tuoyuanxing" style="margin-right:10px;font-size:36px;"></span>
+				<span v-else class="iconfont icon-ziyuan" style="margin-right:10px;font-size:36px;color:#FAB060"></span>
 				<!-- <img class="right-icon" src="https://dm.static.elab-plus.com/miniProgram/iconfont/right-icon.png" mode="widthFix"/> -->
 				{{checked?'已选定图片':'选定图片'}}
 			</div>

src/components/newBottomCom/viewStyle/viewStyle.scss

@@ -1,5 +1,5 @@
 .layout-view{
-	margin-top:30rem;
+	margin-top:30px;
 }
 
 .aiEdit {
@@ -11,29 +11,29 @@
 
 	.aiStyleList {
 		width: 100%;
-		height: 240rem;
+		height: 240px;
 		/* background: #333; */
 		flex-shrink: 0;
 		white-space: nowrap;
 
 		.scrollViewItem {
-			width: 152rem;
+			width: 152px;
 			height: 100%;
 			display: inline-block;
-			margin: 0rem 10rem;
+			margin: 0px 10px;
 		}
 
 		.scrollViewItem:first-child {
-			margin-left: 30rem;
+			margin-left: 30px;
 		}
 
 		.scrollViewItem:last-child {
-			margin-right: 30rem;
+			margin-right: 30px;
 		}
 
 		.styleItem {
 			position: absolute;
-			width: 144rem;
+			width: 144px;
 			height: 100%;
 			display: flex;
 			flex-direction: column;
@@ -42,18 +42,18 @@
 
 			/* background: red; */
 			.styleIcon {
-				width: 144rem;
-				height: 144rem;
+				width: 144px;
+				height: 144px;
 				background: #5c5c5c;
-				border-radius: 12rem;
-				border: 2rem solid #fff;
+				border-radius: 12px;
+				border: 2px solid #fff;
 			}
 
 			.styleTitle {
-				margin-top: 20rem;
+				margin-top: 20px;
 				font-family: "Verdana";
 				font-weight: 400;
-				font-size: 28rem;
+				font-size: 28px;
 				text-align: center;
 				color: #4e4e4e;
 			}
@@ -61,7 +61,7 @@
 
 		.styleItemSelected {
 			.styleIcon {
-				border: 2rem solid #ff9c38;
+				border: 2px solid #ff9c38;
 			}
 
 			.styleTitle {
@@ -80,59 +80,59 @@
 
 	.aiTool {
 		width: 100%;
-		height: 100rem;
+		height: 100px;
 		display: flex;
 		flex-direction: row;
 		align-items: center;
 		justify-content: center;
 		/* background: red; */
-		// margin: 0rem 30rem;
-		margin-top: 10rem;
-		padding: 0rem 30rem;
+		// margin: 0px 30px;
+		margin-top: 10px;
+		padding: 0px 30px;
 		box-sizing: border-box;
 		.changeBtn {
-			width: 320rem;
-			height: 100rem;
-			border-radius: 50rem;
+			width: 320px;
+			height: 100px;
+			border-radius: 50px;
 			background: rgba(255, 156, 56, 0.15);
-			margin-right: 30rem;
-			line-height: 100rem;
+			margin-right: 30px;
+			line-height: 100px;
 			text-align: center;
 			font-family: "DIN Alternate Bold";
 			font-weight: 700;
-			font-size: 32rem;
+			font-size: 32px;
 			color: #ff9f36;
 		}
 
 		.submitBtn {
-			width: 460rem;
-			border-radius: 50rem;
+			width: 460px;
+			border-radius: 50px;
 			background: rgba(255, 156, 56, 0.15);
 			text-align: center;
 			height: 100%;
-			line-height: 100rem;
+			line-height: 100px;
 			font-family: "DIN Alternate Bold";
 			font-weight: 700;
-			font-size: 28rem;
+			font-size: 28px;
 			color: #fff;
-			box-shadow: 0 6rem 20rem rgba(242, 152, 2, 0.2);
-			backdrop-filter: blur(40rem);
+			box-shadow: 0 6px 20px rgba(242, 152, 2, 0.2);
+			backdrop-filter: blur(40px);
 			background-color: rgba(255, 255, 255, 0.15);
 			background-image:linear-gradient(124deg, rgba(245, 201, 82, 1) 0%, rgba(239, 149, 57, 1) 100%);
 		}
 		.continue{
-			width: 330rem;
+			width: 330px;
 			background: #fab060;
 		}
 		.right-icon{
-			width: 34rem;
-			height: 34rem;
-			margin-right:10rem;
+			width: 34px;
+			height: 34px;
+			margin-right:10px;
 		}
 		.magic-icon{
-			width: 40.6rem;
-			height: 40.56rem;
-			margin-right:10rem;
+			width: 40.6px;
+			height: 40.56px;
+			margin-right:10px;
 		}
 	}
 }

src/components/newBottomCom/viewlayout/viewlayout.html

@@ -12,10 +12,10 @@
 		</div>
 		<div class="btn-list rows rows-between" v-else-if="styleType==2">
 			<div class="btn houseType rows justify-center up2" >
-				<div class="iconfont icon-huxingjianshang" style="margin-right:17rem;"></div>户型空间
+				<div class="iconfont icon-huxingjianshang style1"></div>户型空间
 			</div>
 			<div class="btn AiBtn rows justify-center up1" @click="goRoam">
-				<div class="iconfont icon-a-lujing35039" style="margin-right:17rem;"></div>AI精软装
+				<div class="iconfont icon-a-lujing35039 style1"></div>AI精软装
 			</div>
 		</div>
 	</div>

src/components/newBottomCom/viewlayout/viewlayout.css

@@ -1,9 +1,9 @@
 .layout-view{
 	position: fixed;
-	left: 30rem;
-	bottom: 0rem;
-	padding-bottom: 60rem;
-	width: 690rem;
+	left: 30px;
+	bottom: 0px;
+	padding-bottom: 60px;
+	width: 690px;
 	z-index: 15;
 	background-color: rgba(255, 255, 255, 1);
 }
@@ -14,31 +14,31 @@
 	z-index: 12;
 }
 .seed-item{
-	margin-right:90rem;
+	margin-right:90px;
 }
 .seed-item:last-child{
-	margin-right:0rem;
+	margin-right:0px;
 }
 .item-text{
 	font-family: "Verdana Bold";
 	font-weight: 700;
-	font-size: 34rem;
+	font-size: 34px;
 	text-align: center;
 	color: #1c1c1c;
-	width: 95rem;
-	/* height: 80rem; */
-	margin-bottom:10rem;
+	width: 95px;
+	/* height: 80px; */
+	margin-bottom:10px;
 }
 .item-select{
-	width: 50rem;
-	height: 12rem;
-	border-radius: 6rem;
+	width: 50px;
+	height: 12px;
+	border-radius: 6px;
 	background: #ffa040;
 }
 .item-set{
 	font-family: "Verdana";
 	font-weight: 400;
-	font-size: 24rem;
+	font-size: 24px;
 	text-align: left;
 	color: #faa040;
 }
@@ -46,22 +46,22 @@
 	position: relative;
 	width: 100%;
 	box-sizing: border-box;
-	margin-top:26rem;
+	margin-top:26px;
 }
 .btn{
-	height: 100rem;
-	border-radius: 50rem;
+	height: 100px;
+	border-radius: 50px;
 	backdrop-filter:blur(40px);
 	--webkit-backdrop-filter: blur(40px);
 	font-family: "Verdana Bold";
 	font-weight: 700;
-	font-size: 32rem;
+	font-size: 32px;
 	color: #272727;
 	box-sizing: border-box;
 }
 .up{
-	width: 690rem;
-	box-shadow: 0 6rem 20rem #f2980233;
+	width: 690px;
+	box-shadow: 0 6px 20px #f2980233;
 }
 .up1{
 	color: rgba(245, 145, 39, 1);
@@ -73,10 +73,13 @@
 }
 
 .houseType{
-	width: 320rem;
-	box-shadow: 0 6rem 20rem #f2980233;
+	width: 320px;
+	box-shadow: 0 6px 20px #f2980233;
+}
+.style1{
+	margin-right:17px;
 }
 .AiBtn{
-	width: 320rem;
-	box-shadow: 0 6rem 20rem #f2980233;
+	width: 320px;
+	box-shadow: 0 6px 20px #f2980233;
 }

src/components/newBottomCom/viewlayout/viewlayout.vue

@@ -524,7 +524,7 @@
 		}
 	}
 </script>
-<style lang="css" scoped>
-	@import "./viewlayout.css";
+<style lang="scss" scoped>
+	@import "./viewlayout.scss";
 	/* @import "@/common/css/common.css"; */
 </style>

src/main.js

@@ -18,6 +18,7 @@ import "@/assets/font/iconfont.css"; //引用公共icon库
 import {message} from "@/utils/resetMessage";
 
 import mynavbar from '@/components/mynavbar/mynavbar.vue'
+import 'amfe-flexible'
 // import checkPermission from "@/utils/permission";
 
 Vue.use(ElementUI); //导入ele-ui

src/pages/loginView/loginView.scss

@@ -22,22 +22,22 @@
   margin-top: 7%;
 }
 .img_logo_rihgt{
-    width: 190rem;
-height: 87rem;
-margin-left: 25rem;
+    width: 190px;
+	height: 87px;
+	margin-left: 25px;
 }
 .img_logo {
-  width: 66rem;
-  height: 74rem;
+  width: 66px;
+  height: 74px;
 }
 .txt_logo {
-  font-size: 46rem;
+  font-size: 46px;
   font-family: FontName, FontName-Regular;
   font-weight: 400;
   text-align: left;
   color: #ffffff;
-  line-height: 50rem;
-  margin-left: 30rem;
+  line-height: 50px;
+  margin-left: 30px;
   font-style: italic;
 }
 .logo_desc {
@@ -47,45 +47,45 @@ margin-left: 25rem;
   font-weight: 700;
   text-align: center;
   color: #ffffff;
-  margin-top: 31rem;
+  margin-top: 31px;
 }
 .logo_info {
-  width: 300rem;
-  height: 96rem;
+  width: 300px;
+  height: 96px;
   background: #ffffff;
-  border-radius: 10rem;
-  margin-top: 37rem;
+  border-radius: 10px;
+  margin-top: 37px;
 }
 .login_name {
   width: 100%;
-  height: 45rem;
+  height: 45px;
   font-size: 15px;
-  padding-left: 20rem;
+  padding-left: 20px;
   box-sizing: border-box;
-  border-radius: 10rem;
+  border-radius: 10px;
   border: transparent;
    outline: transparent;
 }
 .line {
-  width: 265rem;
-  height: 1rem;
+  width: 265px;
+  height: 1px;
   opacity: 0.1;
   background: #707070;
 }
 .verification_info {
   width: 100%;
-  height: 45rem;
+  height: 45px;
   font-size: 15px;
-  padding-left: 20rem;
+  padding-left: 20px;
   box-sizing: border-box;
   display: flex;
   align-items: center;
 }
 .verification {
   box-sizing: border-box;
-  border-radius: 10rem;
+  border-radius: 10px;
   border: transparent;
-  height: 45rem;
+  height: 45px;
   outline: transparent;
   width: 40%;
   padding: unset;
@@ -101,17 +101,17 @@ margin-left: 25rem;
     display: block;
 }
 .btn_login {
-  width: 300rem;
-  height: 46rem;
-  line-height: 46rem;
+  width: 300px;
+  height: 46px;
+  line-height: 46px;
   background: #ef863f;
-  border-radius: 10rem;
+  border-radius: 10px;
   font-size: 15px;
   font-family: Verdana, Verdana-Bold;
   font-weight: 700;
   text-align: center;
   color: #ffffff;
-  margin-top: 10rem;
+  margin-top: 10px;
   cursor: pointer;
 }
 .login_fill {
@@ -119,7 +119,7 @@ margin-left: 25rem;
 }
 .login_notice {
   width: 40%;
-  margin-bottom: 40rem;
+  margin-bottom: 40px;
 }
 .login_private {
   font-size: 12px;
@@ -127,7 +127,7 @@ margin-left: 25rem;
   font-weight: 400;
   text-align: center;
   color: #ffffff;
-  margin-bottom: 40rem;
+  margin-bottom: 40px;
 }
 .login_item_notice {
   display: flex;
@@ -135,7 +135,7 @@ margin-left: 25rem;
   align-items: center;
 }
 .img_notice {
-  width: 33rem;
+  width: 33px;
 }
 
 .txt_notice {
@@ -144,11 +144,11 @@ margin-left: 25rem;
   font-weight: 400;
   text-align: left;
   color: #ffffff;
-  margin-left: 10rem;
+  margin-left: 10px;
 }
 .img_elab {
-  width: 52rem;
-  height: 20rem;
+  width: 52px;
+  height: 20px;
 }
 .image--not-loaded{
     /* fix ios 缺少重绘的问题，添加无意义的transform强制触发重绘 */

src/pages/webgl_rxdz/webgl_rxdz.html

@@ -4,10 +4,10 @@
 	<div class="submit-btn" @click="submitHouse" v-if="styleType==1">提交</div>
 	<div class="area-view">
 		<div>总面积：{{layoutArea}}<span style="font-weight: 700;">㎡</span></div>
-		<div class="rows" style="margin-top:10rem;">
+		<div class="rows style1">
 			<div v-if="changeArea" class="reduce">
 				<div>{{changeArea < 0 ? '减少':'增加'}}</div>
-				<div style="font-weight: 700;font-size: 28rem;">{{Math.abs(changeArea)}}<span style="font-size: 24rem;">㎡</span></div>
+				<div class="style2" >{{Math.abs(changeArea)}}<span class="style3">㎡</span></div>
 			</div>
 			<div>
 				<div>初始面积：{{fixedArea}}<span style="font-weight: 700;">㎡</span></div>

src/pages/webgl_rxdz/webgl_rxdz.scss

@@ -39,7 +39,7 @@
 canvas:focus {
   outline:none;
 }
-canvas { width:100vw; height:calc(100vh - 200rem);z-index: 10; }
+canvas { width:100vw; height:calc(100vh - 200px);z-index: 10; }
 
 #canvas_webgl{
 	/* background: url(resources/images/daikanyama.jpg) no-repeat center center; */
@@ -52,29 +52,39 @@ canvas { width:100vw; height:calc(100vh - 200rem);z-index: 10; }
 	width: 100vw;
 	z-index: -1;
 	position: absolute;
-	left:0rem;
+	left:0px;
 }
 .area-view{
 	position: absolute;
-	top:10rem;
-	left:30rem;
+	top:10px;
+	left:30px;
 	width:100%;
-	font-size: 24rem;
+	font-size: 24px;
 	font-family: "Verdana";
 	font-weight: 400;
 	z-index: 301;
+	.style1{
+		margin-top:10px;
+	}
+	.style2{
+		font-weight: 700;
+		font-size: 28px;
+	}
+	.style3{
+		font-size: 24px;
+	}
 	span{
-		font-size: 28rem;
+		font-size: 28px;
 	}
 	.reduce{
-		// width: 92rem;
-		height: 72rem;
-		border-radius: 12rem;
+		// width: 92px;
+		height: 72px;
+		border-radius: 12px;
 		color: #fa9f40;
 		background: rgba(250, 159, 64, 0.12);
-		font-size: 24rem;
-		margin-right:10rem;
-		padding:4rem 10rem;
+		font-size: 24px;
+		margin-right:10px;
+		padding:4px 10px;
 	}
 }
 .tran{
@@ -83,8 +93,8 @@ canvas { width:100vw; height:calc(100vh - 200rem);z-index: 10; }
 }
 .voice-mask{
 	position: fixed;
-	left:0rem;
-	top:0rem;
+	left:0px;
+	top:0px;
 	width: 100vw;
 	height:100vh;
 	z-index: 11;
@@ -92,11 +102,11 @@ canvas { width:100vw; height:calc(100vh - 200rem);z-index: 10; }
 }
 // .btn{
 // 	position:absolute;
-// 	width:300rem;
-// 	height:132rem;
-// 	bottom:60rem;
-// 	right:30rem;
-// 	border-radius: 10rem;
+// 	width:300px;
+// 	height:132px;
+// 	bottom:60px;
+// 	right:30px;
+// 	border-radius: 10px;
 // 	opacity:1;
 // 	z-index:10000;
 // 	color:red;
@@ -109,11 +119,11 @@ canvas { width:100vw; height:calc(100vh - 200rem);z-index: 10; }
 
 // .changeSizebtn {
 // 	position:absolute;
-// 	width:300rem;
-// 	height:132rem;
-// 	bottom:60rem;
-// 	left:30rem;
-// 	border-radius: 10rem;
+// 	width:300px;
+// 	height:132px;
+// 	bottom:60px;
+// 	left:30px;
+// 	border-radius: 10px;
 // 	opacity:1;
 // 	z-index:10000;
 // 	color:red;
@@ -137,35 +147,35 @@ canvas { width:100vw; height:calc(100vh - 200rem);z-index: 10; }
 	user-select: none;  
 	z-index: 12;
 	text-align: center;
-	border-radius: 5rem;
+	border-radius: 5px;
 }
 .word{
 	font-family: "Verdana";
 	font-weight: 400;
-	height: 40rem;
-	line-height: 40rem;
-	padding:0rem 10rem;
-	border-radius: 20rem;
+	height: 40px;
+	line-height: 40px;
+	padding:0px 10px;
+	border-radius: 20px;
 	background: #fff;
-	font-size:26rem;
+	font-size:26px;
 	color: #1d1d1d;
 }
 .number-view{
-	width: 30rem;
-	height: 30rem;
-	line-height: 30rem;
+	width: 30px;
+	height: 30px;
+	line-height: 30px;
 	background: #fff;
 	color: #121212;
 	font-weight: 700;
-	font-size: 28rem;
+	font-size: 28px;
 	font-family: "DIN Alternate Bold";
-	border-radius: 30rem;
+	border-radius: 30px;
 }
 .number-more{
-	width: 40rem;
-	height: 40rem;
-	line-height: 40rem;
-	border-radius: 30rem;
+	width: 40px;
+	height: 40px;
+	line-height: 40px;
+	border-radius: 30px;
 }
 .active{
 	background: #faad5c;
@@ -173,30 +183,30 @@ canvas { width:100vw; height:calc(100vh - 200rem);z-index: 10; }
 }
 .submit-btn{
 	position: absolute;
-	top:42rem;
-	right:20rem;
-	width: 140rem;
-	height: 64rem;
-	border-radius: 32rem;
-	backdrop-filter: blur(40rem);
+	top:42px;
+	right:20px;
+	width: 140px;
+	height: 64px;
+	border-radius: 32px;
+	backdrop-filter: blur(40px);
 	background-color: rgba(255, 156, 56, 1);
 	font-family: "Verdana Bold";
 	font-weight: 700;
-	font-size: 28rem;
+	font-size: 28px;
 	color: #fff;
 	text-align:center;
-	line-height:64rem;
+	line-height:64px;
 	z-index: 302;
 }
 .submit-btn1{
-	left:20rem;
+	left:20px;
 }
 .voice-view{
-	width: 614rem;
-	height: 312rem;
-	border-radius: 40rem;
+	width: 614px;
+	height: 312px;
+	border-radius: 40px;
 	background: #fff;
-	box-shadow: 0 -6rem 12rem #0000001f;
+	box-shadow: 0 -6px 12px #0000001f;
 	position: absolute;
 	left:50%;
 	top:50%;
@@ -204,11 +214,11 @@ canvas { width:100vw; height:calc(100vh - 200rem);z-index: 10; }
 	text-align:center;
 }
 .voice-tips{
-	font-size: 28rem;
+	font-size: 28px;
 	color: rgba(36, 36, 36, 0.51);
-	margin-top:12rem;
+	margin-top:12px;
 }
 .voice-gif{
 	width: 100%;
-	margin-top:56rem;
+	margin-top:56px;
 }

src/pages/webgl_rxdz/webgl_rxdz.vue

@@ -468,7 +468,7 @@
 			}
 			//高度持续变化处理 time 动画持续时间 单位秒
 			function gradientResize (time,startHeight,endHeight) {
-				let _timeStep = 20;//单位 毫秒
+				// let _timeStep = 20;//单位 毫秒
 				// let unit = screenWidth / 750;//单位rpm 对应 px 的值
 				// that.canvasHeight = screenHeight - (200 * unit) + (20 * unit);
 				
@@ -477,8 +477,8 @@
 				let _jisua = that.canvasHeight;
 				let lastHeight = _jisua + (_height * unit);//动画结束时的高度值； 单位 px
 				that.canvasHeight = lastHeight;//触发css动画
-				let step = (_height * unit) / (time*1000 / _timeStep);//真实大小 单位px
-				console.warn("***gradientResize***",step,lastHeight,_jisua,startHeight,endHeight)
+				// let step = (_height * unit) / (time*1000 / _timeStep);//真实大小 单位px
+				console.warn("***gradientResize***",lastHeight,_jisua,startHeight,endHeight)
 
 				// that.showLables = false;
 				// let canvas_webgl = document.getElementById('canvas_webgl');

src/pages/webgl_rxdz_customize/webgl_rxdz_customize.html

@@ -114,7 +114,7 @@
 				    加企微 · 定制服务
 				</div>
 				<div class="bottom-btn btn-share rows justify-center" @click="optionChange(true)">
-					<i class="iconfont icon-Shared" style="color: #ffffff;font-size:32rem;margin-right:20rem;"></i>
+					<i class="iconfont icon-Shared"></i>
 				    <!-- 立即分享 -->
 					去首页
 				</div>

src/pages/webgl_rxdz_customize/webgl_rxdz_customize.scss

@@ -4,11 +4,11 @@ page {
 }
 
 .font40{
-    font-size: 40rem;
+    font-size: 40px;
     // color: #fff;
 }
 .font52{
-    font-size: 52rem;
+    font-size: 52px;
 	font-weight: 700;
 }
 .pointerEvents{
@@ -26,12 +26,12 @@ page {
     .picArea{
         position: relative;
 		width: 100%;
-		height:1100rem;
+		height:1100px;
         .master-pic{
             position: relative;
 			width: 100%;
-			height:930rem;
-            // padding: 10rem;
+			height:930px;
+            // padding: 10px;
             box-sizing: border-box;
             // background-color: #171717;
 			.master-pic-swiper{
@@ -46,41 +46,41 @@ page {
             }
 			.lookHouseView{
 				position: absolute;
-				left:276rem;
-				bottom:138rem;
-				width: 200rem;
-				height: 76rem;
-				border-radius: 38rem;
+				left:276px;
+				bottom:138px;
+				width: 200px;
+				height: 76px;
+				border-radius: 38px;
 				background: rgba(0, 0, 0, 0.4);
 				font-family: "Verdana";
 				font-weight: 400;
-				font-size: 28rem;
+				font-size: 28px;
 				color: #fff;
 				.icon-ai{
-					width:46rem;
-					height:46rem;
-					margin-right:10rem;
+					width:46px;
+					height:46px;
+					margin-right:10px;
 				}
 			}
 
 			.indicator-view{
 				position: absolute;
 				z-index: 12;
-				bottom: 100rem;
+				bottom: 100px;
 				left:50%;
 				transform: translateX(-50%);
 				.indicator-item{
-					width: 12rem;
-					height: 12rem;
+					width: 12px;
+					height: 12px;
 					background: #fff;
 					opacity: 0.52;
-					margin-right:6rem;
+					margin-right:6px;
 					border-radius: 50%;
 					&.active{
 						opacity:1;
 					}
 					&:last-child{
-						margin-right:0rem;
+						margin-right:0px;
 					}
 				}
 			}
@@ -89,47 +89,47 @@ page {
     .tabList{
 		position: absolute;
 		width: 100%;
-		height:246rem;
-		bottom:0rem;
+		height:246px;
+		bottom:0px;
 		overflow-x: auto;
 		overflow-y: hidden;
 		z-index: 2;
         .tab-item{
-			width:196rem;
-            margin-right: 20rem;
+			width:196px;
+            margin-right: 20px;
             font-family: "Verdana";
             font-weight: 400;
-            font-size: 24rem;
+            font-size: 24px;
             color: #1d1d1d;
 			text-align:center;
-			padding:2rem;
-			// border:solid 2rem #65574933;
-			// box-shadow: 0 4rem 40rem #65574933;
+			padding:2px;
+			// border:solid 2px #65574933;
+			// box-shadow: 0 4px 40px #65574933;
 			background: #ededed;
-			filter: drop-shadow(0 4rem 40rem #65574933);
+			filter: drop-shadow(0 4px 40px #65574933);
 			box-sizing: border-box;
             &.tabActive{
                 position: relative;
                 font-weight: 700;
                 color: #4d463f;
-				// border:solid 2rem #65574933;
+				// border:solid 2px #65574933;
 				background: rgba(254, 176, 102, 0.5);
-				filter: drop-shadow(0 4rem 40rem #65574933);
+				filter: drop-shadow(0 4px 40px #65574933);
             }
 			&:first-child{
-			    margin-left: 30rem;;
+			    margin-left: 30px;;
 			}
             &:last-child{
-                margin-right: 30rem;
+                margin-right: 30px;
             }
 			.tab-img{
-				width: 192rem;
-				height: 200rem;
+				width: 192px;
+				height: 200px;
 				object-fit: cover;
 			}
 			.tab-info{
 				width:100%;
-				padding:6rem 10rem;
+				padding:6px 10px;
 				box-sizing: border-box;
 			}
         }
@@ -137,35 +137,35 @@ page {
     .textAbout{
         font-family: "DIN Alternate Bold";
         font-weight: 700;
-        font-size: 20rem;
+        font-size: 20px;
         // color: rgba(255, 255, 255, 0.3);
 		opacity: 0.3;
-		margin-left:10rem;
+		margin-left:10px;
     }
     .booking-info{
-        margin-left: 30rem;
-        margin-right: 30rem;
-        margin-top: 130rem;
-        margin-bottom: 15rem;
+        margin-left: 30px;
+        margin-right: 30px;
+        margin-top: 130px;
+        margin-bottom: 15px;
         position: relative;
-        border: 2rem solid rgba(255, 255, 255, 0.5);
+        border: 2px solid rgba(255, 255, 255, 0.5);
 		border-top:none;
-        padding: 90rem 30rem 20rem;
+        padding: 90px 30px 20px;
 		box-sizing: border-box;
 		color: #fff;
 		z-index: 3;
 		.line{
 			position: absolute;
-			top:0rem;
-			width: 100rem;
-			height:2rem;
+			top:0px;
+			width: 100px;
+			height:2px;
 			background-color: rgba(255, 255, 255, 0.5);
 		}
 		.left-line{
-			left:0rem;
+			left:0px;
 		}
 		.right-line{
-			right:0rem;
+			right:0px;
 		}
         // .booking-info-bg{
         //     position: absolute;
@@ -175,17 +175,17 @@ page {
         //     height: unset;
         // }
         .writingBox{
-			padding:0rem 10rem;
-            // width: 440rem;
+			padding:0px 10px;
+            // width: 440px;
             width: max-content;
-            height: 120rem;
+            height: 120px;
             position: absolute;
-            // margin-top: -45rem;
+            // margin-top: -45px;
             // font-family: "STFangsong";
             font-weight: 400;
             
             // color: #fff;
-            top: -60rem;
+            top: -60px;
             box-sizing: border-box;
             left: 50%;
             transform: translate(-50%,0);
@@ -194,26 +194,26 @@ page {
 			// backdrop-filter: blur(20px);
             
             .writing-img{
-                width: 120rem;
-                height: 120rem;
-                min-width: 120rem;
-                filter: drop-shadow(0 3rem 4rem #00000029); 
+                width: 120px;
+                height: 120px;
+                min-width: 120px;
+                filter: drop-shadow(0 3px 4px #00000029); 
                 box-sizing: border-box;
                 border-radius: 50%;
-                border: 6rem solid #F5F5F5;
-				margin-right:30rem;
+                border: 6px solid #F5F5F5;
+				margin-right:30px;
             }
             .wiriting-right{
                 // text-align: right;
-                padding-right: 20rem;
+                padding-right: 20px;
                 .wiriting-text{
-                    // height: 60rem;
+                    // height: 60px;
                 }
             }
             
         }
         .info-bar{
-            // padding: 80rem 50rem 140rem;
+            // padding: 80px 50px 140px;
             display: flex;
             flex-wrap: wrap;
             
@@ -221,8 +221,8 @@ page {
                 // color: #fff;
                 width: 33.33%;
                 
-                margin-bottom: 40rem;
-                padding-left: 10rem;
+                margin-bottom: 40px;
+                padding-left: 10px;
                 box-sizing: border-box;
                 // &:nth-child(3n-1){
                 //     width: 39.66%;
@@ -238,13 +238,13 @@ page {
             .info-item-label{
                 font-family: "Verdana";
                 font-weight: 400;
-                font-size: 28rem;
-                margin-bottom: 8rem;
+                font-size: 28px;
+                margin-bottom: 8px;
             }
             .info-item-value{
                 font-family: "DIN Alternate Bold";
                 font-weight: bold;
-                font-size: 34rem;
+                font-size: 34px;
                 // white-space: nowrap;
             }
         }
@@ -252,9 +252,9 @@ page {
 }
 .swiper-img-gs-mh {
 	// width: 100vw;
-	// top:0rem;
-	height: calc(100% - 930rem);
-	top:930rem;
+	// top:0px;
+	height: calc(100% - 930px);
+	top:930px;
 	width: 100%;
 	opacity: 0.85;
 	position: absolute;
@@ -274,50 +274,55 @@ page {
 .bottom-view{
     position: relative;
     width: 100%;
-	padding-top:128rem;
-	padding-bottom:300rem;
+	padding-top:128px;
+	padding-bottom:300px;
     box-sizing: border-box;
 	z-index: 3;
     .bottom-title{
 		font-family: "DIN Alternate Bold";
 		font-weight: 700;
-		font-size: 28rem;
+		font-size: 28px;
 		text-align: center;
 		color: #fff;
-		text-shadow: 0 0 8rem rgba(0, 0, 0, 0.17);
+		text-shadow: 0 0 8px rgba(0, 0, 0, 0.17);
 	}
 	.bottom-tips{
 		font-family: "Verdana";
 		font-weight: 400;
-		font-size: 28rem;
-		line-height: 48rem;
+		font-size: 28px;
+		line-height: 48px;
 		text-align: center;
-		margin-top:8rem;
-		margin-bottom:40rem;
+		margin-top:8px;
+		margin-bottom:40px;
 		opacity: 0.6;
 	}
     .bottom-btn{
-        width: 290rem;
-        height: 80rem;
-        border-radius: 40rem;
+        width: 290px;
+        height: 80px;
+        border-radius: 40px;
 		font-family: "DIN Alternate Bold";
 		font-weight: 700;
-		font-size: 28rem;
+		font-size: 28px;
         .bottom-subtitle{
             font-family: "DIN Alternate Bold";
             font-weight: bold;
-            font-size: 30rem;
+            font-size: 30px;
             white-space: nowrap;
         }
     }
 	.btn-qw{
 		background: rgba(246, 165, 83, 0.2);
 		color: #f6a553;
-		margin-right:30rem;
+		margin-right:30px;
 	}
     .btn-share{
         background: #f6a553;
-        box-shadow: 0 6rem 20rem rgba(208, 193, 168, 0.31);
+        box-shadow: 0 6px 20px rgba(208, 193, 168, 0.31);
 		color: #fff;
     }
+	.icon-Shared{
+		color: #ffffff;
+		font-size:32px;
+		margin-right:20px;
+	}
 }

src/pages/webgl_rxdz_look/webgl_rxdz_look.scss

@@ -29,29 +29,29 @@ canvas {
 	color: #1d1d1d;
 	user-select: none;   /* don't let the text get selected */
 	z-index: 12;
-	font-size:26rem;
+	font-size:26px;
 	/* pointer-events:none; */
-	line-height: 40rem;
-	/* width: 90rem; */
-	height: 40rem;
-	padding:0rem 10rem;
-	border-radius: 20rem;
+	line-height: 40px;
+	/* width: 90px; */
+	height: 40px;
+	padding:0px 10px;
+	border-radius: 20px;
 	background: #fff;
 	text-align: center;
 }
 .floor-view{
 	position: absolute;
-	left:30rem;
-	bottom:60rem;
-	width: 72rem;
-	border-radius: 12rem;
+	left:30px;
+	bottom:60px;
+	width: 72px;
+	border-radius: 12px;
 	background: rgba(0, 0, 0, 0.4);
 	overflow: hidden;
 	z-index: 11;
-	font-size: 28rem;
+	font-size: 28px;
 }
 .floor-item{
-	height: 60rem;
+	height: 60px;
 	color: #fff;
 }
 .floor-item.active{

src/pages/webgl_rxdz_look/webgl_rxdz_look.vue

@@ -69,6 +69,7 @@
 				instancedMeshList: [],
 				lableItem:[],
 				showLables:false,
+				gltfSpaceRoofs:[], // 屋顶模型数组
 				floorList:[],
 				floorId:null,
 				curData:null,	//上一个页面传来的数据
@@ -106,6 +107,8 @@
 				}
 			}, 0)
 			this.gltfWalls = [];
+			this.gltfSpaces = [];
+			this.gltfSpaceRoofs = [];
 			this.instancedMeshList = [];
 			this.instancedSpaceMeshList = [];
 			this.lableItem = [];

src/pages/webgl_rxdz_roam/webgl_rxdz_roam.scss

@@ -3,7 +3,7 @@
 	height:100vh;
 	overflow: hidden;
 }
-canvas { width:100vw; height:calc(100vh - 408rem);z-index: 10;}
+canvas { width:100vw; height:calc(100vh - 408px);z-index: 10;}
 #mapDiv{
 	background-color: #fff;
 }
@@ -20,7 +20,7 @@ page {
 	width: 100vw;
 	z-index: -1;
 	// position: absolute;
-	left:0rem;
+	left:0px;
 }
 .canvas-view{
 	position:relative;

src/services/request.js

@@ -7,6 +7,7 @@ var showToast = true;
 
 axios.defaults.headers.post['elabEnvironment'] = '4'; //axios默认的请求方式,可以自己设置
 axios.defaults.headers.post['userType'] = '1000'; //axios默认的请求方式,可以自己设置
+// axios.defaults.headers.post['Authorization'] = 'Token 9837b7480a99ab4df7e3a06ad0d990fbc7b941e4'; //axios默认的请求方式,可以自己设置
 axios.interceptors.request.use(function(config) {
 	if(config.noLoading){
 		store.dispatch('setLoading',false);//不显示loading态
@@ -17,6 +18,7 @@ axios.interceptors.request.use(function(config) {
 		requestCount++;//请求数+1
 	}
 	if (config.url.includes('http')) {
+		config.headers['Authorization'] = 'Token 9837b7480a99ab4df7e3a06ad0d990fbc7b941e4';
 		return config;
 	} else {
 		config.url = window.$config.api_url + config.url;

src/services/requestConfig.js

@@ -35,6 +35,7 @@ const endpoints = {
 	generateTaskWordToImgForAliyun: 'elab-marketing-content/aiGenerateImg/addTaskWithWord2Img', // 生成识别任务-阿里云(文生图)
 	generateProcess: 'elab-marketing-content/aiGenerateImg/getResult', // 获取任务进度-阿里云
 	shareDetail: '/elab-marketing-content/aiDreamHouse/V3.0/shareDetail', // 分享查看
+	// predictions: "https://api.replicate.com/v1/deployments/feathers-wing/spacely-realistic-style-softedge-a100/predictions", // 分享查看
 };
 window.requestConfig = async(endpoint, options, isHideLoading = false, preventDoubleClick = false, method = 'post') => {
 	if (!endpoints.hasOwnProperty(endpoint)) {

src/utils/rem.js

@@ -1,6 +1,6 @@
 (function(){
 	function resize(){
-		var baseFontSize = 1;
+		var baseFontSize = 75;//确保跟config配置文件的remUnit一致
 		var designWidth = 750;
 		// var width = window.innerWidth;
 		var width = window.screen.width;
@@ -8,7 +8,8 @@
 			width = Math.min(window.innerWidth,window.screen.width)
 		}
 		var currentFontSize = (width/designWidth)*baseFontSize;
-		document.querySelector('html').style.fontSize = currentFontSize+'px';
+		// document.querySelector('html').style.fontSize = currentFontSize+'px';
+		document.documentElement.style.fontSize = currentFontSize+'px';
 	}
 	// 页面大小发生变化时
 	window.onresize = function(){

vue.config.js

@@ -17,12 +17,22 @@ module.exports = {
 		proxy:{},
 	},
 	chainWebpack: config => {
-		config
-			.plugin('html')
+		config.plugin('html')
 			.tap(args => {
 				args[0].title = "";//定义 HTML 文档的标题
 				args[0].template = 'public/index.html';// webpack模板的地址-相对或绝对路径
 				return args
-			})
+			}).end();
+		config.module
+			.rule('scss')
+			.test(/\.scss$/)
+			.oneOf('vue')
+			.use('px2rem-loader')
+			.loader('px2rem-loader')
+			.before('postcss-loader') // this makes it work.
+			.options({
+				remUnit: 75, //根据视觉稿，rem为px的⼗分之⼀，750px  75rem
+				remPrecision: 4 //保留8位⼩数
+			}).end();
 	}
 }