This commit is contained in:
2025-09-25 16:22:36 +08:00
parent 8e791cfb74
commit 4455bec4d0
14 changed files with 1156 additions and 64 deletions

View File

@ -159,6 +159,7 @@ export default {
device: '设备管理', device: '设备管理',
modelManage: '模型管理', modelManage: '模型管理',
graphLabelManage: '军标管理', graphLabelManage: '军标管理',
photoManage: '图标管理',
version: '版本信息' version: '版本信息'
}, },
auths: { auths: {
@ -175,6 +176,7 @@ export default {
theme: '主题换肤', theme: '主题换肤',
defaultView: '设置', defaultView: '设置',
defaultData: '添加', defaultData: '添加',
intoBack: '进入',
management: '后台管理', management: '后台管理',
showCompass: '导航器', showCompass: '导航器',
showLatitudeLongitudeNetwork: '经纬网', showLatitudeLongitudeNetwork: '经纬网',

View File

@ -0,0 +1,93 @@
import request from '@/axios/request'
//图标库
export const PhotoApi = {
//创建图标库
createModelDB: async (data: any) => {
return await request.post({
url: `/iconLibrary/createIconLibrary`,
data
})
},
//导入图标库
importModelDB: async (data: any) => {
return await request.post({
url: `/iconLibrary/importIconLibrary`,
data
})
},
//删除图标
delModel: async (data: any) => {
return await request.post({
url: `/iconLibrary/deleteIcon`,
data,
})
},
//删除图标类型
delModelType: async (data: any) => {
return await request.post({
url: `/iconLibrary/deleteIconType`,
data,
})
},
//添加图标类型
addModelType: async (data: any) => {
return await request.post({
url: `/iconLibrary/addIconType`,
data
})
},
//修改图标类型名称
updateMilitaryTypeName: async (data: any) => {
return await request.post({
url: `/iconLibrary/updateIconTypeName`,
data
})
},
//图标类型列表
modelTypeList: async () => {
return await request.get({
url: `/iconLibrary/iconTypeTree`
})
},
//添加图标文件
addGraph: async (data: any) => {
return await request.post({
url: `/iconLibrary/addIconFile`,
data,
headers: {
'Content-Type': 'multipart/form-data'
}
})
},
//根据图标类型查看图标列表
showModelByType: async (data: any) => {
return await request.post({
url: `/iconLibrary/iconList`,
data,
// headers: {
// 'content-type': 'application/x-www-form-urlencoded'
// }
})
},
//更新图标信息
updatePoster: async (data: any) => {
return await request.post({
url: `/iconLibrary/updateIconInfo`,
data
})
},
// //默认图标参数设置
// modelSetting: async (data: any) => {
// return await request.post({
// url: `/businessConfig/addBusinessConfig`,
// data,
// })
// },
// //获取默认图标参数设置
// getModelSetting: async () => {
// return await request.get({
// url: `/businessConfig/list`
// })
// },
}

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="12" height="12" viewBox="0 0 12 12" fill="none"><path d="M11.5696 8.36808C11.3293 8.3718 11.1356 8.56922 11.1393 8.80947L11.1393 9.91763C11.1393 10.4019 10.7556 10.7967 10.2825 10.7967L1.71933 10.7967C1.24619 10.7967 0.862461 10.4019 0.862461 9.91763L0.862461 2.01156C0.862461 1.52733 1.24619 1.13249 1.71933 1.13249L4.69976 1.13249L5.80624 3.10109C5.89566 3.25754 6.06331 3.33762 6.22909 3.319L10.2806 3.319C10.7538 3.319 11.1375 3.71383 11.1375 4.19807L11.1375 5.29691C11.1375 5.54089 11.3312 5.73831 11.5696 5.73831C11.8081 5.73831 11.9999 5.54089 11.9999 5.29691C11.9999 5.28573 11.9999 5.27456 11.9981 5.26339L11.9981 4.19807C11.9981 3.22774 11.2306 2.43992 10.2843 2.43992L6.42654 2.43992L5.32192 0.478772C5.2232 0.30184 5.08163 0.255279 4.95682 0.259004L4.95496 0.257141L1.71375 0.257141C0.76746 0.257141 0 1.04495 0 2.01529L0 9.899C0 10.8693 0.76746 11.6571 1.71375 11.6571L10.2843 11.6571C11.2306 11.6571 11.9981 10.8693 11.9981 9.899L11.9981 8.843C11.9999 8.83182 11.9999 8.82065 11.9999 8.80947C12.0018 8.694 11.9571 8.58226 11.8751 8.50031C11.795 8.4165 11.6851 8.36994 11.5696 8.36808Z" fill="#FFFFFF" ></path><path d="M5.49522 5.17397C5.4263 5.09948 5.3313 5.05664 5.22885 5.05664C5.12826 5.05664 5.03139 5.09948 4.96247 5.17397L3.3754 6.86321L3.36608 6.87252L3.36422 6.87252L3.3549 6.88183C3.21147 7.04014 3.21147 7.28226 3.3549 7.44057L4.94757 9.13911C5.01463 9.21361 5.10963 9.25459 5.21022 9.25645C5.31081 9.25645 5.40581 9.21547 5.47287 9.14098L5.48032 9.13166C5.62375 8.97336 5.62375 8.73124 5.48032 8.57293L4.521 7.54859L8.87801 7.54859C9.08105 7.54859 9.24683 7.37166 9.24683 7.15561C9.24683 6.93957 9.08105 6.76264 8.87801 6.76264L4.53776 6.76264L5.49522 5.74016C5.64238 5.58185 5.64238 5.33414 5.49522 5.17397Z" fill="#FFFFFF" ></path></svg>

After

Width:  |  Height:  |  Size: 1.8 KiB

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="12" height="12" viewBox="0 0 12 12" fill="none"><path d="M4.22892 9.16677C4.18757 8.9817 4.01913 8.8497 3.82439 8.8497L0.828 8.8497L0.828 0.804888L9.10193 0.804888L9.10193 4.49953C9.10193 4.67389 9.2134 4.82975 9.3814 4.89062C9.66304 4.99255 9.9626 4.78869 9.96029 4.49649L9.92993 0.499965C9.92993 0.223814 9.69976 3.30921e-07 9.41566 3.30921e-07L0.514265 3.30921e-07C0.230169 -0.00028735 0 0.223525 0 0.499676L0 9.15477C0 9.43092 0.230169 9.65473 0.514265 9.65473L3.82439 9.65473C4.08839 9.65473 4.28501 9.41762 4.22892 9.16677Z" fill="#FFFFFF" ></path><path d="M12 7.36786L4.53597 4.45093L6.20397 12L8.05385 9.22935L10.5496 11.656L11.2768 10.949L8.846 8.58553L12 7.36786Z" fill="#FFFFFF" ></path></svg>

After

Width:  |  Height:  |  Size: 798 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="12" height="11.339996337890625" viewBox="0 0 12 11.339996337890625" fill="none"><path d="M11.874 4.5C11.8039 4.12944 11.5781 3.888 11.298 3.888L11.292 3.888L11.238 3.888C10.4282 3.888 9.768 3.22794 9.768 2.418C9.768 2.15516 9.894 1.86 9.894 1.86C10.0391 1.53328 9.92896 1.1344 9.636 0.93L9.618 0.918L8.13 0.09L8.112 0.084C8.01504 0.0418499 7.90635 0.018 7.794 0.018C7.56374 0.018 7.33695 0.109354 7.188 0.264C7.02472 0.432533 6.46303 0.912 6.03 0.912C5.59306 0.912 5.02997 0.423654 4.866 0.252C4.71627 0.0941974 4.48658 0 4.254 0C4.14384 0 4.03731 0.019351 3.942 0.06L3.924 0.072L2.382 0.918L2.364 0.93C2.07007 1.13422 1.96101 1.53345 2.106 1.86C2.106 1.86 2.232 2.15317 2.232 2.418C2.232 3.22794 1.57192 3.888 0.762 3.888L0.714 3.888L0.702 3.888C0.422224 3.888 0.196105 4.12938 0.126 4.5C0.126 4.52718 0 5.1721 0 5.676C0 6.17989 0.126 6.82475 0.126 6.852C0.196157 7.22258 0.422037 7.458 0.702 7.458L0.708 7.458L0.762 7.458C1.57192 7.458 2.232 8.11807 2.232 8.928C2.232 9.19116 2.106 9.486 2.106 9.486C1.96098 9.81245 2.07119 10.217 2.364 10.422L2.382 10.434L3.84 11.25L3.858 11.256C3.95492 11.2986 4.06422 11.322 4.176 11.322C4.40951 11.322 4.63345 11.2256 4.782 11.064C4.98939 10.8386 5.55443 10.374 5.97 10.374C6.41996 10.374 6.99749 10.8935 7.164 11.076C7.31288 11.2404 7.54014 11.34 7.776 11.34C7.88559 11.34 7.99258 11.3212 8.088 11.28L8.106 11.268L9.618 10.434L9.636 10.422C9.92943 10.2176 10.0447 9.8178 9.9 9.492C9.9 9.492 9.768 9.18933 9.768 8.928C9.768 8.11807 10.4282 7.458 11.238 7.458L11.286 7.458L11.298 7.458C11.5785 7.458 11.804 7.22232 11.874 6.852C11.874 6.84547 12 6.19252 12 5.676C12 5.1698 11.874 4.52711 11.874 4.5ZM4.182 10.476L2.904 9.762C2.96029 9.61744 3.072 9.27688 3.072 8.928C3.072 7.71648 2.14273 6.71613 0.942 6.624C0.912678 6.45313 0.846 6.01603 0.846 5.676C0.846 5.33644 0.912695 4.899 0.942 4.728C2.14278 4.63594 3.072 3.62959 3.072 2.418C3.072 2.07003 2.96018 1.73462 2.904 1.59L4.266 0.846C4.31499 0.896048 4.51134 1.09113 4.782 1.284C5.22425 1.59925 5.64168 1.758 6.03 1.758C6.41451 1.758 6.83255 1.59915 7.272 1.29C7.54095 1.10082 7.73913 0.913213 7.788 0.864L9.096 1.59C9.03976 1.7346 8.928 2.06956 8.928 2.418C8.928 3.62959 9.85722 4.63594 11.058 4.728C11.0873 4.89926 11.154 5.33747 11.154 5.676C11.154 6.0159 11.0873 6.45308 11.058 6.624C9.85725 6.71604 8.928 7.7164 8.928 8.928C8.928 9.27635 9.03978 9.61144 9.096 9.756L7.77 10.494C7.71276 10.4332 7.52132 10.2305 7.254 10.032C6.80321 9.69724 6.37025 9.528 5.97 9.528C5.57358 9.528 5.14621 9.69753 4.698 10.026C4.43454 10.2191 4.23936 10.4162 4.182 10.476ZM8.1 5.664C8.1 4.49212 7.14787 3.54 5.976 3.54C4.80415 3.54 3.846 4.49212 3.846 5.664C3.846 6.83587 4.80415 7.794 5.976 7.794C7.14789 7.794 8.1 6.83587 8.1 5.664ZM5.976 4.386C6.6829 4.386 7.254 4.95712 7.254 5.664C7.254 6.37092 6.6829 6.948 5.976 6.948C5.26913 6.948 4.692 6.37092 4.692 5.664C4.692 4.9571 5.26913 4.386 5.976 4.386Z" fill="#FFFFFF" ></path></svg>

After

Width:  |  Height:  |  Size: 2.9 KiB

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="12.00048828125" height="12" viewBox="0 0 12.00048828125 12" fill="none"><path d="M5.6792 4.65356L5.6792 4.65356L5.6792 4.65356L5.6792 4.65356Z" fill="#FFFFFF" ></path><path d="M2.79079 11.0492L2.79079 12L1.86063 12L1.86063 11.0492L2.79079 11.0492ZM8.3713 7.60639L12.0005 9.65246L8.3713 11.6396L8.3713 10.0984L0.000488281 10.0984L0.000488281 9.14759L8.3713 9.14759L8.3713 7.60639ZM2.79079 7.24602L2.79079 8.1968L1.86063 8.1968L1.86063 7.24602L2.79079 7.24602ZM2.79079 5.34446L2.79079 6.29524L1.86063 6.29524L1.86063 5.34446L2.79079 5.34446ZM6.51107 0.590483L7.90622 2.72975L9.30138 0.590483L10.2314 0.590483L8.3713 3.44282L10.2314 6.29524L9.30138 6.29524L7.90622 4.15597L6.51107 6.29524L5.58099 6.29524L7.44123 3.44282L5.58099 0.590483L6.51107 0.590483ZM2.32571 0L4.2984 3.44282L2.79079 3.44282L2.79079 4.39361L1.86063 4.39361L1.86063 3.44282L0.353018 3.44282L2.32571 0Z" fill="#FFFFFF" ></path></svg>

After

Width:  |  Height:  |  Size: 994 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="12.00048828125" height="12" viewBox="0 0 12.00048828125 12" fill="none"><path d="M5.68799 4.65503L5.68799 4.65503L5.68799 4.65503L5.68799 4.65503Z" fill="#FFFFFF" ></path><path d="M2.3257 0L4.2984 3.44281L2.79079 3.44281L2.79079 12L1.86063 12L1.86063 3.44282L0.353004 3.44282L2.3257 0ZM8.3713 7.60641L12.0005 9.65248L8.3713 11.6396L8.3713 10.0985L7.44123 10.0985L7.44123 9.14761L8.3713 9.14761L8.3713 7.60641ZM0.930558 9.1476L0.930558 10.0984L0.000488281 10.0984L0.000488281 9.1476L0.930558 9.1476ZM4.65093 9.1476L4.65093 10.0984L3.72086 10.0984L3.72086 9.1476L4.65093 9.1476ZM6.51107 9.1476L6.51107 10.0984L5.581 10.0984L5.581 9.1476L6.51107 9.1476ZM6.51107 0.590488L7.90623 2.73071L9.30137 0.590488L10.2314 0.590488L6.51107 6.29525L5.581 6.29525L7.44123 3.44282L5.581 0.590488L6.51107 0.590488Z" fill="#FFFFFF" ></path></svg>

After

Width:  |  Height:  |  Size: 921 B

View File

@ -7,7 +7,7 @@
@click="importModelDB" @click="importModelDB"
> >
<template #icon> <template #icon>
<svg-icon name="leading_in" /> <svg-icon name="select" />
</template> </template>
<span>选择军标库</span> <span>选择军标库</span>
</el-button> </el-button>
@ -18,7 +18,7 @@
@click="createModelDB" @click="createModelDB"
> >
<template #icon> <template #icon>
<svg-icon name="leading_in" /> <svg-icon name="addDevice" />
</template> </template>
<span>创建军标库</span> <span>创建军标库</span>
</el-button> </el-button>
@ -27,6 +27,7 @@
<!-- 左侧分类树 --> <!-- 左侧分类树 -->
<el-col :span="6" class="tree"> <el-col :span="6" class="tree">
<el-card shadow="hover"> <el-card shadow="hover">
<div class="typeList">类型列表</div>
<div class="tree-container" @click="handleClick" @contextmenu="divContextMenu"> <div class="tree-container" @click="handleClick" @contextmenu="divContextMenu">
<el-tree <el-tree
style="max-width: 600px" style="max-width: 600px"
@ -349,7 +350,7 @@ const handleDragEnd = (
dropType: NodeDropType, dropType: NodeDropType,
ev: DragEvents ev: DragEvents
) => { ) => {
console.log('tree drag end:', dropNode && dropNode.label, dropType) console.log('tree drag end:', dropNode, dropType, ev, draggingNode)
} }
const handleDrop = (draggingNode: Node, dropNode: Node, dropType: NodeDropType, ev: DragEvents) => { const handleDrop = (draggingNode: Node, dropNode: Node, dropType: NodeDropType, ev: DragEvents) => {
console.log('tree drop:', dropNode.label, dropType) console.log('tree drop:', dropNode.label, dropType)
@ -667,7 +668,7 @@ onMounted(() => {
} }
.tree-container { .tree-container {
height: 400px; height: 380px;
overflow-y: auto; overflow-y: auto;
} }
.el-row { .el-row {
@ -816,4 +817,13 @@ onMounted(() => {
text-shadow: 0px 0px 9px var(--color-sdk-text-shadow) !important; text-shadow: 0px 0px 9px var(--color-sdk-text-shadow) !important;
color: rgba(255, 255, 255, 1) !important; color: rgba(255, 255, 255, 1) !important;
} }
::v-deep .typeList {
width: 100%;
height: 40px;
line-height: 40px;
padding: 0 12px;
color: rgba(230, 247, 255, 1) !important;
border-bottom: 1px solid rgba(var(--color-sdk-base-rgb), 0.5);
letter-spacing: 1px;
}
</style> </style>

View File

@ -7,7 +7,7 @@
@click="importModelDB" @click="importModelDB"
> >
<template #icon> <template #icon>
<svg-icon name="leading_in" /> <svg-icon name="select" />
</template> </template>
<span>选择模型库</span> <span>选择模型库</span>
</el-button> </el-button>
@ -18,7 +18,7 @@
@click="createModelDB" @click="createModelDB"
> >
<template #icon> <template #icon>
<svg-icon name="leading_in" /> <svg-icon name="addDevice" />
</template> </template>
<span>创建模型库</span> <span>创建模型库</span>
</el-button> </el-button>
@ -27,6 +27,7 @@
<!-- 左侧分类树 --> <!-- 左侧分类树 -->
<el-col :span="6" class="tree"> <el-col :span="6" class="tree">
<el-card shadow="hover"> <el-card shadow="hover">
<div class="typeList">类型列表</div>
<div class="tree-container" @click="handleClick" @contextmenu="divContextMenu"> <div class="tree-container" @click="handleClick" @contextmenu="divContextMenu">
<el-tree <el-tree
style="max-width: 600px" style="max-width: 600px"
@ -358,7 +359,7 @@ const handleDragEnd = (
dropType: NodeDropType, dropType: NodeDropType,
ev: DragEvents ev: DragEvents
) => { ) => {
console.log('tree drag end:', dropNode && dropNode.label, dropType) console.log('tree drag end:', dropNode, dropType, ev, draggingNode)
} }
const handleDrop = (draggingNode: Node, dropNode: Node, dropType: NodeDropType, ev: DragEvents) => { const handleDrop = (draggingNode: Node, dropNode: Node, dropType: NodeDropType, ev: DragEvents) => {
console.log('tree drop:', dropNode.label, dropType) console.log('tree drop:', dropNode.label, dropType)
@ -676,7 +677,7 @@ onMounted(() => {
} }
.tree-container { .tree-container {
height: 400px; height: 380px;
overflow-y: auto; overflow-y: auto;
} }
.el-row { .el-row {
@ -825,4 +826,13 @@ onMounted(() => {
text-shadow: 0px 0px 9px var(--color-sdk-text-shadow) !important; text-shadow: 0px 0px 9px var(--color-sdk-text-shadow) !important;
color: rgba(255, 255, 255, 1) !important; color: rgba(255, 255, 255, 1) !important;
} }
::v-deep .typeList {
width: 100%;
height: 40px;
line-height: 40px;
padding: 0 12px;
color: rgba(230, 247, 255, 1) !important;
border-bottom: 1px solid rgba(var(--color-sdk-base-rgb), 0.5);
letter-spacing: 1px;
}
</style> </style>

View File

@ -0,0 +1,994 @@
<template>
<div class="model-management-container">
<div class="equipment_title" style="margin-bottom: 10px">
<div>
<el-button
color="#004b4b"
style="border: 1px solid rgba(0, 255, 255, 0.5)"
@click="importModelDB"
>
<template #icon>
<svg-icon name="select" />
</template>
<span>选择图标库</span>
</el-button>
<el-button
color="#004b4b"
style="border: 1px solid rgba(0, 255, 255, 0.5)"
@click="createModelDB"
>
<template #icon>
<svg-icon name="addDevice" />
</template>
<span>创建图标库</span>
</el-button>
</div>
<div class="typeBut">
<span
v-for="(item, index) in butList"
:key="index"
:class="{ clickButClass: activeIndex == index }"
@click="typeClick(index)"
>{{ item }}</span
>
</div>
</div>
<el-row :gutter="20">
<!-- 左侧分类树 -->
<el-col :span="6" class="tree">
<el-card shadow="hover">
<div class="typeList">类型列表</div>
<div class="tree-container" @click="handleClick" @contextmenu="divContextMenu">
<el-tree
style="max-width: 600px"
:allow-drop="allowDrop"
:allow-drag="allowDrag"
:data="typeTreeData"
draggable
ref="treeRef"
node-key="id"
@node-click="handleTypeClick"
@node-contextmenu="handleContextMenu"
@node-drag-start="handleDragStart"
@node-drag-enter="handleDragEnter"
@node-drag-leave="handleDragLeave"
@node-drag-over="handleDragOver"
@node-drag-end="handleDragEnd"
@node-drop="handleDrop"
>
<template #default="{ node, data }">
<!-- <span> {{ node.label }}</span> -->
<span
:class="{
'primary-type': !(node.childNodes.length != 0),
'selected-text': node.id === currentTypeId
}"
@click.stop="toggleExpand(node)"
class="allowDrag"
>
<svg-icon
:name="node.expanded ? 'arrow' : 'more'"
:size="12"
color="rgba(0, 255, 255, 1)"
style="margin-right: 5px; margin-left: 5px"
v-if="node.childNodes.length != 0"
@click.stop="toggleExpand(node)"
></svg-icon>
{{ node.label }}</span
>
</template>
</el-tree>
</div>
</el-card>
</el-col>
<!-- 右侧模型列表 -->
<el-col :span="18">
<el-card shadow="hover">
<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">
<template #default="{ row }" v-if="activeIndex === 2">
<el-image
ref="imageRef"
fit="contain"
:preview-teleported="true"
:preview-src-list="['http://127.0.0.1:8848' + row.data]"
style="width: 80px; height: 60px"
:src="'http://127.0.0.1:8848' + row.data"
/>
</template>
<template #default="{ row }" v-else>
<el-image
ref="imageRef"
fit="contain"
:preview-teleported="true"
:preview-src-list="['http://localhost:55110/' + row.data]"
style="width: 80px; height: 60px"
:src="'http://localhost:55110/' + row.data"
/>
</template>
</el-table-column>
<el-table-column label="操作">
<template #default="{ row }">
<el-button size="small" @click="reviewPhoto">预览</el-button>
<el-button size="small" @click="editPhotoName(row)">修改名称</el-button>
<el-button size="small" @click="handleDelete(row)">删除</el-button>
</template>
</el-table-column>
<template #empty>
<div class="custom-empty">
<img src="@/assets/images/noData.png" alt="暂无数据" />
<div class="noData">暂无数据</div>
</div>
</template>
</el-table>
</el-card>
</el-col>
</el-row>
<!-- 右键菜单 -->
<contextMenuCom
v-model:visible="contextMenu.visible"
:x="contextMenu.x"
:y="contextMenu.y"
:menu-items="contextMenu.items"
@command="handleMenuCommand"
/>
<!-- 添加类型弹窗 -->
<el-dialog v-model="dialogVisible" :title="dialogTitle" width="30%" :before-close="handleClose">
<el-input v-model="modelType" placeholder="请输入名称" />
<template #footer>
<span class="dialog-footer">
<el-button @click="closeDialog">取消</el-button>
<el-button type="primary" @click="addType"> 确定 </el-button>
</span>
</template>
</el-dialog>
<input ref="fileInput" type="file" hidden @change="handleFileChange" accept=".jpg,.jpeg,.png" />
</div>
</template>
<script lang="ts" setup>
import { ref, reactive, onMounted, nextTick } from 'vue'
import type { TableColumnCtx } from 'element-plus'
import contextMenuCom from './contentMenu.vue'
import Sortable from 'sortablejs'
import { inject } from 'vue'
import type { DragEvents } from 'element-plus/es/components/tree/src/model/useDragNode'
import type { AllowDropType, NodeDropType, RenderContentContext } from 'element-plus'
import { PhotoApi } from '@/api/photo/index'
import { ElMessage, ElMessageBox } from 'element-plus'
import {
$sendElectronChanel,
$recvElectronChanel,
$changeComponentShow
} from '@/utils/communication'
const fs = require('fs')
const eventBus: any = inject('bus')
const imageRef: any = ref('')
var clickTreeNode: any = reactive({})
interface TypeNode {
id: string
label: string
parentId: string | null
children?: TypeNode[]
createdAt?: string | null
updatedAt?: string | null
}
interface ModelItem {
id: string
typeId: string
name: string
thumbnail: string
militaryId: string
}
const typeTreeData = ref<TypeNode[]>([])
const modelList = ref<ModelItem[]>([])
const currentTypeId = ref<string>('')
const contextMenu = reactive({
visible: false,
x: 0,
y: 0,
currentRow: null as TypeNode | null,
items: [] as { command: string; icon: string; label: string; disabled?: boolean }[]
})
//按钮
var activeIndex = ref(0)
var butList = reactive(['立体图标', '普通图标', '自定义图标'])
const typeClick = (index) => {
activeIndex.value = index
modelList.value = []
getModelList()
}
const treeRef = ref()
const reviewPhoto = () => {
imageRef.value!.showPreview()
}
// @ts-ignore
var sortableInstance: any = reactive(null)
//--------------添加模型类型----------------
var dialogVisible: any = ref(false)
var dialogTitle: any = ref('添加图标类型')
var modelType: any = ref('')
const handleClose = () => {
dialogVisible.value = false
}
const closeDialog = () => {
modelType.value = ''
dialogVisible.value = false
}
const addType = () => {
if (!modelType.value) {
return ElMessage.warning('请输入图标类型名称')
}
if (dialogTitle.value == '添加图标类型') {
let params = {
name: modelType.value,
parentId: clickTreeNode && clickTreeNode.id ? clickTreeNode.id : undefined
}
PhotoApi.addModelType(params).then((res) => {
if (res.code == 0 || res.code == 200) {
ElMessage.success('添加成功')
getModelList()
}
})
} else if (dialogTitle.value == '图标重命名') {
let params = {
iconName: modelType.value,
iconId: clickPhotoRow.id
}
let formData = new FormData()
formData.append('iconName', modelType.value)
formData.append('iconId', clickPhotoRow.id)
PhotoApi.updatePoster(formData).then((res) => {
if (res.code == 0 || res.code == 200) {
ElMessage.success('修改成功')
// getModelList()
getModelListByType(clickTreeNode.id)
}
})
} else {
let params = {
name: modelType.value,
id: clickTreeNode.id
}
PhotoApi.updateMilitaryTypeName(params).then((res) => {
if (res.code == 0 || res.code == 200) {
ElMessage.success('修改成功')
getModelList()
}
})
}
modelType.value = ''
dialogVisible.value = false
}
//获取模型列表
eventBus.on('settingPop', (data) => {
if (data) {
//关闭弹框时更新模型列表
// getModelList()
getModelListByType(showImageRow.iconTypeId)
showImageRow = null
}
})
const getModelList = async () => {
if (activeIndex.value !== 2) {
typeTreeData.value = [
{
id: '1121',
label: '基本类型',
parentId: null
}
]
} else {
//自定义类型
const res: any = await PhotoApi.modelTypeList()
if (res.code == 0 || res.code == 200) {
let data = transformNestedJson(res.data, 'name', 'label')
typeTreeData.value = data
console.log(typeTreeData.value, 'klklk')
}
}
}
const transformNestedJson = (data, oldKey, newKey) => {
if (Array.isArray(data)) {
return data.map((item) => transformNestedJson(item, oldKey, newKey))
} else if (data && typeof data === 'object') {
const newObj = {}
for (const key in data) {
// 替换键名
const currentKey = key === oldKey ? newKey : key
// 递归处理子元素
newObj[currentKey] = transformNestedJson(data[key], oldKey, newKey)
}
return newObj
}
return data
}
//------------导入模型--------------
const fileInput = ref<HTMLInputElement>()
const triggerUpload = () => {
fileInput.value?.click()
}
const handleFileChange = (e: Event) => {
const files = (e.target as HTMLInputElement).files
if (files) {
const formData = new FormData()
formData.append('files', files[0])
formData.append('iconTypeId', clickTreeNode.id)
PhotoApi.addGraph(formData).then((res) => {
if (res.code == 0 || res.code == 200) {
ElMessage.success('导入成功')
getModelListByType(clickTreeNode.id)
}
})
// 此处可添加文件验证或预处理逻辑
}
}
//创建模型库
const createModelDB = async () => {
let option = {
title: '创建图标库',
filename: 'YJEarth.tubiao',
filters: [{ name: '保存库文件', extensions: ['tubiao'] }]
}
$sendElectronChanel('saveFile', option)
$recvElectronChanel('selectedFileItem', (e, path) => {
if (path) {
let index = path.lastIndexOf('/')
let model_lib_path = path.slice(0, index)
let model_lib_name = path.slice(index + 1)
PhotoApi.createModelDB({ name: model_lib_name, path: model_lib_path }).then((res) => {
if (res.code == 0 || res.code == 200) {
ElMessage.success('创建成功')
getModelList()
}
})
}
})
}
//导入模型库
const importModelDB = () => {
let option = {
properties: ['openFile'],
filters: [
{
name: '图标库', //、底图
extensions: ['tubiao']
}
]
}
$sendElectronChanel('open-directory-dialog', option)
$recvElectronChanel('selectedItem', (e, path) => {
if (path.length) addModelDB(path[0])
})
}
const addModelDB = (path) => {
let formData = new FormData()
formData.append('iconPath', path)
PhotoApi.importModelDB(formData).then((res) => {
if (res.code == 0 || res.code == 200) {
ElMessage.success('导入成功')
getModelList()
}
})
}
//拖拽
type Node = RenderContentContext['node']
const handleDragStart = (node: Node, ev: DragEvents) => {
console.log('drag start', node)
}
const handleDragEnter = (draggingNode: Node, dropNode: Node, ev: DragEvents) => {
console.log('tree drag enter:', dropNode.label)
}
const handleDragLeave = (draggingNode: Node, dropNode: Node, ev: DragEvents) => {
console.log('tree drag leave:', dropNode.label)
}
const handleDragOver = (draggingNode: Node, dropNode: Node, ev: DragEvents) => {
console.log('tree drag over:', dropNode.label)
}
const handleDragEnd = (
draggingNode: Node,
dropNode: Node,
dropType: NodeDropType,
ev: DragEvents
) => {
console.log('tree drag end:', dropNode, dropType, ev, draggingNode)
}
const handleDrop = (draggingNode: Node, dropNode: Node, dropType: NodeDropType, ev: DragEvents) => {
console.log('tree drop:', dropNode.label, dropType)
}
const allowDrop = (draggingNode: Node, dropNode: Node, type: AllowDropType) => {
if (dropNode.data.label === 'Level two 3-1') {
return type !== 'inner'
} else {
return true
}
}
const allowDrag = (draggingNode: Node) => {
return !draggingNode.data.label.includes('Level three 3-1-1')
}
//拖拽结束
//---------------------查看缩略图--------------------
var showImageRow = null
const showImage = (row: any) => {
showImageRow = row
eventBus.emit('imagePopDialog', row)
eventBus.emit('settingPop', false)
}
const handleContextMenu = (event: MouseEvent, row: TypeNode) => {
event.stopPropagation()
event.preventDefault()
if (activeIndex.value !== 2) {
return
}
contextMenu.currentRow = row
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' }
]
}
clickTreeNode = row
contextMenu.visible = true
}
const toggleExpand = (row: any) => {
if (row.childNodes.length != 0) {
// row._expanded = !row._expanded
// 这里需要调用el-table的toggleRowExpansion方法
// 需要通过ref获取table实例
// tableRef.value?.toggleRowExpansion(row, row._expanded)
if (row.expanded) {
row.collapse()
} else {
row.expand()
// getModelListByType(row.data.id)
}
} else {
// getModelListByType(row.data.id)
}
getModelListByType(row.data.id)
currentTypeId.value = row.id
clickTreeNode = row.data
// loadModelsByType(row.id)
contextMenu.visible && (contextMenu.visible = false)
}
const getModelListByType = async (id) => {
if (activeIndex.value === 0) {
await nextTick()
modelList.value = threePhoto
} else if (activeIndex.value === 1) {
modelList.value = ordinaryPhoto
} else {
let formData = new FormData()
formData.append('iconTypeId', id)
PhotoApi.showModelByType(formData).then((res) => {
modelList.value = res.data
})
}
}
const divContextMenu = (event: MouseEvent) => {
if (activeIndex.value !== 2) {
return
}
event.preventDefault()
contextMenu.x = event.clientX
contextMenu.y = event.clientY
clickTreeNode = null
contextMenu.items = [{ command: 'addType', label: '添加类型', icon: 'add' }]
contextMenu.visible = true
}
const handleMenuCommand = (command: string) => {
const row = contextMenu.currentRow
if (!row) {
//添加类型
handleAddType()
} else {
switch (command) {
case 'addType':
handleAddType()
break
case 'add-child':
handleAddChildType(row)
break
case 'import':
handleImportModel(row)
break
case 'rename':
handleRenameType(row)
break
case 'delete':
handleDeleteType(row)
break
}
}
}
var clickTreeNode = null
const handleTypeClick = (row: TypeNode) => {
getModelListByType(row.id)
currentTypeId.value = row.$treeNodeId
clickTreeNode = row
// // 模拟根据类型ID加载模型数据
// loadModelsByType(row.id)
// contextMenu.visible && (contextMenu.visible = false)
}
const handleClick = () => {
contextMenu.visible && (contextMenu.visible = false)
}
const loadModelsByType = (typeId: string) => {
// 模拟数据加载
modelList.value = [
// {
// id: '1',
// typeId: typeId,
// name: `模型_${typeId}_1`,
// thumbnail: 'https://picsum.photos/200/150?random=1'
// },
// {
// id: '2',
// typeId: typeId,
// name: `模型_${typeId}_2`,
// thumbnail: 'https://picsum.photos/200/150?random=2'
// }
]
}
const handleAddType = () => {
dialogTitle.value = '添加图标类型'
modelType.value = ''
dialogVisible.value = true
}
const handleAddChildType = (row: TypeNode) => {
dialogTitle.value = '添加图标类型'
modelType.value = ''
dialogVisible.value = true
}
const handleImportModel = (row: TypeNode) => {
triggerUpload()
}
const handleRenameType = (row: TypeNode) => {
dialogTitle.value = '图标类型重命名'
modelType.value = row.label
dialogVisible.value = true
}
var clickPhotoRow = null
const editPhotoName = (row) => {
dialogTitle.value = '图标重命名'
modelType.value = row.iconName
clickPhotoRow = row
dialogVisible.value = true
}
const handleDeleteType = (row: TypeNode) => {
ElMessageBox.confirm('是否删除数据?', '警告', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
let formData = new FormData()
formData.append('iconTypeId', row.id)
PhotoApi.delModelType(formData).then((res) => {
if (res.code == 0 || res.code == 200) {
ElMessage.success('删除成功')
getModelList()
}
})
})
.catch(() => {})
}
const handleEdit = (row: ModelItem) => {
updatePoster(row)
}
const updatePoster1 = (row, flag = false, path = '') => {
let cb = (c) => {
const formData = new FormData()
formData.append('militaryId', row.id)
formData.append('file', c)
PhotoApi.updatePoster(formData).then((res) => {
if (res.code == 0 || res.code == 200) {
getModelListByType(row.iconTypeId)
ElMessage.success('添加成功')
}
})
}
if (!flag) {
let option = {
properties: ['openFile'],
filters: [
{
name: '图标',
extensions: ['svg']
}
]
}
$sendElectronChanel('open-directory-dialog', option)
$recvElectronChanel('selectedItem', (e, paths) => {
if (paths.length) {
cb(paths[0])
}
})
} else {
cb(path)
}
}
const updatePoster = (row, flag = false, path = '') => {
let that = this
let cb = (c) => {
const formData = new FormData()
formData.append('militaryId', row.id)
formData.append('file', c)
PhotoApi.updatePoster(formData).then((res) => {
if (res.code == 0 || res.code == 200) {
getModelListByType(row.iconTypeId)
ElMessage.success('添加成功')
}
})
}
if (!flag) {
let option = {
properties: ['openFile'],
filters: [
{
name: '图标',
extensions: ['svg']
}
]
}
$sendElectronChanel('open-directory-dialog', option)
$recvElectronChanel('selectedItem', (e, paths) => {
if (paths.length) {
// 取出路径中的文件名
let name = getNamefromPath(paths[0])
// 读取文件
fs.readFile(paths[0], (err, data) => {
const blob = new Blob([data], {
type: 'image/png, image/jpeg, image/jpg'
})
var file = new File([blob], `${name}` + '.png')
cb(file)
})
// cb(paths[0]);
}
})
} else {
cb(path)
}
}
const getNamefromPath = (path) => {
let index = 1
if (path.endsWith('.json')) {
index = 2
}
let arr = path.split('/')
let str = arr[arr.length - index]
let name = str
if (!path.endsWith('.json')) {
let arr1 = str.split('.')
arr1.pop()
name = arr1.join('.')
}
return name
}
const handleDelete = (row: ModelItem) => {
ElMessageBox.confirm('是否删除数据?', '警告', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
let formData = new FormData()
formData.append('iconId', row.id)
PhotoApi.delModel(formData).then((res) => {
if (res.code == 0 || res.code == 200) {
ElMessage.success('删除成功')
getModelListByType(row.iconTypeId)
}
})
})
.catch(() => {})
}
//立体图标、普通图标
let threePhoto = []
let ordinaryPhoto = []
const setPhotoList = () => {
$sendElectronChanel('requireGEMarkerName', {
dirName: 'GEMarker',
dirName1s: 'GEMarker1s'
})
$recvElectronChanel('dirFiles', (e, res) => {
console.log(res, e, 'resxxxx')
res.GEMarker1s.forEach((item) => {
let name = item.split('.')[0]
name = name.split('/')[1]
threePhoto.push({
iconName: name,
data: item
})
console.log(threePhoto, 'threePhoto')
})
res.GEMarker.forEach((item) => {
let name = item.split('.')[0]
name = name.split('/')[1]
ordinaryPhoto.push({
iconName: name,
data: item
})
})
})
}
onMounted(() => {
getModelList()
setPhotoList()
})
</script>
<style scoped>
.model-management-container {
padding: 20px;
height: 100%;
}
.tree {
border-right: 1px solid rgba(var(--color-sdk-base-rgb), 0.5);
}
.tree-container {
height: 380px;
overflow-y: auto;
}
.el-row {
border: 1px solid rgba(var(--color-sdk-base-rgb), 0.5);
}
::v-deep .el-button--small {
padding: 5px 7px !important;
}
.el-button {
background-color: rgba(var(--color-sdk-base-rgb), 0.2) !important;
--el-button-text-color: rgba(255, 255, 255, 1) !important;
--el-button-border-color: rgba(var(--color-sdk-base-rgb), 0.2);
--el-button-hover-text-color: rgba(var(--color-sdk-base-rgb), 1) !important;
--el-button-hover-border-color: rgba(var(--color-sdk-base-rgb), 1) !important;
}
.primary-type {
font-weight: bold;
color: var(--el-color-primary);
}
::v-deep .el-scrollbar {
height: 360px !important;
overflow: auto;
}
.el-card {
--el-card-border-color: 1px solid rgba(var(--color-sdk-base-rgb), 0.5);
background-color: transparent !important;
}
.el-table {
--el-table-border: 1px solid rgba(var(--color-sdk-base-rgb), 0.5);
--el-table-header-bg-color: transparent !important;
--el-table-tr-bg-color: transparent !important;
--el-table-bg-color: transparent !important;
--el-table-current-row-bg-color: transparent !important;
--el-table-row-hover-bg-color: transparent !important;
--el-table-border-color: transparent !important;
--el-table-text-color: rgba(230, 247, 255, 1) !important;
--el-table-header-text-color: rgba(230, 247, 255, 1) !important;
font-size: 14px !important;
font-weight: 500 !important;
}
/* 一级菜单 */
.primary-type {
color: rgba(255, 255, 255, 1) !important;
font-size: 12px !important;
font-weight: 400 !important;
}
.tree .el-table {
--el-table-border: unset !important;
--el-table-text-color: rgba(255, 255, 255, 1) !important;
--el-table-header-text-color: rgba(255, 255, 255, 1) !important;
font-size: 12px !important;
font-weight: 400 !important;
}
::v-deep .tree .el-table__header-wrapper {
border-bottom: 1px solid rgba(var(--color-sdk-base-rgb), 0.5) !important;
}
.el-table__body {
height: 360px !important;
}
.el-table td.el-table__cell,
.el-table th.el-table__cell.is-leaf {
border-bottom: transparent !important;
height: 80px;
}
::v-deep .el-card.is-always-shadow,
::v-deep .el-card.is-hover-shadow:focus,
::v-deep .el-card.is-hover-shadow:hover {
box-shadow: transparent !important;
}
::v-deep .el-card.is-always-shadow,
::v-deep .el-card.is-hover-shadow:focus,
::v-deep .el-card.is-hover-shadow:hover {
box-shadow: transparent !important;
}
::v-deep .el-card__body {
padding: 0 !important;
}
::v-deep .el-col,
.el-col-6,
.is-guttered {
padding: 0 !important;
}
::v-deep .el-icon svg {
color: rgba(var(--color-sdk-base-rgb), 1) !important;
}
.selected-text {
color: rgba(var(--color-sdk-base-rgb), 1) !important; /* Element UI主色可自定义 */
}
::v-deep .el-table__expand-icon {
display: none !important;
}
::v-deep .el-tree-node__expand-icon {
display: none !important;
}
.el-table__empty-text {
line-height: 0px !important;
}
.noData {
height: 20px;
line-height: 20px;
font-size: 14px;
font-weight: 400;
margin-top: 10px;
}
.custom-empty {
display: flex;
justify-content: center; /* 水平居中 */
align-items: center; /* 垂直居中 */
flex-direction: column;
height: 300px;
}
.custom-empty img {
display: block;
width: 130px;
}
.el-tree {
background: transparent !important;
/* --el-tree-node-hover-bg-color: rgba(var(--color-sdk-base-rgb), 0.2) !important; */
--el-tree-node-hover-bg-color: unset !important;
color: rgba(255, 255, 255, 1) !important;
/* font-size: 12px !important; */
}
::v-deep .el-text {
color: rgba(255, 255, 255, 1) !important;
font-size: 12px !important;
}
::v-deep .el-input {
width: 300px;
margin-left: 30px;
--el-input-placeholder-color: rgba(173, 241, 255, 1) !important;
--el-input-placeholder-font-size: 14px;
--el-input-text-color: #fff !important;
--el-input-border-color: rgba(var(--color-sdk-base-rgb), 0.5) !important;
--el-input-hover-border-color: rgba(var(--color-sdk-base-rgb), 0.5) !important;
--el-input-focus-border-color: rgba(var(--color-sdk-base-rgb), 0.5) !important;
}
::v-deep .el-input__wrapper {
background-color: rgba(0, 0, 0, 0.5) !important;
}
::v-deep .el-dialog__title {
text-shadow: 0px 0px 9px var(--color-sdk-text-shadow) !important;
color: rgba(255, 255, 255, 1) !important;
}
.typeBut {
left: 527px;
top: 3764px;
width: 217px;
height: 32px;
opacity: 1;
display: flex;
justify-content: flex-start;
align-items: flex-start;
span {
display: block;
width: 90px;
height: 32px;
opacity: 1;
border-radius:
0px 4px,
4px,
0px;
background: rgba(0, 255, 255, 0.2);
border: 1px solid rgba(0, 255, 255, 0.1);
display: flex;
justify-content: center;
align-items: center;
padding: 4px 5px 4px 5px;
font-size: 12px;
cursor: pointer;
}
span:hover {
color: rgba(var(--color-sdk-base-rgb), 1);
border: 1px solid rgba(var(--color-sdk-base-rgb), 1);
border-radius: 4px;
}
}
.equipment_title {
display: flex;
justify-content: space-between;
}
::v-deep .typeList {
width: 100%;
height: 40px;
line-height: 40px;
padding: 0 12px;
color: rgba(230, 247, 255, 1) !important;
border-bottom: 1px solid rgba(var(--color-sdk-base-rgb), 0.5);
letter-spacing: 1px;
}
.clickButClass {
color: rgba(var(--color-sdk-base-rgb), 1);
border: 1px solid rgba(var(--color-sdk-base-rgb), 1) !important;
border-radius: 4px;
}
</style>

View File

@ -163,20 +163,30 @@
<span class="fankuai"></span> <span class="fankuai"></span>
<span class="setting_title">功能设置</span> <span class="setting_title">功能设置</span>
</div> </div>
<div class="seting_content1"> <div class="seting_switch">
<div class="detailSkin1"> <div class="detailSkin2">
<span>默认视角</span> <span>默认视角</span>
<el-button color="#005c5c" @click="setView">{{ <el-button color="#005c5c" @click="setView"
t('systemSetting.defaultView') ><svg-icon name="sitting" :size="12" style="margin-right: 5px"></svg-icon>
}}</el-button> {{ t('systemSetting.defaultView') }}</el-button
>
</div> </div>
<div class="detailSkin1"> <div class="detailSkin2">
<span>在线数据</span> <span>在线数据</span>
<el-button color="#005c5c" @click="setData">{{ <el-button color="#005c5c" @click="setData"
t('systemSetting.defaultData') ><svg-icon name="add" :size="12" style="margin-right: 5px"></svg-icon
}}</el-button> >{{ t('systemSetting.defaultData') }}</el-button
>
</div> </div>
<div class="detailSkin2">
<span>后台管理</span>
<el-button color="#005c5c"
><svg-icon name="out_login" :size="12" style="margin-right: 5px"></svg-icon
>{{ t('systemSetting.intoBack') }}</el-button
>
</div>
</div>
<div class="seting_content1">
<div class="detailSkin1"> <div class="detailSkin1">
<span>{{ t('searchWay.title') }}</span> <span>{{ t('searchWay.title') }}</span>
<el-select <el-select

View File

@ -1,6 +1,12 @@
<template> <template>
<div class="set_pup"> <div class="set_pup">
<el-dialog v-model="isShowPup" :modal="false" draggable :close-on-click-modal='false' :destroy-on-close='true'> <el-dialog
v-model="isShowPup"
:modal="false"
draggable
:close-on-click-modal="false"
:destroy-on-close="true"
>
<template #header> <template #header>
<div class="set_pup_header"> <div class="set_pup_header">
<div class="system_title"> <div class="system_title">
@ -28,6 +34,9 @@
<el-tab-pane :label="t('system.graphLabelManage')" name="graphLabelManage"> <el-tab-pane :label="t('system.graphLabelManage')" name="graphLabelManage">
<graphLabelManage></graphLabelManage> <graphLabelManage></graphLabelManage>
</el-tab-pane> </el-tab-pane>
<el-tab-pane :label="t('system.photoManage')" name="photoManage">
<photoManage></photoManage>
</el-tab-pane>
<el-tab-pane :label="t('system.version')" name="version"> <el-tab-pane :label="t('system.version')" name="version">
<version></version> <version></version>
</el-tab-pane> </el-tab-pane>
@ -45,6 +54,7 @@ import equipment from './components/equipment.vue'
import version from './components/version.vue' import version from './components/version.vue'
import modelManage from './components/modelManage.vue' import modelManage from './components/modelManage.vue'
import graphLabelManage from './components/graphLabelManage.vue' import graphLabelManage from './components/graphLabelManage.vue'
import photoManage from './components/photoManage.vue'
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
const { t } = useI18n() const { t } = useI18n()

View File

@ -183,8 +183,8 @@
<use xlink:href="#yj-icon-edit"></use></svg <use xlink:href="#yj-icon-edit"></use></svg
>编辑 >编辑
</button> </button>
<button @click="returnX">X轴翻转</button> <button @click="returnX"><svg-icon name="xaxis" :size="12"></svg-icon> X轴翻转</button>
<button @click="returnY">Y轴翻转</button> <button @click="returnY"><svg-icon name="yaxis" :size="12"></svg-icon>Y轴翻转</button>
<button @click="remove">删除</button> <button @click="remove">删除</button>
<button @click="confirm">确定</button> <button @click="confirm">确定</button>
<button @click="close">关闭</button> <button @click="close">关闭</button>
@ -278,48 +278,6 @@ const open = async (id: any, type: any) => {
entityOptions.value.textColor = 'rgba(255,255,255,1)' entityOptions.value.textColor = 'rgba(255,255,255,1)'
} //点击清空按钮事件回调 } //点击清空按钮事件回调
}) })
let ylinecolorPicker = new window.YJColorPicker({
el: labelLineColorRef.value,
size: 'mini', //颜色box类型
alpha: true, //是否开启透明度
defaultColor: entityOptions.value.labelLineColor,
disabled: false, //是否禁止打开颜色选择器
openPickerAni: 'opacity', //打开颜色选择器动画
sure: (color) => {
entityOptions.value.labelLineColor = color
}, //点击确认按钮事件回调
clear: () => {
entityOptions.value.labelLineColor = 'rgba(255,255,255,1)'
} //点击清空按钮事件回调
})
let bgcolorPicker1 = new window.YJColorPicker({
el: labelBackgroundColorStartRef.value,
size: 'mini', //颜色box类型
alpha: true, //是否开启透明度
defaultColor: entityOptions.value.labelBackgroundColorStart,
disabled: false, //是否禁止打开颜色选择器
openPickerAni: 'opacity', //打开颜色选择器动画
sure: (color) => {
entityOptions.value.labelBackgroundColorStart = color
}, //点击确认按钮事件回调
clear: () => {
entityOptions.value.labelBackgroundColorStart = 'rgba(255,255,255,1)'
} //点击清空按钮事件回调
})
let bgcolorPicker2 = new window.YJColorPicker({
el: labelBackgroundColorEndRef.value,
size: 'mini', //颜色box类型
alpha: true, //是否开启透明度
defaultColor: entityOptions.value.labelBackgroundColorEnd,
disabled: false, //是否禁止打开颜色选择器
openPickerAni: 'opacity', //打开颜色选择器动画
sure: (color) => {
entityOptions.value.labelBackgroundColorEnd = color
}, //点击确认按钮事件回调
clear: () => {
entityOptions.value.labelBackgroundColorEnd = 'rgba(255,255,255,1)'
} //点击清空按钮事件回调
})
} }
const textPosPick = (val) => { const textPosPick = (val) => {

View File

@ -176,7 +176,7 @@ const save = (e) => {
imageData.value && formData.append('file', imageData.value) imageData.value && formData.append('file', imageData.value)
ModelApi.updatePoster(formData).then((res) => { ModelApi.updatePoster(formData).then((res) => {
if (res.code == 0 || res.code == 200) { if (res.code == 0 || res.code == 200) {
ElMessage.success('添加成功') ElMessage.success('设置成功')
} }
}) })
baseDialog.value?.close() baseDialog.value?.close()