fix(样式): 修复生产环境产物样式不生效的问题

App.vue

@@ -67,6 +67,7 @@
 			// 主题风格
 			if (uni.getStorageSync('themeStyle')) {
 				this.$store.commit('setThemeStyle', configExternal.loadThemeSync(uni.getStorageSync('themeStyle')));
+				this.$store.dispatch('themeColorSet');
 			}
 
 			// 插件是否存在

common/js/config-external.js

@@ -111,6 +111,7 @@ class ConfigExternal {
     try {
       // 动态加载主题配置
       const themeData = require(`@/common/js/style_color.js`)['default'][theme];
+      console.log('sync themeData => ', themeData);
       this.loadedConfigs[`theme_${theme}`] = themeData;
       return themeData;
     } catch (error) {
@@ -136,7 +137,8 @@ class ConfigExternal {
     this.loadPromises[`theme_${theme}`] = new Promise((resolve, reject) => {
       try {
         // 动态加载主题配置
-        const themeData = require(`@/common/js/style_color.js`)[theme];
+        const themeData = require(`@/common/js/style_color.js`)['default'][theme];
+        console.log('async themeData => ', themeData);
         this.loadedConfigs[`theme_${theme}`] = themeData;
         resolve(themeData);
       } catch (error) {

common/js/golbalConfig.js

@@ -1,21 +1,8 @@
 export default {
-	data() {
-		return {
-			// 页面样式，动态设置主色调
-			themeColor: '' //''--base-color:#fa5d14;--base-help-color:#ff7e00;'
-		}
-	},
 	onLoad() { },
 	onShow() {
 		// 刷新多语言
 		this.$langConfig.refresh();
-		let time = setInterval(() => {
-			let theme = this.themeStyle;
-			if (theme && theme.main_color) {
-				this.themeColorSet();
-				clearInterval(time);
-			}
-		}, 50);
 	},
 	computed: {
 		// 是否是英文环境
@@ -25,6 +12,9 @@ export default {
 		themeStyle() {
 			return this.$store.state.themeStyle;
 		},		
+		themeColor() {
+			return this.$store.state.themeColor;
+		},
 		// 插件是否存在
 		addonIsExist() {
 			return this.$store.state.addonIsExist;
@@ -111,25 +101,7 @@ export default {
 		}
 	},
 	methods: {
-		themeColorSet() {
+
-			let theme = this.themeStyle;
-			this.themeColor = `--base-color:${theme.main_color};--base-help-color:${theme.aux_color};`;
-			if (this.tabBarHeight != '56px') this.themeColor += `--tab-bar-height:${this.tabBarHeight};`
-			Object.keys(theme).forEach(key => {
-				let data = theme[key];
-				if (typeof (data) == "object") {
-					Object.keys(data).forEach(k => {
-						this.themeColor += '--' + k.replace(/_/g, "-") + ':' + data[k] + ';';
-					});
-				} else if (typeof (key) == "string" && key) {
-					this.themeColor += '--' + key.replace(/_/g, "-") + ':' + data + ';';
-				}
-			});
-			for (let i = 9; i >= 5; i--) {
-				let color = this.$util.colourBlend(theme.main_color, '#ffffff', (i / 10));
-				this.themeColor += `--base-color-light-${i}:${color};`;
-			}
-		},
 		// 颜色变浅（>0）、变深函数（<0）
 		lightenDarkenColor(color, amount) {
 

common/js/lang.js

@@ -72,7 +72,7 @@ export default {
 			//当前页面语言包（同步加载）
 			let route = _this.route;
 			let langPath = processRoutePath(route);
-			console.log(`当前页面语言包路径: ${langPath}`);
+			// console.log(`当前页面语言包路径: ${langPath}`);
 			
 			// 加载当前页面语言包
 			let currentPageLang = loadLangPackSync(locale, langPath);
@@ -113,7 +113,7 @@ export default {
 		if (value == undefined || (value == 'title' && field == 'title')) value = ''; // field
 
 		// 多语言调试，注释后可以关闭控制台输出
-		console.log(`字段: ${field}, 值: ${value}`)
+		// console.log(`字段: ${field}, 值: ${value}`)
 		return value;
 	},
 	/**

lang/zh-cn/goods/detail.js

@@ -2,7 +2,7 @@ export const lang = {
 	//title为每个页面的标题
 	title: '',
 	select: '选择',
-	details:'商品详情',
+	details:'资源详情',
 	params: '参数',
 	service: '商品服务',
 	allGoods: '全部商品',

pages.json

@@ -43,7 +43,7 @@
 				{
 					"path": "detail",
 					"style": {
-						"navigationBarTitleText": "商品详情"
+						"navigationBarTitleText": "资源详情"
 					}
 				},
 				{

pages_goods/cart.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view class="container">
 			<scroll-view class="scroll-view" :scroll-y="true" :show-scrollbar="false" :refresher-enabled="true" :refresher-triggered="refresherTriggered" @refresherrefresh="onRefresh">
 				<block v-if="hasData">

pages_goods/category.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<block v-if="diyData">
 			<block v-for="(item, index) in diyData.value" :key="index">
 				<view v-if="item.componentName == 'GoodsCategory'">

pages_goods/detail.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<!-- #ifndef H5 -->
 	<!-- 	<view class="page-header" v-if="goodsSkuDetail && goodsSkuDetail.config && goodsSkuDetail.config.nav_bar_switch == 0">
 			<ns-navbar :data="navbarData" :isBack="true"></ns-navbar>

pages_order/detail_local_delivery.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<loading-cover ref="loadingCover"></loading-cover>
 	</view>
 </template>

pages_order/detail_pickup.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<loading-cover ref="loadingCover"></loading-cover>
 	</view>
 </template>

pages_order/payment.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<common-payment :api="api" create-data-key="orderCreateData" ref="payment"></common-payment>
 	</view>
 </template>

pages_promotion/fenxiao/child_fenxiao.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<mescroll-uni ref="mescroll" @getData="getData" top="0" class="member-point" :size="8" v-if="storeToken">
 			<block slot="list">
 				<view class="team-li" v-for="(item, index) in teamList" :key="index" v-if="teamList.length != 0" @click="toFenxiaoOrder(item)">

pages_promotion/fenxiao/order.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view class="withdraw-cate">
 			<block v-for="(item, index) in category" :key="index">
 				<view @click="selectCate(item.id)" class="cate-li" :class="{ 'active color-base-text color-base-bg-before': selectId == item.id }">{{ item.name }}</view>

pages_promotion/fenxiao/order_detail.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view class="order-detail">
 			<view class="order-detail-box">
 				<view class="header">

pages_promotion/fenxiao/relation.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<mescroll-uni ref="mescroll" @getData="getData" top="20" class="member-point" :size="8" v-if="storeToken">
 			<view class="goods_list" slot="list">
 				<view class="order-list">

pages_promotion/fenxiao/team.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view class="team-cate" v-if="storeToken && levelNum > 1">
 			<block v-for="(item, index) in levelList" :key="index">
 				<view class="cate-li" :class="{ 'active color-base-text color-base-border': currentLevel == item.level }" @click="selectLevel(item.level)">{{ item.name }}</view>

pages_promotion/fenxiao/withdraw_list.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<mescroll-uni @getData="getData" class="member-point">
 			<view slot="list">
 				<block v-if="withdrawList.length">

pages_promotion/fenxiao/withdrawal_detail.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view class="money-wrap">
 			<text>-{{ detail.money }}</text>
 		</view>

pages_promotion/merch/merchcategory.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view class="category-page-wrap category-template-1" style="height: calc(-56px + 100vh);">
 
 		<!-- 	<view class="search-box" @click="$util.redirectTo('/pages_tool/goods/search')">

pages_promotion/point/detail.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view scroll-y="true" class="goods-detail" :class="isIphoneX ? 'active' : ''">
 			<view class="goods-container">
 				<view class="goods-media">

pages_tool/article/list.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<mescroll-uni @getData="getData" ref="mescroll">
 			<block slot="list">
 				<view class="article-wrap" v-if="list.length">

pages_tool/contact/contact.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view class="about w100">
 			<view class="bg border-top"></view>
 			<view class="list_cotact padding-top">

pages_tool/goods/coupon.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view class="cf-container color-line-border">
 			<view class="tab">
 				<view @click="changeSort(1)"><text :class="sort == 1 ? 'color-base-text active color-base-border-bottom' : ''">全部</text></view>

pages_tool/goods/search.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view class="content">
 			<view class="cate-search">
 				<view class="search-box" @click="search()" @tap.stop="search()">

pages_tool/member/account.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<mescroll-uni ref="mescroll" @getData="getData" v-if="storeToken">
 			<block slot="list">
 				<view class="nc-info-list-content">

pages_tool/member/address.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<mescroll-uni ref="mescroll" @getData="getListData" v-if="storeToken">
 			<block slot="list">
 				<view class="address-list">

pages_tool/member/balance_detail.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<!-- 		<scroll-view id="tab-bar" class="order-nav" :scroll-x="true" :show-scrollbar="false" :scroll-into-view="scrollInto">
 			<view v-for="(statusItem, statusIndex) in statusList" :key="statusIndex" class="uni-tab-item" :id="statusItem.id" :data-current="statusIndex" @click="ontabtap">
 				<text class="uni-tab-item-title" :class="statusIndex == orderStatus ? 'uni-tab-item-title-active' : ''">{{ statusItem.name }}</text>

pages_tool/member/collection.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<mescroll-uni ref="mescroll" @getData="getData" class="member-point" :size="8" @listenRefresh="listenRefresh" v-if="storeToken">
 			<view class="goods_list" slot="list">
 				<block v-if="collectionList.length > 0">

pages_tool/member/info.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view v-if="indent == 'all' && memberInfo" class="info-wrap">
 			<!-- 头像@click="headImage" -->
 			<view  class="info-list-cell info-item info-list-con" hover-class="cell-hover">

pages_tool/member/info_edit.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<template v-if="memberInfo">
 			<!-- 修改用户名 -->
 			<view v-if="indent == 'username'" class="edit-info">

pages_tool/member/invite_friends.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view v-if="info" style="background-color: #fff;">
 
 			<view class="invite_adv">

pages_tool/member/point_detail.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 	<!-- 	<view class="tab color-bg">
 			<view class="tab-left">
 				<picker mode="date" :value="searchType.date" @change="bindDateChange" fields="month">

pages_tool/member/withdrawal.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<mescroll-uni @getData="getData" class="member-point">
 			<view slot="list">
 				<block v-if="dataList.length">

pages_tool/member/withdrawal_detail.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view class="money-wrap">
 			<text>-{{ detail.apply_money }}</text>
 		</view>

pages_tool/notice/list.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<mescroll-uni @getData="getData" ref="mescroll">
 			<block slot="list">
 				<view class="notice-list" v-if="dataList.length">

pages_tool/order/detail_virtual.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<loading-cover ref="loadingCover"></loading-cover>
 	</view>
 </template>

pages_tool/order/evaluate.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view>
 			<view class="page">
 				<block v-for="(item, index) in goodsList" :key="index">

pages_tool/order/logistics.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<scroll-view class="order-nav" :scroll-x="true" :show-scrollbar="false">
 			<view v-for="(packageItem, packageIndex) in packageList" :key="packageIndex" class="uni-tab-item" @click="ontabtap(packageIndex)">
 				<text class="uni-tab-item-title" :class="packageIndex == currIndex ? 'uni-tab-item-title-active color-base-border  color-base-text' : ''">

pages_tool/order/refund.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view>
 			<scroll-view scroll-y="true" class="refund-container">
 				<view class="goods-wrap">

pages_tool/order/refund_batch.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view>
 			<scroll-view scroll-y="true" class="refund-container">
 				<view class="goods-wrap" v-for="(item,index) in refund_data.order_goods_info" :key="index">

pages_tool/order/refund_detail.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<scroll-view scroll-y="true" class="detail-container" :class="{ 'safe-area': isIphoneX }" v-if="detail">
 			<view v-show="action == ''">
 				<view class="status-wrap">

pages_tool/order/refund_type_select.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view>
 			<view class="refund-option">
 				<view class="option-item" @click="selectRefundType(1)">

pages_tool/storeclose/storeclose.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view class="closeBox">
 			<image :src="$util.img('public/uniapp/store/storeclose.png')" mode="widthFix"></image>
 			<text class="close-title">{{ textVal }}</text>

pages_tool/vr/index.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view class="iconfont iconshang navigate-back" @click="navigateBack"></view>
 		<web-view :src="src"></web-view>
 	</view>

pages_tool/webview/webview.vue

@@ -1,6 +1,6 @@
 <template>
 	<page-meta :page-style="themeColor"></page-meta>
-	<view>
+	<view :style="themeColor">
 		<view class="iconfont iconshang navigate-back" @click="navigateBack"></view>
 		<web-view :src="src"></web-view>
 

store/index.js

@@ -5,6 +5,7 @@ Vue.use(Vuex)
 import Http from '../common/js/http.js'
 import { themeConfig } from '../common/js/config-external.js'
 import configExternal from '../common/js/config-external.js'
+import util from '../common/js/util.js'
 
 const store = new Vuex.Store({
 	state: {
@@ -14,6 +15,7 @@ const store = new Vuex.Store({
 		tabBarList: '',
 		siteState: 1,
 		themeStyle: '',
+		themeColor: '',
 		addonIsExist: {
 			bundling: 0,
 			coupon: 0,
@@ -236,6 +238,10 @@ const store = new Vuex.Store({
 		// 设置AI未读消息数量
 		setAiUnreadCount(state, value) {
 			state.aiUnreadCount = value;
+		},
+		// 设置主题颜色
+		setThemeColor(state, value) {
+			state.themeColor = value;
 		}
 	},
 	getters: {
@@ -253,6 +259,7 @@ const store = new Vuex.Store({
 						var data = res.data;
 						if (data) {
 							this.commit('setThemeStyle', configExternal.loadThemeSync(data.style_theme?.name));
+							this.dispatch('themeColorSet');
 
 							// 底部导航
 							this.commit('setTabBarList', data.diy_bottom_nav);
@@ -401,6 +408,34 @@ const store = new Vuex.Store({
 
 			this.commit('setCartIds', ids);
 
+		},
+		// 生成主题颜色CSS变量
+		themeColorSet() {
+			console.log('样式颜色设置...');
+			let theme = this.state.themeStyle;
+			if (!theme?.main_color || !theme?.aux_color) return;
+			try {
+				let themeColor = `--base-color:${theme.main_color};--base-help-color:${theme.aux_color};`;
+				if (this.state.tabBarHeight != '56px') themeColor += `--tab-bar-height:${this.state.tabBarHeight};`
+				Object.keys(theme).forEach(key => {
+					let data = theme[key];
+					if (typeof (data) == "object") {
+						Object.keys(data).forEach(k => {
+							themeColor += '--' + k.replace(/_/g, "-") + ':' + data[k] + ';';
+						});
+					} else if (typeof (key) == "string" && key) {
+						themeColor += '--' + key.replace(/_/g, "-") + ':' + data + ';';
+					}
+				});
+				for (let i = 9; i >= 5; i--) {
+					let color = util.colourBlend(theme.main_color, '#ffffff', (i / 10));
+					themeColor += `--base-color-light-${i}:${color};`;
+				}
+				this.commit('setThemeColor', themeColor);
+			} catch (e) {
+				console.error('设置主题颜色失败', e);
+			}
+			console.log('themeColor => ', this.state.themeColor);
 		}
 	}
 })