From 02df26cf1949e54a70edf13a97214e81cc902108 Mon Sep 17 00:00:00 2001
From: hejunjie <hejunjie@datametatech.com>
Date: Tue, 16 Apr 2024 15:19:13 +0800
Subject: [PATCH] =?UTF-8?q?=E5=9B=9B=E9=A2=84=E5=AE=8C=E6=88=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../previewInfo/detail/PlanDetail.vue         |   2 +-
 .../previewInfo/detail/edit.vue               | 438 +++++++++++-------
 .../fourPredictions/previewInfo/index.vue     |   2 +-
 .../warnInfo/components/forecastDetail.vue    |  10 +-
 .../warnInfo/detail/PlanDetail.vue            |   2 +-
 .../fourPredictions/warnInfo/index.vue        |   2 +-
 .../InitialInformation/compoments/edit.vue    | 216 +++++++++
 .../waterSetting/InitialInformation/index.vue |  97 +++-
 8 files changed, 599 insertions(+), 170 deletions(-)
 create mode 100644 src/views/aiSupervision/waterSetting/InitialInformation/compoments/edit.vue

diff --git a/src/views/aiSupervision/fourPredictions/previewInfo/detail/PlanDetail.vue b/src/views/aiSupervision/fourPredictions/previewInfo/detail/PlanDetail.vue
index 8e61755..be0e308 100644
--- a/src/views/aiSupervision/fourPredictions/previewInfo/detail/PlanDetail.vue
+++ b/src/views/aiSupervision/fourPredictions/previewInfo/detail/PlanDetail.vue
@@ -21,7 +21,7 @@
         </el-dropdown>
       </template>
     </Tree>
-    <Edit></Edit>
+    <Edit style="flex: 1"></Edit>
   </div>
 </template>
 <script>
diff --git a/src/views/aiSupervision/fourPredictions/previewInfo/detail/edit.vue b/src/views/aiSupervision/fourPredictions/previewInfo/detail/edit.vue
index 177e28d..f575ba4 100644
--- a/src/views/aiSupervision/fourPredictions/previewInfo/detail/edit.vue
+++ b/src/views/aiSupervision/fourPredictions/previewInfo/detail/edit.vue
@@ -10,59 +10,109 @@ export default {
   },
   data() {
     return {
+      isEdit: false,
       segmentationForm: {
-        planName: '',
-        code: '',
-        id: '',
-        size: '',
-        waterLevel: '',
-        createTime: '',
-        creator: ''
+        planName: '渲染项目名',
+        code: '编号',
+        id: '网格id',
+        size: '网格大小',
+        waterLevel: '网格水位',
+        createTime: '创建时间',
+        creator: '创建人'
       },
       waterTreatmentForm: {
-        planName: '',
-        code: '',
-        id: '',
-        waterLevel: '',
-        flowVelocity: '',
+        planName: '渲染项目名',
+        code: '编号',
+        id: '网格id',
+        waterLevel: '平均水位',
+        flowVelocity: '平均流速',
       },
       preDirectionForm: {
-        planName: '',
-        code: '',
-        id: '',
-        direction: '',
-        flowVelocity: '',
-        time: '',
+        planName: '渲染项目名',
+        code: '编号',
+        id: '网格id',
+        direction: '流向',
+        flowVelocity: '流速',
+        time: '时间',
       },
       directionForm: {
-        planName: '',
-        code: '',
-        id: '',
-        x: '',
-        y: '',
-        flowVelocity: '',
-        time: '',
+        planName: '渲染项目名',
+        code: '编号',
+        id: '网格id',
+        x: 'x轴坐标',
+        y: 'y轴坐标',
+        flowVelocity: '流速',
+        time: '时间',
       },
       correlationForm: {
-        planName: '',
-        code: '',
-        id: '',
-        configName: '',
-        function: '',
+        planName: '渲染项目名',
+        code: '编号',
+        id: '网格id',
+        configName: '配置名',
+        function: '网格关联函数',
       },
       terrainForm: {
-        planName: '',
-        code: '',
-        id: '',
-        position: '',
-        elevation: '',
+        planName: '渲染项目名',
+        code: '编号',
+        id: '网格id',
+        position: '网格坐标',
+        elevation: '网格点高程',
       },
       colorForm: {
-        planName: '',
-        code: '',
-        id: '',
-        RGB: '',
-        opacity: '',
+        planName: '渲染项目名',
+        code: '编号',
+        id: '网格id',
+        RGB: 'RGB值',
+        opacity: '透明度',
+      },
+      waterFlowForm: {
+        planName: '渲染项目名',
+        code: '编号',
+        id: '网格id',
+        time: '时间',
+        rate: '进度',
+        gridVector: '网格矢量信息',
+      },
+      gridVectorForm: {
+        planName: '渲染项目名',
+        code: '编号',
+        id: '网格id',
+        waterLevel: '平均水位',
+        flowVelocity: '平均流速',
+        x: 'X轴坐标',
+        y: 'Y轴坐标',
+        z: 'Z轴坐标',
+        time: '时间',
+      },
+      gateOpenForm: {
+        enginName: '工程名称',
+        enginId: '工程ID',
+        gateNum: '闸门编号',
+        time: '时间',
+        gateOpenChange: '闸门开度变化过程',
+      },
+      gateOpenChangeForm: {
+        enginName: '工程名称',
+        enginId: '工程ID',
+        gateNum: '闸门编号',
+        gateOpen: '闸门开度',
+        time: '时间',
+      },
+      deformationForm: {
+        enginName: '工程名称',
+        enginId: '工程ID',
+        enginType: '工程类型',
+        dikeForm: '坝体形式',
+        dikeSection: '坝体断面位移信息',
+        time: '时间',
+      },
+      sectionForm: {
+        enginName: '工程名称',
+        enginId: '工程ID',
+        sectionName: '断面名称',
+        coors: '坐标',
+        displacement: '相对位移',
+        time: '时间',
       },
     }
   },
@@ -76,6 +126,19 @@ export default {
         }
       })
     },
+    handleEdit() {
+      this.isEdit = true
+    },
+    handleSave() {
+      this.$message.success('保存成功')
+    },
+    handleClear() {
+      this.isEdit = false
+      this.$refs.segmentationForm.resetFields()
+      this.$refs.waterTreatmentForm.resetFields()
+      this.$refs.preDirectionForm.resetFields()
+      this.$refs.directionForm.resetFields()
+    },
   },
   mounted() {
     if (this.model) {
@@ -92,24 +155,49 @@ export default {
 
 <template>
   <div class="edit">
-    <div style="display: flex; margin-bottom: 16px">
-      <div
-        style="
+    <div style="display: flex; margin-bottom: 16px; justify-content: space-between">
+      <div style="display: flex;">
+        <div
+          style="
             width: 5px;
             height: 16px;
             background-color: #31a08e;
             margin-right: 8px;
           "
-      ></div>
-      <span style="font-weight: 600">水流渲染配置</span>
+        ></div>
+        <span style="font-weight: 600">水流渲染配置</span>
+      </div>
+      <div>
+        <el-button
+          type="primary"
+          @click="handleEdit"
+          style="margin-left: 16px"
+        >
+          编辑
+        </el-button>
+        <el-button
+          type="primary"
+          @click="handleSave"
+          style="margin-left: 16px"
+        >
+          保存
+        </el-button>
+        <el-button
+          type="danger"
+          @click="handleClear"
+          style="margin-left: 16px"
+        >
+          取消
+        </el-button>
+      </div>
     </div>
     <div style="display: flex; margin-bottom: 16px">
       <span style="font-weight: 600">网格分割配置</span>
     </div>
     <el-form
       :model="segmentationForm"
-      :disabled="!!model && model.eventType !== 'edit'"
-      ref="ruleForm"
+      :disabled="!isEdit"
+      ref="segmentationForm"
       label-width="100px"
     >
       <el-row>
@@ -155,8 +243,8 @@ export default {
     </div>
     <el-form
       :model="waterTreatmentForm"
-      :disabled="!!model && model.eventType !== 'edit'"
-      ref="ruleForm"
+      :disabled="!isEdit"
+      ref="waterTreatmentForm"
       label-width="100px"
     >
       <el-row>
@@ -192,8 +280,8 @@ export default {
     </div>
     <el-form
       :model="preDirectionForm"
-      :disabled="!!model && model.eventType !== 'edit'"
-      ref="ruleForm"
+      :disabled="!isEdit"
+      ref="preDirectionForm"
       label-width="100px"
     >
       <el-row>
@@ -234,8 +322,8 @@ export default {
     </div>
     <el-form
       :model="directionForm"
-      :disabled="!!model && model.eventType !== 'edit'"
-      ref="ruleForm"
+      :disabled="!isEdit"
+      ref="directionForm"
       label-width="100px"
     >
       <el-row>
@@ -280,35 +368,35 @@ export default {
       <span style="font-weight: 600">网格关联配置</span>
     </div>
     <el-form
-      :model="directionForm"
-      :disabled="!!model && model.eventType !== 'edit'"
-      ref="ruleForm"
+      :model="correlationForm"
+      :disabled="!isEdit"
+      ref="directionForm"
       label-width="100px"
     >
       <el-row>
         <el-col :span="6">
           <el-form-item label-width="120px" label="渲染项目名" prop="planName">
-            <el-input v-model="directionForm.planName"></el-input>
+            <el-input v-model="correlationForm.planName"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label-width="120px" label="编号" prop="code">
-            <el-input v-model="directionForm.code"></el-input>
+            <el-input v-model="correlationForm.code"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label-width="120px" label="网格ID" prop="id">
-            <el-input v-model="directionForm.id"></el-input>
+            <el-input v-model="correlationForm.id"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="配置名" prop="direction">
-            <el-input v-model="directionForm.x"></el-input>
+          <el-form-item label-width="120px" label="配置名" prop="configName">
+            <el-input v-model="correlationForm.configName"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="网格关联函数" prop="direction">
-            <el-input v-model="directionForm.y"></el-input>
+          <el-form-item label-width="120px" label="网格关联函数" prop="function">
+            <el-input v-model="correlationForm.function"></el-input>
           </el-form-item>
         </el-col>
       </el-row>
@@ -317,72 +405,73 @@ export default {
       <span style="font-weight: 600">网格地形配置</span>
     </div>
     <el-form
-      :model="directionForm"
-      :disabled="!!model && model.eventType !== 'edit'"
-      ref="ruleForm"
+      :model="terrainForm"
+      :disabled="!isEdit"
+      ref="directionForm"
       label-width="100px"
     >
       <el-row>
         <el-col :span="6">
           <el-form-item label-width="120px" label="渲染项目名" prop="planName">
-            <el-input v-model="directionForm.planName"></el-input>
+            <el-input v-model="terrainForm.planName"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label-width="120px" label="编号" prop="code">
-            <el-input v-model="directionForm.code"></el-input>
+            <el-input v-model="terrainForm.code"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label-width="120px" label="网格ID" prop="id">
-            <el-input v-model="directionForm.id"></el-input>
+            <el-input v-model="terrainForm.id"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="网格坐标" prop="direction">
-            <el-input v-model="directionForm.x"></el-input>
+          <el-form-item label-width="120px" label="网格坐标" prop="position">
+            <el-input v-model="terrainForm.position"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="网格点高程" prop="direction">
-            <el-input v-model="directionForm.y"></el-input>
+          <el-form-item label-width="120px" label="网格点高程" prop="elevation">
+            <el-input v-model="terrainForm.elevation"></el-input>
           </el-form-item>
         </el-col>
       </el-row>
     </el-form>
     <div style="display: flex; margin-bottom: 16px">
       <span style="font-weight: 600">网格水体颜色信息</span>
-    </div>
+    </div>: '透明度',
+    },
     <el-form
-      :model="directionForm"
-      :disabled="!!model && model.eventType !== 'edit'"
-      ref="ruleForm"
+      :model="colorForm"
+      :disabled="!isEdit"
+      ref="directionForm"
       label-width="100px"
     >
       <el-row>
         <el-col :span="6">
           <el-form-item label-width="120px" label="渲染项目名" prop="planName">
-            <el-input v-model="directionForm.planName"></el-input>
+            <el-input v-model="colorForm.planName"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label-width="120px" label="编号" prop="code">
-            <el-input v-model="directionForm.code"></el-input>
+            <el-input v-model="colorForm.code"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label-width="120px" label="网格ID" prop="id">
-            <el-input v-model="directionForm.id"></el-input>
+            <el-input v-model="colorForm.id"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="RGB值" prop="direction">
-            <el-input v-model="directionForm.x"></el-input>
+          <el-form-item label-width="120px" label="RGB值" prop="RGB">
+            <el-input v-model="colorForm.RGB"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="透明度" prop="direction">
-            <el-input v-model="directionForm.y"></el-input>
+          <el-form-item label-width="120px" label="透明度" prop="opacity">
+            <el-input v-model="colorForm.opacity"></el-input>
           </el-form-item>
         </el-col>
       </el-row>
@@ -402,35 +491,40 @@ export default {
       <span style="font-weight: 600">水体流动信息</span>
     </div>
     <el-form
-      :model="directionForm"
-      :disabled="!!model && model.eventType !== 'edit'"
-      ref="ruleForm"
+      :model="waterFlowForm"
+      :disabled="!isEdit"
+      ref="directionForm"
       label-width="100px"
     >
       <el-row>
         <el-col :span="6">
           <el-form-item label-width="120px" label="渲染项目名" prop="planName">
-            <el-input v-model="directionForm.planName"></el-input>
+            <el-input v-model="waterFlowForm.planName"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label-width="120px" label="编号" prop="code">
-            <el-input v-model="directionForm.code"></el-input>
+            <el-input v-model="waterFlowForm.code"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label-width="120px" label="网格ID" prop="id">
-            <el-input v-model="directionForm.id"></el-input>
+            <el-input v-model="waterFlowForm.id"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="RGB值" prop="direction">
-            <el-input v-model="directionForm.x"></el-input>
+          <el-form-item label-width="120px" label="时间" prop="time">
+            <el-input v-model="waterFlowForm.time"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="透明度" prop="direction">
-            <el-input v-model="directionForm.y"></el-input>
+          <el-form-item label-width="120px" label="进度" prop="rate">
+            <el-input v-model="waterFlowForm.rate"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="18">
+          <el-form-item label-width="120px" label="网格矢量信息" prop="gridVector">
+            <el-input v-model="waterFlowForm.gridVector"></el-input>
           </el-form-item>
         </el-col>
       </el-row>
@@ -439,35 +533,55 @@ export default {
       <span style="font-weight: 600">网格矢量信息</span>
     </div>
     <el-form
-      :model="directionForm"
-      :disabled="!!model && model.eventType !== 'edit'"
-      ref="ruleForm"
+      :model="gridVectorForm"
+      :disabled="!isEdit"
+      ref="directionForm"
       label-width="100px"
     >
       <el-row>
         <el-col :span="6">
           <el-form-item label-width="120px" label="渲染项目名" prop="planName">
-            <el-input v-model="directionForm.planName"></el-input>
+            <el-input v-model="gridVectorForm.planName"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label-width="120px" label="编号" prop="code">
-            <el-input v-model="directionForm.code"></el-input>
+            <el-input v-model="gridVectorForm.code"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label-width="120px" label="网格ID" prop="id">
-            <el-input v-model="directionForm.id"></el-input>
+            <el-input v-model="gridVectorForm.id"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="RGB值" prop="direction">
-            <el-input v-model="directionForm.x"></el-input>
+          <el-form-item label-width="120px" label="平均水位" prop="waterLevel">
+            <el-input v-model="gridVectorForm.waterLevel"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="透明度" prop="direction">
-            <el-input v-model="directionForm.y"></el-input>
+          <el-form-item label-width="120px" label="平均流速" prop="flowVelocity">
+            <el-input v-model="gridVectorForm.flowVelocity"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label-width="120px" label="x轴坐标" prop="x">
+            <el-input v-model="gridVectorForm.x"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label-width="120px" label="y轴坐标" prop="y">
+            <el-input v-model="gridVectorForm.y"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label-width="120px" label="z轴坐标" prop="z">
+            <el-input v-model="gridVectorForm.z"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label-width="120px" label="时间" prop="time">
+            <el-input v-model="gridVectorForm.time"></el-input>
           </el-form-item>
         </el-col>
       </el-row>
@@ -476,35 +590,35 @@ export default {
       <span style="font-weight: 600">闸门启闭信息</span>
     </div>
     <el-form
-      :model="directionForm"
-      :disabled="!!model && model.eventType !== 'edit'"
-      ref="ruleForm"
+      :model="gateOpenForm"
+      :disabled="!isEdit"
+      ref="directionForm"
       label-width="100px"
     >
       <el-row>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="渲染项目名" prop="planName">
-            <el-input v-model="directionForm.planName"></el-input>
+          <el-form-item label-width="120px" label="工程名称" prop="enginName">
+            <el-input v-model="gateOpenForm.enginName"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="编号" prop="code">
-            <el-input v-model="directionForm.code"></el-input>
+          <el-form-item label-width="120px" label="工程ID" prop="enginId">
+            <el-input v-model="gateOpenForm.enginId"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="网格ID" prop="id">
-            <el-input v-model="directionForm.id"></el-input>
+          <el-form-item label-width="120px" label="闸门编号" prop="gateNum">
+            <el-input v-model="gateOpenForm.gateNum"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="RGB值" prop="direction">
-            <el-input v-model="directionForm.x"></el-input>
+          <el-form-item label-width="120px" label="时间" prop="time">
+            <el-input v-model="gateOpenForm.time"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="透明度" prop="direction">
-            <el-input v-model="directionForm.y"></el-input>
+          <el-form-item label-width="120px" label="闸门开度变化" prop="gateOpenChange">
+            <el-input v-model="gateOpenForm.gateOpenChange"></el-input>
           </el-form-item>
         </el-col>
       </el-row>
@@ -513,35 +627,35 @@ export default {
       <span style="font-weight: 600">闸门开度变化过程</span>
     </div>
     <el-form
-      :model="directionForm"
-      :disabled="!!model && model.eventType !== 'edit'"
-      ref="ruleForm"
+      :model="gateOpenChangeForm"
+      :disabled="!isEdit"
+      ref="directionForm"
       label-width="100px"
     >
       <el-row>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="渲染项目名" prop="planName">
-            <el-input v-model="directionForm.planName"></el-input>
+          <el-form-item label-width="120px" label="工程名称" prop="enginName">
+            <el-input v-model="gateOpenChangeForm.enginName"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="编号" prop="code">
-            <el-input v-model="directionForm.code"></el-input>
+          <el-form-item label-width="120px" label="工程ID" prop="enginId">
+            <el-input v-model="gateOpenChangeForm.enginId"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="网格ID" prop="id">
-            <el-input v-model="directionForm.id"></el-input>
+          <el-form-item label-width="120px" label="闸门编号" prop="gateNum">
+            <el-input v-model="gateOpenChangeForm.gateNum"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="RGB值" prop="direction">
-            <el-input v-model="directionForm.x"></el-input>
+          <el-form-item label-width="120px" label="闸门开度" prop="闸门开度">
+            <el-input v-model="gateOpenChangeForm.gateOpen"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="透明度" prop="direction">
-            <el-input v-model="directionForm.y"></el-input>
+          <el-form-item label-width="120px" label="时间" prop="time">
+            <el-input v-model="gateOpenChangeForm.time"></el-input>
           </el-form-item>
         </el-col>
       </el-row>
@@ -550,35 +664,40 @@ export default {
       <span style="font-weight: 600">坝体变形仿真信息</span>
     </div>
     <el-form
-      :model="directionForm"
-      :disabled="!!model && model.eventType !== 'edit'"
-      ref="ruleForm"
+      :model="deformationForm"
+      :disabled="!isEdit"
+      ref="directionForm"
       label-width="100px"
     >
       <el-row>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="渲染项目名" prop="planName">
-            <el-input v-model="directionForm.planName"></el-input>
+          <el-form-item label-width="120px" label="工程名称" prop="enginName">
+            <el-input v-model="deformationForm.enginName"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="编号" prop="code">
-            <el-input v-model="directionForm.code"></el-input>
+          <el-form-item label-width="120px" label="工程ID" prop="enginId">
+            <el-input v-model="deformationForm.enginId"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="网格ID" prop="id">
-            <el-input v-model="directionForm.id"></el-input>
+          <el-form-item label-width="120px" label="工程类型" prop="enginType">
+            <el-input v-model="deformationForm.enginType"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="RGB值" prop="direction">
-            <el-input v-model="directionForm.x"></el-input>
+          <el-form-item label-width="120px" label="坝体形式" prop="dikeForm">
+            <el-input v-model="deformationForm.dikeForm"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="透明度" prop="direction">
-            <el-input v-model="directionForm.y"></el-input>
+          <el-form-item label-width="120px" label="坝体断面位移信息" prop="dikeSection">
+            <el-input v-model="deformationForm.dikeSection"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label-width="120px" label="时间" prop="time">
+            <el-input v-model="deformationForm.time"></el-input>
           </el-form-item>
         </el-col>
       </el-row>
@@ -587,35 +706,40 @@ export default {
       <span style="font-weight: 600">坝体断面位移信息</span>
     </div>
     <el-form
-      :model="directionForm"
-      :disabled="!!model && model.eventType !== 'edit'"
-      ref="ruleForm"
+      :model="sectionForm"
+      :disabled="!isEdit"
+      ref="directionForm"
       label-width="100px"
     >
       <el-row>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="渲染项目名" prop="planName">
-            <el-input v-model="directionForm.planName"></el-input>
+          <el-form-item label-width="120px" label="工程名称" prop="enginName">
+            <el-input v-model="sectionForm.enginName"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="编号" prop="code">
-            <el-input v-model="directionForm.code"></el-input>
+          <el-form-item label-width="120px" label="工程ID" prop="enginId">
+            <el-input v-model="sectionForm.enginId"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="网格ID" prop="id">
-            <el-input v-model="directionForm.id"></el-input>
+          <el-form-item label-width="120px" label="断面名称" prop="sectionName">
+            <el-input v-model="sectionForm.sectionName"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="RGB值" prop="direction">
-            <el-input v-model="directionForm.x"></el-input>
+          <el-form-item label-width="120px" label="坐标" prop="coors">
+            <el-input v-model="sectionForm.coors"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label-width="120px" label="透明度" prop="direction">
-            <el-input v-model="directionForm.y"></el-input>
+          <el-form-item label-width="120px" label="相对位移" prop="displacement">
+            <el-input v-model="sectionForm.displacement"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label-width="120px" label="时间" prop="time">
+            <el-input v-model="sectionForm.time"></el-input>
           </el-form-item>
         </el-col>
       </el-row>
@@ -623,7 +747,7 @@ export default {
   </div>
 </template>
 
-<style scoped lang="scss">
+<style scoped lang="less">
  .edit {
    height: 100%;
    overflow-y: auto;
diff --git a/src/views/aiSupervision/fourPredictions/previewInfo/index.vue b/src/views/aiSupervision/fourPredictions/previewInfo/index.vue
index 3d4b7ab..96efaa2 100644
--- a/src/views/aiSupervision/fourPredictions/previewInfo/index.vue
+++ b/src/views/aiSupervision/fourPredictions/previewInfo/index.vue
@@ -194,7 +194,7 @@ export default {
         </el-table-column>
         <el-table-column prop="foresee" align="center" label="预见期">
           <template slot-scope="scope">
-            {{ scope.row.foresee + "米" }}
+            {{ scope.row.foresee + "天" }}
           </template>
         </el-table-column>
         <el-table-column prop="address" align="center" label="操作">
diff --git a/src/views/aiSupervision/fourPredictions/warnInfo/components/forecastDetail.vue b/src/views/aiSupervision/fourPredictions/warnInfo/components/forecastDetail.vue
index ff254f3..e3b9dba 100644
--- a/src/views/aiSupervision/fourPredictions/warnInfo/components/forecastDetail.vue
+++ b/src/views/aiSupervision/fourPredictions/warnInfo/components/forecastDetail.vue
@@ -22,7 +22,7 @@
             <div class="analysis-content" v-for="(item, index) in analysisList" :key="index">
                 <div class="echarts-content">
                     <span class="title-name">{{ item.chartData.chartName }}</span>
-                    <div class="echarts-box" :id="item.chartId" :ref="item.chartId" :style="{ 'zoom': zoom }"></div>
+                    <div class="echarts-box" :id="item.chartId" :ref="item.chartId" :style="{ 'zoom': zoom, 'width': 'calc(951px /' + zoom + ')', height: 'calc(260px / ' + zoom + ')' }"></div>
                 </div>
                 <div class="warn-analysis">
                     <span class="title-name">{{ item.tableName }}</span>
@@ -440,7 +440,7 @@ export default {
     }
 
     .analysis-content {
-        height: 300px;
+        height: 320px;
         display: flex;
         padding: 0px;
         justify-content: space-between;
@@ -449,7 +449,7 @@ export default {
         border-bottom: 1px solid #E5E5E5;
         .echarts-content {
             width: 951px;
-            height: 300px;
+            height: 320px;
             border-right: 1px solid #E5E5E5;
 
             .echarts-box {
@@ -459,7 +459,7 @@ export default {
         }
 
         .warn-analysis {
-            width: 441px;
+          flex: 1;
             height: 300px;
             border-right: 1px solid #E5E5E5;
         }
@@ -516,4 +516,4 @@ export default {
         }
     }
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/src/views/aiSupervision/fourPredictions/warnInfo/detail/PlanDetail.vue b/src/views/aiSupervision/fourPredictions/warnInfo/detail/PlanDetail.vue
index ee50c7f..7b1c473 100644
--- a/src/views/aiSupervision/fourPredictions/warnInfo/detail/PlanDetail.vue
+++ b/src/views/aiSupervision/fourPredictions/warnInfo/detail/PlanDetail.vue
@@ -81,7 +81,7 @@ export default {
 }
 
 .detail-right {
-  width: 1392px;
+  flex: 1;
   height: calc(100vh - 300px);
   overflow-x: hidden;
   border-left: 1px solid #E5E5E5;
diff --git a/src/views/aiSupervision/fourPredictions/warnInfo/index.vue b/src/views/aiSupervision/fourPredictions/warnInfo/index.vue
index 0b8a0fc..a2eae7f 100644
--- a/src/views/aiSupervision/fourPredictions/warnInfo/index.vue
+++ b/src/views/aiSupervision/fourPredictions/warnInfo/index.vue
@@ -193,7 +193,7 @@ export default {
         </el-table-column>
         <el-table-column prop="foresee" align="center" label="预见期">
           <template slot-scope="scope">
-            {{ scope.row.foresee + "米" }}
+            {{ scope.row.foresee + "天" }}
           </template>
         </el-table-column>
         <el-table-column prop="address" align="center" label="操作">
diff --git a/src/views/aiSupervision/waterSetting/InitialInformation/compoments/edit.vue b/src/views/aiSupervision/waterSetting/InitialInformation/compoments/edit.vue
new file mode 100644
index 0000000..2c9da7f
--- /dev/null
+++ b/src/views/aiSupervision/waterSetting/InitialInformation/compoments/edit.vue
@@ -0,0 +1,216 @@
+<script>
+import { ENGINTYPE } from "../../const";
+export default {
+  name: "Edit",
+  props: {
+    model: {
+      type: Object,
+      default: null
+    }
+  },
+  data() {
+    return {
+      enginTypeList: [],
+      ruleForm: {
+        projectName: '',
+        num: '',
+        enginName: '',
+        id: '',
+        coors: '',
+        enginType: '0',
+        range: '',
+        riversName: '',
+        code: '',
+        blockType: '',
+        dischargeType: '',
+        area: '',
+        flow: '',
+        createTime: '',
+        grade: '',
+        level: '',
+        dischargeMax: '',
+        adcd: '',
+        holeNum: '',
+        width: '',
+        sluiceType: '',
+        shorSeparation: '',
+        dikeType: '',
+        shape: '',
+        system: ''
+      },
+    }
+  },
+  methods: {
+    submitForm(callback) {
+      this.$refs.ruleForm.validate((valid) => {
+        if (valid) {
+          callback({
+            ...this.ruleForm
+          })
+        }
+      })
+    },
+    handleEngin(res) {
+      this.$refs.ruleForm.resetFields()
+      this.ruleForm.enginType = res
+    },
+  },
+  mounted() {
+    this.enginTypeList = ENGINTYPE
+    if (this.model) {
+      for (let key in this.model) {
+        if (this.ruleForm[key] !== undefined) {
+          this.ruleForm[key] = this.model[key]
+        }
+      }
+    }
+  }
+}
+</script>
+
+<template>
+  <div>
+    <el-form
+      :model="ruleForm"
+      ref="ruleForm"
+      label-width="160px"
+    >
+      <el-col :span="24">
+        <el-form-item label="水工程对象类型:" prop="enginType">
+          <el-select style="width: 100%;" v-model="ruleForm.enginType" @change="handleEngin">
+            <el-option
+              v-for="item in enginTypeList"
+              :label="item.dictLabel"
+              :value="item.dictValue"
+              :key="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item label="所属行政区域" prop="adcd">
+          <el-input v-model="ruleForm.adcd" placeholder="请输入所属行政区域"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item label="项目名" prop="projectName">
+          <el-input v-model="ruleForm.projectName" placeholder="请输入项目名"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item label="编号" prop="num">
+          <el-input v-model="ruleForm.num" placeholder="请输入编号"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item label="工程名" prop="enginName">
+          <el-input v-model="ruleForm.enginName" placeholder="请输入工程名"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item label="ID" prop="id">
+          <el-input v-model="ruleForm.id" placeholder="请输入ID"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item label="坐标" prop="coors">
+          <el-input v-model="ruleForm.coors" placeholder="请输入坐标"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item v-if="ruleForm.enginType === '2'" label="范围" prop="riversName">
+          <el-input v-model="ruleForm.range" placeholder="请输入范围"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item label="所在河流（湖泊）名称" prop="riversName">
+          <el-input v-model="ruleForm.riversName" placeholder="请输入所在河流（湖泊）名称"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item v-if="ruleForm.enginType === '0'" label="编码" prop="code">
+          <el-input v-model="ruleForm.code" placeholder="请输入编码"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item v-if="ruleForm.enginType === '0'" label="挡水主坝类型" prop="blockType">
+          <el-input v-model="ruleForm.blockType" placeholder="请输入挡水主坝类型"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item v-if="ruleForm.enginType === '0'" label="主要泄洪建筑物型式" prop="dischargeType">
+          <el-input v-model="ruleForm.dischargeType" placeholder="请输入主要泄洪建筑物型式"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item v-if="ruleForm.enginType === '0'" label="坝址控制流域面积" prop="area">
+          <el-input v-model="ruleForm.area" placeholder="请输入坝址控制流域面积"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item v-if="ruleForm.enginType === '0'" label="坝址多年平均径流量" prop="flow">
+          <el-input v-model="ruleForm.flow" placeholder="请输入坝址多年平均径流量"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item v-if="ruleForm.enginType === '1'" label="闸孔数" prop="holeNum">
+          <el-input v-model="ruleForm.holeNum" placeholder="请输入闸孔数"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item v-if="ruleForm.enginType === '1'" label="闸孔总净宽" prop="width">
+          <el-input v-model="ruleForm.width" placeholder="请输入闸孔总净宽"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item v-if="ruleForm.enginType === '1'" label="水闸类型" prop="sluiceType">
+          <el-input v-model="ruleForm.sluiceType" placeholder="请输入水闸类型"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item v-if="ruleForm.enginType !== '2'" label="建成时间" prop="createTime">
+          <el-input v-model="ruleForm.createTime" placeholder="请输入建成时间"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item v-if="ruleForm.enginType !== '2'" label="工程等级" prop="grade">
+          <el-input v-model="ruleForm.grade" placeholder="请输入工程等级"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item v-if="ruleForm.enginType === '0'" label="主坝级别" prop="level">
+          <el-input v-model="ruleForm.level" placeholder="请输入主坝级别"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item v-if="ruleForm.enginType === '0'" label="最大泄洪量" prop="dischargeMax">
+          <el-input v-model="ruleForm.dischargeMax" placeholder="请输入最大泄洪量"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item v-if="ruleForm.enginType === '2'" label="河流岸别" prop="shorSeparation">
+          <el-input v-model="ruleForm.shorSeparation" placeholder="请输入河流岸别"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item v-if="ruleForm.enginType === '2'" label="堤防类型" prop="dikeType">
+          <el-input v-model="ruleForm.dikeType" placeholder="请输入堤防类型"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item v-if="ruleForm.enginType === '2'" label="堤防型式" prop="shape">
+          <el-input v-model="ruleForm.shape" placeholder="请输入堤防型式"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item v-if="ruleForm.enginType === '2'" label="高程系统" prop="system">
+          <el-input v-model="ruleForm.system" placeholder="请输入高程系统"></el-input>
+        </el-form-item>
+      </el-col>
+    </el-form>
+  </div>
+</template>
+
+<style scoped lang="scss">
+
+</style>
diff --git a/src/views/aiSupervision/waterSetting/InitialInformation/index.vue b/src/views/aiSupervision/waterSetting/InitialInformation/index.vue
index 25665f1..1930753 100644
--- a/src/views/aiSupervision/waterSetting/InitialInformation/index.vue
+++ b/src/views/aiSupervision/waterSetting/InitialInformation/index.vue
@@ -1,17 +1,20 @@
 <!-- 初始信息配置 -->
 <script>
+import Edit from "./compoments/edit.vue";
 import { getAreasData } from "@/api/areas/index";
 import { ENGINTYPE, TABELLIST } from "../const";
 let that;
 export default {
   name: "InitialInformation",
+  components: {
+    Edit
+  },
   data() {
     return {
       searchForm: {
         enginType: "1",
         adcd: "",
         value: ""
-
       },
       enginTypeList: ENGINTYPE, // 检查类型
       areasOptions: [],
@@ -19,6 +22,12 @@ export default {
         emitPath: false,
         checkStrictly: true, //选择任意一级
       },
+      mdl: null,
+      dialog: {
+        title: "新增项目",
+        dom: "",
+        visible: false,
+      },
       tableData: [],
       pageData: {
         pageNum: 1, // 当前页
@@ -89,9 +98,40 @@ export default {
         }
       });
     },
+    handleAdd() {
+      this.dialog.dom = "Edit";
+      this.dialog.visible = true;
+    },
+    handleEdit(row) {
+      this.dialog.dom = "Edit";
+      this.mdl = {
+        eventType: "edit",
+        ...row,
+      };
+      this.dialog.visible = true;
+    },
+    handleDelete() {
+      this.$message.success("删除成功");
+    },
     handleEngin() {
       this.getTableData();
     },
+    // 关闭dialog
+    closeDialog() {
+      this.dialog.visible = false;
+      this.mdl = null;
+    },
+    submitForm() {
+      this.$refs.component.submitForm(async (from) => {
+        if (this.mdl) {
+          this.$message.success("修改成功");
+          this.closeDialog();
+        } else {
+          this.$message.success("新增成功");
+          this.closeDialog();
+        }
+      })
+    },
     // 获取列表数据
     getTableData() {
       const list = TABELLIST.filter(res => {
@@ -172,6 +212,13 @@ export default {
           <el-button @click="resetSearch">重置</el-button>
         </el-form-item>
       </el-form>
+      <el-button
+        class="search-btn"
+        style="margin-right: 16px; margin-bottom: 8px; float: right"
+        type="success"
+        @click="handleAdd()"
+      >新增
+      </el-button>
       <el-table height="625" :data="tableData" border>
         <el-table-column type="index" align="center" label="序号" width="100">
         </el-table-column>
@@ -228,15 +275,39 @@ export default {
         </el-table-column>
         <el-table-column v-if="searchForm.enginType === '2'" prop="system" align="center" label="高程系统">
         </el-table-column>
-        <el-table-column prop="address" align="center" label="操作">
+        <el-table-column width="160" prop="address" align="center" label="操作">
           <template slot-scope="scope">
             <el-button
               style="margin-right: 16px"
               @click="handleGoManage(scope.row)"
               type="text"
               size="small"
-            >预案信息管理</el-button
+            >详情</el-button
+            >
+            <el-button
+              style="margin-right: 16px"
+              @click="handleEdit(scope.row)"
+              type="text"
+              size="small"
             >
+              编辑
+            </el-button>
+            <el-popconfirm
+              confirm-button-text="确定"
+              cancel-button-text="取消"
+              icon="el-icon-info"
+              icon-color="red"
+              title="确定删除吗？"
+              @confirm="handleDelete(scope.row)"
+            >
+              <el-button
+                style="color: red"
+                type="text"
+                size="small"
+                slot="reference"
+              >删除
+              </el-button>
+            </el-popconfirm>
           </template>
         </el-table-column>
       </el-table>
@@ -253,6 +324,25 @@ export default {
       >
       </el-pagination>
     </div>
+    <el-dialog
+      :title="dialog.title"
+      @close="closeDialog"
+      :visible.sync="dialog.visible"
+      width="50%"
+    >
+      <component
+        v-if="dialog.visible"
+        :is="dialog.dom"
+        ref="component"
+        :model="mdl"
+      ></component>
+      <div slot="footer" class="dialog-footer">
+        <el-button size="mini" @click="closeDialog">取 消</el-button>
+        <el-button size="mini" type="primary" @click="submitForm"
+        >保存
+        </el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
@@ -265,7 +355,6 @@ export default {
   align-items: center;
   font-weight: 600;
 }
-
 .table-box {
   width: 100%;
   height: calc(100% - 50px - 24px);