配置参数

pages/housePurchase/planningParameters.vue

 <template>
 <template>
 	<div class="paramsContainer">
 	<div class="paramsContainer">
+		<!-- 关闭按钮 -->
+		<div class="closeBtn">
+			<svg t="1663922894848" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2545" width="26" height="26"><path d="M557.311759 513.248864l265.280473-263.904314c12.54369-12.480043 12.607338-32.704421 0.127295-45.248112-12.512727-12.576374-32.704421-12.607338-45.248112-0.127295L512.127295 467.904421 249.088241 204.063755c-12.447359-12.480043-32.704421-12.54369-45.248112-0.063647-12.512727 12.480043-12.54369 32.735385-0.063647 45.280796l262.975407 263.775299-265.151458 263.744335c-12.54369 12.480043-12.607338 32.704421-0.127295 45.248112 6.239161 6.271845 14.463432 9.440452 22.687703 9.440452 8.160624 0 16.319527-3.103239 22.560409-9.311437l265.216826-263.807983 265.440452 266.240344c6.239161 6.271845 14.432469 9.407768 22.65674 9.407768 8.191587 0 16.352211-3.135923 22.591372-9.34412 12.512727-12.480043 12.54369-32.704421 0.063647-45.248112L557.311759 513.248864z" p-id="2546"></path></svg>
+		</div>
 		<h5>规划参数<span>(点击参数值即可修改参数)</span></h5>
 		<h5>规划参数<span>(点击参数值即可修改参数)</span></h5>
 		<ul>
 		<ul>
 			<li v-for="item in editParamLists" :key="item.id">
 			<li v-for="item in editParamLists" :key="item.id">
@@ -18,6 +22,10 @@
 				</div>
 				</div>
 			</li>
 			</li>
 		</ul>
 		</ul>
+		<div class="optionContent">
+			<div class="confirm"><span @click="confirmParams()">确定</span></div>
+			<div class="reset"><span @click="resetParams()">恢复默认</span></div>
+		</div>
 	</div>
 	</div>
 </template>
 </template>
 
 
@@ -50,6 +58,10 @@
 			        const value = e.detail.value
 			        const value = e.detail.value
 			},
 			},
 			 onnodeclick(node) {
 			 onnodeclick(node) {
+			 },
+			 resetParams(){
+				 this.editParamLists = JSON.parse(JSON.stringify(this.paramsLists))
+				 console.log(this.editParamLists)
 			 }
 			 }
 		},
 		},
 		mounted() {
 		mounted() {
@@ -69,7 +81,8 @@
 			padding-left: 20rpx;
 			padding-left: 20rpx;
 			margin-bottom: 40rpx;
 			margin-bottom: 40rpx;
 			span{
 			span{
-				font-size: 26rpx;	
+				font-size: 26rpx;
+				font-weight: normal;
 			}
 			}
 			&::before{
 			&::before{
 				content:'';
 				content:'';
@@ -118,5 +131,42 @@
 				flex: 0 0 40%;
 				flex: 0 0 40%;
 			}
 			}
 		}
 		}
+		.optionContent{
+			height: 94rpx;
+			line-height: 94rpx;
+			position: relative;
+			margin-top: 40rpx;
+			div{
+				&.confirm{
+					padding: 0 50px;
+					box-shadow: 0px 2px 2px 1px rgb(0 0 0 / 35%);
+					background:linear-gradient(to bottom right,#CEB07D,#FED597);
+				}
+				span{
+					font-size: 36rpx;
+					font-weight: bold;
+					color: #6B4000;
+					letter-spacing: 2px;
+				}
+				&.reset{
+					position: absolute;
+					right: 0;
+					bottom: 0;
+					span{
+						color: #CEB07D;
+						background-image:linear-gradient(to bottom right,#CEB07D,#FED597);
+						background-clip:text;
+						color:transparent;
+						font-size:26rpx;
+						border-bottom: 1px solid #CEB07D;
+					}
+				}
+			}
+		}
+		.closeBtn{
+			position: absolute;
+			right: 20rpx;
+			top: 20rpx;
+		}
 	}
 	}
 </style>
 </style>
\ No newline at end of file