feat:参数修改

张含笑

2025-08-29 4041ef323765aeaad7fa100557e9a84b4be97521

 src/views/resource/components/spotDetails.vue

@@ -1,6 +1,6 @@
<template>
  <el-dialog
  class="spotDialog"
    class="spotDialog"
    :title="props.title"
    v-model="uploadPatchDialog"
    width="75%"
@@ -12,7 +12,16 @@
        <div class="itemBoxLeft">
          <div v-for="(item, index) in infoList" :key="index" class="itemCon">
            <div class="itemBox">
              <div class="itemTitle"><span v-if="props.title === '图斑编辑' && (item.name === '文件名称' || item.name === '图斑类型')" style="color: red;">*</span>{{ item.name }}：</div>
              <div class="itemTitle">
                <span
                  v-if="
                    props.title === '图斑编辑' &&
                    (item.name === '文件名称' || item.name === '图斑类型')
                  "
                  style="color: red"
                  >*</span
                >{{ item.name }}：
              </div>
              <div class="itemContent">
                <template v-if="props.title === '图斑编辑' && item.editable">
                  <template v-if="item.name === '图斑类型'">
@@ -63,7 +72,11 @@
                </template>
              </el-table-column>
              <el-table-column prop="dkbh" align="center" label="图斑名称" />
              <el-table-column prop="investigate" align="center" label="图斑状态" />
              <el-table-column prop="is_exception" align="center" label="图斑状态">
                <template #default="scope">
                  <span>{{ scope.row.is_exception === 2 ? '异常' : '正常' }}</span>
                </template>
              </el-table-column>
              <el-table-column label="操作" align="center" v-if="props.title === '图斑编辑'">
                <template #default="scope">
                  <span class="operationspan">删除</span>
@@ -75,8 +88,8 @@
            </el-table>
            <div class="pagination-container">
              <el-pagination
              :current-page="params.current"
              :page-size="params.size"
                :current-page="params.current"
                :page-size="params.size"
                background
                layout="prev, pager, next"
                prev-text="上一页"
@@ -96,8 +109,8 @@
        ></FunButton>
        <!-- 完成/取消 -->
        <div class="btnGroups" v-if="props.title === '图斑编辑'">
          <img  @click="handleSave" src="@/assets/images/home/territory/savebtn.png" alt="" />
          <img src="@/assets/images/home/territory/cancelbtn.png" alt="" />
          <img @click="handleSave" src="@/assets/images/home/territory/savebtn.png" alt="" />
          <img @click="handleCancel" src="@/assets/images/home/territory/cancelbtn.png" alt="" />
        </div>
        <!-- 地图 -->
        <div id="spotMap" class="ztzf-cesium" v-show="uploadPatchDialog"></div>
@@ -107,15 +120,22 @@
</template>

<script setup>
import {spotManagementTableApi,searchManagementApi,uploadManagementApi,tableMapListApi} from '@/api/patchManagement/index'
import {getCenterPoint, } from '@/utils/cesium/mapUtil.js';
import { ElMessage } from 'element-plus';
import {
  patchEditApi,
  spotManagementTableApi,
  searchManagementApi,
  uploadManagementApi,
  tableMapListApi,
} from '@/api/patchManagement/index';
import { getCenterPoint } from '@/utils/cesium/mapUtil.js';
import { getPatchesSpotList } from '@/api/patchManagement/index';
import * as Cesium from 'cesium';
import { PublicCesium } from '@/utils/cesium/publicCesium';
import { ref, watch, onBeforeUnmount, onMounted } from 'vue';
import FunButton from '@/views/resource/components/FunButton.vue';
const uploadPatchDialog = defineModel('show');
const props = defineProps(['title','detailid']);
const props = defineProps(['title', 'detailid', 'detailList', 'spotTypeOption']);
const polygonTableEle = ref(null);
let publicCesiumInstance = null;
let viewer = null;
@@ -123,6 +143,7 @@
const homeViewer = shallowRef(null);
let tbJwdList = [];
let total = ref(0);
const refreshonload = inject('searchReset');
// 当前选中的图斑面数据
let nowSelectObj = ref({});
// 记录上一次点击高亮
@@ -140,40 +161,66 @@
const tableRowClassName = ({ rowIndex }) => {
  return rowIndex % 2 === 1 ? 'oddNumberRow' : 'even-row';
};
const spotTypeOptions = ref([
  { value: '1', label: '综合类' },
  { value: '2', label: '矿山类' },
  { value: '3', label: '农田类' },
]);
const spotTypeOptions = ref([]);
const infoList = ref([
  { name: '文件名称', value: '55', field: 'job_info_num', editable: true },
  { name: '图斑类型', value: 'ee', field: 'name', editable: true },
  { name: '图斑数量', value: '', field: 'industry_type_str', editable: false },
  { name: '异常图斑数量', value: '', field: 'event_number', editable: false },
  { name: '行政区划', value: '', field: 'device_names', editable: false },
  { name: '数据来源', value: '', field: 'dept_name', editable: false },
  { name: '创建时间', value: '', field: 'cycle_time_value', editable: false },
  { name: '创建人', value: '', field: 'ai_type_str', editable: false },
  { name: '文件名称', value: '', field: 'file_name', editable: true },
  { name: '图斑类型', value: '', field: 'patches_type_desc', editable: true },
  { name: '图斑数量', value: '', field: 'patches_num', editable: false },
  { name: '异常图斑数量', value: '', field: 'exception_num', editable: false },
  { name: '行政区划', value: '', field: 'areaName', editable: false },
  { name: '数据来源', value: '', field: 'dataFrom', editable: false },
  { name: '创建时间', value: '', field: 'create_time', editable: false },
  { name: '创建人', value: '', field: 'user_name', editable: false },
]);
watch(
  () => props.spotTypeOption,
  newOptions => {
    if (newOptions) {
      spotTypeOptions.value = newOptions;
    }
  },
  { immediate: true }
);
watch(
  () => props.detailList,
  newVal => {
    if (newVal) {
      updateInfoList(newVal);
    }
  },
  { immediate: true }
);

// 更新infoList的方法
const updateInfoList = detailData => {
  infoList.value = infoList.value.map(item => {
    // 根据field字段匹配props.detailList中的值
    const fieldValue = detailData[item.field];
    return {
      ...item,
      value: fieldValue !== undefined ? fieldValue : item.value,
    };
  });
};
const params = ref({
  current: 1,
  size: 20,
});
// 图斑管理表格
const getTableList =()=>{
const params={
  patchesInfoId:props.detailid
}
const getTableList = () => {
  const params = {
    patchesInfoId: props.detailid,
  };
  tableMapListApi(params).then(res => {
    console.log('地图表格数据',res.data.data);
     tableData.value = res.data.data
     // 先清空地图现有图斑
  tbJwdList = [];
  viewer?.entities.removeAll(); // 清除所有实体
  // 加载图斑
  entitiesAddSpot();
  })
}
    console.log('地图表格数据', res.data.data);
    tableData.value = res.data.data;
    // 先清空地图现有图斑
    tbJwdList = [];
    viewer?.entities.removeAll(); // 清除所有实体
    // 加载图斑
    entitiesAddSpot();
  });
};

const handleSizeChange = () => {};
const handleCurrentChange = () => {};
@@ -253,6 +300,21 @@
// 鼠标触发点击图斑高亮 pick：可以获取当前图斑数据
const spotHighlighting = (click, pick, viewer) => {
  if (!pick || !(pick.id?.customType == 'pattern_spot_polygon')) return;
     let clickTableID = tableData.value.findIndex(i => i.id == pick.id?.customInfo.id)
       // 计算表格滚动至中间位置
   const rows = polygonTableEle?.value.$el.querySelectorAll('.el-table__body tr')
   let targetRow = rows[clickTableID]
   nextTick(() => {
      const table = polygonTableEle?.value
      if (!table) return
      if (targetRow) {
         targetRow.scrollIntoView({
            behavior: 'smooth',
            block: 'center',
         })
         polygonTableEle?.value.setCurrentRow(tableData.value[clickTableID])
      }
   })
  // 表格也对应选中数据 TODO
  const data = pick.id?.customInfo;
  // 高亮图斑
@@ -330,6 +392,26 @@
    isDrawPolygon.value = false;
  }
};
// 完成
const handleSave = () => {
  const fileNameItem = infoList.value.find(item => item.name === '文件名称');
  const patchTypeItem = infoList.value.find(item => item.name === '图斑类型');
  const updateParams = {
    file_name: fileNameItem?.value || '',
    lot_type_id: patchTypeItem?.value || '',
    type: patchTypeItem?.value || '',
    id: props.detailList.id,
  };
  console.log('保存', updateParams);

  patchEditApi(updateParams).then(res => {
    ElMessage.success(res.data.data);
    refreshonload();
    uploadPatchDialog.value = false;
  });
};
// 取消
const handleCancel = () => {};
provide('selectionIds', selectionIds);
provide('homeViewer', homeViewer);
provide('viewInstance', viewInstance);
@@ -349,7 +431,6 @@
    setTimeout(() => {
      initMap();
      getTableList();
   
    }, 0);
  } else {
    if (funButtonEle.value) {
@@ -359,18 +440,16 @@
    destroyMap();
  }
});
onMounted(()=>{

})
onMounted(() => {});
onBeforeUnmount(() => {
  destroyMap();
});
</script>
<style lang="scss">
.spotDialog {
.el-dialog.is-align-center .el-dialog__header .el-dialog__title {
  padding-left: 16px !important;
}
  .el-dialog.is-align-center .el-dialog__header .el-dialog__title {
    padding-left: 16px !important;
  }
}
</style>
<style scoped lang="scss">
@@ -485,19 +564,19 @@
  // 表格样式
  :deep(.el-table) {
    // 清除表格内部横线和竖线
  &::before,
  &::after,
  .el-table__inner-wrapper::before,
  .el-table__inner-wrapper::after {
    background-color: transparent !important;
    display: none !important; // 彻底隐藏伪元素边框
  }
    &::before,
    &::after,
    .el-table__inner-wrapper::before,
    .el-table__inner-wrapper::after {
      background-color: transparent !important;
      display: none !important; // 彻底隐藏伪元素边框
    }
    .el-table__header-wrapper th {
    border: none !important;
  }
      border: none !important;
    }
    --el-table-bg-color: transparent !important;
    --el-table-tr-bg-color: transparent !important;
    

    --el-table-row-hover-bg-color: rgba(30, 58, 138, 0.5) !important;
    --el-table-current-row-bg-color: rgba(30, 58, 138, 0.7) !important;
    color: #fff !important;
@@ -525,7 +604,6 @@
          overflow: hidden;
          text-overflow: ellipsis;
        }
  
      }
    }

@@ -588,7 +666,7 @@
    display: flex;
    justify-content: center;
    height: 20px;
    margin: 24px 0  14px 0;
    margin: 24px 0 14px 0;
  }
}