Uniapp/lucky_shop
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

fix(diy-recommend-code): Horizontal 风格立即分享按钮改黄橙渐变胶囊

Browse Source 
之前后端 diyData.buttonBgColor 默认 #E4393C 覆盖了 Horizontal 风格的
`linear-gradient(90deg,#FF9800 0%,#FF4444 100%)` 默认值，导致「立即分享」
按钮显示为红色实心，与设计参考图不一致。

调整内容：
- 立即分享按钮固定走 linear-gradient(90deg,#FFC107 0%,#FF8F00 100%)
  不再读 diyData.buttonBgColor（与 Gradient 风格保持统一）
- 阴影色从 rgba(255,68,68,...) 改为 rgba(255,143,0,...) 与渐变色一致
- H5 端 view fallback 同步（与 Card / Gradient 风格统一处理）

影响范围：仅 Horizontal 横向风格（stylePreset === 'horizontal'）。
This commit is contained in:
ZF Sun
2026-08-07 17:24:31 +08:00
parent 1420b7435e
commit 7f4b1d6d13
1 changed files with 7 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
components-diy/diy-recommend-code.vue
View File

@@ -270,10 +270,14 @@
<text style="font-size:22rpx;">📋</text> <text style="font-size:22rpx;">📋</text>
<text :style="{ fontSize: '24rpx', color: value.codeColor || '#FF8F00', fontWeight: '600' }">复制推荐码</text> <text :style="{ fontSize: '24rpx', color: value.codeColor || '#FF8F00', fontWeight: '600' }">复制推荐码</text>
</view> </view>
<!-- 右下角：立即分享链接按钮（渐变橙色圆角胶囊，靠右，触发微信原生分享） --> <!-- 右下角：立即分享链接按钮（黄橙渐变胶囊，靠右，触发微信原生分享）
<button v-if="value.showShareButton !== false" open-type="share" @tap="onShareClick" :style="{ height: '72rpx', display: 'flex', justifyContent: 'center', alignItems: 'center', background: (value.buttonBgColor && /^#[0-9a-f]{3,8}$/i.test(value.buttonBgColor)) ? value.buttonBgColor : 'linear-gradient(90deg,#FF9800 0%,#FF4444 100%)', borderRadius: '36rpx', padding: '0 40rpx', boxShadow: '0 4rpx 12rpx rgba(255,68,68,0.25)', marginBottom: '-4rpx', border: 'none', lineHeight: '1' }"> H5 端用 view 触发，小程序/APP 端保留 button 以触发 open-type=share -->
<text :style="{ fontSize: '27rpx', fontWeight: '700', color: value.buttonTextColor || '#FFFFFF' }">📤 {{ value.buttonText || '立即分享' }}</text> <button v-if="value.showShareButton !== false && !isH5Platform" open-type="share" @tap="onShareClick" :style="{ height: '72rpx', display: 'flex', justifyContent: 'center', alignItems: 'center', background: 'linear-gradient(90deg,#FFC107 0%,#FF8F00 100%)', borderRadius: '36rpx', padding: '0 40rpx', boxShadow: '0 4rpx 12rpx rgba(255,143,0,0.3)', marginBottom: '-4rpx', border: 'none', lineHeight: '1' }">
<text :style="{ fontSize: '27rpx', fontWeight: '700', color: '#FFFFFF' }">📤 {{ value.buttonText || '立即分享' }}</text>
</button> </button>
<view v-else-if="value.showShareButton !== false" @tap="onShareClick" :style="{ height: '72rpx', display: 'flex', justifyContent: 'center', alignItems: 'center', background: 'linear-gradient(90deg,#FFC107 0%,#FF8F00 100%)', borderRadius: '36rpx', padding: '0 40rpx', boxShadow: '0 4rpx 12rpx rgba(255,143,0,0.3)', marginBottom: '-4rpx', lineHeight: '1', boxSizing: 'border-box' }">
<text :style="{ fontSize: '27rpx', fontWeight: '700', color: '#FFFFFF' }">📤 {{ nc.buttonText || '立即分享' }}</text>
</view>
</view> </view>
</view> </view>
<!-- 换一个新码 --> <!-- 换一个新码 -->