样式兼容支付宝小程序
parent
af2c99a840
commit
0db41fb04e
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<view>
|
||||
<view v-if="propData.length > 0" class="data-list">
|
||||
<view v-if="propData.length > 0" class="icon-nav-list">
|
||||
<view v-for="(item, index) in propData" :key="index" class="item">
|
||||
<view class="item-content" :data-value="item.event_value" :data-type="item.event_type" @tap="navigation_event" :style="'background-color:' + (item.bg_color || '#fff')">
|
||||
<image :src="item.images_url" mode="aspectFit"></image>
|
||||
|
|
@ -29,11 +29,11 @@
|
|||
};
|
||||
</script>
|
||||
<style>
|
||||
.data-list {
|
||||
.icon-nav-list {
|
||||
overflow: hidden;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.data-list .item {
|
||||
.icon-nav-list .item {
|
||||
width: calc(20% - 20rpx);
|
||||
float: left;
|
||||
padding: 20rpx 10rpx 0 10rpx;
|
||||
|
|
@ -41,7 +41,7 @@
|
|||
cursor: pointer;
|
||||
/* #endif */
|
||||
}
|
||||
.item-content {
|
||||
.icon-nav-list .item .item-content {
|
||||
border-radius: 50%;
|
||||
padding: 20rpx;
|
||||
text-align: center;
|
||||
|
|
@ -51,11 +51,11 @@
|
|||
-webkit-box-shadow: 0 2px 12px rgb(226 226 226 / 95%);
|
||||
box-shadow: 0 2px 12px rgb(226 226 226 / 95%);
|
||||
}
|
||||
.data-list .item image {
|
||||
.icon-nav-list .item image {
|
||||
width: 50rpx !important;
|
||||
height: 50rpx !important;
|
||||
}
|
||||
.data-list .item .title {
|
||||
.icon-nav-list .item .title {
|
||||
margin-top: 6rpx;
|
||||
font-size: 28rpx;
|
||||
text-align: center;
|
||||
|
|
|
|||
|
|
@ -14,8 +14,8 @@
|
|||
<image class="icon" :src="common_static_url+'chat-icon.png'" mode="scaleToFill"></image>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef MP-ALIPAY -->
|
||||
<button open-type="contact">
|
||||
<contact-button :tnt-inst-id="mini_alipay_tnt_inst_id" :scene="mini_alipay_scene" :alipay-card-no="mini_alipay_openid || ''" :icon="common_static_url+'chat-icon.png'" size="21px*21px" />
|
||||
<button open-type="contact" class="alipay-contact">
|
||||
<contact-button :tnt-inst-id="mini_alipay_tnt_inst_id" :scene="mini_alipay_scene" :alipay-card-no="mini_alipay_openid || ''" :icon="common_static_url+'chat-icon.png'" size="40rpx*40rpx" />
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef H5 || APP -->
|
||||
<button type="default" @tap="call_event">
|
||||
|
|
@ -41,8 +41,8 @@
|
|||
</button>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef MP-ALIPAY -->
|
||||
<button open-type="contact" :class="common_ent">
|
||||
<contact-button :tnt-inst-id="mini_alipay_tnt_inst_id" :scene="mini_alipay_scene" :alipay-card-no="mini_alipay_openid || ''" :icon="common_static_url+'online-service-icon.png'" size="21px*21px" />
|
||||
<button open-type="contact" :class="'alipay-contact '+common_ent">
|
||||
<contact-button :tnt-inst-id="mini_alipay_tnt_inst_id" :scene="mini_alipay_scene" :alipay-card-no="mini_alipay_openid || ''" :icon="common_static_url+'online-service-icon.png'" size="40rpx*40rpx" />
|
||||
</button>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef H5 || APP -->
|
||||
|
|
@ -257,12 +257,6 @@
|
|||
width: 21px !important;
|
||||
height: 21px !important;
|
||||
}
|
||||
/* #ifdef MP-ALIPAY */
|
||||
.online-service-event-submit contact-button {
|
||||
line-height: initial;
|
||||
display: block;
|
||||
}
|
||||
/* #endif */
|
||||
.goods-chat-container button {
|
||||
padding: 0;
|
||||
border: 0;
|
||||
|
|
@ -277,5 +271,17 @@
|
|||
}
|
||||
.goods-chat-container .text {
|
||||
margin-top: -10rpx;
|
||||
}
|
||||
}
|
||||
/* #ifdef MP-ALIPAY */
|
||||
.goods-chat-container .alipay-contact {
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.goods-chat-container .alipay-contact .text {
|
||||
margin-top: -5rpx;
|
||||
}
|
||||
.online-service-event-submit contact-button {
|
||||
line-height: initial;
|
||||
display: block;
|
||||
}
|
||||
/* #endif */
|
||||
</style>
|
||||
|
|
@ -18,7 +18,8 @@
|
|||
.header-top {
|
||||
padding-right: 250rpx;
|
||||
/* #ifdef MP-ALIPAY */
|
||||
padding-right: 255rpx;
|
||||
padding-top: 20rpx !important;
|
||||
padding-right: 20rpx;
|
||||
/* #endif */
|
||||
/* #ifdef H5 || APP */
|
||||
padding-right: 20rpx;
|
||||
|
|
@ -33,6 +34,9 @@
|
|||
}
|
||||
.nav-search {
|
||||
width: calc(100% - 90rpx);
|
||||
/* #ifdef MP-ALIPAY */
|
||||
width: 100%;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -90,6 +94,9 @@
|
|||
.tablecode {
|
||||
background: rgb(255 255 255 / 60%);
|
||||
padding: 2rpx 20rpx;
|
||||
/* #ifdef MP-ALIPAY */
|
||||
margin-top: 15rpx;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -101,6 +108,9 @@
|
|||
/* #ifdef H5 || APP */
|
||||
height: calc(100vh - 390rpx);
|
||||
/* #endif */
|
||||
/* #ifdef MP-ALIPAY */
|
||||
height: calc(100vh - 400rpx);
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -185,6 +195,8 @@
|
|||
top: 0;
|
||||
right: 0;
|
||||
line-height: 88rpx;
|
||||
height: 88rpx;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
|||
|
|
@ -7,9 +7,11 @@
|
|||
<!-- 顶部 -->
|
||||
<view v-if="is_single_page == 0" class="header-top padding-horizontal-main" :style="'padding-top:'+(status_bar_height+8)+'px;'">
|
||||
<!-- 返回 -->
|
||||
<!-- #ifndef MP-ALIPAY -->
|
||||
<view class="nav-back dis-inline-block round tc va-m" @tap="top_nav_left_back_event">
|
||||
<uni-icons type="arrowleft" size="20" color="#fff"></uni-icons>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
<!-- 搜索 -->
|
||||
<view class="nav-search fr va-m">
|
||||
<!-- #ifndef H5 || MP-KUAISHOU -->
|
||||
|
|
|
|||
Loading…
Reference in New Issue