fix: 微信小程序兼容性修复 - u-button替换为原生button
微信小程序对uview-plus的u-button组件有依赖分析问题，导致运行报错。 将所有u-button替换为原生button并添加对应样式： - detail.vue: 底部操作按钮、弹窗确认/取消按钮 - config.vue: 创建组合按钮 - strategies/edit.vue: 保存/删除策略按钮
This commit is contained in:
parent
709a57e073
commit
65fd6ce23d
@ -132,12 +132,7 @@
|
||||
<text class="summary-label">预计初始投入</text>
|
||||
<text class="summary-val">¥ {{ totalInvestment }}</text>
|
||||
</view>
|
||||
<u-button
|
||||
type="primary"
|
||||
text="创建组合"
|
||||
:customStyle="{ backgroundColor: '#064E3B', borderRadius: '24rpx', height: '96rpx', fontSize: '30rpx', fontWeight: '700' }"
|
||||
@click="submitForm"
|
||||
></u-button>
|
||||
<button class="btn-submit" @click="submitForm">创建组合</button>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
@ -697,18 +692,19 @@ onShow(async () => {
|
||||
font-family: 'DIN Alternate';
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
.btn-submit {
|
||||
background-color: #064E3B;
|
||||
color: #fff;
|
||||
font-weight: 700;
|
||||
border-radius: 24rpx;
|
||||
height: 96rpx;
|
||||
line-height: 96rpx;
|
||||
font-size: 30rpx;
|
||||
width: 100%;
|
||||
border: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.submit-btn:active {
|
||||
opacity: 0.9;
|
||||
}
|
||||
.btn-submit::after { border: none; }
|
||||
.btn-submit:active { opacity: 0.9; }
|
||||
</style>
|
||||
@ -170,28 +170,17 @@
|
||||
</view>
|
||||
|
||||
<view class="action-section fixed-bottom">
|
||||
<u-button
|
||||
type="error"
|
||||
:plain="true"
|
||||
icon="trash"
|
||||
:customStyle="{ flex: '0 0 96rpx', width: '96rpx', height: '96rpx', borderRadius: '24rpx', backgroundColor: '#FEE2E2', borderColor: '#FEE2E2' }"
|
||||
@click="deletePortfolio"
|
||||
></u-button>
|
||||
<u-button
|
||||
type="primary"
|
||||
icon="download"
|
||||
text="增加"
|
||||
:customStyle="{ backgroundColor: '#064E3B', borderRadius: '24rpx', height: '96rpx', fontSize: '30rpx', fontWeight: '700' }"
|
||||
@click="handleBuy"
|
||||
></u-button>
|
||||
<u-button
|
||||
type="primary"
|
||||
:plain="true"
|
||||
icon="upload"
|
||||
text="减少"
|
||||
:customStyle="{ borderRadius: '24rpx', height: '96rpx', fontSize: '30rpx', fontWeight: '700', borderColor: '#064E3B', color: '#064E3B' }"
|
||||
@click="handleSell"
|
||||
></u-button>
|
||||
<button class="btn-delete" @click="deletePortfolio">
|
||||
<uni-icons type="trash" size="20" color="#DC2626"></uni-icons>
|
||||
</button>
|
||||
<button class="btn-buy" @click="handleBuy">
|
||||
<uni-icons type="download" size="18" color="#FFFFFF"></uni-icons>
|
||||
<text>增加</text>
|
||||
</button>
|
||||
<button class="btn-sell" @click="handleSell">
|
||||
<uni-icons type="upload" size="18" color="#064E3B"></uni-icons>
|
||||
<text>减少</text>
|
||||
</button>
|
||||
</view>
|
||||
|
||||
<!-- 交易表单弹窗 -->
|
||||
@ -286,18 +275,8 @@
|
||||
</view>
|
||||
|
||||
<view class="modal-footer">
|
||||
<u-button
|
||||
type="default"
|
||||
text="取消"
|
||||
:customStyle="{ borderRadius: '12rpx', height: '80rpx', fontSize: '24rpx', fontWeight: '600', backgroundColor: '#F3F4F6', color: '#6B7280' }"
|
||||
@click="showTransactionForm = false"
|
||||
></u-button>
|
||||
<u-button
|
||||
type="primary"
|
||||
text="确认"
|
||||
:customStyle="{ backgroundColor: '#064E3B', borderRadius: '12rpx', height: '80rpx', fontSize: '24rpx', fontWeight: '600' }"
|
||||
@click="submitTransaction"
|
||||
></u-button>
|
||||
<button class="btn-cancel" @click="showTransactionForm = false">取消</button>
|
||||
<button class="btn-confirm" @click="submitTransaction">确认</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -738,6 +717,52 @@ const deletePortfolio = async () => {
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.btn-delete {
|
||||
flex: 0 0 96rpx;
|
||||
width: 96rpx;
|
||||
height: 96rpx;
|
||||
border-radius: 24rpx;
|
||||
background-color: #FEE2E2;
|
||||
border: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0;
|
||||
}
|
||||
.btn-delete::after { border: none; }
|
||||
.btn-buy {
|
||||
flex: 1;
|
||||
height: 96rpx;
|
||||
border-radius: 24rpx;
|
||||
background-color: #064E3B;
|
||||
border: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 8rpx;
|
||||
color: #FFFFFF;
|
||||
font-size: 30rpx;
|
||||
font-weight: 700;
|
||||
padding: 0;
|
||||
}
|
||||
.btn-buy::after { border: none; }
|
||||
.btn-sell {
|
||||
flex: 1;
|
||||
height: 96rpx;
|
||||
border-radius: 24rpx;
|
||||
background-color: #FFFFFF;
|
||||
border: 2rpx solid #064E3B;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 8rpx;
|
||||
color: #064E3B;
|
||||
font-size: 30rpx;
|
||||
font-weight: 700;
|
||||
padding: 0;
|
||||
}
|
||||
.btn-sell::after { border: none; }
|
||||
|
||||
.transaction-modal {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
@ -818,6 +843,30 @@ const deletePortfolio = async () => {
|
||||
gap: 16rpx;
|
||||
}
|
||||
|
||||
.btn-cancel,
|
||||
.btn-confirm {
|
||||
flex: 1;
|
||||
height: 80rpx;
|
||||
border-radius: 12rpx;
|
||||
font-size: 26rpx;
|
||||
font-weight: 600;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: none;
|
||||
padding: 0;
|
||||
}
|
||||
.btn-cancel {
|
||||
background-color: #F3F4F6;
|
||||
color: #6B7280;
|
||||
}
|
||||
.btn-cancel::after { border: none; }
|
||||
.btn-confirm {
|
||||
background-color: #064E3B;
|
||||
color: #fff;
|
||||
}
|
||||
.btn-confirm::after { border: none; }
|
||||
|
||||
.relative { position: relative; }
|
||||
|
||||
.search-dropdown {
|
||||
|
||||
@ -233,27 +233,10 @@
|
||||
|
||||
<view class="footer-bar">
|
||||
<view class="btn-row" v-if="isEditMode">
|
||||
<u-button
|
||||
type="error"
|
||||
text="删除策略"
|
||||
:plain="true"
|
||||
:customStyle="{ flex: '0 0 180rpx', borderRadius: '24rpx', height: '96rpx', fontSize: '24rpx', fontWeight: '700', backgroundColor: '#FEE2E2', borderColor: '#FEE2E2', color: '#DC2626' }"
|
||||
@click="deleteStrategy"
|
||||
></u-button>
|
||||
<u-button
|
||||
type="primary"
|
||||
text="更新策略配置"
|
||||
:customStyle="{ backgroundColor: '#064E3B', borderRadius: '24rpx', height: '96rpx', fontSize: '30rpx', fontWeight: '700' }"
|
||||
@click="submit"
|
||||
></u-button>
|
||||
<button class="btn-delete" @click="deleteStrategy">删除策略</button>
|
||||
<button class="btn-save" @click="submit">更新策略配置</button>
|
||||
</view>
|
||||
<u-button
|
||||
v-else
|
||||
type="primary"
|
||||
text="保存策略配置"
|
||||
:customStyle="{ backgroundColor: '#064E3B', borderRadius: '24rpx', height: '96rpx', fontSize: '30rpx', fontWeight: '700' }"
|
||||
@click="submit"
|
||||
></u-button>
|
||||
<button v-else class="btn-save btn-full" @click="submit">保存策略配置</button>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
@ -936,7 +919,7 @@ onMounted(() => {
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-color: #fff;
|
||||
padding: 20rpx 32rpx 50rpx 32rpx; /* 适配底部安全区 */
|
||||
padding: 20rpx 32rpx 50rpx 32rpx;
|
||||
box-shadow: 0 -4rpx 16rpx rgba(0,0,0,0.05);
|
||||
z-index: 99;
|
||||
}
|
||||
@ -944,27 +927,35 @@ onMounted(() => {
|
||||
display: flex;
|
||||
gap: 16rpx;
|
||||
}
|
||||
.submit-btn {
|
||||
.btn-save {
|
||||
flex: 1;
|
||||
background-color: #064E3B;
|
||||
color: #fff;
|
||||
font-weight: 700;
|
||||
border-radius: 24rpx;
|
||||
height: 96rpx;
|
||||
line-height: 96rpx;
|
||||
font-size: 30rpx;
|
||||
border: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.submit-btn:active { opacity: 0.9; }
|
||||
.delete-btn {
|
||||
flex: 0 0 120rpx;
|
||||
.btn-save::after { border: none; }
|
||||
.btn-save:active { opacity: 0.9; }
|
||||
.btn-full { width: 100%; }
|
||||
.btn-delete {
|
||||
flex: 0 0 180rpx;
|
||||
background-color: #FEE2E2;
|
||||
color: #DC2626;
|
||||
font-weight: 700;
|
||||
border-radius: 24rpx;
|
||||
height: 96rpx;
|
||||
line-height: 96rpx;
|
||||
font-size: 24rpx;
|
||||
border: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.delete-btn:active { background-color: #FECACA; }
|
||||
.btn-delete::after { border: none; }
|
||||
.btn-delete:active { background-color: #FECACA; }
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user