|
|
@@ -0,0 +1,251 @@
|
|
|
+<template>
|
|
|
+ <view class="content">
|
|
|
+ <view class="title-box">
|
|
|
+ <view class="top">
|
|
|
+ <view class="title">
|
|
|
+ <view class="title-left">
|
|
|
+ <view class="img">
|
|
|
+ <image src="../../static/usdt/logo.png" mode=""></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="title-right">
|
|
|
+ <view class="name">
|
|
|
+ 好强儿
|
|
|
+ </view>
|
|
|
+ <view class="time">
|
|
|
+ 1分钟前
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="share">
|
|
|
+ <view class="img">
|
|
|
+ <image src="../../static/user/share.png" mode=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="ci">
|
|
|
+ 985
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="text">
|
|
|
+ <text>
|
|
|
+ 承包你大半年的洗衣液~【威露士】倍净洗衣液套装 消毒除异味，除螨除菌高达99%用心呵护一家子的 健康整整12斤，专享价【89】
|
|
|
+ </text>
|
|
|
+ </view>
|
|
|
+ <view class="share-img">
|
|
|
+ <view class="text-img" v-for="item in imgList">
|
|
|
+ <image :src="item.img" mode=""></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="bottom">
|
|
|
+ <view class="pic">
|
|
|
+ 下载图片
|
|
|
+ </view>
|
|
|
+ <view class="fuzhi">
|
|
|
+ 复制文本
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="title-box">
|
|
|
+ <view class="top">
|
|
|
+ <view class="title">
|
|
|
+ <view class="title-left">
|
|
|
+ <view class="img">
|
|
|
+ <image src="../../static/usdt/logo.png" mode=""></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="title-right">
|
|
|
+ <view class="name">
|
|
|
+ 好强儿
|
|
|
+ </view>
|
|
|
+ <view class="time">
|
|
|
+ 1分钟前
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="share">
|
|
|
+ <view class="img">
|
|
|
+ <image src="../../static/user/share.png" mode=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="ci">
|
|
|
+ 985
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="text">
|
|
|
+ <text>
|
|
|
+ 承包你大半年的洗衣液~【威露士】倍净洗衣液套装 消毒除异味，除螨除菌高达99%用心呵护一家子的 健康整整12斤，专享价【89】
|
|
|
+ </text>
|
|
|
+ </view>
|
|
|
+ <view class="share-img">
|
|
|
+ <view class="text-img" v-for="item in imgList">
|
|
|
+ <image :src="item.img" mode=""></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="bottom">
|
|
|
+ <view class="pic">
|
|
|
+ 下载图片
|
|
|
+ </view>
|
|
|
+ <view class="fuzhi">
|
|
|
+ 复制文本
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ imgList:[
|
|
|
+ {img:"../../static/usdt/logo.png"},
|
|
|
+ {img:"../../static/usdt/logo.png"},
|
|
|
+ {img:"../../static/usdt/logo.png"},
|
|
|
+ {img:"../../static/usdt/logo.png"},
|
|
|
+ {img:"../../static/usdt/logo.png"},
|
|
|
+ {img:"../../static/usdt/logo.png"}
|
|
|
+ ]
|
|
|
+ };
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+ page,
|
|
|
+ .content {
|
|
|
+ height: 100%;
|
|
|
+ padding: 0;
|
|
|
+ margin: 0;
|
|
|
+ background: #F8F8F8;
|
|
|
+ }
|
|
|
+
|
|
|
+ .title-box {
|
|
|
+ border-radius: 20px 20px 20px 20px;
|
|
|
+ background: #FFFFFF;
|
|
|
+ margin: 20rpx auto;
|
|
|
+ width: 700rpx;
|
|
|
+
|
|
|
+ padding: 30rpx;
|
|
|
+ .top{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ }
|
|
|
+ .title {
|
|
|
+ display: flex;
|
|
|
+ .title-left {
|
|
|
+ display: flex;
|
|
|
+ height: 80rpx;
|
|
|
+ .img {
|
|
|
+ width: 80rpx;
|
|
|
+ height: 80rpx;
|
|
|
+ border-radius:50%;
|
|
|
+
|
|
|
+ image {
|
|
|
+ height: 100%;
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .title-right {
|
|
|
+ margin-left: 16rpx;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ .name {
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #444444;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .time {
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #999999;
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .share {
|
|
|
+ padding: 10rpx;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+ width: 120rpx;
|
|
|
+ height: 42rpx;
|
|
|
+
|
|
|
+ background: #FAEBCF;
|
|
|
+ border-radius: 30rpx;
|
|
|
+ .img {
|
|
|
+ width: 33rpx;
|
|
|
+ height: 24rpx;
|
|
|
+ image {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .ci {
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #80420A;
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+.text{
|
|
|
+ margin: 10rpx 0;
|
|
|
+ text{
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #666666;
|
|
|
+ line-height: 56rpx;
|
|
|
+ }
|
|
|
+}
|
|
|
+.share-img{
|
|
|
+ margin: 10rpx 0;
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ flex-wrap: wrap;
|
|
|
+
|
|
|
+ .text-img{
|
|
|
+ margin: 10rpx 0;
|
|
|
+ width: 200rpx;
|
|
|
+ height: 200rpx;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ image{
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.bottom{
|
|
|
+ display: flex;
|
|
|
+ .pic{
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #536893;
|
|
|
+ }
|
|
|
+ .fuzhi{
|
|
|
+ margin-left: 33rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #536893;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+</style>
|
