fix: 添加水雨情信息

src/views/sluice/runManage/waterRainReport/index.vue

@@ -0,0 +1,3 @@
+<template>
+  <router-view />
+</template>

src/views/sluice/runManage/waterRainReport/testReportDetails/index.vue

@@ -0,0 +1,344 @@
+<!-- 水雨情测报页面 -->
+<template>
+  <div class="patrol-manage-page">
+    <div class="top-title">水闸信息</div>
+    <div class="table-box">
+      <div class="top-search">
+        <span>区域选择：</span>
+        <el-select v-model="dikeType" placeholder="请选择">
+          <!-- <el-option
+            v-for="item in dikeTypeList"
+            :key="item.dictValue"
+            :label="item.dictLabel"
+            :value="item.dictValue"
+          >
+          </el-option> -->
+        </el-select>
+        <span class="ml-12">水闸标识：</span>
+        <el-select v-model="dikeType" placeholder="请选择">
+          <el-option
+            v-for="item in dikeTypeList"
+            :key="item.dictValue"
+            :label="item.dictLabel"
+            :value="item.dictValue"
+          >
+          </el-option>
+        </el-select>
+        <el-button
+          class="!ml-10"
+          type="success"
+          @click="getTableData(searchInput)"
+          >搜索</el-button
+        >
+        <el-button @click="resetSearch()">重置</el-button>
+      </div>
+      <el-table class="mt-16" height="625" :data="tableData" border>
+        <el-table-column type="index" align="center" label="序号" width="80" />
+        <el-table-column prop="dikeName" align="center" label="水闸名称" />
+        <el-table-column prop="dikeCode" align="center" label="水闸代码" />
+        <el-table-column prop="dikeLength" align="center" label="水闸标识" />
+        <el-table-column prop="dikeType" align="center" label="区域" />
+        <el-table-column prop="project" align="center" label="管理机构" />
+        <el-table-column prop="operate" align="center" label="操作">
+          <template slot-scope="scope">
+            <el-button @click="handleCheck(scope.row)" type="text" size="small"
+              >查看</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-pagination
+        background
+        class="pagination"
+        style="margin-top: 16px; margin-right: 16px; float: right"
+        :current-page="pageData.pageNum"
+        :page-sizes="pageData.pageSizes"
+        layout="total, prev, pager, next, sizes, jumper"
+        :total="pageData.total"
+        @size-change="getTableData()"
+      >
+      </el-pagination>
+    </div>
+
+    <!-- 弹窗 -->
+    <el-dialog
+      title="标题"
+      @close="dialogVisible = false"
+      :visible.sync="dialogVisible"
+      width="520px"
+    >
+      <el-form
+        :model="ruleForm"
+        :rules="rules"
+        ref="ruleForm"
+        label-width="100px"
+      >
+        <el-form-item
+          label-width="120px"
+          label="日常巡查项目"
+          prop="checkings[0].xcId"
+        >
+          <el-select
+            filterable
+            remote
+            :remote-method="(query) => handleGetRemoteProjectListData(0, query)"
+            @focus="handleGetRemoteProjectListData(0, '')"
+            v-model="ruleForm.checkings[0].xcId"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in projectList0"
+              :label="item.name"
+              :value="item.id"
+              :key="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item
+          label-width="120px"
+          label="定期巡查项目"
+          prop="checkings[1].xcId"
+        >
+          <el-select
+            filterable
+            remote
+            :remote-method="(query) => handleGetRemoteProjectListData(1, query)"
+            @focus="handleGetRemoteProjectListData(1, '')"
+            v-model="ruleForm.checkings[1].xcId"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in projectList1"
+              :label="item.name"
+              :value="item.id"
+              :key="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item
+          label-width="120px"
+          label="特别巡查项目"
+          prop="checkings[2].xcId"
+        >
+          <el-select
+            filterable
+            remote
+            :remote-method="(query) => handleGetRemoteProjectListData(2, query)"
+            @focus="handleGetRemoteProjectListData(2, '')"
+            v-model="ruleForm.checkings[2].xcId"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in projectList2"
+              :label="item.name"
+              :value="item.id"
+              :key="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button size="mini" @click="resetForm">取 消</el-button>
+        <el-button size="mini" type="primary" @click="submitForm"
+          >保存</el-button
+        >
+      </div>
+    </el-dialog>
+  </div>
+</template>
+<script>
+import { getDikeProjectList, postProjectChecking } from "@/api/dike";
+import { postDFInspectionProjectList } from "@/api/management";
+
+export default {
+  data() {
+    return {
+      dialogVisible: false,
+      pageData: {
+        pageNum: 1,
+        pageSize: 10,
+        total: 0,
+      },
+      searchInput: "",
+      dikeTypeList: [
+        {
+          label: "全部",
+          value: "",
+        },
+      ], // 水闸类型列表
+      dikeType: "",
+      tableData: [],
+      ruleForm: {
+        dikeCode: "",
+        checkings: [
+          {
+            type: 0,
+            label: "日常检查",
+            xcId: "",
+          },
+          {
+            type: 1,
+            label: "定期检查",
+            xcId: "",
+          },
+          {
+            type: 2,
+            label: "特别检查",
+            xcId: "",
+          },
+        ],
+      },
+      projectList0: [], // 对应type===0的日常巡查项目
+      projectList1: [], // 对应type===1的日常巡查项目
+      projectList2: [], // 对应type===2的日常巡查项目
+      rules: {
+        ["checkings[0].xcId"]: [
+          { required: true, message: "请选择", trigger: "change" },
+        ],
+        ["checkings[1].xcId"]: [
+          { required: true, message: "请选择", trigger: "change" },
+        ],
+        ["checkings[2].xcId"]: [
+          { required: true, message: "请选择", trigger: "change" },
+        ],
+      },
+    };
+  },
+  created() {
+    this.getDicts("embankment_type").then((response) => {
+      this.dikeTypeList = response.data;
+    });
+  },
+  mounted() {
+    this.getTableData();
+  },
+  methods: {
+    // 获取列表信息
+    getTableData() {
+      getDikeProjectList({
+        pageNum: this.pageData.pageNum,
+        pageSize: this.pageData.pageSize,
+        data: {
+          dikeType: this.dikeType || "",
+          dikeName: this.searchInput || "",
+        },
+      }).then((res) => {
+        if (res) {
+          this.tableData = res.records;
+          this.pageData.total = res.total;
+        }
+      });
+    },
+    // 重置搜索条件
+    resetSearch() {
+      this.searchInput = "";
+      this.dikeType = "";
+      this.getTableData();
+    },
+    handleGoPlan(row) {
+      this.$router.push({
+        path: "inspectionPlan",
+        query: {
+          dikeCode: row.dikeCode,
+          dikeName: row.dikeName,
+        },
+      });
+    },
+    handleGoRecord(row) {
+      this.$router.push({
+        path: "inspectionRecords",
+        query: {
+          dikeCode: row.dikeCode,
+          dikeName: row.dikeName,
+        },
+      });
+    },
+    // 请求项目列表
+    initProjectList(type, query) {
+      postDFInspectionProjectList({
+        data: {
+          timeView: {
+            timeField: "create_time",
+          },
+          type,
+        },
+        cv: {
+          name: "name",
+          type: "like",
+          value: query,
+        },
+        pageSize: 20,
+        pageNum: 1,
+      }).then((res) => {
+        if (res) {
+          this[`projectList${type}`] = res.records;
+        }
+      });
+    },
+    // 请求项目列表数据
+    handleGetRemoteProjectListData(type, query) {
+      this.initProjectList(type, query);
+    },
+    // 查看详情
+    handleCheck(row) {
+      // this.initProjectList();
+      // this.dialogVisible = true;
+      // this.ruleForm.dikeCode = row.dikeCode;
+    },
+    resetForm() {
+      this.$refs.ruleForm.resetFields();
+      this.dialogVisible = false;
+    },
+    submitForm() {
+      console.log("表单 >>> ", this.ruleForm);
+      this.$refs.ruleForm.validate((valid) => {
+        if (valid) {
+          postProjectChecking(this.ruleForm).then((res) => {
+            console.log("res >>>>>  ", res);
+            if (res?.success) {
+              this.$message.success("配置成功");
+              this.dialogVisible = false;
+            }
+          });
+        }
+      });
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.patrol-manage-page {
+  width: 100%;
+  min-height: calc(100vh - 56px);
+  padding-left: 24px;
+  .top-title {
+    height: 40px;
+    background-color: white;
+    display: flex;
+    padding-left: 16px;
+    align-items: center;
+    font-weight: 600;
+  }
+
+  .table-box {
+    width: 100%;
+    min-height: calc(100vh - 56px - 64px);
+    margin-top: 24px;
+    padding: 16px;
+    background-color: white;
+
+    .top-search {
+      margin-bottom: 8px;
+
+      .search-input {
+        width: 202px;
+        margin-right: 10px;
+      }
+    }
+
+    .table {
+      height: calc(680px - 34px);
+    }
+  }
+}
+</style>

src/views/sluice/runManage/waterRainReport/testReportManage/index.vue

@@ -0,0 +1,362 @@
+<!-- 水雨情测报页面 -->
+<template>
+  <div class="patrol-manage-page">
+    <div class="top-title">水雨情测报</div>
+    <div class="table-box">
+      <div class="top-search">
+        <span>起/终点所在地：</span>
+        <el-select v-model="dikeType" placeholder="请选择">
+          <!-- <el-option
+            v-for="item in dikeTypeList"
+            :key="item.dictValue"
+            :label="item.dictLabel"
+            :value="item.dictValue"
+          >
+          </el-option> -->
+        </el-select>
+        <span> - </span>
+        <el-select v-model="dikeType" placeholder="请选择">
+          <!-- <el-option
+            v-for="item in dikeTypeList"
+            :key="item.dictValue"
+            :label="item.dictLabel"
+            :value="item.dictValue"
+          >
+          </el-option> -->
+        </el-select>
+        <span class="ml-12">水闸类型：</span>
+        <el-select v-model="dikeType" placeholder="请选择">
+          <el-option
+            v-for="item in dikeTypeList"
+            :key="item.dictValue"
+            :label="item.dictLabel"
+            :value="item.dictValue"
+          >
+          </el-option>
+        </el-select>
+        <el-button
+          class="!ml-10"
+          type="success"
+          @click="getTableData(searchInput)"
+          >搜索</el-button
+        >
+        <el-button @click="resetSearch()">重置</el-button>
+      </div>
+      <el-table class="mt-16" height="625" :data="tableData" border>
+        <el-table-column type="index" align="center" label="序号" width="80" />
+        <el-table-column prop="dikeName" align="center" label="水闸名称" />
+        <!-- <el-table-column prop="dikeCode" align="center" label="水闸代码" /> -->
+        <el-table-column prop="dikeLength" align="center" label="水闸长度" />
+        <el-table-column prop="dikeType" align="center" label="水闸型式" />
+        <el-table-column prop="project" align="center" label="工程任务" />
+        <el-table-column prop="waterHeight" align="center" label="水位高度" />
+        <el-table-column prop="rainValue" align="center" label="雨量监测" />
+        <el-table-column prop="operate" align="center" label="操作">
+          <template slot-scope="scope">
+            <el-button @click="handleCheck(scope.row)" type="text" size="small"
+              >查看</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-pagination
+        background
+        class="pagination"
+        style="margin-top: 16px; margin-right: 16px; float: right"
+        :current-page="pageData.pageNum"
+        :page-sizes="pageData.pageSizes"
+        layout="total, prev, pager, next, sizes, jumper"
+        :total="pageData.total"
+        @size-change="getTableData()"
+      >
+      </el-pagination>
+    </div>
+
+    <!-- 弹窗 -->
+    <el-dialog
+      title="巡查项目配置"
+      @close="dialogVisible = false"
+      :visible.sync="dialogVisible"
+      width="520px"
+    >
+      <el-form
+        :model="ruleForm"
+        :rules="rules"
+        ref="ruleForm"
+        label-width="100px"
+      >
+        <el-form-item
+          label-width="120px"
+          label="日常巡查项目"
+          prop="checkings[0].xcId"
+        >
+          <el-select
+            filterable
+            remote
+            :remote-method="(query) => handleGetRemoteProjectListData(0, query)"
+            @focus="handleGetRemoteProjectListData(0, '')"
+            v-model="ruleForm.checkings[0].xcId"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in projectList0"
+              :label="item.name"
+              :value="item.id"
+              :key="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item
+          label-width="120px"
+          label="定期巡查项目"
+          prop="checkings[1].xcId"
+        >
+          <el-select
+            filterable
+            remote
+            :remote-method="(query) => handleGetRemoteProjectListData(1, query)"
+            @focus="handleGetRemoteProjectListData(1, '')"
+            v-model="ruleForm.checkings[1].xcId"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in projectList1"
+              :label="item.name"
+              :value="item.id"
+              :key="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item
+          label-width="120px"
+          label="特别巡查项目"
+          prop="checkings[2].xcId"
+        >
+          <el-select
+            filterable
+            remote
+            :remote-method="(query) => handleGetRemoteProjectListData(2, query)"
+            @focus="handleGetRemoteProjectListData(2, '')"
+            v-model="ruleForm.checkings[2].xcId"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in projectList2"
+              :label="item.name"
+              :value="item.id"
+              :key="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button size="mini" @click="resetForm">取 消</el-button>
+        <el-button size="mini" type="primary" @click="submitForm"
+          >保存</el-button
+        >
+      </div>
+    </el-dialog>
+  </div>
+</template>
+<script>
+import { getDikeProjectList, postProjectChecking } from "@/api/dike";
+import { postDFInspectionProjectList } from "@/api/management";
+
+export default {
+  data() {
+    return {
+      dialogVisible: false,
+      pageData: {
+        pageNum: 1,
+        pageSize: 10,
+        total: 0,
+      },
+      searchInput: "",
+      dikeTypeList: [
+        {
+          label: "全部",
+          value: "",
+        },
+      ], // 水闸类型列表
+      dikeType: "",
+      tableData: [],
+      ruleForm: {
+        dikeCode: "",
+        checkings: [
+          {
+            type: 0,
+            label: "日常检查",
+            xcId: "",
+          },
+          {
+            type: 1,
+            label: "定期检查",
+            xcId: "",
+          },
+          {
+            type: 2,
+            label: "特别检查",
+            xcId: "",
+          },
+        ],
+      },
+      projectList0: [], // 对应type===0的日常巡查项目
+      projectList1: [], // 对应type===1的日常巡查项目
+      projectList2: [], // 对应type===2的日常巡查项目
+      rules: {
+        ["checkings[0].xcId"]: [
+          { required: true, message: "请选择", trigger: "change" },
+        ],
+        ["checkings[1].xcId"]: [
+          { required: true, message: "请选择", trigger: "change" },
+        ],
+        ["checkings[2].xcId"]: [
+          { required: true, message: "请选择", trigger: "change" },
+        ],
+      },
+    };
+  },
+  created() {
+    this.getDicts("embankment_type").then((response) => {
+      this.dikeTypeList = response.data;
+    });
+  },
+  mounted() {
+    this.getTableData();
+  },
+  methods: {
+    // 获取列表信息
+    getTableData() {
+      getDikeProjectList({
+        pageNum: this.pageData.pageNum,
+        pageSize: this.pageData.pageSize,
+        data: {
+          dikeType: this.dikeType || "",
+          dikeName: this.searchInput || "",
+        },
+      }).then((res) => {
+        if (res) {
+          this.tableData = res.records;
+          this.pageData.total = res.total;
+        }
+      });
+    },
+    // 重置搜索条件
+    resetSearch() {
+      this.searchInput = "";
+      this.dikeType = "";
+      this.getTableData();
+    },
+    handleGoPlan(row) {
+      this.$router.push({
+        path: "inspectionPlan",
+        query: {
+          dikeCode: row.dikeCode,
+          dikeName: row.dikeName,
+        },
+      });
+    },
+    handleGoRecord(row) {
+      this.$router.push({
+        path: "inspectionRecords",
+        query: {
+          dikeCode: row.dikeCode,
+          dikeName: row.dikeName,
+        },
+      });
+    },
+    // 请求项目列表
+    initProjectList(type, query) {
+      postDFInspectionProjectList({
+        data: {
+          timeView: {
+            timeField: "create_time",
+          },
+          type,
+        },
+        cv: {
+          name: "name",
+          type: "like",
+          value: query,
+        },
+        pageSize: 20,
+        pageNum: 1,
+      }).then((res) => {
+        if (res) {
+          this[`projectList${type}`] = res.records;
+        }
+      });
+    },
+    // 请求项目列表数据
+    handleGetRemoteProjectListData(type, query) {
+      this.initProjectList(type, query);
+    },
+    // 配置项目
+    handleCheck(row) {
+      // this.initProjectList();
+      // this.dialogVisible = true;
+      // this.ruleForm.dikeCode = row.dikeCode;
+      this.$router.push({
+        path: "testReportDetails",
+        query: {
+          id: row.id,
+        },
+      });
+    },
+    resetForm() {
+      this.$refs.ruleForm.resetFields();
+      this.dialogVisible = false;
+    },
+    submitForm() {
+      console.log("表单 >>> ", this.ruleForm);
+      this.$refs.ruleForm.validate((valid) => {
+        if (valid) {
+          postProjectChecking(this.ruleForm).then((res) => {
+            console.log("res >>>>>  ", res);
+            if (res?.success) {
+              this.$message.success("配置成功");
+              this.dialogVisible = false;
+            }
+          });
+        }
+      });
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.patrol-manage-page {
+  width: 100%;
+  min-height: calc(100vh - 56px);
+  padding-left: 24px;
+  .top-title {
+    height: 40px;
+    background-color: white;
+    display: flex;
+    padding-left: 16px;
+    align-items: center;
+    font-weight: 600;
+  }
+
+  .table-box {
+    width: 100%;
+    min-height: calc(100vh - 56px - 64px);
+    margin-top: 24px;
+    padding: 16px;
+    background-color: white;
+
+    .top-search {
+      margin-bottom: 8px;
+
+      .search-input {
+        width: 202px;
+        margin-right: 10px;
+      }
+    }
+
+    .table {
+      height: calc(680px - 34px);
+    }
+  }
+}
+</style>