代码更新

Surpriseplus

2023-10-10 77f9937b32f67f5b7d5476b0a1db19956702c0c8

 src/views/plotting/plottingInquire.vue

@@ -1,8 +1,28 @@
<template>
  <div class="plottingInquire" v-if="isShow">
    <div class="InquireHeader">标绘查询</div>
  <div
    class="plottingInquire"
    v-if="isShow"
    v-drag="true"
  >
    <div class="InquireHeader">
      <div>标绘查询</div>

      <div>
        <el-icon
          @click="isShow = false"
          :size="20"
          style="cursor: pointer"
        >
          <Close />
        </el-icon>

      </div>
    </div>
    <div class="inquireContent">
      <div class="inquireContent_title">用户新建要素</div>
      <div class="inquireContent_title">
        <div>用户新建要素</div>

      </div>
      <div class="inquireContent_name">
        <div class="plotting_list_tr_name">
          <img
@@ -11,9 +31,19 @@
            alt=""
          /><span>{{ inquireData.name }}</span>
        </div>
        <div
          class="plotting_list_tr_wkt"
          v-show="geoWktFlag"
        >{{ geoWkt }}</div>
        <div class="plotting_list_tr_btn">
          <div class="tr_btn dw" @click="setLayerLocation()"></div>
          <div class="tr_btn sc" @click="setLayerRemove()"></div>
          <div
            class="tr_btn dw"
            @click="setLayerLocation()"
          ></div>
          <div
            class="tr_btn sc"
            @click="setLayerRemove()"
          ></div>
        </div>
      </div>
      <div class="tab_box">
@@ -23,8 +53,14 @@
          @tab-click="handleClick"
        >
          <!-- <el-tab-pane label="图层属性" name="first">User</el-tab-pane> -->
          <el-tab-pane label="查询结果" name="second">
            <div class="inquireContent_input" v-show="pixelIsShow">
          <el-tab-pane
            label="查询结果"
            name="second"
          >
            <div
              class="inquireContent_input"
              v-show="pixelIsShow"
            >
              <!-- <div class="inquireContent_input_left">
                <div class="label">范围框</div>
                <el-input
@@ -35,7 +71,10 @@
                  <template #append>km</template>
                </el-input>
              </div> -->
              <div class="inquireContent_input_right" v-show="!chartIsshow">
              <div
                class="inquireContent_input_right"
                v-show="!chartIsshow"
              >
                <div class="label">范围框内最大像素值</div>
                <el-select
                  v-model="ScopeBox.pixel"
@@ -52,7 +91,10 @@
                  />
                </el-select>
              </div>
              <div class="inquireContent_input_right" v-show="chartIsshow">
              <div
                class="inquireContent_input_right"
                v-show="chartIsshow"
              >
                <div class="label">节点数</div>
                <el-select
                  v-model="ScopeBox.nodes"
@@ -70,7 +112,10 @@
                </el-select>
              </div>
            </div>
            <div class="chart" v-if="chartIsshow">
            <div
              class="chart"
              v-if="chartIsshow"
            >
              <div class="chart_box">
                <div class="chart_btn">
                  <el-button
@@ -143,7 +188,10 @@
                >
              </div>
            </div> -->
            <div class="inquireContent_table" v-if="!chartIsshow">
            <div
              class="inquireContent_table"
              v-if="!chartIsshow"
            >
              <div class="table">
                <div class="table_head">
                  <div class="table_head_td">序号</div>
@@ -153,7 +201,11 @@
                  </div>
                </div>
                <div class="table_content">
                  <div class="table_tr" v-for="(e, i) in resultList" :key="i">
                  <div
                    class="table_tr"
                    v-for="(e, i) in resultList"
                    :key="i"
                  >
                    <div class="table_td">{{ i + 1 }}</div>
                    <div class="table_td">
                      <span> {{ e.layerName }}</span>
@@ -163,19 +215,29 @@
                </div>
              </div>
            </div>
            <div class="download" v-if="!chartIsshow">
              <el-button link @click="download">下载分析结果</el-button>
            <div
              class="download"
              v-if="!chartIsshow"
            >
              <el-button
                link
                @click="download"
              >下载分析结果</el-button>
            </div>
          </el-tab-pane>
        </el-tabs>
      </div>
    </div>
  </div>
  <div class="dialog" v-if="dialogShow" @click.self="dialogShow = false">
  <div
    class="dialog"
    v-if="dialogShow"
    @click.self="dialogShow = false"
  >
    <div class="chart">
      <i @click.capture="closeDialog"
        ><el-icon><Close /></el-icon
      ></i>
      <i @click.capture="closeDialog"><el-icon>
          <Close />
        </el-icon></i>
      <BarGraphAxisLine
        :width="'856px'"
        :height="'636px'"
@@ -206,7 +268,9 @@
} from "@/utils/downloadCSV.js";
import { selectByPoint, selectByPolygon, selectByPolyline } from "@/api/api";
import { ElMessage } from "element-plus";
import { Search, Delete, Download } from "@element-plus/icons-vue";
import { Search, Delete, Download, Close } from "@element-plus/icons-vue";
import WKT from "terraformer-wkt-parser";
import * as turf from "@turf/turf";
const store = useStore(); // 该方法用于返回store 实例
const emits = defineEmits(["setCloseplotting"]);
let isShow = ref(false);
@@ -312,6 +376,8 @@
let layerArr = ref([]);
let dialogShow = ref(false);
let layerNameNum = 0;
let geoWkt = ref(null);
let geoWktFlag = ref(false);
//新增图表
const addCharts = () => {
  layerArr.value.push({ layerName: `null${layerNameNum}`, points: [] });
@@ -513,6 +579,23 @@
  (nVal, oVal) => {
    isShow.value = nVal.isshow;
    inquireData.value = nVal.entitiesData;
    geoWktFlag.value = false;
    if (inquireData.value.wkt) {
      var wkt = WKT.parse(inquireData.value.wkt);

      if (wkt.type == "Point") {
        geoWkt.value = wkt.coordinates[0] + " " + wkt.coordinates[1];
        geoWktFlag.value = true;
      }
      if (wkt.type == "Polygon") {
        var Polygon = turf.multiPolygon([wkt.coordinates]);
        var center = turf.center(Polygon);
        geoWkt.value =
          center.geometry.coordinates[0] + " " + center.geometry.coordinates[1];
        geoWktFlag.value = true;
      }
    }

    if (nVal.entitiesData.icon == "x.png") {
      pixelIsShow.value = true;
      selectPolyline({
@@ -560,6 +643,8 @@
    color: #d6e4ff;
    padding: 10px;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
  }
  .inquireContent {
    .inquireContent_title {
@@ -591,6 +676,13 @@
          margin-left: 10px;
        }
      }
      .plotting_list_tr_wkt {
        font-size: 12px;
        font-weight: 300;
        color: #ffffff;
        margin-left: 10px;
        flex: 1;
      }
      .plotting_list_tr_btn {
        display: flex;
        align-items: center;