Merge branch 'dev' of http://124.70.149.18:10880/lianghj/queenshow into dev

src/modules/editor/components/CompSave/index.tsx

@@ -58,7 +58,7 @@ export default defineComponent({
                       <Select
                         v-model={[formState.type, "value"]}
                       >
-                        <Select.Option value="comp">组件</Select.Option>
+                        <Select.Option value="comp">组合</Select.Option>
                         <Select.Option value="text">文字</Select.Option>
                         <Select.Option value="shape">形状</Select.Option>
                       </Select>

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

@@ -11,10 +11,10 @@ export const Component = defineComponent({
     compId: string().isRequired,
   },
   setup(props) {
-    const { store, controls, actions } = useEditor();
+    const { store, controls, actions, helper } = useEditor();
     const comp = useCompData(props.compId);
     const { value } = comp;
-    const videoRef = ref();
+    const videoRef = ref<HTMLVideoElement>();
 
     async function changeVal() {
       try {
@@ -26,17 +26,30 @@ export const Component = defineComponent({
       }
     }
 
+    function updateSize() {
+      const { videoWidth, videoHeight } = videoRef.value as HTMLVideoElement;
+      if (videoHeight == 0 || videoWidth == 0) return;
+      const t = value.ratio || videoWidth * 1.0 / videoHeight;
+      comp.setH(comp.getW() / t);
+      actions.onCompLayoutUpdated(comp);
+      helper.extendStreamCard( store.currStreamCardId );
+    }
+
     watch(
       () => [value.ratio],
       () => {
-        const { videoWidth, videoHeight } = videoRef.value;
-        const t = value.ratio || videoWidth / videoHeight;
-        comp.setH(comp.getW() / t);
-        actions.onCompLayoutUpdated(comp);
+        updateSize();
       }
     );
     onMounted(() => {
-      videoRef.value.addEventListener("play", () => {
+      const el = videoRef.value as HTMLVideoElement;
+      el.addEventListener("loadedmetadata", ()=>{
+          if (value.ratio == 0 && comp.layout.size[0] / comp.layout.size[1] != value.ratio) {
+            updateSize();
+          }
+      })
+
+      el.addEventListener("play", () => {
         controls.mediaCtrl.pauseOtherMedia(props.compId);
       });
       controls.mediaCtrl.setMediasInstance(props.compId, videoRef.value);

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

@@ -13,7 +13,7 @@ export const { createComp, useCompData } = createCompHooks({
 
   value: {
     url: "//sku3d-test.obs.cn-east-3.myhuaweicloud.com/queenshow/1689723277730_hPbfyN_shoe.mp4",
-    ratio: 1,
+    ratio: 0,
     autoplay: true,
     loop: true,
     controls: true,