围栏弹窗改成全屏覆盖

src/views/fys-equipment/geoFence/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="content" v-loading="Status.fullLoading">
-    <div class="percent100">
+    <div class="percent100" v-show="!Status.showEdit">
       <div class="topTool">
         <div class="button-row">
           <el-button type="primary" @click.stop="ShowEdit(null)"
@@ -94,7 +94,7 @@
     </div>
 
     <!-- 围栏编辑弹出层 -->
-    <el-dialog width="calc(calc(100% - 250px) * 0.9)" v-model="Status.showEdit" :title="'编辑围栏'" :draggable="true">
+    <div class="editLayer percent100" v-show="Status.showEdit" :title="'编辑围栏'" :draggable="true">
       <div>
         <el-form :inline="true" :model="cEdit" label-width="auto">
           <el-form-item label="服务id">
@@ -130,19 +130,19 @@
       </div>
       <div>
         <el-button type="primary" @click.stop="AddPoint()"
-          ><el-icon><Plus /></el-icon>添加坐标</el-button
+          ><el-icon><Plus /></el-icon>添加点</el-button
         >
 
-        <el-button type="primary" @click.stop="ClearPoint()">
+        <el-button type="danger" @click.stop="ClearPoint()">
           <el-icon><Delete /></el-icon>清空</el-button
         >
       </div>
       <div class="map" id="map"></div>
       <div class="center footerBtn" style="margin-top: 20px">
         <el-button type="primary" @click="SaveFormData"> 确定 </el-button>
-        <el-button type="primary" plain @click="CloseEdit"> 取消 </el-button>
+        <el-button type="danger" plain @click="CloseEdit"> 关闭 </el-button>
       </div>
-    </el-dialog>
+    </div>
 
     <!-- 提示框 -->
     <el-dialog :width="300" :draggable="true" v-model="Status.confirm.Visible" :title="Status.confirm.title" center>
@@ -877,7 +877,7 @@ onMounted(() => {
 
 .map {
   width: 100%;
-  height: calc(58vh - 50px);
+  height: calc(100% - 200px);
   box-sizing: border-box;
   border: 1px solid #7371719e;
   border-radius: 8px;