Skip to content

Commit 5a00989

Browse files
committed
update
1 parent b9cdb68 commit 5a00989

File tree

5 files changed

+42
-14
lines changed

5 files changed

+42
-14
lines changed

geojson-editor/src/App.vue

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -10,12 +10,10 @@
1010
<script setup lang="ts">
1111
import { Component, createApp, h, ref, watch } from 'vue';
1212
import Map from '../../packages/maplugin-maplibre/demo/Map.vue';
13-
import Drawer from './components/features/Drawer.vue';
1413
import Measurer from './components/features/Measurer.vue';
1514
import FeatureCollectionEditor from './components/features/FeatureCollectionEditor.vue';
1615
import ShowEditorButton from './components/features/ShowEditorButton.vue';
17-
import IO from './components/features/IO.vue';
18-
import ExtendPannel from './components/base/ExtendPannel.vue';
16+
import Data from './components/features/Data/Data.vue';
1917
2018
import { DrawManager, GeoJSONLayerManager, MeasureManager, TIdentityGeoJSONFeature, MiddleButtonRoate, VertexEditor, useCamera } from '../../packages/maplugin-maplibre';
2119
import { StoreEditor } from './stores';
@@ -112,11 +110,11 @@ function handleMapLoaded(map: maplibregl.Map) {
112110
});
113111
114112
createMapControl(map, ShowEditorButton);
115-
createMapControl(map, IO, {
113+
createMapControl(map, Data, {
114+
drawManager,
116115
onUpload: (features: Array<TIdentityGeoJSONFeature>) => glManager.add(...features),
117116
onDownload: () => glManager.fc
118-
});
119-
createMapControl(map, Drawer, { drawManager }, 'top-left');
117+
}, "top-left");
120118
createMapControl(map, Measurer, { measureManager }, 'top-left');
121119
}
122120

geojson-editor/src/components/base/ExtendPannel.vue

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,11 +47,12 @@ function onToggleWrap(active: boolean) {
4747
border-radius: 6px;
4848
opacity: 0;
4949
transition: opacity 0.2s ease-in-out;
50-
50+
pointer-events: none;
5151
}
5252
5353
.extend-pannel-content.active {
5454
opacity: 1;
55+
pointer-events: auto;
5556
}
5657
5758
.top-left {
Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<template>
2+
<div class="data">
3+
<IO :onUpload="onUpload" :onDownload="onDownload"></IO>
4+
<Drawer :drawManager="drawManager"></Drawer>
5+
</div>
6+
</template>
7+
8+
<script setup lang="ts">
9+
import IO from './IO.vue';
10+
import Drawer from './Drawer.vue';
11+
import { DrawManager, TIdentityGeoJSONFeature } from '../../../../../packages/maplugin-maplibre';
12+
13+
defineProps<{
14+
onUpload(features: Array<TIdentityGeoJSONFeature>): void,
15+
onDownload(): GeoJSON.FeatureCollection,
16+
drawManager: DrawManager
17+
}>();
18+
19+
</script>
20+
21+
<style scoped>
22+
.data {
23+
display: flex;
24+
gap: 8px;
25+
}
26+
</style>

geojson-editor/src/components/features/Drawer.vue renamed to geojson-editor/src/components/features/Data/Drawer.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@
77
</template>
88

99
<script lang="ts" setup>
10-
import RadioButton from '../base/RadioButton.vue';
11-
import { DrawManager, TDrawGeometryType } from '../../../../packages/maplugin-core';
10+
import RadioButton from '../../base/RadioButton.vue';
11+
import { DrawManager, TDrawGeometryType } from '../../../../../packages/maplugin-maplibre';
1212
import { ref, watch } from 'vue';
1313
1414
const radios: Record<TDrawGeometryType, string> = {

geojson-editor/src/components/features/IO.vue renamed to geojson-editor/src/components/features/Data/IO.vue

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
11
<template>
22
<div class="up-down-load">
33
<div class="upload" @click="handleUpload">
4-
<svg t="1731034374048" class="icon" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="24"
4+
<svg t="1731034374048" class="icon" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="32"
55
height="20">
66
<path
77
d="M576 631.466667V725.333333h170.666667c59.733333-8.533333 106.666667-64 106.666666-128 0-72.533333-55.466667-128-128-128-17.066667 0-29.866667 4.266667-42.666666 8.533334V469.333333c0-93.866667-76.8-170.666667-170.666667-170.666666s-170.666667 76.8-170.666667 170.666666c0 17.066667 4.266667 29.866667 4.266667 46.933334-8.533333-4.266667-17.066667-4.266667-25.6-4.266667C260.266667 512 213.333333 558.933333 213.333333 618.666667S260.266667 725.333333 320 725.333333h170.666667v-93.866666l-46.933334 46.933333L384 618.666667l149.333333-149.333334 149.333334 149.333334-59.733334 59.733333-46.933333-46.933333z m0 93.866666v85.333334h-85.333333v-85.333334h-42.666667v85.333334h-128C213.333333 810.666667 128 725.333333 128 618.666667c0-85.333333 55.466667-157.866667 128-183.466667C273.066667 311.466667 379.733333 213.333333 512 213.333333c110.933333 0 209.066667 72.533333 243.2 170.666667 102.4 12.8 183.466667 102.4 183.466667 213.333333s-85.333333 200.533333-192 213.333334h-128v-85.333334h-42.666667z"
88
fill="#ccc" p-id="8232" style="--darkreader-inline-fill: #33373a;"></path>
99
</svg>
1010
</div>
1111
<div class="download" @click="handleDownload">
12-
<svg t="1731034330703" class="icon" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="24"
12+
<svg t="1731034330703" class="icon" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="32"
1313
height="20">
1414
<path
1515
d="M490.666667 644.266667V469.333333h85.333333v174.933334l46.933333-46.933334 59.733334 59.733334-68.266667 68.266666h132.266667c59.733333-8.533333 106.666667-64 106.666666-128 0-72.533333-55.466667-128-128-128-17.066667 0-29.866667 4.266667-42.666666 8.533334V469.333333c0-93.866667-76.8-170.666667-170.666667-170.666666s-170.666667 76.8-170.666667 170.666666c0 17.066667 4.266667 29.866667 4.266667 46.933334-8.533333-4.266667-17.066667-4.266667-25.6-4.266667C260.266667 512 213.333333 558.933333 213.333333 618.666667S260.266667 725.333333 320 725.333333h132.266667L384 657.066667l59.733333-59.733334 46.933334 46.933334z m123.733333 81.066666l-81.066667 81.066667-81.066666-81.066667H405.333333v85.333334h-85.333333C213.333333 810.666667 128 725.333333 128 618.666667c0-85.333333 55.466667-157.866667 128-183.466667C273.066667 311.466667 379.733333 213.333333 512 213.333333c110.933333 0 209.066667 72.533333 243.2 170.666667 102.4 12.8 183.466667 102.4 183.466667 213.333333s-85.333333 200.533333-192 213.333334h-85.333334v-85.333334h-46.933333z"
@@ -20,8 +20,8 @@
2020
</template>
2121

2222
<script setup lang="ts">
23-
import { TIdentityGeoJSONFeature } from '../../../../packages/maplugin-core';
24-
import FileProcesses from '../../services/file-processes';
23+
import { TIdentityGeoJSONFeature } from '../../../../../packages/maplugin-core';
24+
import FileProcesses from '../../../services/file-processes';
2525
2626
const props = defineProps<{
2727
onUpload(features: Array<TIdentityGeoJSONFeature>): void,
@@ -96,9 +96,12 @@ async function handleDownload() {
9696
}
9797
9898
.up-down-load>div {
99-
padding: 4px;
10099
line-height: 0;
101100
cursor: pointer;
101+
height: 100%;
102+
display: flex;
103+
align-items: center;
104+
justify-content: center;
102105
}
103106
104107
.up-down-load>div:hover {

0 commit comments

Comments
 (0)