Compare commits
2 Commits
d30b1ae48a
...
84cc20d01a
| Author | SHA1 | Date | |
|---|---|---|---|
| 84cc20d01a | |||
| d997410c9d |
@ -46,7 +46,7 @@ export const GraphApi = {
|
||||
//军标类型列表
|
||||
modelTypeList: async () => {
|
||||
return await request.get({
|
||||
url: `/militaryLibrary/militaryTypeList`
|
||||
url: `/militaryLibrary/militaryTypeTree`
|
||||
})
|
||||
},
|
||||
//添加军标文件
|
||||
@ -76,6 +76,15 @@ export const GraphApi = {
|
||||
data
|
||||
})
|
||||
},
|
||||
|
||||
//拖动层级(tree)
|
||||
dragModelType: async (data: any) => {
|
||||
return await request.post({
|
||||
url: `/militaryLibrary/dragMilitaryType`,
|
||||
data,
|
||||
})
|
||||
},
|
||||
|
||||
// //默认军标参数设置
|
||||
// modelSetting: async (data: any) => {
|
||||
// return await request.post({
|
||||
|
||||
@ -92,5 +92,11 @@ export const ModelApi = {
|
||||
url: `/businessConfig/list`
|
||||
})
|
||||
},
|
||||
|
||||
//拖动层级(tree)
|
||||
dragModelType: async (data: any) => {
|
||||
return await request.post({
|
||||
url: `/modelLibrary/dragModelType`,
|
||||
data,
|
||||
})
|
||||
},
|
||||
}
|
||||
|
||||
@ -76,6 +76,13 @@ export const PhotoApi = {
|
||||
data
|
||||
})
|
||||
},
|
||||
//拖动调整图标类型层级
|
||||
dragModelType: async (data: any) => {
|
||||
return await request.post({
|
||||
url: `/iconLibrary/dragIconType`,
|
||||
data
|
||||
})
|
||||
},
|
||||
// //默认图标参数设置
|
||||
// modelSetting: async (data: any) => {
|
||||
// return await request.post({
|
||||
|
||||
@ -10,16 +10,38 @@ export const RouteApi = {
|
||||
},
|
||||
//获取地图列表
|
||||
getRouteList: async () => {
|
||||
return await request.get({
|
||||
url: `/graphhopper/list`
|
||||
return await request.post({
|
||||
url: `/pbfInfo/list`
|
||||
})
|
||||
},
|
||||
//加载路网数据
|
||||
// //加载路网数据
|
||||
// loadRoute: async (data: any) => {
|
||||
// return await request.post({
|
||||
// url: `/graphhopper/loadMap`,
|
||||
// data,
|
||||
// headersType: 'application/x-www-form-urlencoded'
|
||||
// })
|
||||
// },
|
||||
//添加路网数据
|
||||
loadRoute: async (data: any) => {
|
||||
return await request.post({
|
||||
url: `/graphhopper/loadMap`,
|
||||
url: `/pbfInfo/add`,
|
||||
data,
|
||||
headersType: 'application/x-www-form-urlencoded'
|
||||
})
|
||||
},
|
||||
//启用路网数据
|
||||
enableRoute: async (data: any) => {
|
||||
return await request.post({
|
||||
url: `/pbfInfo/enable`,
|
||||
data,
|
||||
})
|
||||
},
|
||||
//删除路网数据
|
||||
delRoute: async (data: any) => {
|
||||
return await request.post({
|
||||
url: `/pbfInfo/delete`,
|
||||
data,
|
||||
})
|
||||
},
|
||||
}
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
<span class="fankuai"></span>
|
||||
<span class="setting_title">工程设置</span>
|
||||
|
||||
<el-upload
|
||||
<!-- <el-upload
|
||||
:action="uploadUrl()"
|
||||
:headers="headers"
|
||||
:data="data"
|
||||
@ -13,17 +13,21 @@
|
||||
:on-success="handleSuccess"
|
||||
:on-error="handleError"
|
||||
class="simple-upload"
|
||||
> -->
|
||||
<el-button
|
||||
color="#004b4b"
|
||||
style="border: 1px solid rgba(0, 255, 255, 0.5)"
|
||||
@click="routeImport"
|
||||
>
|
||||
<el-button color="#004b4b" style="border: 1px solid rgba(0, 255, 255, 0.5)">
|
||||
<template #icon>
|
||||
<svg-icon name="road_network" />
|
||||
</template>
|
||||
<span>路网导入</span>
|
||||
</el-button>
|
||||
</el-upload>
|
||||
<template #icon>
|
||||
<svg-icon name="road_network" />
|
||||
</template>
|
||||
<span>路网导入</span>
|
||||
</el-button>
|
||||
<!-- </el-upload> -->
|
||||
</div>
|
||||
<div class="fileList">
|
||||
<div class="fileList_nav" v-if="routeList.length">
|
||||
<div class="fileList" v-if="routeList.length">
|
||||
<div class="fileList_nav">
|
||||
<div class="fileList_nav_item" v-for="(item, index) in routeList" :key="index">
|
||||
<div class="item_left">
|
||||
<div class="img">
|
||||
@ -33,12 +37,27 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="file_name">
|
||||
<span>{{ item.fileName }}</span>
|
||||
<span>{{ item.name }}</span>
|
||||
<span>{{ item.createdAt }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item_right">
|
||||
<el-button color="#004b4b" style="border: 1px solid rgba(0, 255, 255, 0.5)">
|
||||
<span v-if="item.isEnable">已启用</span>
|
||||
|
||||
<el-button
|
||||
v-if="!item.isEnable"
|
||||
color="#004b4b"
|
||||
style="border: 1px solid rgba(0, 255, 255, 0.5)"
|
||||
@click="enableRouteData(item)"
|
||||
>
|
||||
<span>启用</span>
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="!item.isEnable"
|
||||
color="#004b4b"
|
||||
style="border: 1px solid rgba(0, 255, 255, 0.5)"
|
||||
@click="delRouteData(item)"
|
||||
>
|
||||
<span>删除</span>
|
||||
</el-button>
|
||||
</div>
|
||||
@ -122,10 +141,15 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ElMessage } from 'element-plus'
|
||||
import { ref } from 'vue'
|
||||
import { GisApi } from '@/api/gisApi'
|
||||
import { RouteApi } from '@/api/route'
|
||||
import {
|
||||
$sendElectronChanel,
|
||||
$recvElectronChanel,
|
||||
$changeComponentShow
|
||||
} from '@/utils/communication'
|
||||
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||
// 上传状态
|
||||
const isUploading = ref(false)
|
||||
|
||||
@ -152,9 +176,78 @@ const props = defineProps({
|
||||
}
|
||||
})
|
||||
|
||||
const routeImport = () => {
|
||||
let option = {
|
||||
properties: ['openFile'],
|
||||
filters: [
|
||||
{
|
||||
name: '路网', //、底图
|
||||
extensions: ['pbf']
|
||||
}
|
||||
]
|
||||
}
|
||||
$sendElectronChanel('open-directory-dialog', option)
|
||||
$recvElectronChanel('selectedItem', (e, path) => {
|
||||
if (path.length) {
|
||||
RouteApi.loadRoute({
|
||||
path: path[0]
|
||||
}).then((res) => {
|
||||
if (res.code === 200) {
|
||||
ElMessage({
|
||||
message: '上传成功',
|
||||
type: 'success'
|
||||
})
|
||||
getList()
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const enableRouteData = (row) => {
|
||||
ElMessageBox.confirm(`是否启用${row.name}数据?`, '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
let formData = new FormData()
|
||||
formData.append('id', row.id)
|
||||
RouteApi.enableRoute(formData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
ElMessage({
|
||||
message: '启用成功',
|
||||
type: 'success'
|
||||
})
|
||||
getList()
|
||||
}
|
||||
})
|
||||
})
|
||||
.catch(() => {})
|
||||
}
|
||||
const delRouteData = (row) => {
|
||||
ElMessageBox.confirm(`是否删除${row.name}数据?`, '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
let formData = new FormData()
|
||||
formData.append('id', row.id)
|
||||
RouteApi.delRoute(formData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
ElMessage({
|
||||
message: '删除成功',
|
||||
type: 'success'
|
||||
})
|
||||
getList()
|
||||
}
|
||||
})
|
||||
})
|
||||
.catch(() => {})
|
||||
}
|
||||
const uploadUrl = () => {
|
||||
//process.env.BASE_API +
|
||||
console.log(process.env.BASE_API, 'yyyyy')
|
||||
let url = 'http://192.168.110.25:8848' + '/yjearth4.0/api/v1/fileInfo/upload'
|
||||
return url
|
||||
}
|
||||
@ -164,12 +257,10 @@ const handleBeforeUpload = (file: File) => {
|
||||
ElMessage.error(`文件大小不能超过 ${props.maxSize}MB`)
|
||||
return false
|
||||
}
|
||||
console.log(file)
|
||||
// 标记为上传中
|
||||
const formData = new FormData()
|
||||
// fileArray.forEach((file, index) => {
|
||||
formData.append(`files`, file) // 生成files[0]格式参数
|
||||
console.log(formData, 'formData')
|
||||
// })
|
||||
GisApi.linkFile(formData).then((res) => {
|
||||
if (res.code == 0 || res.code == 200) {
|
||||
@ -192,14 +283,12 @@ const handleBeforeUpload = (file: File) => {
|
||||
var routeList: any = reactive([])
|
||||
const getList = async () => {
|
||||
let list = await RouteApi.getRouteList()
|
||||
console.log(list, 'list')
|
||||
routeList.splice(0, routeList.length, ...list.data)
|
||||
}
|
||||
getList()
|
||||
|
||||
const addRoute = async (fileId) => {
|
||||
let res = await RouteApi.loadRoute({ fileId })
|
||||
console.log(res, 'res')
|
||||
}
|
||||
|
||||
// 上传成功处理
|
||||
@ -212,7 +301,6 @@ const handleSuccess = (response: any) => {
|
||||
const handleError = (error: Error) => {
|
||||
isUploading.value = false
|
||||
ElMessage.error('文件上传失败')
|
||||
console.error('上传错误:', error)
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -226,6 +314,7 @@ const handleError = (error: Error) => {
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
line-height: 32px; // padding: 20px 0;
|
||||
padding: 0 0 20px 0;
|
||||
.fankuai {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
@ -267,9 +356,10 @@ const handleError = (error: Error) => {
|
||||
}
|
||||
.fileList {
|
||||
width: 100%;
|
||||
height: 20vh;
|
||||
// height: 20vh;
|
||||
max-height: 20vh;
|
||||
box-sizing: border-box;
|
||||
padding: 20px 0;
|
||||
padding: 0 0 20px 0;
|
||||
|
||||
.fileList_nav {
|
||||
width: 100%;
|
||||
|
||||
@ -37,6 +37,8 @@
|
||||
draggable
|
||||
ref="treeRef"
|
||||
node-key="id"
|
||||
empty-text=""
|
||||
:default-expanded-keys="expandedKeys"
|
||||
@node-click="handleTypeClick"
|
||||
@node-contextmenu="handleContextMenu"
|
||||
@node-drag-start="handleDragStart"
|
||||
@ -79,11 +81,15 @@
|
||||
<el-table :data="modelList" border style="width: 100%">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="militaryName" label="名称" />
|
||||
<el-table-column prop="thumbnail" label="缩略图" width="100">
|
||||
<el-table-column prop="militaryDataUrl" label="缩略图" width="100">
|
||||
<template #default="{ row }">
|
||||
<!-- <el-image
|
||||
style="width: 80px; height: 60px"
|
||||
:src="'http://127.0.0.1:8848' + row.militaryDataUrl"
|
||||
/> -->
|
||||
<el-image
|
||||
style="width: 80px; height: 60px"
|
||||
:src="'http://127.0.0.1:8848' + row.data"
|
||||
:src="'http://127.0.0.1:8848' + row.militaryDataUrl"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
@ -145,6 +151,7 @@ import {
|
||||
const fs = require('fs')
|
||||
const eventBus: any = inject('bus')
|
||||
var clickTreeNode: any = reactive({})
|
||||
var leftClickTreeNode: any = reactive({})
|
||||
|
||||
interface TypeNode {
|
||||
id: string
|
||||
@ -159,8 +166,8 @@ interface ModelItem {
|
||||
id: string
|
||||
typeId: string
|
||||
name: string
|
||||
thumbnail: string
|
||||
militaryId: string
|
||||
militaryDataUrl: string
|
||||
}
|
||||
|
||||
const typeTreeData = ref<TypeNode[]>([])
|
||||
@ -225,12 +232,26 @@ const addType = () => {
|
||||
dialogVisible.value = false
|
||||
}
|
||||
|
||||
var expandedKeys: any = ref([])
|
||||
// 获取当前所有展开节点的key
|
||||
const getExpandedKeys = () => {
|
||||
const nodesMap = treeRef.value?.store?.nodesMap || {}
|
||||
return Object.values(nodesMap)
|
||||
.filter((node) => node.expanded)
|
||||
.map((node) => node.key)
|
||||
}
|
||||
|
||||
// 节点展开/折叠时更新状态
|
||||
const updateExpandedState = () => {
|
||||
const keys = getExpandedKeys()
|
||||
expandedKeys.value = keys
|
||||
}
|
||||
|
||||
//获取模型列表
|
||||
eventBus.on('settingPop', (data) => {
|
||||
if (data) {
|
||||
//关闭弹框时更新模型列表
|
||||
// getModelList()
|
||||
getModelListByType(showImageRow.militaryTypeId)
|
||||
// getModelListByType(showImageRow.militaryTypeId)
|
||||
showImageRow = null
|
||||
}
|
||||
})
|
||||
@ -321,10 +342,11 @@ const importModelDB = () => {
|
||||
|
||||
const addModelDB = (path) => {
|
||||
let formData = new FormData()
|
||||
formData.append('modelPath', path)
|
||||
formData.append('militaryPath', path)
|
||||
GraphApi.importModelDB(formData).then((res) => {
|
||||
if (res.code == 0 || res.code == 200) {
|
||||
ElMessage.success('导入成功')
|
||||
modelList.value = []
|
||||
getModelList()
|
||||
}
|
||||
})
|
||||
@ -352,6 +374,19 @@ const handleDragEnd = (
|
||||
ev: DragEvents
|
||||
) => {
|
||||
console.log('tree drag end:', dropNode, dropType, ev, draggingNode)
|
||||
let nodeList = dropNode.childNodes.map((item, index) => {
|
||||
return {
|
||||
id: item.data.id,
|
||||
parentId: dropNode.data.id,
|
||||
treeIndex: index
|
||||
}
|
||||
})
|
||||
GraphApi.dragModelType(nodeList).then((res) => {
|
||||
if (res.code == 0 || res.code == 200) {
|
||||
ElMessage.success('拖拽成功')
|
||||
getModelList()
|
||||
}
|
||||
})
|
||||
}
|
||||
const handleDrop = (draggingNode: Node, dropNode: Node, dropType: NodeDropType, ev: DragEvents) => {
|
||||
console.log('tree drop:', dropNode.label, dropType)
|
||||
@ -370,7 +405,7 @@ const allowDrag = (draggingNode: Node) => {
|
||||
//拖拽结束
|
||||
|
||||
//---------------------查看缩略图--------------------
|
||||
var showImageRow:any = null
|
||||
var showImageRow: any = null
|
||||
const showImage = (row: any) => {
|
||||
showImageRow = row
|
||||
eventBus.emit('imagePopDialog', row)
|
||||
@ -414,8 +449,10 @@ const toggleExpand = (row: any) => {
|
||||
|
||||
if (row.expanded) {
|
||||
row.collapse()
|
||||
updateExpandedState()
|
||||
} else {
|
||||
row.expand()
|
||||
updateExpandedState()
|
||||
// getModelListByType(row.data.id)
|
||||
}
|
||||
} else {
|
||||
@ -423,6 +460,7 @@ const toggleExpand = (row: any) => {
|
||||
}
|
||||
getModelListByType(row.data.id)
|
||||
currentTypeId.value = row.id
|
||||
leftClickTreeNode = row.data
|
||||
// loadModelsByType(row.id)
|
||||
contextMenu.visible && (contextMenu.visible = false)
|
||||
}
|
||||
@ -472,6 +510,7 @@ const handleMenuCommand = (command: string) => {
|
||||
const handleTypeClick = (row: any) => {
|
||||
getModelListByType(row.id)
|
||||
currentTypeId.value = row.$treeNodeId
|
||||
leftClickTreeNode = row
|
||||
// // 模拟根据类型ID加载模型数据
|
||||
// loadModelsByType(row.id)
|
||||
// contextMenu.visible && (contextMenu.visible = false)
|
||||
@ -520,7 +559,7 @@ const handleRenameType = (row: TypeNode) => {
|
||||
}
|
||||
|
||||
const handleDeleteType = (row: TypeNode) => {
|
||||
ElMessageBox.confirm('是否删除数据?', '警告', {
|
||||
ElMessageBox.confirm('是否删除数据?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
@ -637,7 +676,7 @@ const getNamefromPath = (path) => {
|
||||
}
|
||||
|
||||
const handleDelete = (row: any) => {
|
||||
ElMessageBox.confirm('是否删除数据?', '警告', {
|
||||
ElMessageBox.confirm('是否删除数据?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
@ -828,3 +867,30 @@ onMounted(() => {
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss">
|
||||
.el-message-box {
|
||||
--el-messagebox-title-color: #fff !important;
|
||||
--el-messagebox-content-color: #fff !important;
|
||||
background:
|
||||
linear-gradient(
|
||||
180deg,
|
||||
rgba(var(--color-sdk-base-rgb), 0) 0%,
|
||||
rgba(var(--color-sdk-base-rgb), 0.2) 100%
|
||||
),
|
||||
rgba(0, 0, 0, 0.6) !important;
|
||||
.el-message-box__btns {
|
||||
.el-button {
|
||||
--el-button-text-color: #fff;
|
||||
--el-button-bg-color: rgba(var(--color-sdk-base-rgb), 0.2) !important;
|
||||
--el-button-hover-bg-color: rgba(var(--color-sdk-base-rgb), 0.2) !important;
|
||||
--el-button-border-color: rgba(var(--color-sdk-base-rgb), 0.5) !important;
|
||||
--el-button-hover-border-color: rgba(var(--color-sdk-base-rgb), 1) !important;
|
||||
--el-button-hover-text-color: rgba(var(--color-sdk-base-rgb), 1) !important;
|
||||
}
|
||||
.el-button--primary {
|
||||
--el-button-bg-color: rgba(var(--color-sdk-base-rgb), 0.2) !important;
|
||||
--el-button-hover-bg-color: rgba(var(--color-sdk-base-rgb), 0.2) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -34,9 +34,11 @@
|
||||
:allow-drop="allowDrop"
|
||||
:allow-drag="allowDrag"
|
||||
:data="typeTreeData"
|
||||
:default-expanded-keys="expandedKeys"
|
||||
draggable
|
||||
ref="treeRef"
|
||||
node-key="id"
|
||||
empty-text=""
|
||||
@node-click="handleTypeClick"
|
||||
@node-contextmenu="handleContextMenu"
|
||||
@node-drag-start="handleDragStart"
|
||||
@ -83,7 +85,7 @@
|
||||
<template #default="{ row }">
|
||||
<el-image
|
||||
style="width: 80px; height: 60px"
|
||||
:src="'http://127.0.0.1:8848' + row.poster"
|
||||
:src="'http://127.0.0.1:8848' + row.posterDataUrl"
|
||||
fit="contain"
|
||||
/>
|
||||
</template>
|
||||
@ -137,7 +139,7 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, reactive, onMounted } from 'vue'
|
||||
import { ref, reactive, onMounted, nextTick } from 'vue'
|
||||
import type { TableColumnCtx } from 'element-plus'
|
||||
import contextMenuCom from './contentMenu.vue'
|
||||
import Sortable from 'sortablejs'
|
||||
@ -154,6 +156,7 @@ import {
|
||||
const fs = require('fs')
|
||||
const eventBus: any = inject('bus')
|
||||
var clickTreeNode: any = reactive({})
|
||||
var leftClickTreeNode: any = reactive({})
|
||||
|
||||
interface TypeNode {
|
||||
id: string
|
||||
@ -239,16 +242,48 @@ eventBus.on('settingPop', (data) => {
|
||||
if (data) {
|
||||
//关闭弹框时更新模型列表
|
||||
// getModelList()
|
||||
getModelListByType(showImageRow.modelTypeId)
|
||||
|
||||
// getModelListByType(showImageRow.modelTypeId)
|
||||
showImageRow = null
|
||||
}
|
||||
})
|
||||
|
||||
var expandedKeys: any = ref([])
|
||||
// 获取当前所有展开节点的key
|
||||
const getExpandedKeys = () => {
|
||||
const nodesMap = treeRef.value?.store?.nodesMap || {}
|
||||
return Object.values(nodesMap)
|
||||
.filter((node) => node.expanded)
|
||||
.map((node) => node.key)
|
||||
}
|
||||
|
||||
// 节点展开/折叠时更新状态
|
||||
const updateExpandedState = () => {
|
||||
const keys = getExpandedKeys()
|
||||
expandedKeys.value = keys
|
||||
}
|
||||
const getModelList = async () => {
|
||||
const res: any = await ModelApi.modelTypeList()
|
||||
if (res.code == 0 || res.code == 200) {
|
||||
let data = transformNestedJson(res.data, 'name', 'label')
|
||||
typeTreeData.value = data
|
||||
const saved = localStorage.getItem('tree-expanded-keys')
|
||||
if (saved) {
|
||||
expandedKeys.value = JSON.parse(saved)
|
||||
localStorage.removeItem('tree-expanded-keys')
|
||||
}
|
||||
let click = localStorage.getItem('tree-click-node')
|
||||
if (click) {
|
||||
let data = JSON.parse(click)
|
||||
await nextTick(() => {
|
||||
let node = treeRef.value!.getNode(data.id)
|
||||
currentTypeId.value = node.id
|
||||
leftClickTreeNode = data
|
||||
getModelListByType(node.data.id)
|
||||
})
|
||||
|
||||
localStorage.removeItem('tree-click-node')
|
||||
}
|
||||
}
|
||||
}
|
||||
const transformNestedJson = (data, oldKey, newKey) => {
|
||||
@ -282,6 +317,7 @@ const handleFileChange = (e: Event) => {
|
||||
ModelApi.addModel(formData).then((res) => {
|
||||
if (res.code == 0 || res.code == 200) {
|
||||
ElMessage.success('导入成功')
|
||||
|
||||
getModelListByType(clickTreeNode.id)
|
||||
}
|
||||
})
|
||||
@ -334,6 +370,7 @@ const addModelDB = (path) => {
|
||||
ModelApi.importModelDB(formData).then((res) => {
|
||||
if (res.code == 0 || res.code == 200) {
|
||||
ElMessage.success('导入成功')
|
||||
modelList.value = []
|
||||
getModelList()
|
||||
}
|
||||
})
|
||||
@ -361,6 +398,19 @@ const handleDragEnd = (
|
||||
ev: DragEvents
|
||||
) => {
|
||||
console.log('tree drag end:', dropNode, dropType, ev, draggingNode)
|
||||
let nodeList = dropNode.childNodes.map((item, index) => {
|
||||
return {
|
||||
id: item.data.id,
|
||||
parentId: dropNode.data.id,
|
||||
treeIndex: index
|
||||
}
|
||||
})
|
||||
ModelApi.dragModelType(nodeList).then((res) => {
|
||||
if (res.code == 0 || res.code == 200) {
|
||||
ElMessage.success('拖拽成功')
|
||||
getModelList()
|
||||
}
|
||||
})
|
||||
}
|
||||
const handleDrop = (draggingNode: Node, dropNode: Node, dropType: NodeDropType, ev: DragEvents) => {
|
||||
console.log('tree drop:', dropNode.label, dropType)
|
||||
@ -382,6 +432,8 @@ const allowDrag = (draggingNode: Node) => {
|
||||
var showImageRow: any = null
|
||||
const showImage = (row: any) => {
|
||||
showImageRow = row
|
||||
localStorage.setItem('tree-expanded-keys', JSON.stringify(expandedKeys.value)) //打开弹框前记录展开状态和点击状态
|
||||
localStorage.setItem('tree-click-node', JSON.stringify(leftClickTreeNode)) //打开弹框前记录展开状态和点击状态
|
||||
eventBus.emit('imagePopDialog', row)
|
||||
eventBus.emit('settingPop', false)
|
||||
}
|
||||
@ -394,22 +446,22 @@ const handleContextMenu = (event: MouseEvent, row: TypeNode) => {
|
||||
contextMenu.x = event.clientX
|
||||
contextMenu.y = event.clientY
|
||||
|
||||
if (row.parentId) {
|
||||
// 二级分类菜单
|
||||
contextMenu.items = [
|
||||
{ command: 'import', label: '导入模型', icon: 'importModel' },
|
||||
{ command: 'rename', label: '重命名', icon: 'rename' },
|
||||
{ command: 'delete', label: '删除', icon: 'delModel' }
|
||||
]
|
||||
} else {
|
||||
// 一级分类菜单
|
||||
contextMenu.items = [
|
||||
{ command: 'add-child', label: '添加子类型', icon: 'add' },
|
||||
{ command: 'import', label: '导入模型', icon: 'importModel' },
|
||||
{ command: 'rename', label: '重命名', icon: 'rename' },
|
||||
{ command: 'delete', label: '删除', icon: 'delModel' }
|
||||
]
|
||||
}
|
||||
// if (row.parentId) {
|
||||
// // 二级分类菜单
|
||||
// contextMenu.items = [
|
||||
// { command: 'import', label: '导入模型', icon: 'importModel' },
|
||||
// { command: 'rename', label: '重命名', icon: 'rename' },
|
||||
// { command: 'delete', label: '删除', icon: 'delModel' }
|
||||
// ]
|
||||
// } else {
|
||||
// 一级分类菜单
|
||||
contextMenu.items = [
|
||||
{ command: 'add-child', label: '添加子类型', icon: 'add' },
|
||||
{ command: 'import', label: '导入模型', icon: 'importModel' },
|
||||
{ command: 'rename', label: '重命名', icon: 'rename' },
|
||||
{ command: 'delete', label: '删除', icon: 'delModel' }
|
||||
]
|
||||
// }
|
||||
clickTreeNode = row
|
||||
|
||||
contextMenu.visible = true
|
||||
@ -423,8 +475,10 @@ const toggleExpand = (row: any) => {
|
||||
|
||||
if (row.expanded) {
|
||||
row.collapse()
|
||||
updateExpandedState()
|
||||
} else {
|
||||
row.expand()
|
||||
updateExpandedState()
|
||||
// getModelListByType(row.data.id)
|
||||
}
|
||||
} else {
|
||||
@ -432,6 +486,7 @@ const toggleExpand = (row: any) => {
|
||||
}
|
||||
getModelListByType(row.data.id)
|
||||
currentTypeId.value = row.id
|
||||
leftClickTreeNode = row.data
|
||||
// loadModelsByType(row.id)
|
||||
contextMenu.visible && (contextMenu.visible = false)
|
||||
}
|
||||
@ -481,6 +536,7 @@ const handleMenuCommand = (command: string) => {
|
||||
const handleTypeClick = (row: any) => {
|
||||
getModelListByType(row.id)
|
||||
currentTypeId.value = row.$treeNodeId
|
||||
leftClickTreeNode = row
|
||||
// // 模拟根据类型ID加载模型数据
|
||||
// loadModelsByType(row.id)
|
||||
// contextMenu.visible && (contextMenu.visible = false)
|
||||
|
||||
@ -25,7 +25,7 @@
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<div class="typeBut">
|
||||
<!-- <div class="typeBut">
|
||||
<span
|
||||
v-for="(item, index) in butList"
|
||||
:key="index"
|
||||
@ -33,7 +33,7 @@
|
||||
@click="typeClick(index)"
|
||||
>{{ item }}</span
|
||||
>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<el-row :gutter="20">
|
||||
<!-- 左侧分类树 -->
|
||||
@ -49,6 +49,8 @@
|
||||
draggable
|
||||
ref="treeRef"
|
||||
node-key="id"
|
||||
empty-text=""
|
||||
:default-expanded-keys="expandedKeys"
|
||||
@node-click="handleTypeClick"
|
||||
@node-contextmenu="handleContextMenu"
|
||||
@node-drag-start="handleDragStart"
|
||||
@ -91,15 +93,20 @@
|
||||
<el-table :data="modelList" border style="width: 100%">
|
||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||
<el-table-column prop="iconName" label="名称" />
|
||||
<el-table-column prop="thumbnail" label="缩略图" width="100">
|
||||
<el-table-column prop="iconDataUrl" label="缩略图" width="100">
|
||||
<template #default="{ row, $index }" v-if="activeIndex === 2">
|
||||
<el-image
|
||||
ref="imageRef"
|
||||
fit="contain"
|
||||
:preview-teleported="true"
|
||||
:preview-src-list="modelList.map((item:any) => 'http://127.0.0.1:8848' + item.data)"
|
||||
:preview-src-list="
|
||||
modelList.map((item: any) => 'http://127.0.0.1:8848' + item.iconDataUrl)
|
||||
"
|
||||
style="width: 80px; height: 60px"
|
||||
:src="'http://127.0.0.1:8848' + row.data"
|
||||
:src="
|
||||
'http://127.0.0.1:8848' +
|
||||
'/iconLibrary/data/icon/f492f933485049358d11efffc611d89d/png'
|
||||
"
|
||||
:initial-index="currentIndex"
|
||||
@click="seeBigPhoto($index)"
|
||||
/>
|
||||
@ -109,9 +116,11 @@
|
||||
ref="imageRef"
|
||||
fit="contain"
|
||||
:preview-teleported="true"
|
||||
:preview-src-list="modelList.map((item:any) => 'http://localhost:55110/' + item.data)"
|
||||
:preview-src-list="
|
||||
modelList.map((item: any) => 'http://localhost:55110/' + item.iconDataUrl)
|
||||
"
|
||||
style="width: 80px; height: 60px"
|
||||
:src="'http://localhost:55110/' + row.data"
|
||||
:src="'http://localhost:55110/' + row.iconDataUrl"
|
||||
:initial-index="currentIndex"
|
||||
@click="seeBigPhoto($index)"
|
||||
/>
|
||||
@ -219,7 +228,7 @@ const contextMenu = reactive({
|
||||
})
|
||||
|
||||
//按钮
|
||||
var activeIndex = ref(0)
|
||||
var activeIndex = ref(2)
|
||||
var butList = reactive(['立体图标', '普通图标', '自定义图标'])
|
||||
const typeClick = (index) => {
|
||||
activeIndex.value = index
|
||||
@ -227,6 +236,21 @@ const typeClick = (index) => {
|
||||
getModelList()
|
||||
}
|
||||
|
||||
var expandedKeys: any = ref([])
|
||||
// 获取当前所有展开节点的key
|
||||
const getExpandedKeys = () => {
|
||||
const nodesMap = treeRef.value?.store?.nodesMap || {}
|
||||
return Object.values(nodesMap)
|
||||
.filter((node) => node.expanded)
|
||||
.map((node) => node.key)
|
||||
}
|
||||
|
||||
// 节点展开/折叠时更新状态
|
||||
const updateExpandedState = () => {
|
||||
const keys = getExpandedKeys()
|
||||
expandedKeys.value = keys
|
||||
}
|
||||
|
||||
const treeRef = ref()
|
||||
var currentIndex = ref(0)
|
||||
const reviewPhoto = (index) => {
|
||||
@ -303,9 +327,8 @@ const addType = () => {
|
||||
eventBus.on('settingPop', (data) => {
|
||||
if (data) {
|
||||
//关闭弹框时更新模型列表
|
||||
// getModelList()
|
||||
getModelListByType(showImageRow.iconTypeId)
|
||||
showImageRow = null
|
||||
// getModelListByType(showImageRow.iconTypeId)
|
||||
// showImageRow = null
|
||||
}
|
||||
})
|
||||
|
||||
@ -437,6 +460,19 @@ const handleDragEnd = (
|
||||
ev: DragEvents
|
||||
) => {
|
||||
console.log('tree drag end:', dropNode, dropType, ev, draggingNode)
|
||||
let nodeList = dropNode.childNodes.map((item, index) => {
|
||||
return {
|
||||
id: item.data.id,
|
||||
parentId: dropNode.data.id,
|
||||
treeIndex: index
|
||||
}
|
||||
})
|
||||
PhotoApi.dragModelType(nodeList).then((res) => {
|
||||
if (res.code == 0 || res.code == 200) {
|
||||
ElMessage.success('拖拽成功')
|
||||
getModelList()
|
||||
}
|
||||
})
|
||||
}
|
||||
const handleDrop = (draggingNode: Node, dropNode: Node, dropType: NodeDropType, ev: DragEvents) => {
|
||||
console.log('tree drop:', dropNode.label, dropType)
|
||||
@ -502,8 +538,10 @@ const toggleExpand = (row: any) => {
|
||||
|
||||
if (row.expanded) {
|
||||
row.collapse()
|
||||
updateExpandedState()
|
||||
} else {
|
||||
row.expand()
|
||||
updateExpandedState()
|
||||
// getModelListByType(row.data.id)
|
||||
}
|
||||
} else {
|
||||
|
||||
@ -61,9 +61,13 @@ const { t } = useI18n()
|
||||
const tabPosition = ref('left')
|
||||
const activeName = ref('authorize')
|
||||
const isShowPup = ref(false)
|
||||
const open = () => {
|
||||
const open = (data) => {
|
||||
isShowPup.value = true
|
||||
activeName.value = 'authorize'
|
||||
console.log(data, 'kkkkkkkk')
|
||||
if (data !== 'current') {
|
||||
//如果不是传curent打开就回到第一个tab
|
||||
activeName.value = 'authorize'
|
||||
}
|
||||
}
|
||||
const close = () => {
|
||||
isShowPup.value = false
|
||||
|
||||
@ -13,8 +13,14 @@
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="set_item" :title="t('iconTitle.' + item.name)" v-for="(item, i) of setList" :key="item.id"
|
||||
:class="{ 'last-item': i === setList.length - 1 }" @click="item.callback">
|
||||
<div
|
||||
class="set_item"
|
||||
:title="t('iconTitle.' + item.name)"
|
||||
v-for="(item, i) of setList"
|
||||
:key="item.id"
|
||||
:class="{ 'last-item': i === setList.length - 1 }"
|
||||
@click="item.callback"
|
||||
>
|
||||
<svg-icon :name="item.icon" :size="20"></svg-icon>
|
||||
</div>
|
||||
<setPup ref="setPupRef"></setPup>
|
||||
@ -26,7 +32,7 @@ import { useRouter } from 'vue-router'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import setPup from '../setPup/setPup.vue'
|
||||
import { inject } from 'vue'
|
||||
const { ipcRenderer } = require('electron');
|
||||
const { ipcRenderer } = require('electron')
|
||||
const router = useRouter() // 路由实例
|
||||
const { t } = useI18n()
|
||||
import { uesSetTool } from './hooks'
|
||||
@ -37,7 +43,7 @@ const { setShow } = uesSetTool(setPupRef)
|
||||
//控制显隐
|
||||
const eventBus: any = inject('bus')
|
||||
eventBus.on('settingPop', (data) => {
|
||||
data ? setPupRef.value.open() : setPupRef.value.close()
|
||||
data ? setPupRef.value.open('current') : setPupRef.value.close()
|
||||
})
|
||||
const logout = async (e) => {
|
||||
let res = await LoginApi.logout()
|
||||
@ -47,14 +53,12 @@ const logout = async (e) => {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
const fullScreen = (item) => {
|
||||
ipcRenderer.send('toggle-fullscreen');
|
||||
ipcRenderer.send('toggle-fullscreen')
|
||||
}
|
||||
const resetShow = (item) => {
|
||||
//重置
|
||||
new YJ.Tools(window.earth).flyHome();
|
||||
new YJ.Tools(window.earth).flyHome()
|
||||
}
|
||||
|
||||
const setList = ref([
|
||||
@ -65,8 +69,8 @@ const setList = ref([
|
||||
icon: 'beidou',
|
||||
name: 'locate',
|
||||
className: 'header_public',
|
||||
dbcallback: (e)=>{},
|
||||
callback: (e)=>{}
|
||||
dbcallback: (e) => {},
|
||||
callback: (e) => {}
|
||||
// dbcallback: this.flyTo,
|
||||
// callback: this.locate,
|
||||
},
|
||||
@ -77,7 +81,7 @@ const setList = ref([
|
||||
className: 'header_public',
|
||||
name: 'reset',
|
||||
dbcallback: null,
|
||||
callback: resetShow,
|
||||
callback: resetShow
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
@ -86,7 +90,7 @@ const setList = ref([
|
||||
className: 'header_public',
|
||||
name: 'fullScreen',
|
||||
dbcallback: null,
|
||||
callback: fullScreen,
|
||||
callback: fullScreen
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
@ -114,7 +118,7 @@ ipcRenderer.invoke('getIsFullScreen').then((res) => {
|
||||
})
|
||||
ipcRenderer.on('fullscreen-status-changed', (event, isFullscreen) => {
|
||||
setList.value[2].icon = isFullscreen ? 'full_screen_exit' : 'full_screen'
|
||||
});
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@ -148,10 +152,12 @@ ipcRenderer.on('fullscreen-status-changed', (event, isFullscreen) => {
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 1px;
|
||||
background: linear-gradient(180deg,
|
||||
rgba(0, 255, 255, 0),
|
||||
rgba(0, 255, 255, 1),
|
||||
rgba(204, 204, 204, 0));
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
rgba(0, 255, 255, 0),
|
||||
rgba(0, 255, 255, 1),
|
||||
rgba(204, 204, 204, 0)
|
||||
);
|
||||
}
|
||||
|
||||
.set_item.last-item::after {
|
||||
|
||||
@ -198,6 +198,7 @@ const handleClick = (item: any, e) => {
|
||||
//模型库
|
||||
if ((window as any).checkAuthIsValid) {
|
||||
eventBus.emit('openModel', true)
|
||||
console.log('打开模型库')
|
||||
} else {
|
||||
ElMessage({
|
||||
message: '您没有该功能的权限',
|
||||
@ -214,14 +215,12 @@ const handleClick = (item: any, e) => {
|
||||
type: 'warning'
|
||||
})
|
||||
}
|
||||
}
|
||||
else if (item.key === 'ersanwei') {
|
||||
if(YJ.Global.multiViewportMode.getSdk().sdkD) {
|
||||
YJ.Global.multiViewportMode.off(window.earth);
|
||||
}
|
||||
else {
|
||||
} else if (item.key === 'ersanwei') {
|
||||
if (YJ.Global.multiViewportMode.getSdk().sdkD) {
|
||||
YJ.Global.multiViewportMode.off(window.earth)
|
||||
} else {
|
||||
eventBus.emit('closeSplitScreen')
|
||||
YJ.Global.multiViewportMode.on(window.earth);
|
||||
YJ.Global.multiViewportMode.on(window.earth)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -161,7 +161,6 @@ eventBus.on('routePlanningDialog', () => {
|
||||
host
|
||||
})
|
||||
routePlanning.Dialog.queryCallBack = async (v) => {
|
||||
console.log(v, 'vvvvvvvvv')
|
||||
// await queryRoute(params, (response) => {
|
||||
// if (response) {
|
||||
// routePlanning.createRoute(response.list[0].positions)
|
||||
@ -174,8 +173,9 @@ eventBus.on('routePlanningDialog', () => {
|
||||
endLat: endLat.value,
|
||||
waypoints: []
|
||||
})
|
||||
routePlanning.createRoute(res.data.pathPoints)
|
||||
console.log(res, 'routLIst')
|
||||
if (res.code === 200) {
|
||||
routePlanning.createRoute(res.data.pathPoints)
|
||||
}
|
||||
}
|
||||
}, 100)
|
||||
})
|
||||
@ -184,7 +184,6 @@ eventBus.on('routePlanningDialog', () => {
|
||||
|
||||
const addRoute = async (fileId) => {
|
||||
let res = await RouteApi.loadRoute({ fileId })
|
||||
console.log(res, 'res')
|
||||
}
|
||||
const getList = async () => {
|
||||
let list = await RouteApi.getRouteList()
|
||||
@ -192,7 +191,6 @@ const getList = async () => {
|
||||
let file = list.data[list.data.length - 1]
|
||||
addRoute(file.id)
|
||||
}
|
||||
console.log(list, 'list')
|
||||
}
|
||||
|
||||
const closeCallBack = (e) => {
|
||||
@ -202,7 +200,6 @@ const closeCallBack = (e) => {
|
||||
endLat.value = null
|
||||
}
|
||||
const routeQuery = async (e) => {
|
||||
console.log('aaaaa')
|
||||
let res = await RouteApi.queryRoute({
|
||||
startLng: startLng.value,
|
||||
startLat: startLat.value,
|
||||
@ -210,12 +207,10 @@ const routeQuery = async (e) => {
|
||||
endLat: endLat.value,
|
||||
waypoints: []
|
||||
})
|
||||
console.log(res, 'res')
|
||||
}
|
||||
const clearRoute = (e) => {}
|
||||
const pickStartPos = () => {
|
||||
routePlanning.pickStartPos((position) => {
|
||||
console.log(position, 'position')
|
||||
startLng.value = position.lng
|
||||
startLat.value = position.lat
|
||||
})
|
||||
|
||||
@ -35,6 +35,7 @@
|
||||
:data="typeTreeData"
|
||||
ref="treeRef"
|
||||
node-key="id"
|
||||
empty-text=""
|
||||
@node-click="handleTypeClick"
|
||||
:filter-node-method="filterNode"
|
||||
>
|
||||
@ -48,6 +49,8 @@
|
||||
}"
|
||||
@click.stop="toggleExpand(node)"
|
||||
class="allowDrag"
|
||||
style="width: 100%; text-overflow: ellipsis; overflow: hidden"
|
||||
:title="node.label"
|
||||
>
|
||||
<svg-icon
|
||||
:name="node.expanded ? 'arrow' : 'more'"
|
||||
@ -64,7 +67,7 @@
|
||||
</div>
|
||||
|
||||
<div class="model-gallery" ref="galleryRef">
|
||||
<div class="model-section">
|
||||
<div class="model-section" v-if="categories.length != 0">
|
||||
<!-- <h2 class="section-title">{{ categories[Number(currentTypeId)].name }}</h2> -->
|
||||
<div class="model-grid">
|
||||
<div
|
||||
@ -75,7 +78,7 @@
|
||||
>
|
||||
<div class="imgbg">
|
||||
<el-image
|
||||
:src="'http://127.0.0.1:8848' + model.data"
|
||||
:src="'http://127.0.0.1:8848' + model.militaryDataUrl"
|
||||
fit="contain"
|
||||
class="thumbnail"
|
||||
>
|
||||
@ -91,7 +94,12 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-show="loading" class="loading-more">加载中...</div>
|
||||
<div v-if="categories.length == 0">
|
||||
<div class="custom-empty">
|
||||
<img src="@/assets/images/noData.png" alt="暂无数据" />
|
||||
<div class="noData">暂无数据</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -295,7 +303,7 @@ const renderModel = async (model) => {
|
||||
let option = {
|
||||
id: id,
|
||||
name: model.militaryName,
|
||||
url: 'http://127.0.0.1:8848' + model.data,
|
||||
url: 'http://127.0.0.1:8848' + model.militaryDataUrl,
|
||||
position: positions
|
||||
}
|
||||
|
||||
@ -387,7 +395,7 @@ eventBus.on('openGraph', (data) => {
|
||||
getSetting()
|
||||
}
|
||||
})
|
||||
eventBus.on('closeModelSet', (data) => {
|
||||
eventBus.on('closeModelSetGraph', (data) => {
|
||||
isShowPup.value = data
|
||||
if (data) {
|
||||
getSetting()
|
||||
@ -640,6 +648,7 @@ defineExpose({
|
||||
height: 100%;
|
||||
float: left;
|
||||
border-right: 1px solid rgba(204, 204, 204, 0.2);
|
||||
overflow-x: hidden;
|
||||
}
|
||||
.model-gallery {
|
||||
flex: 1;
|
||||
@ -649,6 +658,18 @@ defineExpose({
|
||||
width: calc(100% - 160px);
|
||||
float: left;
|
||||
margin-left: 10px;
|
||||
|
||||
.custom-empty {
|
||||
display: flex;
|
||||
justify-content: center; /* 水平居中 */
|
||||
align-items: center; /* 垂直居中 */
|
||||
flex-direction: column;
|
||||
height: 300px;
|
||||
}
|
||||
.custom-empty img {
|
||||
display: block;
|
||||
width: 130px;
|
||||
}
|
||||
}
|
||||
.model-section {
|
||||
min-height: 10vh;
|
||||
@ -762,4 +783,9 @@ defineExpose({
|
||||
::v-deep .el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content {
|
||||
border-right: 1px solid rgba(var(--color-sdk-base-rgb), 0.2) !important;
|
||||
}
|
||||
::v-deep .allowDrag {
|
||||
width: 100% !important;
|
||||
overflow: hidden !important;
|
||||
text-overflow: ellipsis !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -341,9 +341,7 @@ const closeCallback = () => {
|
||||
}
|
||||
|
||||
const nodeEdit = () => {
|
||||
console.log(entityOptions.value._isdrag, '_isdrag')
|
||||
that.drag(!entityOptions.value._isdrag, (data) => {
|
||||
console.log(data, 'data')
|
||||
that.options = data
|
||||
})
|
||||
}
|
||||
|
||||
@ -121,7 +121,7 @@ const viewPointHeightInput = () => {
|
||||
const closeCallBack = (e) => {
|
||||
type.value = 'point'
|
||||
distance.value = null
|
||||
eventBus.emit('closeModelSet', true)
|
||||
eventBus.emit('closeModelSetGraph', true)
|
||||
}
|
||||
const close = () => {
|
||||
baseDialog.value?.close()
|
||||
|
||||
@ -15,7 +15,7 @@
|
||||
</div>
|
||||
<div class="inputCon">
|
||||
<span class="label">模型名称</span>
|
||||
<input class="input" maxlength="40" type="text" v-model="newData.name" />
|
||||
<input class="input" maxlength="40" type="text" v-model="rowData.name" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -45,9 +45,9 @@ const eventBus: any = inject('bus')
|
||||
const viewPointHeight: any = ref(1.8)
|
||||
var rowData: any = reactive([])
|
||||
var imageData: any = ref(null)
|
||||
var newData: any = reactive({
|
||||
name: ''
|
||||
})
|
||||
// var newData: any = reactive({
|
||||
// name: ''
|
||||
// })
|
||||
eventBus.on('imagePopDialog', (data) => {
|
||||
rowData = data
|
||||
rowData.name = data.modelName
|
||||
@ -59,7 +59,7 @@ eventBus.on('imagePopDialog', (data) => {
|
||||
})
|
||||
})
|
||||
//----------------模型预览---------------
|
||||
const threeCanvas:any = ref(null)
|
||||
const threeCanvas: any = ref(null)
|
||||
let scene, camera, renderer, model, controls
|
||||
|
||||
const initThreeJS = () => {
|
||||
@ -114,7 +114,7 @@ const initThreeJS = () => {
|
||||
const loadModel = () => {
|
||||
const loader = new GLTFLoader()
|
||||
loader.load(
|
||||
'http://127.0.0.1:8848' + rowData.data, // 模型路径
|
||||
'http://127.0.0.1:8848' + rowData.modelDataUrl, // 模型路径
|
||||
function (gltf) {
|
||||
// onLoad回调函数
|
||||
model = gltf.scene
|
||||
@ -151,7 +151,6 @@ const closeCallBack = (e) => {
|
||||
renderer.domElement.remove() // 从DOM中移除渲染器。
|
||||
imageData.value = null
|
||||
rowData = []
|
||||
newData.name = ''
|
||||
//打开系统设置弹框
|
||||
eventBus.emit('settingPop', true)
|
||||
}
|
||||
@ -162,7 +161,8 @@ const setImage = (e) => {
|
||||
const canvas = renderer.domElement
|
||||
|
||||
canvas.toBlob((blob) => {
|
||||
imageData.value = blob
|
||||
const file = new File([blob], 'filename.png', { type: 'image/png' })
|
||||
imageData.value = file
|
||||
ElMessage.warning('点击保存是会应用当前图片')
|
||||
}, 'image/png')
|
||||
}
|
||||
@ -172,7 +172,7 @@ const close = (e) => {
|
||||
const save = (e) => {
|
||||
const formData = new FormData()
|
||||
formData.append('modelId', rowData.id)
|
||||
newData.name && formData.append('modelName', newData.name)
|
||||
rowData.name && formData.append('modelName', rowData.name)
|
||||
imageData.value && formData.append('file', imageData.value)
|
||||
ModelApi.updatePoster(formData).then((res) => {
|
||||
if (res.code == 0 || res.code == 200) {
|
||||
|
||||
@ -13,7 +13,7 @@
|
||||
<el-input
|
||||
v-model="modelName"
|
||||
class="w-50 m-2"
|
||||
placeholder="请输入模型名称进行搜索"
|
||||
placeholder="请输入模型类型进行搜索"
|
||||
:suffix-icon="Search"
|
||||
/>
|
||||
<button @click="setting" class="btn">
|
||||
@ -35,6 +35,7 @@
|
||||
:data="typeTreeData"
|
||||
ref="treeRef"
|
||||
node-key="id"
|
||||
empty-text=""
|
||||
@node-click="handleTypeClick"
|
||||
:filter-node-method="filterNode"
|
||||
>
|
||||
@ -48,6 +49,8 @@
|
||||
}"
|
||||
@click.stop="toggleExpand(node)"
|
||||
class="allowDrag"
|
||||
style="width: 100%; text-overflow: ellipsis; overflow: hidden"
|
||||
:title="node.label"
|
||||
>
|
||||
<svg-icon
|
||||
:name="node.expanded ? 'arrow' : 'more'"
|
||||
@ -64,7 +67,7 @@
|
||||
</div>
|
||||
|
||||
<div class="model-gallery" ref="galleryRef">
|
||||
<div class="model-section">
|
||||
<div class="model-section" v-if="categories.length != 0">
|
||||
<!-- <h2 class="section-title">{{ categories[Number(currentTypeId)].name }}</h2> -->
|
||||
<div class="model-grid">
|
||||
<div
|
||||
@ -75,7 +78,7 @@
|
||||
>
|
||||
<div class="imgbg">
|
||||
<el-image
|
||||
:src="'http://127.0.0.1:8848' + model.poster"
|
||||
:src="'http://127.0.0.1:8848' + model.posterDataUrl"
|
||||
fit="contain"
|
||||
class="thumbnail"
|
||||
>
|
||||
@ -85,13 +88,22 @@
|
||||
</el-image>
|
||||
</div>
|
||||
|
||||
<div class="model-name" :class="{ isactive: activeIndex == mIndex }">
|
||||
<div
|
||||
class="model-name"
|
||||
:class="{ isactive: activeIndex == mIndex }"
|
||||
:title="model.modelName"
|
||||
>
|
||||
{{ model.modelName }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-show="loading" class="loading-more">加载中...</div>
|
||||
<div v-if="categories.length == 0">
|
||||
<div class="custom-empty">
|
||||
<img src="@/assets/images/noData.png" alt="暂无数据" />
|
||||
<div class="noData">暂无数据</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -112,6 +124,7 @@ const { findParentId, findTreeIndex, cusAddNodes } = useTreeNode()
|
||||
const isShowPup = ref(false)
|
||||
const eventBus: any = inject('bus')
|
||||
var modelName = ref('')
|
||||
var clickTreeNode: any = ref('')
|
||||
|
||||
//tab
|
||||
interface Model {
|
||||
@ -252,6 +265,7 @@ const toggleExpand = (row: any) => {
|
||||
}
|
||||
}
|
||||
getModelListByType(row.data.id)
|
||||
clickTreeNode.value = row.data.id
|
||||
currentTypeId.value = row.id
|
||||
// loadModelsByType(row.id)
|
||||
}
|
||||
@ -259,6 +273,7 @@ const addType = ref('')
|
||||
|
||||
const handleTypeClick = (row: any) => {
|
||||
getModelListByType(row.id)
|
||||
clickTreeNode.value = row.id
|
||||
currentTypeId.value = row.$treeNodeId
|
||||
}
|
||||
|
||||
@ -281,7 +296,7 @@ const modelClick = (index, row) => {
|
||||
typeof selectCallback === 'function' &&
|
||||
addType.value === 'trajectoryMotion'
|
||||
) {
|
||||
selectCallback('http://127.0.0.1:8848' + row.data)
|
||||
selectCallback('http://127.0.0.1:8848' + row.modelDataUrl)
|
||||
close()
|
||||
return
|
||||
}
|
||||
@ -299,7 +314,7 @@ const modelClick = (index, row) => {
|
||||
id: id,
|
||||
type: typeArr[isSetting.key],
|
||||
spacing: isSetting['value'] * 1,
|
||||
url: 'http://127.0.0.1:8848' + isSetting[row.data]
|
||||
url: 'http://127.0.0.1:8848' + isSetting[row.modelDataUrl]
|
||||
},
|
||||
function (data) {
|
||||
// posiArr.forEach((item, index) => {
|
||||
@ -325,9 +340,9 @@ const renderModel = async (data, model) => {
|
||||
// let source_id = this.$md5(new Date().getTime() + model.model_name+index);
|
||||
let id = new YJ.Tools().randomString()
|
||||
if (data.type == '面') {
|
||||
z = data.rotate.z
|
||||
z = data.rotate - 90
|
||||
} else if (data.type == '线') {
|
||||
z = data.rotate[index]
|
||||
z = data.rotate[index] - 90
|
||||
}
|
||||
|
||||
let option = {
|
||||
@ -336,7 +351,7 @@ const renderModel = async (data, model) => {
|
||||
name: model.modelName + index,
|
||||
show: true,
|
||||
scale: { x: 1, y: 1, z: 1 },
|
||||
url: model.data,
|
||||
url: 'http://127.0.0.1:8848' + model.modelDataUrl,
|
||||
maximumScale: 1,
|
||||
// host: 'http://127.0.0.1:8848',
|
||||
rotate: {
|
||||
@ -438,6 +453,7 @@ eventBus.on('closeModelSet', (data) => {
|
||||
isShowPup.value = data
|
||||
if (data) {
|
||||
getSetting()
|
||||
clickTreeNode.value && getModelListByType(clickTreeNode.value)
|
||||
}
|
||||
})
|
||||
|
||||
@ -691,6 +707,7 @@ defineExpose({
|
||||
height: 100%;
|
||||
float: left;
|
||||
border-right: 1px solid rgba(204, 204, 204, 0.2);
|
||||
overflow-x: hidden;
|
||||
}
|
||||
.model-gallery {
|
||||
flex: 1;
|
||||
@ -700,6 +717,17 @@ defineExpose({
|
||||
width: calc(100% - 160px);
|
||||
float: left;
|
||||
margin-left: 10px;
|
||||
.custom-empty {
|
||||
display: flex;
|
||||
justify-content: center; /* 水平居中 */
|
||||
align-items: center; /* 垂直居中 */
|
||||
flex-direction: column;
|
||||
height: 300px;
|
||||
}
|
||||
.custom-empty img {
|
||||
display: block;
|
||||
width: 130px;
|
||||
}
|
||||
}
|
||||
.model-section {
|
||||
min-height: 10vh;
|
||||
|
||||
Reference in New Issue
Block a user