|
|
@@ -1,192 +1,196 @@
|
|
|
<template>
|
|
|
- <div class="right-layout">
|
|
|
- <div class="right-content">
|
|
|
- <div class="tree-layout">
|
|
|
- <p>全部数据</p>
|
|
|
- <div class="poly-list">
|
|
|
- <template v-if="data.polygons.length > 0" v-for=" item in data.polygons">
|
|
|
- <div class="poly-list-item">
|
|
|
- <div class="left">
|
|
|
- <span>{{ item.name ? item.name : '本体边界' + item.id }}</span>
|
|
|
- </div>
|
|
|
- <div class="right">
|
|
|
- <el-icon class="icon">
|
|
|
- <Delete @click="del(item.id)" />
|
|
|
- </el-icon>
|
|
|
- <el-icon class="icon">
|
|
|
- <Edit @click="handleShowEditModel(item)" />
|
|
|
- </el-icon>
|
|
|
- <el-icon class="icon">
|
|
|
- <Download @click="handleDownload" />
|
|
|
- </el-icon>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- <template v-else>
|
|
|
- <div class="empty">
|
|
|
- 暂没数据
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </div>
|
|
|
+ <div class="right-layout">
|
|
|
+ <div class="right-content">
|
|
|
+ <div class="tree-layout">
|
|
|
+ <p>全部数据</p>
|
|
|
+ <div class="poly-list">
|
|
|
+ <template v-if="data.polygons.length > 0" v-for="item in data.polygons">
|
|
|
+ <div class="poly-list-item">
|
|
|
+ <div class="left">
|
|
|
+ <span>{{ item.name ? item.name : "本体边界" + item.id }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+ <el-icon class="icon">
|
|
|
+ <Delete @click="del(item.id)" />
|
|
|
+ </el-icon>
|
|
|
+ <el-icon class="icon">
|
|
|
+ <Edit @click="handleShowEditModel(item)" />
|
|
|
+ </el-icon>
|
|
|
+ <el-icon class="icon">
|
|
|
+ <Download @click="handleDownload(item)" />
|
|
|
+ </el-icon>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <div class="empty">暂没数据</div>
|
|
|
+ </template>
|
|
|
</div>
|
|
|
- <SingleInput :visible="isShowPolyEditName" @update:visible="isShowPolyEditName = false"
|
|
|
- :value="currentPoly.name" :update-value="updatePolyName" title="修改边界名称" />
|
|
|
+ </div>
|
|
|
</div>
|
|
|
+ <SingleInput
|
|
|
+ :visible="isShowPolyEditName"
|
|
|
+ @update:visible="isShowPolyEditName = false"
|
|
|
+ :value="currentPoly.name"
|
|
|
+ :update-value="updatePolyName"
|
|
|
+ title="修改边界名称"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
import { ref, watchEffect } from "vue";
|
|
|
-import type { PolyDataType, DrawingDataType } from '@/request/drawing.ts'
|
|
|
-import {
|
|
|
- Delete,
|
|
|
- Download,
|
|
|
- Edit,
|
|
|
-} from "@element-plus/icons-vue";
|
|
|
+import type { PolyDataType, DrawingDataType } from "@/request/drawing.ts";
|
|
|
+import { Delete, Download, Edit } from "@element-plus/icons-vue";
|
|
|
import SingleInput from "@/components/single-input.vue";
|
|
|
import { scenePosTransform } from "./board";
|
|
|
import { downloadPointsXLSL2 } from "@/util/pc4xlsl";
|
|
|
-import { scenes } from "@/store/scene";
|
|
|
+import { scenePoints, scenes } from "@/store/scene";
|
|
|
|
|
|
import { relics } from "@/store/relics";
|
|
|
import { ElMessageBox } from "element-plus";
|
|
|
+import { getWholeLinePolygonPoints } from "@/submodule/src/board";
|
|
|
|
|
|
const props = defineProps<{
|
|
|
- data: DrawingDataType | null;
|
|
|
+ data: DrawingDataType | null;
|
|
|
}>();
|
|
|
|
|
|
const emit = defineEmits<{
|
|
|
- (e: "del", id: string): void;
|
|
|
- (e: "edit", data: PolyDataType): void;
|
|
|
- // (e: "edit", id: string): void;
|
|
|
+ (e: "del", id: string): void;
|
|
|
+ (e: "edit", data: PolyDataType): void;
|
|
|
+ // (e: "edit", id: string): void;
|
|
|
}>();
|
|
|
|
|
|
const relicsName = ref("");
|
|
|
|
|
|
const currentPoly = ref<PolyDataType>({
|
|
|
- id: '',
|
|
|
- name: '',
|
|
|
- lineIds: []
|
|
|
+ id: "",
|
|
|
+ name: "",
|
|
|
+ lineIds: [],
|
|
|
});
|
|
|
const isShowPolyEditName = ref(false);
|
|
|
watchEffect(() => {
|
|
|
- relicsName.value = relics.value?.name || "";
|
|
|
- console.log('props', props.data)
|
|
|
+ relicsName.value = relics.value?.name || "";
|
|
|
+ console.log("props", props.data);
|
|
|
});
|
|
|
const updatePolyName = (name: string) => {
|
|
|
- currentPoly.value.name = name;
|
|
|
- emit('edit', currentPoly.value);
|
|
|
-}
|
|
|
+ currentPoly.value.name = name;
|
|
|
+ emit("edit", currentPoly.value);
|
|
|
+};
|
|
|
const handleShowEditModel = (item: PolyDataType) => {
|
|
|
- isShowPolyEditName.value = true;
|
|
|
- currentPoly.value = item;
|
|
|
-}
|
|
|
+ isShowPolyEditName.value = true;
|
|
|
+ currentPoly.value = item;
|
|
|
+};
|
|
|
|
|
|
const del = async (id: string) => {
|
|
|
- const ok = await ElMessageBox.confirm("确定要删除吗", {
|
|
|
- type: "warning",
|
|
|
- });
|
|
|
- if (ok) {
|
|
|
- emit('del', id)
|
|
|
+ const ok = await ElMessageBox.confirm("确定要删除吗", {
|
|
|
+ type: "warning",
|
|
|
+ });
|
|
|
+ if (ok) {
|
|
|
+ emit("del", id);
|
|
|
+ }
|
|
|
+};
|
|
|
+const handleDownload = async (item: any) => {
|
|
|
+ const polygonPoints: any[] = getWholeLinePolygonPoints(props.data as any, item.id);
|
|
|
+
|
|
|
+ const points = polygonPoints.map((p) => {
|
|
|
+ const pos = [p.x, p.y, 0];
|
|
|
+ if (p.rtk) {
|
|
|
+ const sPoint = scenePoints.value.find(({ id }) => id.toString() === p.title);
|
|
|
+ if (sPoint) {
|
|
|
+ pos[2] = sPoint.pos[2];
|
|
|
+ }
|
|
|
}
|
|
|
-}
|
|
|
-const handleDownload = async () => {
|
|
|
- const points = []
|
|
|
- props.data.polygons.forEach(poly => {
|
|
|
- poly.lineIds.forEach(line => {
|
|
|
- const targetLine = props.data.lines.find(l => l.id === line)
|
|
|
- targetLine && targetLine.pointIds.forEach(point => {
|
|
|
- const targetPoint = props.data.points.find(p => p.id === point)
|
|
|
- targetPoint && points.push(targetPoint)
|
|
|
- })
|
|
|
- })
|
|
|
- });
|
|
|
-
|
|
|
- points.map(item => (item.rtk = true))
|
|
|
- const transPoints = scenePosTransform(scenes.value);
|
|
|
- console.log('handleDownload', points, transPoints);
|
|
|
- await downloadPointsXLSL2(points, [{ title: "", desc: "" }], "本体边界坐标");
|
|
|
- // await downloadPointsXLSL2(points, [{ title: "xx", desc: "xxxx" }], 'xx');
|
|
|
-}
|
|
|
+ return pos;
|
|
|
+ });
|
|
|
+ const dists = polygonPoints.map((p) => ({
|
|
|
+ title: p.id,
|
|
|
+ desc: p.title || p.id,
|
|
|
+ }));
|
|
|
+ await downloadPointsXLSL2(
|
|
|
+ points,
|
|
|
+ dists,
|
|
|
+ `${item.name ? item.name : "本体边界" + item.id}`
|
|
|
+ );
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
.tree-item {
|
|
|
- display: flex;
|
|
|
- width: calc(100% - 50px);
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
-
|
|
|
- .title {
|
|
|
- flex: 1;
|
|
|
- overflow: hidden;
|
|
|
- text-overflow: ellipsis; //文本溢出显示省略号
|
|
|
- white-space: nowrap; //文本不会换行
|
|
|
- }
|
|
|
-
|
|
|
- .oper {
|
|
|
- flex: none;
|
|
|
- }
|
|
|
+ display: flex;
|
|
|
+ width: calc(100% - 50px);
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+ .title {
|
|
|
+ flex: 1;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis; //文本溢出显示省略号
|
|
|
+ white-space: nowrap; //文本不会换行
|
|
|
+ }
|
|
|
+
|
|
|
+ .oper {
|
|
|
+ flex: none;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
.disable {
|
|
|
- pointer-events: all;
|
|
|
+ pointer-events: all;
|
|
|
}
|
|
|
|
|
|
.tree-layout {
|
|
|
- p {
|
|
|
- color: #303133;
|
|
|
- font-size: 14px;
|
|
|
- }
|
|
|
+ p {
|
|
|
+ color: #303133;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
.right-layout {
|
|
|
- display: flex;
|
|
|
- height: 100%;
|
|
|
- flex-direction: column;
|
|
|
-
|
|
|
- .right-content {
|
|
|
- flex: 1;
|
|
|
- overflow-y: auto;
|
|
|
- }
|
|
|
+ display: flex;
|
|
|
+ height: 100%;
|
|
|
+ flex-direction: column;
|
|
|
+
|
|
|
+ .right-content {
|
|
|
+ flex: 1;
|
|
|
+ overflow-y: auto;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
.tree-layout .tree-scene-name {
|
|
|
- font-size: 10px;
|
|
|
- margin: 0;
|
|
|
- color: #999;
|
|
|
+ font-size: 10px;
|
|
|
+ margin: 0;
|
|
|
+ color: #999;
|
|
|
}
|
|
|
|
|
|
.poly-list {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ font-size: 14px;
|
|
|
+ user-select: none;
|
|
|
+
|
|
|
+ .poly-list-item {
|
|
|
width: 100%;
|
|
|
display: flex;
|
|
|
- flex-direction: column;
|
|
|
- font-size: 14px;
|
|
|
- user-select: none;
|
|
|
-
|
|
|
- .poly-list-item {
|
|
|
- width: 100%;
|
|
|
- display: flex;
|
|
|
- flex-direction: row;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- margin-bottom: 10px;
|
|
|
-
|
|
|
- .icon {
|
|
|
- margin-left: 8px;
|
|
|
- color: #409EFF;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .empty {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- font-size: 13px;
|
|
|
- color: gray;
|
|
|
- padding-top: 40px;
|
|
|
+ flex-direction: row;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 10px;
|
|
|
|
|
|
+ .icon {
|
|
|
+ margin-left: 8px;
|
|
|
+ color: #409eff;
|
|
|
+ cursor: pointer;
|
|
|
}
|
|
|
+ }
|
|
|
+
|
|
|
+ .empty {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ font-size: 13px;
|
|
|
+ color: gray;
|
|
|
+ padding-top: 40px;
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|
