|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
<template>
|
|
|
<div
|
|
<div
|
|
|
- v-if="show && posStyle"
|
|
|
|
|
|
|
+ v-if="task3D && show && posStyle"
|
|
|
class="hot-item pc"
|
|
class="hot-item pc"
|
|
|
:style="posStyle"
|
|
:style="posStyle"
|
|
|
@mouseenter="isHover = true"
|
|
@mouseenter="isHover = true"
|
|
@@ -21,7 +21,7 @@
|
|
|
<ui-audio
|
|
<ui-audio
|
|
|
v-if="tagging.audio"
|
|
v-if="tagging.audio"
|
|
|
class="audio"
|
|
class="audio"
|
|
|
- :src="getResource(getFileUrl(tagging.audio))"
|
|
|
|
|
|
|
+ :src="getResources(getFileUrl(tagging.audio))"
|
|
|
ref="audio"
|
|
ref="audio"
|
|
|
/>
|
|
/>
|
|
|
</h2>
|
|
</h2>
|
|
@@ -72,12 +72,13 @@ import Preview from "../static-preview/index.vue";
|
|
|
import { getTaggingStyle } from "@/store";
|
|
import { getTaggingStyle } from "@/store";
|
|
|
import { getFileUrl } from "@/utils";
|
|
import { getFileUrl } from "@/utils";
|
|
|
import { sdk, TaggingPositionNode } from "@/sdk";
|
|
import { sdk, TaggingPositionNode } from "@/sdk";
|
|
|
-import { custom, getResource } from "@/env";
|
|
|
|
|
|
|
+import { custom, getResource as getResources } from "@/env";
|
|
|
|
|
|
|
|
import type { Tagging, TaggingPosition } from "@/store";
|
|
import type { Tagging, TaggingPosition } from "@/store";
|
|
|
import { useCameraChange, usePixel } from "@/hook/use-pixel";
|
|
import { useCameraChange, usePixel } from "@/hook/use-pixel";
|
|
|
import { inRevise } from "bill/utils";
|
|
import { inRevise } from "bill/utils";
|
|
|
import { defStyleType } from "@/api";
|
|
import { defStyleType } from "@/api";
|
|
|
|
|
+import mitt from "mitt";
|
|
|
|
|
|
|
|
export type SignProps = { tagging: Tagging; scenePos: TaggingPosition; show?: boolean };
|
|
export type SignProps = { tagging: Tagging; scenePos: TaggingPosition; show?: boolean };
|
|
|
|
|
|
|
@@ -94,13 +95,11 @@ const emit = defineEmits<{
|
|
|
const desc = ref<HTMLDivElement>();
|
|
const desc = ref<HTMLDivElement>();
|
|
|
const showDesc = computed(() => {
|
|
const showDesc = computed(() => {
|
|
|
const a = desc.value?.innerText.trim();
|
|
const a = desc.value?.innerText.trim();
|
|
|
- console.error("--aaa->", desc.value, a);
|
|
|
|
|
return a;
|
|
return a;
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
const audio = ref();
|
|
const audio = ref();
|
|
|
watchEffect(() => {
|
|
watchEffect(() => {
|
|
|
- audio.value && console.error("准备好了!,");
|
|
|
|
|
if (props.show && audio.value) {
|
|
if (props.show && audio.value) {
|
|
|
audio.value.play();
|
|
audio.value.play();
|
|
|
}
|
|
}
|
|
@@ -109,20 +108,38 @@ const [posStyle, pos, pause, recovery] = usePixel(() => undefined);
|
|
|
|
|
|
|
|
const queryItems = computed(() =>
|
|
const queryItems = computed(() =>
|
|
|
props.tagging.images.map((image) => ({
|
|
props.tagging.images.map((image) => ({
|
|
|
- url: getResource(getFileUrl(image)),
|
|
|
|
|
|
|
+ url: getResources(getFileUrl(image)),
|
|
|
}))
|
|
}))
|
|
|
);
|
|
);
|
|
|
-console.log(props.tagging.styleId);
|
|
|
|
|
const taggingStyle = computed(() => getTaggingStyle(props.tagging.styleId));
|
|
const taggingStyle = computed(() => getTaggingStyle(props.tagging.styleId));
|
|
|
-const tag = markRaw(
|
|
|
|
|
- sdk.createTagging({
|
|
|
|
|
- ...props.scenePos,
|
|
|
|
|
- title: props.tagging.title,
|
|
|
|
|
- position: props.scenePos.localPos,
|
|
|
|
|
- canMove: false,
|
|
|
|
|
- image: getFileUrl(taggingStyle.value!.icon),
|
|
|
|
|
- })
|
|
|
|
|
-) as TaggingPositionNode;
|
|
|
|
|
|
|
+let task3D = sdk.createTagging({
|
|
|
|
|
+ ...props.scenePos,
|
|
|
|
|
+ title: props.tagging.title,
|
|
|
|
|
+ position: props.scenePos.localPos,
|
|
|
|
|
+ canMove: false,
|
|
|
|
|
+ image: getFileUrl(taggingStyle.value!.icon),
|
|
|
|
|
+});
|
|
|
|
|
+if (!task3D) {
|
|
|
|
|
+ emit("delete");
|
|
|
|
|
+}
|
|
|
|
|
+const emptyfn = () => {};
|
|
|
|
|
+const tag = (task3D
|
|
|
|
|
+ ? markRaw(task3D)
|
|
|
|
|
+ : {
|
|
|
|
|
+ changeCanMove: emptyfn,
|
|
|
|
|
+ changeMat: emptyfn,
|
|
|
|
|
+ changeFontSize: emptyfn,
|
|
|
|
|
+ changeTitle: emptyfn,
|
|
|
|
|
+ visibilityTitle: emptyfn,
|
|
|
|
|
+ changeType: emptyfn,
|
|
|
|
|
+ changeImage: emptyfn,
|
|
|
|
|
+ changePosition: emptyfn,
|
|
|
|
|
+ changeLineHeight: emptyfn,
|
|
|
|
|
+ visibility: emptyfn,
|
|
|
|
|
+ getImageCenter: emptyfn,
|
|
|
|
|
+ bus: mitt(),
|
|
|
|
|
+ destroy: emptyfn,
|
|
|
|
|
+ }) as TaggingPositionNode;
|
|
|
const showDelete = ref(false);
|
|
const showDelete = ref(false);
|
|
|
tag.showDelete = (show) => {
|
|
tag.showDelete = (show) => {
|
|
|
showDelete.value = show;
|
|
showDelete.value = show;
|
|
@@ -184,7 +201,6 @@ tag.bus.on("changeLineHeight", (lineHeight) => {
|
|
|
watch(getPosition, (p) => {
|
|
watch(getPosition, (p) => {
|
|
|
changeTimeout = setTimeout(() => {
|
|
changeTimeout = setTimeout(() => {
|
|
|
if (inRevise(p, currentPosition)) {
|
|
if (inRevise(p, currentPosition)) {
|
|
|
- console.log("更改当前位置");
|
|
|
|
|
tag.changePosition(p);
|
|
tag.changePosition(p);
|
|
|
currentPosition = p;
|
|
currentPosition = p;
|
|
|
}
|
|
}
|
|
@@ -311,6 +327,7 @@ defineExpose(tag);
|
|
|
p {
|
|
p {
|
|
|
margin-bottom: 10px;
|
|
margin-bottom: 10px;
|
|
|
display: flex;
|
|
display: flex;
|
|
|
|
|
+
|
|
|
span {
|
|
span {
|
|
|
flex: 0 0 auto;
|
|
flex: 0 0 auto;
|
|
|
}
|
|
}
|