底部迁移

src/components/ThemeDataPlant.vue

+<template>
+  <div
+    ref="ThemeDataPlant"
+    class="ThemeDataPlant"
+    :style="{
+      'background-color': pageSettingData.backgroundColor,
+      'background-image':bacImage,
+      'background-repeat':pageSettingData.backgroundFit == 'repeat' ? 'repeat' : 'no-repeat',
+      'position':pageSettingData.backgroundImageLock ? 'fixed' : 'absolute',
+      }"
+  >
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+  },
+  components : {
+    // 'area-navigation' : () => import('~/components/theme/components/other/area-navigation')
+  },
+  data() {
+    return {
+      flag: false,
+      render: true,
+      pageInfo:{},
+      pageData:{},
+      pageSettingData:{},
+      bacImage:""
+    };
+  },
+  created(){
+    if (this.mpApp.globalData.pageList) {
+        this.pageInfo = this.mpApp.globalData.pageList.filter((item) => item.pageCode == 1)[0];
+        this.pageSettingData = JSON.parse(this.pageInfo.pageSettingData);
+        console.log(this.pageInfo.pageSettingData,'kl')
+    }
+  },
+  mounted(){
+    this.bacImage = `url(${this.pageSettingData.backgroundImage})`
+  },
+  computed:{
+  }
+
+};
+</script>
+
+<style lang="scss" scoped>
+.ThemeDataPlant {
+  width:100%;
+  height: 100%;
+  position: absolute;
+}
+.ThemeDataPlant::before {
+  content: " ";
+  // position: var(--lock);
+  z-index: -1;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  // background-color: var(--bg_color);
+  // background-image: var(--image);
+  // background-repeat: var(--repeat);
+  background-size: 100% auto;
+}
+</style>

src/components/bottomCont.vue

+<template>
+  <div class="bottomCont">
+      <div class="bc1 flex">
+        <i></i>
+        <p @click="showVConsoles">底线在此，不能更低了</p>
+        <i></i>
+      </div>
+      <div class="bc2">
+        <img :src="shopInfo.logoUrl" alt />
+      </div>
+      <div class="bc3">
+        <!-- 送颂 -->
+        <p v-if="shopInfo.shopCode=='songsong'" @click="showCookie">送颂科技提供技术支持</p>
+        <!-- 嗨有料 -->
+        <p v-else-if="shopInfo.shopCode=='HYL' || shopInfo.shopCode=='Id9uwD' " @click="showCookie"></p>
+        <!-- <p
+          v-else-if="Array.isArray(this.$store.state.sceneModule.songCopyright)"
+          @click="showCookie"
+        >{{this.$store.state.sceneModule.songCopyright.some(item=>item==shopInfo.shopCode)?'送颂科技提供技术支持':'小工蚁(上股交N板企业300258)提供平台服务'}}</p> -->
+      </div>
+      <div class="height7"></div>
+  </div>
+</template>
+
+<script type="text/ecmascript-6">
+import { DFSImg } from "@/utils/index";
+export default {
+  data() {
+    return {
+      shopInfo: {
+        logoUrl:''
+      },
+    };
+  },
+  created(){
+    this.shopInfo = this.mpApp.globalData.shopInfo
+    this.shopInfo.logoUrl = DFSImg(this.shopInfo.logoUrl, 400, 400)
+    console.log(this.shopInfo,'mpapp123')
+  },
+  onLoad() {
+  },
+  onShow(){
+  },
+  methods:{
+    showCookie(){
+
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .bottomCont {
+    width: 100%;
+    position: absolute;
+    padding: 10px 0;
+    z-index:10;
+    div {
+      width: 70%;
+      margin: 0 auto;
+      text-align: center;
+      color: #999;
+      font-size: 13px;
+    }
+    .bc1 {
+      justify-content: space-between;
+      align-items: center;
+      i {
+        width: 15%;
+        height: 1px;
+        background: #c3c3c3;
+      }
+    }
+    .bc2 {
+      width: 64px;
+      height: 64px;
+      margin-top: 20px;
+      margin-bottom: 10px;
+      img {
+        width: 100%;
+        height: 100%;
+        object-fit: contain;
+      }
+    }
+    .height7{
+      width:100%;
+      height: 50px;
+    }
+  }
+</style>

src/pages/home/index.vue

@@ -3,20 +3,24 @@
     <view class="ant-daipinglun">1</view>
     <!-- <goods-list id="goodsList"></goods-list> -->
     <scroll-view @scroll="scrolls" @scrolltolower="scrolltolower" style="height:100vh;" scroll-y="true">
-      <div v-for="(item,index) in pageData" :key="index">
-        <div v-if="item.componentCode=='banner'">
-          <banner :datas="item"></banner>
-        </div>
-        <div v-else-if="item.componentCode=='goods-list'" style="height:100%;">
-          <goods-list class="goodsListItem" :datas="item"></goods-list>
-        </div>
-        <div v-else-if="item.componentCode == 'area-navigation'">
-          <area-navigation :datas="item"></area-navigation>
-        </div>
-        <div v-else-if="item.componentCode == 'cube-nav'">
-          <cube-nav :datas="item"></cube-nav>
+      <div style="position:relative">
+        <ThemeDataPlant></ThemeDataPlant>
+        <div v-for="(item,index) in pageData" :key="index">
+          <div v-if="item.componentCode=='banner'">
+            <banner :datas="item"></banner>
+          </div>
+          <div v-else-if="item.componentCode=='goods-list'" style="height:100%;">
+            <goods-list class="goodsListItem" :datas="item"></goods-list>
+          </div>
+          <div v-else-if="item.componentCode == 'area-navigation'">
+            <area-navigation :datas="item"></area-navigation>
+          </div>
+          <div v-else-if="item.componentCode == 'cube-nav'">
+            <cube-nav :datas="item"></cube-nav>
+          </div>
         </div>
       </div>
+      <bottomCont></bottomCont>
     </scroll-view>
     <!-- <image
       src="http://cdn.mayi888.com/public/jpg/33ff0efc-96b5-4044-a65a-07799dfe98e1.jpg?x-oss-process=image/resize,limit_1,w_750"
@@ -35,9 +39,15 @@
 </template>
 
 <script>
-import { setTabBarActive, checkTabbarPage } from "../../utils/mayi.js";
+import { setTabBarActive, checkTabbarPage } from "../../utils/mayi.js"
+import bottomCont from "../../components/bottomCont"
+import ThemeDataPlant from "../../components/ThemeDataPlant"
 
 export default {
+  components: {
+    bottomCont,
+    ThemeDataPlant
+  },
   data() {
     return {
       pageInfo: {},
@@ -81,4 +91,4 @@ export default {
   /* text-align: center; */
   /* padding-top: 50%; */
 }
-</style>
\ No newline at end of file
+</style>