修改

src/views/modelStretch/index.vue

@@ -9,12 +9,12 @@
       <span class="closeBtn" @click="toggleVisibility">&times;</span>
     </div>
     <div class="xz_box">
-      <el-form :model="form" ref="form" label-width="80px" :rules="rules">
+      <el-form :model="form" ref="ruleForm" label-width="100px" :rules="rules">
         <el-form-item label="平面范围:" prop="xzmj">
           <range type="hgxfx" :keys="['hx', 'sc']" class="range" ref="range" />
         </el-form-item>
         <el-row :gutter="10">
-          <el-col :span="14" style="text-align: center">
+          <el-col :span="13" style="text-align: center">
             <!-- 楼体高度:
             <el-input-number
               size="mini"
@@ -32,8 +32,8 @@
               米
             </el-form-item>
           </el-col>
-          <el-col :span="10" style="text-align: center">
-            <el-form-item label="层高:" prop="FLOORH" label-width="45px">
+          <el-col :span="11" style="text-align: center">
+            <el-form-item label="层高:" prop="FLOORH" label-width="60px">
               <el-input
                 class="inputwidth"
                 v-model.number="form.FLOORH"
@@ -87,7 +87,23 @@ export default {
     range,
   },
   data() {
-    return { form: { BuildingHeight: 50, FLOORH: 5 } };
+    return {
+      form: { BuildingHeight: 50, FLOORH: 5 },
+      rules: {
+        xzmj: [{ required: true, message: "请填写范围的数据" }],
+        BuildingHeight: [{ required: true, message: "请填写模型高度" }],
+        FLOORH: [{ required: true, message: "请填写层高" }],
+        mxmc: [
+          { required: true, message: "请输入模型名称", trigger: "blur" },
+          {
+            min: 3,
+            max: 50,
+            message: "长度在 3 到 50 个字符",
+            trigger: "blur",
+          },
+        ],
+      },
+    };
   },
   created() {},
   mounted() {},
@@ -206,9 +222,19 @@ export default {
     },
     submit() {
       var _temp = this.$refs.range.getRange();
-      _temp.geojson = parse(_temp.geom);
-      // this.pullUp(_temp, this.form.BuildingHeight);
-      this.onSubmit(_temp.geojson);
+      this.form.xzfw = _temp.xzfw;
+
+      this.$refs.ruleForm.validate((valid) => {
+        if (valid) {
+          if (!this.form.xzfw) {
+            Message.warning("请绘制或导入平面范围!");
+            return;
+          }
+          this.form.geojson = parse(_temp.geom);
+          // this.pullUp(_temp, this.form.BuildingHeight);
+          this.onSubmit(this.form.geojson);
+        }
+      });
     },
     getjcHigeht(geojson) {
       // sampleTerrainMostDetailed
@@ -301,10 +327,9 @@ export default {
         attributes: {
           color: Cesium.ColorGeometryInstanceAttribute.fromColor(
             // Cesium.Color.CHARTREUSE.withAlpha(0.1)
-            new Cesium.Color(0.9, 0.9, 0.9, 1.0).withAlpha(1)
+            new Cesium.Color(0.8, 0.8, 0.8, 1.0).withAlpha(1)
           ),
         },
-        zIndex: 100
       });
 
       // 添加到场景中
@@ -314,9 +339,11 @@ export default {
           flat: true,
         }),
         shadows: Cesium.ShadowMode.ENABLED, // 开启阴影
+        index: 1,
       });
       viewer.scene.primitives.add(Primitive);
       polygonids.push(Primitive);
+      viewer.scene.primitives.raiseToTop(Primitive);
     },
     addPolyline(pss) {
       // 创建多边形的边界线
@@ -331,7 +358,7 @@ export default {
             new Cesium.Color(0.4, 0.4, 0.4, 1.0).withAlpha(1)
           ),
         },
-        zIndex: 99
+        zIndex: 99,
       });
       let boundaryPolylinePrimitive = new Cesium.Primitive({
         geometryInstances: [boundaryPolyline],
@@ -340,6 +367,7 @@ export default {
           // vertexFormat: Cesium.PolylineVertexFormat.POSITION_AND_COLOR,
           vertexFormat: Cesium.PolylineColorAppearance.VERTEX_FORMAT,
         }),
+        index: 0,
       });
       viewer.scene.primitives.add(boundaryPolylinePrimitive);
       polygonids.push(boundaryPolylinePrimitive);