|
|
@@ -2,23 +2,25 @@
|
|
|
<view class="content">
|
|
|
<view class="img-div">
|
|
|
<img class="img" v-for="url in images" :src="url" />
|
|
|
- <view>
|
|
|
+ <view class="text-color">
|
|
|
重庆润天健康管理有限公司，主营中医养生课程，课程内容包括居家养生，食疗食补房子，穴位养生等，针对50岁以上中老年人群，0基础即可学习，每天30分钟，在家轻松学。
|
|
|
</view>
|
|
|
</view>
|
|
|
+ <view class="box"></view>
|
|
|
<view class="foot">
|
|
|
<view class="butt">
|
|
|
<!-- <u-button type="success" text="加微" @click="show = true"></u-button> -->
|
|
|
<!-- <button data-agl-cvt="35">复制微信</button> -->
|
|
|
<div class="copy">
|
|
|
- 加微信了解更多：
|
|
|
+ <span>加微信了解更多</span>：
|
|
|
<!-- 点击微信号之后复制，设置转化类型为35（微信复制按钮点击） -->
|
|
|
- <span @click="clickToWx">点击加微</span>
|
|
|
+ <span @click="clickToWx" class="clickbox shake-animation">点击加微</span>
|
|
|
</div>
|
|
|
</view>
|
|
|
- <span>重庆润天健康管理有限公司</span>
|
|
|
- <span>重庆市经开区长生桥镇蔷薇路46号5-1</span>
|
|
|
- <span>18523923647</span>
|
|
|
+ <view class="foot-box">
|
|
|
+ <span>重庆润天健康管理有限公司</span>
|
|
|
+ <span>重庆市经开区长生桥镇蔷薇路46号5-1 18523923647</span>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
@@ -74,12 +76,33 @@
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
-<style>
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .text-color{
|
|
|
+ text-align: center;
|
|
|
+ width: 90%;
|
|
|
+ margin: 0 auto;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ .foot-box{
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ margin: 4px 0;
|
|
|
+ span{
|
|
|
+ margin: 0;
|
|
|
+ line-height:16px;
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .box{
|
|
|
+ height: 120px;
|
|
|
+ }
|
|
|
.content {
|
|
|
text-align: center;
|
|
|
}
|
|
|
.img-div{
|
|
|
margin: 0 auto;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
}
|
|
|
.img{
|
|
|
width: 100%;
|
|
|
@@ -93,15 +116,44 @@
|
|
|
line-height: 50px;
|
|
|
color: #848b99;
|
|
|
text-align: center;
|
|
|
- }
|
|
|
- .foot span{
|
|
|
- margin-left: 10px;
|
|
|
+ position: fixed;
|
|
|
+ bottom: 0;
|
|
|
}
|
|
|
.butt{
|
|
|
/* width: 80px; */
|
|
|
margin: 0 auto;
|
|
|
}
|
|
|
.copy{
|
|
|
- width: 100%;
|
|
|
+ width: 80%;
|
|
|
+ background-color: #F26F00;
|
|
|
+ margin: 0 auto;
|
|
|
+ color: #fff;
|
|
|
+ border-radius: 6px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center
|
|
|
+ }
|
|
|
+ .clickbox{
|
|
|
+ background-color: #fff;
|
|
|
+ color: #F26F00;
|
|
|
+ display: inline-block;
|
|
|
+ width: 100px;
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ border-radius: 4px;
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: bold;
|
|
|
}
|
|
|
+ @keyframes shake-animation {
|
|
|
+ 0% { transform: scale(1); }
|
|
|
+ 25% { transform: scale(1.1); }
|
|
|
+ 50% { transform: scale(1); }
|
|
|
+ 75% { transform: scale(1.1); }
|
|
|
+ 100% { transform: scale(1); }
|
|
|
+ }
|
|
|
+
|
|
|
+ .shake-animation {
|
|
|
+ animation: shake-animation 1.5s;
|
|
|
+ animation-iteration-count: infinite; /* 使动画无限循环 */
|
|
|
+ }
|
|
|
</style>
|
