✨ feat: 动态设置门店文字颜色

src/components/ThemeDataPlant.vue

@@ -55,13 +55,14 @@ export default {
   mounted() {
     this.bacImage = `url(${this.pageSettingData.backgroundImage})`;
     this.imgRgb = `${this.pageSettingData.backgroundColor}`;
+    this.mpApp.setStoreAddrColor(this.imgRgb);
   },
   computed: {
 
   },
   methods: {
     setHomeBgImg({ backgroundImage, imgRgb }) {
-      // this.bacImage = backgroundImage;
+      this.mpApp.setStoreAddrColor(imgRgb);
       if (this.pageCode != 1) return;
       this.bacImage = "";
       this.imgRgb = imgRgb;

src/components/common/StoreAddr.vue

@@ -4,7 +4,9 @@
       <div class="logo">
         <image :src="logoUrl" alt=""></image>
       </div>
-      <div class="contentInfo flex" v-if="name != ''">
+      <div class="contentInfo flex" v-if="name != ''" :style="{
+          'color': imgRgb,
+        }">
         <p class="info">{{ name }}</p>
         <p class="addr" v-if="distanceForXinHua">{{ distanceForXinHua | formatDistance}}</p>
         <p class="change"><i class="ant-fanhui-line"></i></p>
@@ -36,9 +38,11 @@ export default {
       logoUrl: "",
       openThousandsStoresFlag: false,
       distanceForXinHua: 0,
+      imgRgb: "",
     };
   },
   async onLoad() {
+    this.mpApp.setStoreAddrColor = this.setStoreAddrColor;
     try {
       this.getLocationHandle(() => {
         this.$emit("toUpdate");
@@ -63,6 +67,9 @@ export default {
   computed: {
   },
   methods: {
+    setStoreAddrColor(imgRgb) {
+      this.imgRgb = imgRgb;
+    },
     reloadName() {
       let { offlineShopName } = getStoreInfo();
       this.name = decodeURI(offlineShopName) || "";
@@ -135,23 +142,25 @@ export default {
     align-items: center;
 
     .contentInfo {
+      height: 0;
+      background-color: currentColor;
       align-items: center;
+      p{
+        filter: grayscale(1) contrast(999) invert(1);
+      }
 
       .info {
         font-size: 14px;
-        color: #333;
         flex: 1;
       }
       .addr{
         font-size: 12px;
         margin-left: 4px;
-        color: #333;
       }
 
       .change {
         flex-shrink: 0;
         padding-left: 6px;
-        color: #333;
         font-size: 14px;
         align-items: center;
         i{

src/main.js

@@ -106,7 +106,9 @@ mpApp.openSelectGoods = function () { }
 // 打开选择商品规格(2B)弹窗
 mpApp.openTwoBAddCart = function () { }
 // 动态设置首页背景图片
-mpApp.setHomeBgImg = function () {}
+mpApp.setHomeBgImg = function () { }
+// 动态设置导航栏颜色
+mpApp.setStoreAddrColor = function () {}
 
 /**
  * 组件点击行为收集