update

packages/qjkankan-editor/src/lang/_en.json

@@ -688,6 +688,8 @@
     "coverImgBacSelec2":"图片平铺",
     "coverVideoTit":"视频设置",
     "select_video":"选择视频",
+    "coverImgInWay":"进入方式",
+    "coverImgInWayTit":"是否开启3秒倒计后自动进入",
     "coverVideoInWay":"进入方式",
     "coverVideoInWayTit":"视频播放完自动进入",
     "coverVideoControl":"视频控件",

packages/qjkankan-editor/src/lang/_zh.json

@@ -690,6 +690,8 @@
     "coverImgBacSelec2":"图片平铺",
     "coverVideoTit":"视频设置",
     "select_video":"选择视频",
+    "coverImageInWay":"进入方式",
+    "coverImageInWayTit":"是否开启3秒倒计后自动进入",
     "coverVideoInWay":"进入方式",
     "coverVideoInWayTit":"视频播放完自动进入",
     "coverVideoControl":"视频控件",

packages/qjkankan-editor/src/views/base/coverBase.vue

@@ -93,7 +93,7 @@ pc端视频位置 videoPcLoc
         >
         </Option>
       </Select>
-
+      {{ info.coverInfo.coverSelect }}
       <!-- 关于图片 -->
       <div class="mainImgBox" v-show="info.coverInfo.coverSelect !== 'video'">
         <div class="coverImgTit">{{ coverImgTit }}</div>
@@ -253,6 +253,22 @@ pc端视频位置 videoPcLoc
             </div>
           </div>
         </div>
+
+        <!-- 进入方式 -->
+        <div class="coverImgTit">
+          {{ $i18n.t(`edit_settings.coverImageInWay`) }}
+        </div>
+        <div class="VideoTit">
+          <div class="VideoTitL">
+            {{ $i18n.t(`edit_settings.coverImageInWayTit`) }}
+          </div>
+          <div class="VideoTitR">
+            <Switcher
+              :value="info.coverInfo.coverImageInWay"
+              @change="coverImageInWayChange"
+            ></Switcher>
+          </div>
+        </div>
       </div>
 
       <!-- 关于视频 -->
@@ -315,7 +331,7 @@ pc端视频位置 videoPcLoc
               <SelectedImage
                 :imgSrc="info.coverInfo.videoMoIcon"
                 :defaultImgSrc="require('@/assets/img/coverUpTit2.png')"
-                @cancel="claerVideoMo"
+                @cancel="clearVideoMo"
               ></SelectedImage>
               <div class="imgRight">
                 <!-- 上传视频按钮 -->
@@ -464,6 +480,7 @@ pc端视频位置 videoPcLoc
       <br />
       <br />
     </div>
+
     <div class="dialog" style="z-index: 2000" v-if="isShowSelectionWindow">
       <MaterialSelector
         :title="$i18n.t(`gather.select_material`)"
@@ -545,6 +562,8 @@ export default {
         // 视频的背景设置
         coverVideoBac: "colorFill",
         videoColorSelec: "#000000",
+        // 图片进入方式
+        coverImageInWay: 0,
         // 视频的进入方式
         coverVideoInWay: 0,
         // 视频控件是否显示
@@ -587,13 +606,18 @@ export default {
   methods: {
     //是否显示
     onSwitcherChange(data) {
-      console.log(data, "dadad");
       this.info.coverInfo.isShowCover = data;
     },
+
     // 视频的进入方式
     coverVideoInWayChange(val) {
       this.info.coverInfo.coverVideoInWay = val;
     },
+    // 图片的进入方式
+    coverImageInWayChange(val) {
+      console.log(val, "coverImageInWayChange");
+      this.info.coverInfo.coverImageInWay = val;
+    },
     coverVideoControlChange(val) {
       this.info.coverInfo.coverVideoControl = val;
     },
@@ -639,12 +663,10 @@ export default {
     },
     // 关于视频
     clearVideoPc() {
-      console.log(165168484);
-      console.log(this.info.coverInfo.videoPc);
       this.info.coverInfo.videoPc = "";
       this.info.coverInfo.videoPcIcon = "";
     },
-    claerVideoMo() {
+    clearVideoMo() {
       this.info.coverInfo.videoMo = "";
       this.info.coverInfo.videoMoIcon = "";
     },
@@ -658,12 +680,21 @@ export default {
         coverInfo: { ...this.coverInfo },
         ...this.info,
       });
+    } else {
+      Object.keys(this.coverInfo).forEach((i) => {
+        if (!(i in this.info.coverInfo)) {
+          this.info.coverInfo[i] = this.coverInfo[i];
+        }
+      });
+
+      this.$store.commit("SetInfo", {
+        ...this.info,
+      });
     }
-    // else{
-    //   this.coverInfo={...this.info.coverInfo}
-    // }
   },
-  mounted() {},
+  mounted() {
+    console.log("this.info.coverInfo", this.info.coverInfo);
+  },
   beforeCreate() {}, //生命周期 - 创建之前
   beforeMount() {}, //生命周期 - 挂载之前
   beforeUpdate() {}, //生命周期 - 更新之前
@@ -857,7 +888,8 @@ export default {
       font-size: 14px;
     }
   }
-  .mainVideoBox {
+  .mainVideoBox,
+  .mainImgBox {
     .VideoTit {
       display: flex;
       justify-content: space-between;

packages/qjkankan-editor/src/views/hotspot/EditPanel.vue

@@ -94,10 +94,10 @@
                 icon: 'icon-right',
                 tip: $i18n.t('hotspot.title_right'),
               },
-              {
-                icon: 'icon-mobile',
-                tip: $i18n.t('hotspot.title_custom'),
-              },
+              // {
+              //   icon: 'icon-mobile',
+              //   tip: $i18n.t('hotspot.title_custom'),
+              // },
             ]"
             :activeIdx="currentTitlePositionIdx"
             @select="onSelectTitlePosition"

packages/qjkankan-view/src/components/assembly/Opening.vue

@@ -1,31 +1,63 @@
 <template>
   <!-- 视频 -->
-  <div class="videocon" :class="{ zidxhigh: coverData.coverVideoOrder == 'before' }"
-    v-if="coverData.coverSelect.indexOf('video') > -1 && showVideo" :style="{
+  <div
+    class="videocon"
+    :class="{ zidxhigh: coverData.coverVideoOrder == 'before' }"
+    v-if="coverData.coverSelect.indexOf('video') > -1 && showVideo"
+    :style="{
       backgroundColor: `${coverData.videoColorSelec}`,
-    }">
-    <video v-if="coverData.videoPc" x5-playsinline="true" playsinline="true" webkit-playsinline="true" class="video"
-      ref="openvideo$" preload autoplay :poster="coverData.videoPcIcon"
-      :class="coverData.videoPcLoc == 'center' ? 'contain' : 'cover'" :src="coverData.videoPc"
-      :controls="Boolean(coverData.coverVideoControl)" muted></video>
-    <img v-show="videoPlaying" @click.stop="bofang" class="bofang" :src="require('@/assets/images/default/bofang.png')"
-      alt="" />
+    }"
+  >
+    <video
+      v-if="coverData.videoPc"
+      x5-playsinline="true"
+      playsinline="true"
+      webkit-playsinline="true"
+      class="video"
+      ref="openvideo$"
+      preload
+      autoplay
+      :poster="coverData.videoPcIcon"
+      :class="coverData.videoPcLoc == 'center' ? 'contain' : 'cover'"
+      :src="coverData.videoPc"
+      :controls="Boolean(coverData.coverVideoControl)"
+      muted
+    ></video>
+    <img
+      v-show="videoPlaying"
+      @click.stop="bofang"
+      class="bofang"
+      :src="require('@/assets/images/default/bofang.png')"
+      alt=""
+    />
 
     <div @click.stop="jumpVideo(true)" class="jump">
-      {{ countdownVideo> 0 ? $t('common.jumpTips', { second: countdownVideo }) : $t('common.jump')}}</div>
-
+      {{
+        countdownVideo > 0
+          ? $t("common.jumpTips", { second: countdownVideo })
+          : $t("common.jump")
+      }}
+    </div>
   </div>
 
   <!-- 图片 -->
-  <div class="imgcon" v-if="coverData.coverSelect.toLowerCase().indexOf('img') > -1 && showImg" @click="closeImg"
+  <div
+    class="imgcon"
+    v-if="coverData.coverSelect.toLowerCase().indexOf('img') > -1 && showImg"
+    @click="closeImg"
     :style="{
       backgroundImage: `url(${coverData.coverPc})`,
       backgroundColor: `${coverData.imgColorSelec}`,
-      backgroundSize: coverData.coverPcLoc == 'center' ? 'contain' : 'cover'
-    }">
+      backgroundSize: coverData.coverPcLoc == 'center' ? 'contain' : 'cover',
+    }"
+  >
     <div @click.stop="closeImg" class="jump">
-      {{ countdownImg> 0 ? $t('common.jumpTips', { second: countdownImg }) : $t('common.jump') }}</div>
-
+      {{
+        countdownImg > 0
+          ? $t("common.jumpTips", { second: countdownImg })
+          : $t("common.jump")
+      }}
+    </div>
   </div>
 </template>
 <script setup>
@@ -38,9 +70,11 @@ const { t } = useI18n({ useScope: "global" });
 
 const props = defineProps({
   coverData: {
-    type: [Boolean,Object],
-    default: () => { return {} },
-  }
+    type: [Boolean, Object],
+    default: () => {
+      return {};
+    },
+  },
 });
 const store = useStore();
 const openvideo$ = ref(null);
@@ -57,105 +91,102 @@ const showImg = ref(true);
 const currentScene = computed(() => store.getters["scene/currentScene"]);
 
 const closeImg = (isCall = false) => {
-
   useApp().then((app) => {
     showImg.value = false;
-   
-    if (props.coverData.coverSelect.toLowerCase().indexOf('and') > -1) {
+
+    if (props.coverData.coverSelect.toLowerCase().indexOf("and") > -1) {
       // debugger
-      if (props.coverData.coverVideoOrder == 'later') {
-        showVideo.value = true
-        showVideoDaoji()
+      if (props.coverData.coverVideoOrder == "later") {
+        showVideo.value = true;
+        showVideoDaoji();
       }
-      app.render()
+      app.render();
     } else {
-      app.render()
+      app.render();
     }
   });
-}
+};
 
 const closeVideo = (isCall = false) => {
   useApp().then((app) => {
     showVideo.value = false;
     if (!isCall) {
-      app.render()
+      app.render();
     }
   });
-}
+};
 
-const showImgDaoji = (cb = () => { }) => {
+const showImgDaoji = (cb = () => {}) => {
   timer.value = setInterval(() => {
-    countdownImg.value--
+    countdownImg.value--;
     if (countdownImg.value == 0) {
-      clearInterval(timer.value)
-      timer.value = null
-      cb()
+      clearInterval(timer.value);
+      timer.value = null;
+      cb();
 
-      return
+      return;
     }
   }, 1000);
-}
+};
 
 const showVideoDaoji = (isCall = false) => {
   timer.value = setInterval(() => {
-    countdownVideo.value--
+    countdownVideo.value--;
     if (countdownVideo.value == 0) {
-      clearInterval(timer.value)
-      timer.value = null
-      return
+      clearInterval(timer.value);
+      timer.value = null;
+      return;
     }
   }, 1000);
-}
+};
 
 const jumpVideo = (isCall = false) => {
   closeVideo(isCall);
   if (isCall) {
     // debugger
-    showImg.value = true
-    showImgDaoji(executeImg)
-    
+    showImg.value = true;
+    showImgDaoji(executeImg);
   }
-}
+};
 
 // 执行图片封面
 const executeImg = () => {
   showImgDaoji(() => {
-    closeImg()
-
-  })
-}
-
+    closeImg();
+  });
+};
 
 onMounted(() => {
-  console.log('coverData',unref(props.coverData));
+  console.log("coverData", unref(props.coverData));
   switch (true) {
-    case props.coverData.coverSelect.toLowerCase().indexOf('and') > -1:
-      if (props.coverData.coverVideoOrder == 'before') {
+    case props.coverData.coverSelect.toLowerCase().indexOf("and") > -1:
+      if (props.coverData.coverVideoOrder == "before") {
         // 倒计时结束需要唤起图片
-        showVideoDaoji(true)
-        showImg.value = false
+        showVideoDaoji(true);
+        showImg.value = false;
       } else {
-        showImgDaoji(true)
-        showVideo.value = false
+        showImgDaoji(true);
+        showVideo.value = false;
       }
 
       break;
-    case props.coverData.coverSelect.toLowerCase().indexOf('video') > -1:
-
+    case props.coverData.coverSelect.toLowerCase().indexOf("video") > -1:
+      showVideoDaoji(true);
       break;
-    case props.coverData.coverSelect.toLowerCase().indexOf('img') > -1:
-
+    case props.coverData.coverSelect.toLowerCase().indexOf("img") > -1:
+      showImgDaoji(() => {
+        closeImg();
+      });
       break;
     default:
       break;
   }
   if (props.coverData.coverSelect) {
-
   }
   if (openvideo$.value) {
     openvideo$.value.addEventListener("ended", () => {
       if (props.coverData.coverVideoInWay) {
-        closeVideo()
+        closeVideo();
       }
     });
 
@@ -179,9 +210,7 @@ onMounted(() => {
       false
     );
   }
-
 }),
-
   useApp().then((app) => {
     app.Scene.on("ready", () => {
       if (show.value) {
@@ -210,7 +239,7 @@ onMounted(() => {
 .videocon {
   text-align: center;
 
-  >video {
+  > video {
     max-width: inherit;
     height: auto;
     min-height: 100%;