style: 修复移动端首页ios滚动错位问题

apps/mobile/src/components/message/message-card.vue

@@ -18,7 +18,6 @@
         >
           <div
             class="message-item"
-            style="height: 24px"
             v-for="(item, index) in list"
             :key="index"
             :class="{ visited: item.visited }"
@@ -50,6 +49,7 @@ import { dateMatter } from '@/utils/date'
 import { appCallReloadTab } from '@/utils/callFn/appFn'
 import { callChangeTab, openLinkOfOther } from '@/utils'
 import { mapGetters } from 'vuex'
+import { vw2px, px2viewport } from '@/utils'
 
 // const MSG_TYPE = ['活动通知', '服务通知', '订阅消息', '项目动态', '企业动态', '分析报告', '系统通知', '剑鱼学堂', '商机情报']
 
@@ -114,15 +114,17 @@ export default {
     },
     startScrolling() {
       const offsetY = 24
+      const offsetYvw = px2viewport(offsetY)
+      const offsetYPx = vw2px(offsetYvw)
       let listItem
       if (this.$refs.listItem) {
         listItem = this.$refs.listItem[1] // 列表项高度
       } else {
         listItem = {
-          offsetHeight: offsetY
+          offsetHeight: offsetYPx
         }
       }
-      const listItemHeight = (listItem?.offsetHeight || offsetY) * 2
+      const listItemHeight = (listItem?.offsetHeight || offsetYPx) * 2
       this.groupHeight = (this.list.length / 2) * listItemHeight
       this.scrollInterval = setInterval(() => {
         this.offsetHeight += listItemHeight // 每次滚动的距离，根据需求调整
@@ -270,9 +272,8 @@ export default {
   align-items: flex-start;
   justify-content: space-between;
   background-color: #ffffff;
-  margin-top: 2px;
   padding: 0 16px;
-  height: 52px;
+  height: 48px;
   overflow: hidden;
   &.have-one {
     align-items: center;
@@ -285,6 +286,7 @@ export default {
     display: flex;
     flex-direction: row;
     align-items: center;
+    height: 24px;
     line-height: 24px;
     &.visited {
       .dot {