ljq/TkAstral3D
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(all): 修复html复制报错

Browse Source
This commit is contained in:
plum 2026-04-22 17:47:28 +08:00
parent 37e1e58883
commit ecd24acf19
4 changed files with 209 additions and 193 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
packages/editor/src/components/header/navigation/Copy.vue
View File

@ -18,7 +18,7 @@ import {onMounted, ref} from "vue";
import {Copy} from "@vicons/carbon";
import {NIcon, NTooltip} from "naive-ui";
import {t} from "@/language";
import {App,Hooks,AddObjectCommand} from "@astral3d/engine";
import {App,Hooks,Loader,Utils,AddObjectCommand} from "@astral3d/engine";
const disabled = ref(true);
@ -36,6 +36,15 @@ function handleClone() {
//避免复制相机或场景
if (object === null || object.parent === null) return;
if (Utils.isHtmlPanelObject(object)) {
const _json = object.toJSON() as any;
Loader.objectLoader.parseAsync(_json).then(newObject3D => {
App.execute(new AddObjectCommand(newObject3D));
}).catch((e: Error) => window.$message?.error(e.message));
return;
}
object = object.clone();
App.execute(new AddObjectCommand(object));

11
packages/editor/src/components/tree/SceneTree.vue
View File

@ -19,7 +19,7 @@ import {
ChoroplethMap
} from '@vicons/carbon';
import {t} from "@/language";
import {App,Hooks, MoveObjectCommand, RemoveObjectCommand, AddObjectCommand} from "@astral3d/engine";
import {App,Hooks,Loader,Utils, MoveObjectCommand, RemoveObjectCommand, AddObjectCommand} from "@astral3d/engine";
import {escapeHTML, findSiblingsAndIndex} from "@/utils/common/utils";
import {getMaterialName} from "@/utils/common/scenes";
import EsContextmenu from "@/components/es/EsContextmenu.vue";
@ -367,6 +367,15 @@ function handleContextmenuSelect(key: string) {
if (parent !== null) App.execute(new RemoveObjectCommand(object));
break;
case "clone":
if (Utils.isHtmlPanelObject(object)) {
const _json = object.toJSON() as any;
Loader.objectLoader.parseAsync(_json).then(newObject3D => {
App.execute(new AddObjectCommand(newObject3D));
}).catch((e: Error) => window.$message?.error(e.message));
break;
}
const _object = object.clone();
App.execute(new AddObjectCommand(_object));

34
packages/editor/src/views/editor/layouts/sidebar/SidebarHtmlPanel.vue
View File

@ -29,6 +29,22 @@ onBeforeUnmount(() => {
Hooks.useRemoveSignal("objectSelected", updateUI);
})
function ensureHtmlPanelOptions(object: any) {
const options = object?.options || {};
const codes = Array.isArray(options.codes) ? options.codes : [];
const isSingleHtml = typeof options.isSingleHtml === 'boolean' ? options.isSingleHtml : true;
const isSprite = typeof options.isSprite === 'boolean' ? options.isSprite : !!object?.isHtmlSprite;
object.options = {
...options,
codes,
isSingleHtml,
isSprite
};
return object.options;
}
function updateUI() {
const object = App.selected;
if(!object) return;
@ -39,7 +55,8 @@ function updateUI() {
}
data.type = object.isHtmlPanel? 'panel' :'sprite';
data.codes = object.options.codes;
const options = ensureHtmlPanelOptions(object);
data.codes = options.codes;
}
function update(method: string){
@ -55,6 +72,7 @@ function update(method: string){
const _json = object.toJSON() as any;
_json.object.type = data.type === 'panel' ? 'HtmlSprite' : 'HtmlPanel';
_json.object.options = _json.object.options || {};
_json.object.options.isSprite = !_json.object.options.isSprite;
Loader.objectLoader.parseAsync(_json).then(newObject3D => {
@ -73,9 +91,11 @@ function update(method: string){
_code.content = editorCode.code;
const options = ensureHtmlPanelOptions(object);
const htmlPanelOption = {
isSprite: object.options.isSprite,
isSingleHtml:object.options.isSingleHtml,
isSprite: options.isSprite,
isSingleHtml: options.isSingleHtml,
codes: data.codes
}
@ -135,10 +155,12 @@ function updateFileList(fList: UploadFileInfo[]) {
isSprite: data.type ==='sprite',
fileName: file.name
}).then(htmlPlaneObj => {
object.options.codes = htmlPlaneObj.options.codes;
object.options.isSingleHtml = htmlPlaneObj.options.isSingleHtml;
const options = ensureHtmlPanelOptions(object);
data.codes = object.options.codes;
options.codes = htmlPlaneObj.options.codes;
options.isSingleHtml = htmlPlaneObj.options.isSingleHtml;
data.codes = options.codes;
// Keep object identity (id/uuid) so scene tree and context menu references stay valid.
while (object.element.firstChild) {

186
packages/editor/src/views/home/dataCenter/DataSet.vue
View File

@ -27,21 +27,16 @@
<div class="flex-1">
<div class="flex justify-between mb-3">
<n-input
:placeholder="t('prompt.Please enter a name for the dataset')"
class="max-w-64"
show-count
:maxlength="25"
@update:value="handleSearch"
>
<n-input :placeholder="t('prompt.Please enter a name for the dataset')" class="max-w-64" show-count
:maxlength="25" @update:value="handleSearch">
<template #prefix>
<n-icon :component="Search" />
</template>
</n-input>
<n-button type="primary" @click="handleAddDataSet">{{ t("home.Add data set") }}</n-button>
<n-button type="primary" @click="handleAddDataSet">{{ t('home.Add data set') }}</n-button>
</div>
<n-data-table :columns="dataSetColumns" :data="dataSets" :pagination="pagination" :loading="tableLoading" remote />
<n-data-table :columns="dataSetColumns" :data="dataSets" :pagination="pagination" :loading="tableLoading" />
</div>
</n-flex>
@ -50,123 +45,104 @@
</template>
<script lang="ts" setup>
import { ref, reactive, h, onMounted } from "vue";
import { NButton, NPopconfirm } from "naive-ui";
import { Search } from "@vicons/carbon";
import { t } from "@/language";
import { fetchDataSetDetail, fetchDataSetPage, fetchDeleteDataSet } from "@/http/api/dataSet";
import DataSetModal from "./DataSetModal.vue";
import DataSetGroup from "./DataSetGroup.vue";
import { ref, reactive, h, onMounted } from 'vue';
import { NButton, NPopconfirm } from 'naive-ui';
import { Search } from '@vicons/carbon';
import { t } from "@/language";
import { fetchDataSetDetail, fetchDataSetPage, fetchDeleteDataSet } from "@/http/api/dataSet";
import DataSetModal from "./DataSetModal.vue";
import DataSetGroup from "./DataSetGroup.vue";
const dataSets = ref<IDataSet.Item[]>([]);
const tableLoading = ref(false);
const showDataSetModal = ref(false);
const searchName = ref("");
const selectedGroupId = ref<IDataSet.IGroup["id"] | null>(null);
const defaultDataSet: IDataSet.Item = {
id: "",
groupId: "",
name: "",
type: "API",
method: "GET",
api: "",
dataSourceId: "",
sql: "",
json: "",
};
const currentDataSet = reactive<IDataSet.Item>({
...defaultDataSet,
});
const dataSetColumns = [
const dataSets = ref<IDataSet.Item[]>([])
const tableLoading = ref(false);
const showDataSetModal = ref(false)
const searchName = ref("");
const selectedGroupId = ref<IDataSet.IGroup["id"] | null>(null);
const defaultDataSet: IDataSet.Item = {
id: '',
groupId: '',
name: '',
type: 'API',
method: 'GET',
api: '',
dataSourceId: '',
sql: '',
json: ''
};
const currentDataSet = reactive<IDataSet.Item>({
...defaultDataSet
})
const dataSetColumns = [
{
title: t("home.Data set name"),
key: "name",
defaultSortOrder: "ascend",
sorter: "default",
key: 'name',
defaultSortOrder: 'ascend',
sorter: 'default',
resizable: true,
minWidth: 120,
maxWidth: 400,
ellipsis: {
tooltip: true,
tooltip: true
},
filter(value, row) {
return ~row.name.indexOf(value);
},
}
},
{
title: t("home.Data set type"),
key: "type",
defaultSortOrder: "ascend",
sorter: "default",
key: 'type',
defaultSortOrder: 'ascend',
sorter: 'default',
resizable: true,
width: 180,
minWidth: 120,
maxWidth: 260,
maxWidth: 260
},
{
title: t("other.Action"),
key: "actions",
key: 'actions',
resizable: true,
minWidth: 120,
maxWidth: 300,
render: row =>
h("div", [
h(
NButton,
{
size: "small",
render: (row) => h('div', [
h(NButton, {
size: 'small',
onClick: () => editDataSet(row),
style: { marginRight: "0.4rem" },
},
t("layout.sider.script.Edit")
),
h(
NPopconfirm,
{
onPositiveClick: () => deleteDataSet(row),
},
{
style: { marginRight: '0.4rem' }
}, t("layout.sider.script.Edit")),
h(NPopconfirm, {
onPositiveClick: () => deleteDataSet(row)
}, {
default: () => t("prompt.Are you sure you want to delete it?"),
trigger: () =>
h(
NButton,
{
size: "small",
},
t("home.Delete")
),
trigger: () => h(NButton, {
size: 'small'
}, t("home.Delete"))
})
])
}
),
]),
},
];
// 分页配置
const pagination = reactive({
]
// 分页配置
const pagination = reactive({
page: 1,
pageSize: 10,
pageCount: 1,
onChange: (page: number) => {
"on-update:page": (page: number) => {
pagination.page = page;
getList();
},
onUpdatePageSize: (pageSize: number) => {
pagination.pageSize = pageSize;
pagination.page = 1;
getList();
},
});
function resetCurrentDataSet(data?: Partial<IDataSet.Item>) {
Object.assign(currentDataSet, defaultDataSet, data || {});
}
})
async function getList() {
function resetCurrentDataSet(data?: Partial<IDataSet.Item>) {
Object.assign(currentDataSet, defaultDataSet, data || {});
}
async function getList() {
tableLoading.value = true;
const res = await fetchDataSetPage({
page: pagination.page,
pageSize: pagination.pageSize,
name: searchName.value || undefined,
groupId: selectedGroupId.value ?? undefined,
groupId: selectedGroupId.value ?? undefined
});
tableLoading.value = false;
dataSets.value = res.data?.items || [];
@ -174,28 +150,28 @@
if (res.data?.current) {
pagination.page = res.data.current;
}
}
}
function handleSearch(searchText: string) {
function handleSearch(searchText: string) {
searchName.value = searchText;
pagination.page = 1;
getList();
}
}
function handleGroupSelect(group: IDataSet.IGroup | null) {
function handleGroupSelect(group: IDataSet.IGroup | null) {
selectedGroupId.value = group?.id ?? null;
pagination.page = 1;
getList();
}
}
function handleAddDataSet() {
function handleAddDataSet() {
resetCurrentDataSet({
groupId: selectedGroupId.value ?? "",
groupId: selectedGroupId.value ?? ""
});
showDataSetModal.value = true;
}
}
async function editDataSet(item) {
async function editDataSet(item) {
const res = await fetchDataSetDetail(item.id);
if (res.error) {
return;
@ -203,21 +179,21 @@
const detail = (res.data || item) as any;
resetCurrentDataSet({
...detail,
dataSourceId: detail.dataSourceId || detail.dataSource ? String(detail.dataSourceId || detail.dataSource) : "",
dataSourceId: detail.dataSourceId || detail.dataSource ? String(detail.dataSourceId || detail.dataSource) : ""
});
showDataSetModal.value = true;
}
showDataSetModal.value = true
}
async function deleteDataSet(item) {
async function deleteDataSet(item) {
const res = await fetchDeleteDataSet(item.id);
if (res.error) {
return;
}
window.$message?.success(t("prompt.Success to delete"));
getList();
}
}
onMounted(() => {
onMounted(() => {
getList();
});
})
</script>