Explorar o código

feat: 留资标题图片及滚动定位问题处理

zhangyuhan hai 8 meses
pai
achega
aca7c2358d

+ 57 - 2
apps/bigmember_pc/src/components/collect-info/CollectInfo.vue

@@ -2,10 +2,22 @@
   <div class="collect-info">
     <div class="user-data-dialog" v-if="showForm">
       <div class="mask"></div>
-      <div class="dialog-container">
+      <div class="dialog-container" :class="{ 'use-bg': useImgBg.use }">
+        <div class="dialog-header--use-bg" v-if="useImgBg.use">
+          <img
+            class="dialog-header-img--bg"
+            :src="useImgBg.bg"
+            :alt="dialogTitleTop"
+          />
+          <img
+            class="dialog-header-img--title"
+            :src="useImgBg.title"
+            :alt="dialogTitleTop"
+          />
+        </div>
         <div
           class="dialog-header fs18"
-          v-if="dialogTitleTop"
+          v-if="dialogTitleTop && !useImgBg.use"
           v-text="dialogTitleTop"
         ></div>
         <div
@@ -683,6 +695,23 @@ export default {
       var zjl = this.form.job.indexOf('总经理') > -1
       return !(zc || zjl) && this.form.job
     },
+    useImgBg() {
+      const result = {
+        use: false,
+        bg: '/common-module/pc-dialog/image/data-leave-info-header-bg.png',
+        title: ''
+      }
+      switch (this.source) {
+        case 'pc_Interfacedirectory_apply': {
+          result.use = true
+          result.title =
+            '/common-module/pc-dialog/image/title/api-leave-title-text.png'
+          break
+        }
+      }
+
+      return result
+    },
     successText: function () {
       // 没有_freeuser后缀的体验1次的source,需要走_freeuser的逻辑
       const _freeuserList = ['ent_portrait_bidInfoDesc'].concat([
@@ -1388,7 +1417,33 @@ export default {
     z-index: 3000;
     box-sizing: border-box;
     //overflow-y: auto;
+
+    &.use-bg {
+      padding-top: 74px;
+    }
   }
+
+  .dialog-header--use-bg {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    transform: translateY(-116px);
+    z-index: -1;
+
+    .dialog-header-img-- {
+      &bg {
+      }
+      &title {
+        margin-top: -98px;
+        height: 28px;
+      }
+    }
+  }
+
   .dialog-header {
     color: #1d1d1d;
     font-size: 16px;

+ 16 - 12
apps/bigmember_pc/src/views/api-doc/index.vue

@@ -590,7 +590,15 @@ function doSelectTab(item) {
   const goElement = document.querySelector(
     '.base-card--doc[name="' + item.label + '"]'
   )
-  scrollToTop(goElement, 60)
+  let diff = 80
+  try {
+    if (headerNavMini._headerNavFixedHeight) {
+      diff += headerNavMini._headerNavFixedHeight
+    }
+  } catch (e) {
+    console.warn(e)
+  }
+  scrollToTop(goElement, diff)
 }
 
 // 打开留资弹窗
@@ -810,8 +818,11 @@ function goExCode() {
 
                 <div v-if="apiReqInfo.remark" class="mt-12px color-desc">
                   注:{{ apiReqInfo.remark }},
-                  <span class="color-link go-ex-code" @click="goExCode"
-                    >点击查看初始化代码。</span
+                  <a
+                    class="color-link go-ex-code"
+                    href="/common-module/doc-icon/code.xlsx"
+                    download="剑鱼标讯-数据接口初始化代码表.xlsx"
+                    >点击查看初始化代码。</a
                   >
                 </div>
               </div>
@@ -843,7 +854,7 @@ function goExCode() {
               >
                 <el-carousel
                   :initial-index="previewImgActiveIndex"
-                  :interval="5000"
+                  :interval="3000"
                   :autoplay="true"
                   :style="{
                     height: imgHeight + 'px'
@@ -897,14 +908,7 @@ function goExCode() {
                   </el-table-column>
                   <el-table-column
                     align="center"
-                    width="160"
-                    label="字段说明"
-                    prop="s_explain"
-                  >
-                  </el-table-column>
-                  <el-table-column
-                    align="center"
-                    width="160"
+                    width="220"
                     label="备注"
                     prop="s_remark"
                   >