fix：新增裂缝管理，巡检任务新增同步

src/api/xj/bolt.js

@@ -0,0 +1,168 @@
+/*
+ * @Author: error: error: git config user.name & please set dead value or install git && error: git config user.email & please set dead value or install git & please set dead value or install git
+ * @Date: 2024-10-08 09:26:24
+ * @LastEditors: SunTao 328867980@qq.com
+ * @LastEditTime: 2025-03-20 09:59:56
+ * @FilePath: \znxjxt-ui\src\api\xj\disease.js
+ * @Description: 巡检信息-裂缝管理
+ */
+import request from "@/utils/request";
+
+// 查询病害日志列表
+export function listDefect(query) {
+  return request({
+    url: "/xj/batchDefect/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询病害日志详细
+export function getDefect(id) {
+  return request({
+    url: "/xj/batchDefect/" + id,
+    method: "get",
+  });
+}
+
+// 新增病害日志
+export function addDefect(data) {
+  return request({
+    url: "/xj/batchDefect",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改病害日志
+export function updateDefect(data) {
+  return request({
+    url: "/xj/batchDefect",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除病害日志
+export function delDefect(data) {
+  return request({
+    url: "/xj/batchDefect/",
+    method: "delete",
+    data,
+  });
+}
+
+// 病害类型下拉数据
+export function getDefectTypes() {
+  return request({
+    url: "/metadata/defectTypes",
+    method: "get",
+  });
+}
+
+// 路段下拉数据
+export function getSegment() {
+  return request({
+    url: "/api/v2/segment/selectList",
+    method: "post",
+  });
+}
+
+// 查询列表病害类型
+export function getDefectList(params) {
+  return request({
+    url: "/bigscreen/v2/getBatchDefectTypesDrowDown",
+    method: "get",
+    params,
+  });
+}
+
+// 校验状态下拉类型
+export function getStatesList() {
+  return request({
+    url: "/metadata/defectDataStatus",
+    method: "get",
+  });
+}
+
+// 病害状态下拉类型
+export function getDefectStatus() {
+  return request({
+    url: "/metadata/defectState",
+    method: "get",
+  });
+}
+
+// 批量修改病害状态
+export function changeDefectStatus(data) {
+  return request({
+    url: "/xj/batchDefect/batch",
+    method: "put",
+    data,
+  });
+}
+
+// 合并病害接口
+export function mergeDefect(data) {
+  return request({
+    url: "/xj/batchDefect/mergeDefects",
+    method: "post",
+    data,
+  });
+}
+
+// 拆分病害接口
+export function splitDefect(data) {
+  return request({
+    url: "/xj/batchDefect/splitDefect",
+    method: "post",
+    data,
+  });
+}
+
+// 根据病害id查询快照id下拉
+export function getDefectById(id) {
+  return request({
+    url: "/xj/batchDefect/getDefectDetailDropDownList",
+    method: "get",
+    params: { id },
+  });
+}
+
+// 根据快照id查询查询具体数据
+export function getDetailsBySnapShotId(snapShotId) {
+  return request({
+    url: "/xj/batchDefect/getDefectBySnapShotId",
+    method: "get",
+    params: { snapShotId },
+  });
+}
+
+// 巡检任务下拉接口
+export function getTaskList(params) {
+  return request({
+    url: "/xj/xjtask/taskDropDown",
+    method: "get",
+    params,
+  });
+}
+
+// 病害导出功能
+export function exportDefectData(data) {
+  return request({
+    url: "/xj/batchDefect/export",
+    responseType: "blob",
+    method: "post",
+    data,
+  });
+}
+
+
+// 批量操作提交
+export function handelDealDefect(data) {
+  return request({
+    url: "/xj/batchDefect/dealDefectBatch",
+    method: "post",
+    data,
+  });
+}

src/api/xj/task.js

@@ -83,3 +83,21 @@ export function getDefectPoint(params) {
     params,
   });
 }
+
+// 查询增量同步数据
+export function getMoreType(params) {
+  return request({
+    url: "/xj/xjtask/getMoreType",
+    method: "get",
+    params,
+  });
+}
+
+// 增量同步未同步的病害数据
+export function getMoreDefect(data) {
+  return request({
+    url: "/xj/xjtask/syncMore",
+    method: "post",
+    data,
+  });
+}

src/views/xj/inspection/bolt-management/components/batch-dialog.vue

@@ -0,0 +1,136 @@
+<!--
+ * @Author: SunTao 328867980@qq.com
+ * @Date: 2025-03-19 13:47:20
+ * @LastEditors: SunTao 328867980@qq.com
+ * @LastEditTime: 2025-03-20 13:36:10
+ * @FilePath: \znxjxt-ui\src\views\xj\inspection\bolt-management\components\batch-dialog.vue
+ * @Description: 螺栓检测-批量操作
+ *
+-->
+<template>
+  <div class="add-content">
+    <el-form class="addForm" ref="batchForm" :model="batchForm" :rules="rules" label-width="100px">
+      <el-row :gutter="24">
+        <el-col :span="12">
+          <el-form-item label="道路名称" prop="segmentId">
+            <el-select style="width:100%" v-model="batchForm.segmentId" placeholder="请选择路段" filterable clearable>
+              <el-option v-for="item in segmentList" :key="item.value" :label="item.label" :value="item.value" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="病害类型" prop="defectType">
+            <el-cascader style="width:100%" v-model="batchForm.defectType" :options="tableDefect" :props="{
+              checkStrictly: false,
+              emitPath: false,
+              children: 'subTypes',
+              multiple: true
+            }" clearable></el-cascader>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row :gutter="24">
+        <el-col :span="12">
+          <el-form-item label="开始桩号" prop="stakeStart">
+            <el-input v-model="batchForm.stakeStart" placeholder="请输入开始桩号" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="结束桩号" prop="stakeEnd">
+            <el-input v-model="batchForm.stakeEnd" placeholder="请输入结束桩号" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <div class="dialog-footer">
+      <el-button type="primary" @click="submitForm">确 定</el-button>
+      <el-button @click="cancel">取 消</el-button>
+    </div>
+  </div>
+</template>
+
+<script>
+import {handelDealDefect} from "@/api/xj/bolt"
+export default {
+  name: "BatchDialog",
+  props: {
+    segmentList: {
+      type: Array,
+      default: () => []
+    },
+    roadType: {
+      type: Array,
+      default: () => []
+    },
+    tableDefect: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      // 表单数据
+      batchForm: {
+        segmentId: "",
+        defectType: "",
+        stakeStart: "",
+        stakeEnd: ""
+      },
+      // 验证规则
+      rules: {
+        defectType: [
+          { required: true, message: "请选择病害类型", trigger: "change" },
+        ],
+        stakeStart: [
+          { required: true, message: "请输入开始桩号", trigger: "blur" },
+          {
+            pattern: /^K\d{4}\+\d{3}$/,
+            message: "请按照K0000+000格式进行填写",
+          },
+        ],
+        stakeEnd: [
+          { required: true, message: "请输入结束桩号", trigger: "blur" },
+          {
+            pattern: /^K\d{4}\+\d{3}$/,
+            message: "请按照K0000+000格式进行填写",
+          },
+        ]
+      },
+    }
+  },
+  methods: {
+    /**
+     * @description: 点击取消事件
+     * @return {*}
+     */
+    cancel() {
+      this.$emit("cancel");
+    },
+
+    /**
+     * @description: 点击确定事件
+     * @return {*}
+     */
+    submitForm() {
+      this.$refs["batchForm"].validate((valid) => {
+        if (valid) {
+          handelDealDefect(this.batchForm).then(({code, msg})=>{
+            if(code===200){
+              this.cancel()
+              this.$modal.msgSuccess(msg);
+            }
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+/* 页脚 */
+.dialog-footer {
+  display: flex;
+  justify-content: flex-end;
+}
+</style>

src/views/xj/inspection/bolt-management/components/merge-dialog.vue

@@ -0,0 +1,484 @@
+<!--
+ * @Author: SunTao 328867980@qq.com
+ * @Date: 2024-11-04 10:54:59
+ * @LastEditors: SunTao 328867980@qq.com
+ * @LastEditTime: 2025-03-19 10:34:00
+ * @FilePath: \znxjxt-ui\src\views\xj\inspection\disease-management\components\merge-dialog.vue
+ * @Description: 螺栓检测-合并病害弹窗
+-->
+
+<template>
+  <div class="content">
+    <div class="merge-form">
+      <el-form :model="mergeForm" ref="mergeForm" size="small" :inline="true" label-width="5rem">
+        <el-row :gutter="24">
+          <el-col :span="8">
+            <el-form-item label="道路名称" prop="segmentId">
+              <el-select v-model="mergeForm.segmentId" placeholder="请选择路段" clearable>
+                <el-option v-for="item in segmentList" :key="item.value" :label="item.label" :value="item.value" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="采集时间" prop="dateTime">
+              <el-date-picker :style="{ width: '16rem' }" v-model="dateTime" type="daterange" start-placeholder="开始日期"
+                end-placeholder="结束日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" clearable />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="病害类型" prop="defectType">
+              <el-cascader v-model="paramsDefectType" :options="tableDefect" :props="{
+                checkStrictly: true,
+                emitPath: true,
+                children: 'subTypes',
+              }" clearable></el-cascader>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24">
+          <el-col :span="8">
+            <el-form-item label="公里桩" prop="stakeRange">
+              <el-input v-model="mergeForm.stakeStart" placeholder="起始公里桩" style="width: 7rem" clearable />
+              <span style="margin: 0 5px">-</span>
+              <el-input v-model="mergeForm.stakeEnd" placeholder="终止公里桩" style="width: 7rem" clearable />
+              <el-tooltip class="item" effect="dark" content="格式为K0000+000" placement="top">
+                <i class="el-icon-info"></i>
+              </el-tooltip>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="快照id" prop="snapshotId">
+              <el-input v-model="mergeForm.snapshotId" placeholder="请填写快照id" clearable />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="病害id" prop="id">
+              <el-input v-model="mergeForm.id" placeholder="请填写病害id" clearable />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24">
+          <el-col :span="8" style="padding-left: 2rem">
+            <el-form-item label="" label-width="2rem">
+              <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+              <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+    </div>
+    <div class="merge-table">
+      <el-table ref="defectTable" v-loading="loading" :data="defectMergeList" @select="handleSelectionChange"
+        @select-all="handleSelectAll" style="width: 100%" height="30rem">
+        <el-table-column type="selection" width="55" align="center" />
+        <el-table-column label="路段名称" align="center" prop="segmentName" />
+        <el-table-column label="采集时间" align="center" prop="createdTime">
+          <template slot-scope="scope">
+            <span>{{ new Date(scope.row.createdTime).toLocaleString() }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="病害类型" align="center" prop="defectTypeName">
+        </el-table-column>
+        <!-- <el-table-column label="病害状态" align="center" prop="state">
+          <template slot-scope="scope">
+            <span>{{ filterState(scope.row.state) }}</span>
+          </template>
+        </el-table-column> -->
+        <el-table-column label="校验状态" align="center" prop="dataStatus">
+          <template slot-scope="scope">
+            <span>{{
+              scope.row.dataStatus
+                ? scope.row.dataStatus === 1
+                  ? "未校验"
+                  : "已校验"
+                : ""
+            }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="开始桩号" align="center" prop="stakeStart" />
+        <el-table-column label="结束桩号" align="center" prop="stakeEnd" />
+        <el-table-column label="病害图片" align="center" prop="media">
+          <template slot-scope="scope">
+            <img @click="showScreenImg(scope.row)" height="50" :src="scope.row.mediaUrl" />
+          </template>
+        </el-table-column>
+        <el-table-column label="病害长度" align="center" prop="targetLen" />
+        <el-table-column label="病害面积" align="center" prop="targetArea" />
+        <el-table-column label="预警标识" align="center" prop="warningFlag">
+          <template slot-scope="scope">
+            <el-tag :type="scope.row.warningFlag === 1 ? 'danger' : 'success'">
+              {{ scope.row.warningFlag === 1 ? "是" : "否" }}
+            </el-tag>
+          </template>
+        </el-table-column>
+      </el-table>
+      <!-- 分页组件 -->
+      <div class="pagination-part">
+        <el-pagination background :current-page.sync="pagination.page" @current-change="handleCurrentChange"
+          :page-sizes="[10, 20, 30, 40]" :page-size.sync="pagination.size" @size-change="handleSizeChange"
+          layout="total, sizes, prev, pager, next, jumper" :total="tableTotal">
+        </el-pagination>
+      </div>
+    </div>
+    <div class="merge-footer">
+      <el-button type="primary" @click="submitForm">确 定</el-button>
+      <el-button @click="cancel">取 消</el-button>
+    </div>
+
+    <!-- 查看图片大图 -->
+    <el-dialog title="查看图片" :visible.sync="showImageDialog" width="85rem" append-to-body destroy-on-close
+      @close="imgCancel">
+      <div class="image-container" ref="imageContainer">
+        <img :src="currentImageItem.mediaUrl" alt="Main Image" ref="mainImage" @load="updateRects" />
+        <div v-for="(rect, index) in rects" :key="index" class="rect-overlay" :style="getRectStyle(rect)"></div>
+        <div class="rect-image">
+          采集时间:
+          {{ new Date(currentImageItem.createdTime).toLocaleString() }}
+          起始桩号： {{ currentImageItem.stakeStart || "暂无数据" }} 终止桩号：
+          {{ currentImageItem.stakeEnd || "暂无数据" }}
+          病害类型：
+          {{ currentImageItem.defectTypeName || "暂无数据" }}
+          病害面积：{{ currentImageItem.targetArea }}平方米 病害长度：{{
+            currentImageItem.targetLen * 1 <= 0 ? "暂无数据" : `${currentImageItem.targetLen}米` }} </div>
+        </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { listDefect, mergeDefect } from "@/api/xj/bolt";
+export default {
+  name: "MergeDialog",
+  props: {
+    segmentList: {
+      type: Array,
+      default: () => [],
+    },
+    tableDefect: {
+      type: Array,
+      default: () => [],
+    },
+    defectStatus: {
+      type: Array,
+      default: () => [],
+    },
+    mergeItem: {
+      type: Object,
+      default: () => { },
+    },
+  },
+  data() {
+    return {
+      // 表单绑定
+      mergeForm: {
+        // 道路名称绑定
+        segmentId: "",
+        // 病害类型绑定
+        classType: "",
+        defectType: "",
+        // 公里桩绑定
+        stakeStart: "",
+        stakeEnd: "",
+        // 快照id
+        snapshotId: "",
+        // 病害id
+        id: "",
+      },
+      // 查询表单绑定
+      searchForm: {},
+      // 病害类型绑定
+      paramsDefectType: [],
+      // 采集时间绑定
+      dateTime: [],
+      // 列表数据绑定
+      defectMergeList: [],
+      // 表格加载状态
+      loading: false,
+      // 列表选中数据
+      checkIds: [],
+      // 分页绑定
+      pagination: {
+        page: 1,
+        size: 10,
+      },
+      // 数据总数
+      tableTotal: 0,
+      // 查看图片大图弹窗显隐控制
+      showImageDialog: false,
+      // 查看大图片路径
+      currentImageItem: "",
+      // 图片病害位置信息
+      rects: [],
+      // 合并病害弹窗显隐控制
+      mergeVisibleDialog: false,
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /* 过滤列表病害类型 */
+    filterDefect(value) {
+      let a = null;
+      [a] = this.tableDefect.filter((item) => {
+        return item.value === value;
+      });
+      if (a) {
+        return a.label;
+      }
+    },
+
+    // /* 过滤列表病害状态 */
+    // filterState(value) {
+    //   let a = null;
+    //   [a] = this.defectStatus.filter((item) => {
+    //     return item.value === value;
+    //   });
+    //   if (a) {
+    //     return a.label;
+    //   }
+    // },
+
+    /* 搜索事件 */
+    handleQuery() {
+      const data = {
+        ...this.mergeForm,
+        classType: this.paramsDefectType ? this.paramsDefectType[0] : "",
+        defectType: this.paramsDefectType
+          ? this.paramsDefectType.length > 1
+            ? this.paramsDefectType[1]
+            : ""
+          : "",
+      };
+      this.searchForm = JSON.parse(JSON.stringify(data));
+      this.getList();
+    },
+
+    /* 重置事件 */
+    resetQuery() {
+      this.searchForm = {};
+      this.mergeForm = {
+        // 道路名称绑定
+        segmentId: "",
+        // 病害类型绑定
+        defectType: "",
+        classType: "",
+        type: "",
+        // 公里桩绑定
+        stakeStart: "",
+        stakeEnd: "",
+        // 快照id
+        snapshotId: "",
+        // 病害id
+        id: "",
+      };
+      this.dateTime = [];
+      this.getList();
+    },
+
+    /** 查询缺陷列表 */
+    getList() {
+      this.loading = true;
+      const params = {
+        ...this.searchForm,
+        ...this.pagination,
+        startTime: this.dateTime ? this.dateTime[0] : "",
+        endTime: this.dateTime ? this.dateTime[1] : "",
+      };
+      listDefect(params)
+        .then((response) => {
+          this.defectMergeList = response.rows;
+          this.tableTotal = response.total;
+          this.loading = false;
+          this.$nextTick(() => {
+            this.handleListSelect();
+          });
+        })
+        .catch(() => {
+          this.loading = false;
+        });
+    },
+
+    /* 列表选中事件 */
+    handleSelectionChange(selection, row) {
+      if (selection.length > 1) {
+        this.$refs.defectTable.clearSelection();
+        this.$refs.defectTable.toggleRowSelection(selection.pop());
+        this.checkIds = [row.id];
+      } else if (selection.length === 0) {
+        this.checkIds = [];
+      } else {
+        this.checkIds = [row.id];
+      }
+    },
+
+    /* 列表全选事件 */
+    handleSelectAll() {
+      this.$refs.defectTable.clearSelection();
+    },
+
+    /* 列表框回显勾选 */
+    handleListSelect() {
+      const { defectTable } = this.$refs;
+      if (defectTable) {
+        this.defectMergeList.forEach((temp) => {
+          defectTable.toggleRowSelection(temp, this.checkIds.includes(temp.id));
+        });
+      }
+    },
+
+    /* 点击取消事件 */
+    cancel() {
+      this.$emit("mergeCancel");
+    },
+
+    /* 点击确认事件 */
+    submitForm() {
+      const data = {
+        aimSnapshotId: this.checkIds[0],
+        snapshotId: this.mergeItem.snapshotId,
+      };
+      mergeDefect(data).then(({ code, msg }) => {
+        if (code === 200) {
+          this.cancel();
+          this.$modal.msgSuccess(msg);
+        } else {
+          this.$modal.msgWarning(msg);
+        }
+      });
+    },
+
+    /* 切换分页 */
+    handleCurrentChange(arg) {
+      this.pagination.page = arg;
+      this.getList();
+    },
+
+    /* 切换每条/页 */
+    handleSizeChange(arg) {
+      this.pagination.size = arg;
+      this.getList();
+    },
+
+    /* 打开查看图片弹窗 */
+    showScreenImg(item) {
+      this.currentImageItem = item;
+      this.showImageDialog = true;
+    },
+
+    /* 图片位置信息获取 */
+    updateRects() {
+      this.rects = [];
+      this.rectsItem = {};
+      const image = this.$refs.mainImage;
+      const rects = this.currentImageItem?.rect?.split(",").map(Number) || [];
+      this.rects = [
+        {
+          left: rects[0],
+          top: rects[1],
+          width: rects[2],
+          height: rects[3],
+        },
+      ];
+    },
+
+    /* 图片红框位置 */
+    getRectStyle({ left, top, width, height }) {
+      const image = this.$refs.mainImage;
+      const container = this.$refs.imageContainer;
+      if (!image || !container) return {};
+
+      const scaleX = container.clientWidth / image.naturalWidth;
+      const scaleY = container.clientHeight / image.naturalHeight;
+      const scale = Math.min(scaleX, scaleY);
+
+      const renderedWidth = image.naturalWidth * scale;
+      const renderedHeight = image.naturalHeight * scale;
+
+      const offsetX = (container.clientWidth - renderedWidth) / 2;
+      const offsetY = (container.clientHeight - renderedHeight) / 2;
+
+      return {
+        position: "absolute",
+        left: `${left * scale + offsetX}px`,
+        top: `${top * scale + offsetY}px`,
+        width: `${width * scale}px`,
+        height: `${height * scale}px`,
+        border: "2px solid #FF0000",
+        boxSizing: "border-box",
+      };
+    },
+
+    /* 关闭查看图片弹窗 */
+    imgCancel() {
+      this.showImageDialog = false;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.content {
+  width: 100%;
+  height: 45rem;
+
+  .merge-form {
+    width: 100%;
+    height: 20%;
+  }
+
+  .merge-table {
+    width: 100%;
+    height: 75%;
+
+    /* 分页样式 */
+    .pagination-part {
+      width: 100%;
+      display: flex;
+      padding: 1rem 0;
+      justify-content: flex-end;
+    }
+  }
+
+  .merge-footer {
+    width: 100%;
+    height: 5%;
+    display: flex;
+    justify-content: flex-end;
+  }
+}
+
+/* 查看大图弹窗 */
+.image-container {
+  position: relative;
+  width: 100%;
+  height: 80%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+}
+
+.image-container img {
+  max-width: 100%;
+  max-height: 100%;
+  object-fit: contain;
+}
+
+.rect-overlay {
+  position: absolute;
+  pointer-events: none;
+  border: 2px solid red;
+}
+
+// 图片信息
+.rect-image {
+  width: 90%;
+  position: absolute;
+  top: 0;
+  font-size: 1.2rem;
+  color: #ffffff;
+  background-color: rgba(0, 0, 0, 0.5);
+}
+</style>

src/views/xj/inspection/road-management/components/road-add.vue

@@ -9,43 +9,19 @@
 
 <template>
   <div class="add-content">
-    <el-form
+    <el-form class="addForm" ref="roadForm" :model="roadForm" :rules="rules" label-width="100px">
-      class="addForm"
-      ref="roadForm"
-      :model="roadForm"
-      :rules="rules"
-      label-width="100px"
-    >
       <el-row :gutter="24">
         <el-col :span="dialogItem.title === '添加路产' ? 12 : 24">
           <el-form-item label="道路名称" prop="segmentId">
-            <el-select
+            <el-select v-model="roadForm.segmentId" placeholder="请选择路段" clearable filterable>
-              v-model="roadForm.segmentId"
+              <el-option v-for="item in segmentList" :key="item.value" :label="item.label" :value="item.value" />
-              placeholder="请选择路段"
-              clearable
-            >
-              <el-option
-                v-for="item in segmentList"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value"
-              />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="12" v-if="dialogItem.title === '添加路产'">
           <el-form-item label="路产类型" prop="equipmentType">
-            <el-select
+            <el-select v-model="roadForm.equipmentType" placeholder="请选择路产类型" clearable>
-              v-model="roadForm.equipmentType"
+              <el-option v-for="item in roadType" :key="item.value" :label="item.label" :value="item.value" />
-              placeholder="请选择路产类型"
-              clearable
-            >
-              <el-option
-                v-for="item in roadType"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value"
-              />
             </el-select>
           </el-form-item>
         </el-col>
@@ -69,11 +45,7 @@
         </el-col> -->
         <el-col :span="12">
           <el-form-item label="上下行" prop="inspectDirection">
-            <el-select
+            <el-select v-model="roadForm.inspectDirection" placeholder="请选择上下行" clearable>
-              v-model="roadForm.inspectDirection"
-              placeholder="请选择上下行"
-              clearable
-            >
               <el-option label="上行" value="0" />
               <el-option label="下行" value="1" />
             </el-select>
@@ -81,17 +53,8 @@
         </el-col>
         <el-col :span="12">
           <el-form-item label="路产状态" prop="state">
-            <el-select
+            <el-select v-model="roadForm.state" placeholder="请选择路产状态" clearable>
-              v-model="roadForm.state"
+              <el-option v-for="item in defectStatus" :key="item.value" :label="item.label" :value="item.value" />
-              placeholder="请选择路产状态"
-              clearable
-            >
-              <el-option
-                v-for="item in defectStatus"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value"
-              />
             </el-select>
           </el-form-item>
         </el-col>
@@ -99,51 +62,25 @@
       <el-row :gutter="24">
         <el-col :span="12">
           <el-form-item label="开始桩号" prop="stakeStart">
-            <el-input
+            <el-input v-model="roadForm.stakeStart" placeholder="请输入开始桩号" />
-              v-model="roadForm.stakeStart"
-              placeholder="请输入开始桩号"
-            />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="结束桩号" prop="stakeEnd">
-            <el-input
+            <el-input v-model="roadForm.stakeEnd" placeholder="请输入结束桩号" />
-              v-model="roadForm.stakeEnd"
-              placeholder="请输入结束桩号"
-            />
           </el-form-item>
         </el-col>
       </el-row>
       <el-form-item label="病害位置">
-        <fssm-map
+        <fssm-map ref="addMap" @map-click="getMapClick" class="no-hand-cursor"></fssm-map>
-          ref="addMap"
-          @map-click="getMapClick"
-          class="no-hand-cursor"
-        ></fssm-map>
       </el-form-item>
       <el-form-item label="上传病害图片">
-        <el-upload
+        <el-upload ref="upload" accept=".jpg, .png" :action="upload.url" :headers="upload.headers"
-          ref="upload"
+          :file-list="upload.fileList" :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess"
-          accept=".jpg, .png"
+          :auto-upload="false" list-type="picture">
-          :action="upload.url"
+          <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
-          :headers="upload.headers"
+          <el-button style="margin-left: 1rem" size="small" type="success" :loading="upload.isUploading"
-          :file-list="upload.fileList"
+            @click="submitUpload">上传到服务器</el-button>
-          :on-progress="handleFileUploadProgress"
-          :on-success="handleFileSuccess"
-          :auto-upload="false"
-          list-type="picture"
-        >
-          <el-button slot="trigger" size="small" type="primary"
-            >选取文件</el-button
-          >
-          <el-button
-            style="margin-left: 1rem"
-            size="small"
-            type="success"
-            :loading="upload.isUploading"
-            @click="submitUpload"
-            >上传到服务器</el-button
-          >
           <div slot="tip" class="el-upload__tip">
             只能上传jpg/png文件，且不超过500kb
           </div>
@@ -178,7 +115,7 @@ export default {
     dialogItem: {
       type: Object,
       require: true,
-      default: () => {},
+      default: () => { },
     },
     segmentList: {
       type: Array,
@@ -301,7 +238,7 @@ export default {
    * @description: 生命周期函数-mouted
    * @return {*}
    */
-  mounted() {},
+  mounted() { },
   methods: {
     /**
      * @description: 传回来的地图点击事件获取点位数据
@@ -474,11 +411,13 @@ export default {
 <style lang="scss" scoped>
 /* 新增弹窗/编辑弹窗 */
 .addForm {
+
   .el-select,
   .el-cascader {
     width: 100%;
   }
 }
+
 /* 地图框样式 */
 .no-hand-cursor {
   cursor: default !important;

src/views/xj/inspection/task-management/components/task-synchronous.vue

@@ -0,0 +1,123 @@
+<!--
+ * @Author: SunTao 328867980@qq.com
+ * @Date: 2025-03-18 16:42:54
+ * @LastEditors: SunTao 328867980@qq.com
+ * @LastEditTime: 2025-03-20 09:31:21
+ * @FilePath: \znxjxt-ui\src\views\xj\inspection\task-management\components\task-synchronous.vue
+ * @Description:巡检任务-同步更多弹窗
+-->
+<template>
+  <div class="synchronous-content">
+    <el-card class="box-card">
+      <div slot="header" class="clearfix">
+        <span>病害类型</span>
+      </div>
+      <el-checkbox-group v-model="checkedDisease">
+        <el-checkbox style="margin: 0.2rem;" v-for="(item, index) in diseaseList" :key="`disease-${index}`"
+          :label="item.label" border>{{
+            item.value }}</el-checkbox>
+      </el-checkbox-group>
+    </el-card>
+    <el-card class="box-card" style="margin-top:1rem">
+      <div slot="header" class="clearfix">
+        <span>路产类型</span>
+      </div>
+      <el-checkbox-group v-model="checkedRoad">
+        <el-checkbox style="margin: 0.2rem;" v-for="(item, index) in roadList" :key="`road-${index}`"
+          :label="item.value" border>{{
+            item.label }}</el-checkbox>
+      </el-checkbox-group>
+    </el-card>
+    <div class="dialog-footer">
+      <el-button type="primary" @click="submitForm">确 定</el-button>
+      <el-button @click="cancel">取 消</el-button>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getMoreType, getMoreDefect } from '@/api/xj/task'
+
+export default {
+  name: "TaskSynchronous",
+  props: {
+    // 弹窗传的数据
+    dialogItem: {
+      type: Object,
+      default: () => { },
+    },
+  },
+  data() {
+    return {
+      // 病害类型勾选数据
+      checkedDisease: [],
+      // 病害类型数据
+      diseaseList: [],
+      // 道路类型勾选数据
+      checkedRoad: [],
+      // 道路类型数据
+      roadList: [],
+    }
+  },
+  created() {
+    this.getDieaseList()
+  },
+  methods: {
+    /**
+     * @description: 获取病害类型数据
+     * @param {*}
+     * @return {*}
+     */
+    getDieaseList() {
+      getMoreType({ taskId: this.dialogItem.id }).then(({ code, data }) => {
+        if (code == 200) {
+          this.diseaseList = data.defect
+          this.roadList = data.equipment
+        }
+      })
+    },
+
+    /**
+     * @description: 点击取消事件
+     * @param {*}
+     * @return {*}
+     */
+    cancel() {
+      this.$emit("cancel")
+    },
+
+    /**
+     * @description: 点击确定事件
+     * @param {*}
+     * @return {*}
+     */
+    submitForm() {
+      if (this.checkedDisease.length > 0 || this.checkedRoad.length > 0) {
+        getMoreDefect({ defectTypes: this.checkedDisease, equipmentTypes: this.checkedRoad, id: this.dialogItem.id }).then(({ code, msg }) => {
+          if (code === 200) {
+            this.$modal.msgSuccess(msg);
+          } else {
+            this.$modal.msgError(msg);
+          }
+        }).finally(() => {
+          this.cancel()
+        })
+      }
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.synchronous-content {
+  width: 100%;
+  height: 100%;
+}
+
+/* 页脚 */
+.dialog-footer {
+  display: flex;
+  justify-content: flex-end;
+  margin-top: 1rem;
+}
+</style>

src/views/xj/inspection/task-management/index.vue

@@ -2,7 +2,7 @@
  * @Author: SunTao 328867980@qq.com
  * @Date: 2024-10-14 09:48:43
  * @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2025-01-13 17:27:11
+ * @LastEditTime: 2025-03-18 17:01:15
  * @FilePath: \znxjxt-ui\src\views\xj\inspection\task-management\index.vue
  * @Description: 巡检管理-巡检任务
 -->
@@ -10,72 +10,30 @@
 <template>
   <div class="app-container">
     <!-- 搜索表单 -->
-    <el-form
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="100px">
-      :model="queryParams"
-      ref="queryForm"
-      size="small"
-      :inline="true"
-      label-width="100px"
-    >
       <el-form-item label="任务id" prop="taskId">
-        <el-autocomplete
+        <el-autocomplete v-model="queryParams.taskId" :fetch-suggestions="querySearchAsync"
-          v-model="queryParams.taskId"
+          placeholder="请输入任务id"></el-autocomplete>
-          :fetch-suggestions="querySearchAsync"
-          placeholder="请输入任务id"
-        ></el-autocomplete>
       </el-form-item>
       <el-form-item label="车牌号码" prop="plateNo">
-        <el-input
+        <el-input v-model="queryParams.plateNo" placeholder="请输入车牌号码" clearable=""></el-input>
-          v-model="queryParams.plateNo"
-          placeholder="请输入车牌号码"
-          clearable=""
-        ></el-input>
       </el-form-item>
       <el-form-item label="巡检路段" prop="segmentId">
-        <el-select
+        <el-select v-model="queryParams.segmentId" placeholder="请选择巡检路段" clearable>
-          v-model="queryParams.segmentId"
+          <el-option v-for="item in segmentList" :key="item.value" :label="item.label" :value="item.value" />
-          placeholder="请选择巡检路段"
-          clearable
-        >
-          <el-option
-            v-for="item in segmentList"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          />
         </el-select>
       </el-form-item>
       <el-form-item label="巡检时间" prop="dateTime">
-        <el-date-picker
+        <el-date-picker v-model="dateTime" type="daterange" start-placeholder="开始日期" end-placeholder="结束日期"
-          v-model="dateTime"
+          format="yyyy-MM-dd" value-format="yyyy-MM-dd" clearable />
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          format="yyyy-MM-dd"
-          value-format="yyyy-MM-dd"
-          clearable
-        />
       </el-form-item>
       <el-form-item>
-        <el-button
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
-          type="primary"
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
-          icon="el-icon-search"
-          size="mini"
-          @click="handleQuery"
-          >搜索</el-button
-        >
-        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
-          >重置</el-button
-        >
       </el-form-item>
     </el-form>
     <!-- 列表 -->
-    <el-table
+    <el-table ref="roadTable" :data="roadList" @selection-change="handleSelectionChange" style="width: 100%">
-      ref="roadTable"
-      :data="roadList"
-      @selection-change="handleSelectionChange"
-      style="width: 100%"
-    >
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column label="巡检路段" align="center" prop="segmentName" />
       <el-table-column label="巡检路段编码" align="center" prop="segmentCode">
@@ -95,96 +53,43 @@
       </el-table-column>
       <el-table-column label="发现病害数" align="center" prop="defectCount">
       </el-table-column>
-      <el-table-column
+      <el-table-column label="发现新增病害数" align="center" prop="newDefectCount">
-        label="发现新增病害数"
-        align="center"
-        prop="newDefectCount"
-      >
       </el-table-column>
       <el-table-column label="任务id" align="center" prop="extId" />
-      <el-table-column
+      <el-table-column label="操作" align="center" width="250" class-name="small-padding fixed-width">
-        label="操作"
-        align="center"
-        class-name="small-padding fixed-width"
-      >
         <template slot-scope="scope">
           <el-popover placement="left" width="auto" trigger="hover">
             <p>导出是否附带图片？</p>
             <div style="text-align: right; margin: 0">
-              <el-button size="mini" @click="wordExport(scope.row, false)"
+              <el-button size="mini" @click="wordExport(scope.row, false)">取消</el-button>
-                >取消</el-button
+              <el-button type="primary" size="mini" @click="wordExport(scope.row, true)">确定</el-button>
-              >
-              <el-button
-                type="primary"
-                size="mini"
-                @click="wordExport(scope.row, true)"
-                >确定</el-button
-              >
             </div>
-            <el-button
+            <el-button slot="reference" size="mini" type="text" icon="el-icon-download">导出</el-button>
-              slot="reference"
-              size="mini"
-              type="text"
-              icon="el-icon-download"
-              >导出</el-button
-            >
           </el-popover>
-          <el-button
+          <el-button size="mini" type="text" style="margin-left: 0.5rem" icon="el-icon-refresh-right"
-            size="mini"
+            @click="handleSynchronous(scope.row)">同步更多
-            type="text"
-            icon="el-icon-view"
-            style="margin-left: 0.5rem"
-            @click="viewDefect(scope.row)"
-            >查看
           </el-button>
-          <el-button
+          <el-button size="mini" type="text" icon="el-icon-view" style="margin-left: 0.5rem"
-            size="mini"
+            @click="viewDefect(scope.row)">查看
-            type="text"
+          </el-button>
-            icon="el-icon-help"
+          <el-button size="mini" type="text" icon="el-icon-help" style="margin-left: 0.5rem"
-            style="margin-left: 0.5rem"
+            @click="viewMap(scope.row)">地图
-            @click="viewMap(scope.row)"
-            >地图
           </el-button>
-          <!-- <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-refresh-right"
-            @click="handleRetrace(scope.row)"
-            >回顾
-          </el-button> -->
         </template>
       </el-table-column>
     </el-table>
     <!-- 分页组件 -->
     <div class="pagination-part">
-      <el-pagination
+      <el-pagination background :current-page.sync="pagination.page" @current-change="handleCurrentChange"
-        background
+        :page-sizes="[10, 20, 30, 40]" :page-size.sync="pagination.size" @size-change="handleSizeChange"
-        :current-page.sync="pagination.page"
+        layout="total, sizes, prev, pager, next, jumper" :total="tableTotal">
-        @current-change="handleCurrentChange"
-        :page-sizes="[10, 20, 30, 40]"
-        :page-size.sync="pagination.size"
-        @size-change="handleSizeChange"
-        layout="total, sizes, prev, pager, next, jumper"
-        :total="tableTotal"
-      >
       </el-pagination>
     </div>
     <!-- 查看新增病害弹窗 -->
-    <el-dialog
+    <el-dialog title="已确认新增病害" :visible.sync="viewVisible" width="85rem" append-to-body :close-on-click-modal="false"
-      title="已确认新增病害"
+      destroy-on-close @close="viewCancel">
-      :visible.sync="viewVisible"
+      <task-view v-if="viewVisible" @cancel="viewCancel" :dialogItem="dialogItem"
-      width="85rem"
+        :defectCascaderList="defectCascaderList"></task-view>
-      append-to-body
-      :close-on-click-modal="false"
-      destroy-on-close
-      @close="viewCancel"
-    >
-      <task-view
-        v-if="viewVisible"
-        @cancel="viewCancel"
-        :dialogItem="dialogItem"
-        :defectCascaderList="defectCascaderList"
-      ></task-view>
       <!-- <task-retrace
         v-if="viewVisible"
         @cancel="viewCancel"
@@ -192,39 +97,23 @@
       ></task-retrace> -->
     </el-dialog>
 
-    <el-dialog
+    <!-- 查看地图弹窗 -->
-      title="查看地图"
+    <el-dialog title="查看地图" :visible.sync="mapView" width="90%" append-to-body :close-on-click-modal="false"
-      :visible.sync="mapView"
+      destroy-on-close @close="mapCancel">
-      width="90%"
+      <task-map v-if="mapView" :dialogItem="dialogItem" :defectCascaderList="defectCascaderList"></task-map>
-      append-to-body
+    </el-dialog>
-      :close-on-click-modal="false"
+
-      destroy-on-close
+    <!-- 同步更多弹窗 -->
-      @close="mapCancel"
+    <el-dialog title="同步更多" :visible.sync="synchronousVisible" width="40rem" append-to-body
-    >
+      :close-on-click-modal="false" destroy-on-close @cancel="synchronousCancel">
-      <task-map
+      <task-synchronous v-if="synchronousVisible" :dialogItem="dialogItem"
-        v-if="mapView"
+        @cancel="synchronousCancel"></task-synchronous>
-        :dialogItem="dialogItem"
-        :defectCascaderList="defectCascaderList"
-      ></task-map>
     </el-dialog>
 
     <!-- 回顾巡检任务弹窗 -->
-    <el-dialog
+    <el-dialog title="回顾任务" fullscreen :visible.sync="retraceVisible" width="80rem" append-to-body
-      title="回顾任务"
+      :close-on-click-modal="false" destroy-on-close @close="retraceCancel" class="retrace-dialog">
-      fullscreen
+      <task-retrace v-if="retraceVisible" @cancel="retraceCancel" :dialogItem="dialogItem"></task-retrace>
-      :visible.sync="retraceVisible"
-      width="80rem"
-      append-to-body
-      :close-on-click-modal="false"
-      destroy-on-close
-      @close="retraceCancel"
-      class="retrace-dialog"
-    >
-      <task-retrace
-        v-if="retraceVisible"
-        @cancel="retraceCancel"
-        :dialogItem="dialogItem"
-      ></task-retrace>
     </el-dialog>
   </div>
 </template>
@@ -242,9 +131,10 @@ import {
   getDefectList,
   exportDefectData,
 } from "@/api/xj/task";
+import TaskSynchronous from './components/task-synchronous.vue';
 
 export default {
-  components: { TaskRetrace, TaskView, taskMap },
+  components: { TaskRetrace, TaskView, taskMap, TaskSynchronous },
   data() {
     return {
       // 查询表单
@@ -289,6 +179,10 @@ export default {
       retraceVisible: false,
       // 病害类型下拉
       defectCascaderList: [],
+
+      // 同步更多弹窗显隐控制
+      synchronousVisible: false,
+
     };
   },
   created() {
@@ -410,6 +304,15 @@ export default {
       this.multiple = !selection.length;
     },
 
+    /**
+     * @description: 点击同步更多事件
+     * @return {*}
+     */
+    handleSynchronous(item) {
+      this.dialogItem = item;
+      this.synchronousVisible = true
+    },
+
     /**
      * @description: 点击查看新增病害事件
      * @param {*} item
@@ -497,6 +400,15 @@ export default {
       this.dialogItem = {};
     },
 
+    /**
+     * @description: 关闭同步更多弹窗
+     * @return {*}
+     */
+    synchronousCancel() {
+      this.synchronousVisible = false;
+      this.dialogItem = {};
+    },
+
     /**
      * @description: 关闭地图弹窗
      * @return {*}
@@ -544,6 +456,7 @@ export default {
 
 /* 新增弹窗/编辑弹窗 */
 .addForm {
+
   .el-select,
   .el-cascader {
     width: 100%;