update

src/modules/editor/components/CompUI/basicUI/Image2/component.tsx

@@ -34,7 +34,6 @@ export const Component = defineComponent({
         comp.value.x = 0;
         comp.value.y = 0;
         comp.value.s = 1;
-        comp.value.opacity = 1;
         setImageSize(url);
       } catch (error) {
         console.log(error);
@@ -50,13 +49,17 @@ export const Component = defineComponent({
         scale + "" == "1" && ox + "" == "0" && oy + "" == "0"
           ? "cover"
           : "contain";
-      const op = value?.opacity;
 
       return (
         <View
           class="overflow-hidden"
           compId={props.compId}
           onDblclick={store.isEditMode ? changeVal : undefined}
+          onClick={() => {
+            if (value.showLink && value.link && !store.isEditMode) {
+              window.location.href = value.link;
+            }
+          }}
         >
           <img
             crossorigin="anonymous"
@@ -64,7 +67,6 @@ export const Component = defineComponent({
             style={{
               transform: `scale(${scale}) translate(${ox}%,${oy}%)`,
               objectFit,
-              opacity: op,
             }}
             src={
               value.url.startsWith("data:image/png")

src/modules/editor/components/CompUI/basicUI/Image2/index.ts

@@ -1,7 +1,6 @@
 import { Dict_Imgs } from "@/dict";
 import { createAttrsForm } from "../../defines/createAttrsForm";
 import { createCompHooks } from "../../defines/createCompHooks";
-import Slider from "../../formItems/Slider";
 
 export { Component } from "./component";
 
@@ -11,41 +10,51 @@ export const options = {
 };
 
 export const { createComp, useCompData } = createCompHooks({
-  value: { url: Dict_Imgs.Default, x: 0, y: 0, s: 1, opacity: 1 },
+  value: {
+    url: Dict_Imgs.Default,
+    x: 0,
+    y: 0,
+    s: 1,
+    showLink: false,
+    link: "",
+  },
   layout: {
     size: [750, 400],
   },
 });
 
 export const Form = createAttrsForm([
+  // {
+  //   label: "图片",
+  //   dataIndex: "value.url",
+  //   component: "Input",
+  // },
+  // {
+  //   label: "x偏移",
+  //   dataIndex: "value.x",
+  //   component: "Input",
+  // },
+  // {
+  //   label: "y偏移",
+  //   dataIndex: "value.y",
+  //   component: "Input",
+  // },
+  // {
+  //   label: "缩放",
+  //   dataIndex: "value.s",
+  //   component: "Input",
+  // },
   {
-    label: "图片",
-    dataIndex: "value.url",
-    component: "Input",
-  },
-  {
-    label: "x偏移",
-    dataIndex: "value.x",
-    component: "Input",
-  },
-  {
-    label: "y偏移",
-    dataIndex: "value.y",
-    component: "Input",
+    label: "添加链接",
+    dataIndex: "value.showLink",
+    component: "Switch",
   },
   {
-    label: "缩放",
-    dataIndex: "value.s",
+    dataIndex: "value.link",
     component: "Input",
-  },
-  {
-    label: "透明度",
-    dataIndex: "value.opacity",
-    component: Slider,
     props: {
-      min: 0,
-      max: 1,
-      step: 0.01,
+      placeholder: "http://",
     },
+    isVisible: (value, data) => data?.value?.showLink == true,
   },
 ]);

src/modules/editor/components/CompUI/basicUI/Text/index.ts

@@ -1,6 +1,6 @@
+import "@ckeditor/ckeditor5-build-classic/build/translations/zh-cn";
 import { createAttrsForm } from "../../defines/createAttrsForm";
 import { createCompHooks } from "../../defines/createCompHooks";
-import "@ckeditor/ckeditor5-build-classic/build/translations/zh-cn";
 // import { TextForm } from "./TextForm";
 export { Component } from "./component";
 
@@ -19,9 +19,9 @@ export const { createComp, useCompData } = createCompHooks({
 // export const Form = TextForm;
 
 export const Form = createAttrsForm([
-  {
-    label: "文本",
-    dataIndex: "value",
-    component: "Input",
-  },
+  // {
+  //   label: "文本",
+  //   dataIndex: "value",
+  //   component: "Input",
+  // },
 ]);

src/modules/editor/components/CompUI/basicUI/Video/index.ts

@@ -22,11 +22,11 @@ export const { createComp, useCompData } = createCompHooks({
 });
 
 export const Form = createAttrsForm([
-  {
-    label: "视频地址",
-    dataIndex: "value.url",
-    component: "Input",
-  },
+  // {
+  //   label: "视频地址",
+  //   dataIndex: "value.url",
+  //   component: "Input",
+  // },
   {
     label: "视频比例",
     dataIndex: "value.ratio",
@@ -42,19 +42,19 @@ export const Form = createAttrsForm([
       ],
     },
   },
-  {
-    label: "自动播放",
-    dataIndex: "value.autoplay",
-    component: "Switch",
-  },
+  // {
+  //   label: "自动播放",
+  //   dataIndex: "value.autoplay",
+  //   component: "Switch",
+  // },
   {
     label: "循环播放",
     dataIndex: "value.loop",
     component: "Switch",
   },
-  {
-    label: "显示控制器",
-    dataIndex: "value.controls",
-    component: "Switch",
-  },
+  // {
+  //   label: "显示控制器",
+  //   dataIndex: "value.controls",
+  //   component: "Switch",
+  // },
 ]);

src/modules/editor/components/CompUI/basicUI/View.tsx

@@ -11,7 +11,7 @@ export const View = defineComponent({
   props: {
     compId: string().isRequired,
   },
-  emits: ["dblclick"],
+  emits: ["dblclick", "click"],
   setup(props, { slots, emit }) {
     const { store, actions, helper, controls } = useEditor();
     const compRef = useCompRef(props.compId);
@@ -39,6 +39,8 @@ export const View = defineComponent({
             e.stopPropagation();
             if (store.isEditMode) {
               actions.pickComp(props.compId);
+            } else {
+              emit("click");
             }
           }}
           onDblclick={() => emit("dblclick")}

src/modules/editor/components/CompUI/basicUI/Web3D/index.ts

@@ -18,8 +18,8 @@ export const { createComp, useCompData } = createCompHooks({
     ratio: 1,
   },
   layout: {
-    size: [750, 750]
-  }
+    size: [750, 750],
+  },
 });
 
 export const Form = createAttrsForm([
@@ -34,7 +34,7 @@ export const Form = createAttrsForm([
     component: ImagePicker,
   },
   {
-    label: "视频比例",
+    label: "场景比例",
     dataIndex: "value.ratio",
     component: "Select",
     props: {

src/modules/editor/components/CompUI/defines/createAttrsForm.tsx

@@ -2,11 +2,12 @@ import { useEditor } from "@/modules/editor";
 import { DesignComp } from "@/modules/editor/objects/DesignTemp/DesignComp";
 import { compMasks } from "@/modules/editor/objects/DesignTemp/creates/CompMasks";
 import FormUI, { ColumnItem } from "@queenjs/components/FormUI";
-import { InputNumber, Select, Input } from "ant-design-vue";
+import { Input, InputNumber, Select } from "ant-design-vue";
 import { isEmpty } from "lodash";
 import { defineComponent } from "vue";
 import { any } from "vue-types";
 import { GroupNumber } from "../formItems/GroupNumber";
+import Slider from "../formItems/Slider";
 import { createColorOpts } from "./formOpts/createColorOpts";
 
 export const layoutColumns: ColumnItem[] = [
@@ -41,11 +42,11 @@ export const layoutColumns: ColumnItem[] = [
   //   dataIndex: "layout.padding",
   //   component: "Input",
   // },
-  {
-    label: "偏移矩阵",
-    dataIndex: "layout.transformMatrix",
-    component: Input,
-  },
+  // {
+  //   label: "偏移矩阵",
+  //   dataIndex: "layout.transformMatrix",
+  //   component: Input,
+  // },
   // {
   //   label: "上下偏移",
   //   dataIndex: "layout.offsetY",
@@ -56,29 +57,40 @@ export const layoutColumns: ColumnItem[] = [
   //   },
   //   getValue: (v) => v || 0,
   // },
+  // {
+  //   label: "层级",
+  //   dataIndex: "layout.zIndex",
+  //   component: InputNumber,
+  //   props: {
+  //     min: 0,
+  //     max: 99,
+  //   },
+  // },
+  // {
+  //   label: "遮罩",
+  //   dataIndex: "layout.mask",
+  //   component: Select,
+  //   props: {
+  //     class: "w-full",
+  //     options: [{ label: "无", value: "" }].concat(
+  //       Object.entries(compMasks).map(([key, value]) => {
+  //         return {
+  //           label: value.name,
+  //           value: key,
+  //         };
+  //       })
+  //     ),
+  //   },
+  // },
   {
-    label: "层级",
-    dataIndex: "layout.zIndex",
-    component: InputNumber,
+    label: "透明度",
+    dataIndex: "layout.opacity",
+    component: Slider,
     props: {
+      defaultValue: 1,
       min: 0,
-      max: 99,
-    },
-  },
-  {
-    label: "遮罩",
-    dataIndex: "layout.mask",
-    component: Select,
-    props: {
-      class: "w-full",
-      options: [{ label: "无", value: "" }].concat(
-        Object.entries(compMasks).map(([key, value]) => {
-          return {
-            label: value.name,
-            value: key,
-          };
-        })
-      ),
+      max: 1,
+      step: 0.01,
     },
   },
 ];

src/modules/editor/components/CompUI/formItems/Slider.tsx

@@ -5,6 +5,7 @@ import { bool, number } from "vue-types";
 
 export default defineComponent({
   props: {
+    defaultValue: number().def(0),
     disabled: bool().def(false),
     value: number(),
     min: number(),
@@ -29,8 +30,9 @@ export default defineComponent({
     });
 
     return () => {
-      const { disabled, min, max, step } = props;
+      const { defaultValue, disabled, min, max, step } = props;
       const attr = {
+        defaultValue,
         disabled: disabled,
         value: state.value,
         min,

src/modules/editor/objects/DesignTemp/creates/createCompStyle.ts

@@ -15,6 +15,10 @@ export function createCompStyle(module: EditorModule, layout: Layout) {
     style.display = "none";
   }
 
+  if (layout.opacity !== undefined) {
+    style["opacity"] = layout.opacity;
+  }
+
   if (layout.zIndex) {
     style["zIndex"] = layout.zIndex;
   }
@@ -59,12 +63,10 @@ export function createCompStyle(module: EditorModule, layout: Layout) {
   if (layout.transformMatrix) {
     style.transform = layout.transformMatrix;
     style.transformOrigin = "0 0";
-
   } else {
-    const v = parseTransform(transform)
+    const v = parseTransform(transform);
     if (v) style.transform = v;
   }
-  
 
   if (layout.background) {
     if (layout.background.color) {

src/modules/editor/typings.ts

@@ -20,6 +20,7 @@ export type Layout = {
   margin?: string;
   padding?: string;
   transformMatrix?: string;
+  opacity?: number;
 
   background?: Background;
 };