diff --git a/package.json b/package.json
index 01fa3fd..0b9d762 100644
--- a/package.json
+++ b/package.json
@@ -102,6 +102,7 @@
"ant-design-vue/es/tag/style/css",
"ant-design-vue/es/time-picker/style/css",
"ant-design-vue/es/tooltip/style/css",
+ "ant-design-vue/es/tree-select/style/css",
"ant-design-vue/es/tree/style/css",
"ant-design-vue/es/upload/style/css",
"axios",
diff --git a/src/assets/icons/import.svg b/src/assets/icons/import.svg
new file mode 100644
index 0000000..ffee70b
--- /dev/null
+++ b/src/assets/icons/import.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1694067782275" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5140" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><path d="M746.666667 469.333333H554.666667V213.333333l42.666666 42.666667 51.2 51.2L746.666667 213.333333l59.733333 59.733334-98.133333 98.133333 21.333333 21.333333 38.4 34.133334 42.666667 42.666666h-64zM512 213.333333v85.333334H298.666667v426.666666h426.666666v-213.333333h85.333334v298.666667H213.333333V213.333333h298.666667z" fill="#ffffff" p-id="5141"></path></svg>
\ No newline at end of file
diff --git a/src/components/common/topbar.vue b/src/components/common/topbar.vue
index 69e4462..ed22a27 100644
--- a/src/components/common/topbar.vue
+++ b/src/components/common/topbar.vue
@@ -41,7 +41,7 @@ import { message } from 'ant-design-vue'
import { defineComponent, onMounted, ref } from 'vue'
import { getRoot } from '/@/root'
import { getPlatformInfo } from '/@/api/manage'
-import { ELocalStorageKey, ERouterName } from '/@/types'
+import { ELocalStorageKey, ERouterName, TabName } from '/@/types'
import { UserOutlined, ExportOutlined } from '@ant-design/icons-vue'
import cloudapi from '/@/assets/icons/cloudapi.png'
@@ -61,10 +61,10 @@ interface IOptions {
const username = ref(localStorage.getItem(ELocalStorageKey.Username))
const workspaceName = ref('')
const options = [
- { key: 0, label: ERouterName.WORKSPACE.charAt(0).toUpperCase() + ERouterName.WORKSPACE.substr(1), path: '/' + ERouterName.WORKSPACE },
- { key: 1, label: ERouterName.MEMBERS.charAt(0).toUpperCase() + ERouterName.MEMBERS.substr(1), path: '/' + ERouterName.MEMBERS },
- { key: 2, label: ERouterName.DEVICES.charAt(0).toUpperCase() + ERouterName.DEVICES.substr(1), path: '/' + ERouterName.DEVICES },
- { key: 3, label: ERouterName.FIRMWARES.charAt(0).toUpperCase() + ERouterName.FIRMWARES.substr(1), path: '/' + ERouterName.FIRMWARES },
+ { key: 0, label: TabName.WORKSPACE, path: '/' + ERouterName.WORKSPACE },
+ { key: 1, label: TabName.MEMBERS, path: '/' + ERouterName.MEMBERS },
+ { key: 2, label: TabName.DEVICES, path: '/' + ERouterName.DEVICES },
+ { key: 3, label: TabName.FIRMWARES, path: '/' + ERouterName.FIRMWARES },
]
const selected = ref<string>(root.$route.path)
diff --git a/src/pages/page-web/projects/layer.vue b/src/pages/page-web/projects/layer.vue
index 76fa96d..8110d5c 100644
--- a/src/pages/page-web/projects/layer.vue
+++ b/src/pages/page-web/projects/layer.vue
@@ -3,8 +3,12 @@
<div style="height: 50px; line-height: 50px; border-bottom: 1px solid #4f4f4f; font-weight: 450;">
<a-row>
<a-col :span="1"></a-col>
- <a-col :span="22">标注</a-col>
- <a-col :span="1"></a-col>
+ <a-col :span="20">标注</a-col>
+ <a-col :span="1">
+ <a-tooltip title="导入">
+ <img :src="importImg" class="img-icon" @click="openFileDialog" />
+ </a-tooltip>
+ </a-col>
</a-row>
</div>
<div class="scrollbar" :style="{ height: scorllHeight + 'px'}">
@@ -102,6 +106,42 @@
<a-button type="primary" @click="deleteElement">删除</a-button>
</div>
</a-drawer>
+ <a-modal v-model:visible="importVisible" :closable="false" :maskClosable="false" class="modal-layer-content">
+ <template #title>
+ <div class="model-title">移动到</div>
+ </template>
+ <a-form :model="state" class="form-content">
+ <a-form-item label="文件" style="color:#fff">
+ <a-upload
+ accept=".kml"
+ action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
+ :file-list="fileList"
+ @change="handleChange"
+ >
+ <a-button class="btn-color">
+ <upload-outlined></upload-outlined>
+ 上传文件
+ </a-button>
+ </a-upload>
+ </a-form-item>
+ <a-form-item label="文件夹" style="color:#fff">
+ <a-tree-select
+ v-model:value="state.file"
+ style="width: 100%"
+ :tree-data="fileTree"
+ allow-clear
+ placeholder="Please select"
+ tree-node-filter-prop="label"
+ />
+ </a-form-item>
+ </a-form>
+ <template #footer>
+ <div>
+ <a-button large class="btn-primary btn-color" @click='importVisible=false'>取消</a-button>
+ <a-button type="primary" large class="btn-primary" @click='importSubmit()'>确定</a-button>
+ </div>
+ </template>
+ </a-modal>
</div>
</template>
@@ -121,12 +161,13 @@ import { GeojsonCoordinate, LayerResource } from '/@/types/map'
import { Color, GeoType } from '/@/types/mapLayer'
import { generatePoint } from '/@/utils/genjson'
import { gcj02towgs84, wgs84togcj02 } from '/@/vendors/coordtransform'
+import importImg from '/@/assets/icons/import.svg'
const root = getRoot()
const store = useMyStore()
let useGMapCoverHook = useGMapCover(store)
console.log('store', store)
-const mapLayers = ref(store.state.Layers)
+const mapLayers = ref(store?.state?.Layers)
const checkedKeys = ref<string[]>([])
const selectedKeys = ref<string[]>([])
const selectedKey = ref<string>('')
@@ -441,12 +482,121 @@ function updateCoordinates (transformType: string, element: LayerResource) {
}
}
}
+/** 导入文件--------------start */
+const importVisible = ref(false)
+const state = reactive({ name: '', file: '' })
+const fileList = ref()
+const fileTree = [
+ {
+ label: 'Node1',
+ value: '0-0',
+ children: [
+ {
+ label: 'Child Node1',
+ value: '0-0-0',
+ },
+ ],
+ },
+ {
+ label: 'Node2',
+ value: '0-1',
+
+ children: [
+ {
+ label: 'Child Node3',
+ value: '0-1-0',
+ disabled: true,
+ },
+ {
+ label: 'Child Node4',
+ value: '0-1-1',
+ },
+ {
+ label: 'Child Node5',
+ value: '0-1-2',
+ },
+ ],
+ },
+]
+
+// 打开文件导入弹框
+const openFileDialog = () => {
+ importVisible.value = true
+}
+// 确认导入操作
+const importSubmit = () => {
+
+}
+// const beforeUpload = (file:any) => {
+// // fileList.value = [file]
+// // }
+const handleChange = (info: any) => {
+ let resFileList = [...info.fileList]
+ resFileList = resFileList.slice(-1)
+ resFileList = resFileList.map(file => {
+ if (file.response) {
+ file.url = file.response.url
+ }
+ return file
+ })
+ fileList.value = resFileList
+}
+
+/** 导入文件--------------end */
</script>
<style lang="scss" scoped>
+
@import '/@/styles/index.scss';
+::v-deep(.ant-modal-content){
+ background-color: #1c1c1c;
+
+}
+.btn-color{
+ background-color: #3c3c3c;
+ border:none;
+ color:#fff;
+ &:hover{
+ background-color: #666;
+
+ }
+ }
+.form-content{
+ ::v-deep(.ant-form-item-label>label){
+ color:#ffffffa6
+ }
+ ::v-deep(.ant-select-selector){
+ background-color:#3c3c3c !important;
+ border:none !important;
+ }
+}
+.img-icon{
+ cursor: pointer;
+ width:22px;
+ height:22px;
+}
+
+.model-title{
+ cursor: move ;
+ text-align: center;
+ border: none;
+ color:#fff;
+ width:100%;
+}
</style>
<style lang="scss">
+.modal-layer-content{
+ .ant-modal-content{
+ background-color: #1c1c1c !important;
+ }
+ .ant-modal-header{
+ background-color: #282828;
+ border:none;
+ }
+ .ant-modal-footer{
+ border:none;
+ }
+}
.drawer-element-wrapper {
.ant-drawer-content {
background-color: $dark-highlight;
@@ -491,4 +641,5 @@ function updateCoordinates (transformType: string, element: LayerResource) {
.scrollbar {
overflow: auto;
}
+
</style>
diff --git a/src/types/enums.ts b/src/types/enums.ts
index 43248fa..7aa4d47 100644
--- a/src/types/enums.ts
+++ b/src/types/enums.ts
@@ -136,3 +136,9 @@ export enum EHmsLevel {
CAUTION,
WARN,
}
+export enum TabName {
+ WORKSPACE = '工作区',
+ MEMBERS = '人员管理',
+ DEVICES = '设备管理',
+ FIRMWARES='固件管理'
+}