Merge branch 'master' of http://192.168.0.115:3000/renyicun/NanjingMuseumWuJinZang

README.md

@@ -6,7 +6,7 @@
 ## 任一存的todos
 
 ### bug fix
-邵总
+内容扩展页 左侧有空白
 
 ### 优化
 内容扩展页 按钮边框 上下空间大小不对称
@@ -15,8 +15,6 @@
 
 内容扩展页 操作提示文字竖着
 
-开始按钮位置 不同屏幕里适配
-
 ### 保存成果
 组件：序列帧
 

src/views/MoreContent.vue

@@ -294,7 +294,7 @@ const { haveSwipedThisTime, translateLength, currentAnchorIdx } = useSmoothSwipe
     maxTranslateLength.value * 967 / windowWidthDesign - windowWidth.value / 2,
     maxTranslateLength.value - windowWidth.value
   ],
-  initialAnchorIdx: Number(route.query.anchorIdx)
+  initialAnchorIdx: Number(route.query.anchorIdx) || 0
 })
 
 const bgInitialLeft = 0

src/views/PaintingDetail.vue

@@ -8,7 +8,7 @@
     >
       <img
         class="painting-border"
-        src="@/assets/images/painting-border.png"
+        src="@/assets/images/painting-border-new.png"
         alt=""
         draggable="false"
       >
@@ -219,8 +219,8 @@ onUnmounted(() => {
 /**
  * 尺寸相关
  */
-const paintingWrapWidth = ref(329)
-const paintingWrapHeight = ref(561)
+const paintingWrapWidth = ref(268)
+const paintingWrapHeight = ref(426)
 let wrapSizeRatio = paintingWrapWidth.value / paintingWrapHeight.value
 if (wrapSizeRatio < 1) {
   wrapSizeRatio = 1 / wrapSizeRatio
@@ -281,8 +281,8 @@ function showBigPainting() {
     >.painting-wrap-2{
       position: absolute;
       left: 50%;
-      top: 50%;
-      transform: translate(-50%, -50%);
+      top: calc(110 / v-bind('windowSizeWhenDesignForRef') * v-bind('windowSizeInCssForRef'));
+      transform: translate(-50%, 0);
       width: calc(v-bind('paintingWrapWidth') / v-bind('windowSizeWhenDesignForRef') * v-bind('windowSizeInCssForRef'));
       height: calc(v-bind('paintingWrapHeight') / v-bind('windowSizeWhenDesignForRef') * v-bind('windowSizeInCssForRef'));
       overflow: auto;

src/views/PaintingList.vue

@@ -59,6 +59,7 @@
             width: expandedAgeNameList.has(ageName) ? getHiddenContentWidth(paintingGroup, ageName) : '0',
           }"
         >
+          <div class="shadow" />
           <div
             v-if="ageName === '宋'"
             class="special-desc"
@@ -373,6 +374,15 @@ const unwatch = watch(menuElScrollLeft, (v) => {
         background-image: url(@/assets/images/bg-paper.jpg);
         background-size: auto 100%;
         background-repeat: repeat;
+        position: relative;
+        >.shadow{
+          position: absolute;
+          bottom: 0;
+          left: 0;
+          width: 100%;
+          height: calc(223 / v-bind('windowSizeWhenDesignForRef') * v-bind('windowSizeInCssForRef'));
+          background: linear-gradient( 360deg, rgba(0, 0, 0, 0.2) 0%, rgba(0,0,0,0) 100%);
+        }
         >.special-desc{
           flex: 0 0 auto;
           align-self: center;

src/views/StartupView.vue

@@ -33,8 +33,8 @@
       class="btn-start"
       :class="isStartBtnBlink ? 'animation-show-hide' : ''"
       :image-src="require(`@/assets/images/btn-start.png`)"
-      :total-width="864"
-      :height="72"
+      :total-width="864 / windowSizeWhenDesignForRef * windowSizeInCssForRef.substring(0, windowSizeInCssForRef.length - 2)"
+      :height="72 / windowSizeWhenDesignForRef * windowSizeInCssForRef.substring(0, windowSizeInCssForRef.length - 2)"
       :frame-number="12"
       :loop="false"
       @over="isStartBtnBlink = true"
@@ -148,10 +148,8 @@ function onVideoEnd() {
   >.btn-start{
     position: absolute;
     left: 50%;
-    bottom: calc(75 / v-bind('windowSizeWhenDesignForRef') * v-bind('windowSizeInCssForRef'));
+    bottom: calc(70 / v-bind('windowSizeWhenDesignForRef') * v-bind('windowSizeInCssForRef'));
     transform: translateX(-48%);
-    width: calc(72 / v-bind('windowSizeWhenDesignForRef') * v-bind('windowSizeInCssForRef'));
-    height: calc(72 / v-bind('windowSizeWhenDesignForRef') * v-bind('windowSizeInCssForRef'));
   }
 
   >video.transition-video{