修改分享
This commit is contained in:
parent
7a1962f746
commit
b5602f098c
@ -6,8 +6,8 @@
|
||||
</view>
|
||||
<view class="box flex justify-start flex-column align-items" :class="overlay ? 'no-scroll' : ''">
|
||||
<view class="swiper">
|
||||
<u-swiper :list="detail.images" indicator indicatorActiveColor="#323232" indicatorMode="dot" :indicator-style="{ bottom: '60rpx',zIndex: 999}"
|
||||
:height="height_sw" circular></u-swiper>
|
||||
<u-swiper :list="detail.images" indicator indicatorActiveColor="#323232" indicatorMode="dot"
|
||||
:indicator-style="{ bottom: '60rpx', zIndex: 999 }" :height="height_sw" circular></u-swiper>
|
||||
</view>
|
||||
|
||||
<view class="con-center w-100 flex justify-center flex-column align-items flex-start">
|
||||
@ -32,12 +32,16 @@
|
||||
|
||||
|
||||
<span class="first-image flex align-items" style="margin-top: 25rpx;width: 100%;">
|
||||
<image :src="detail.user.avatar" mode="" class="icon-size" style="width: 36rpx;height: 36rpx;"></image>
|
||||
<image :src="detail.user.avatar" mode="" class="icon-size" style="width: 36rpx;height: 36rpx;">
|
||||
</image>
|
||||
<span style="color: #9C9C9C ;width: 32%;">{{ detail.user.nickname }}</span>
|
||||
<span class="flex justify-center align-items xieyi">
|
||||
<image src="/static/detail/baohu.png" mode="" style="width: 28rpx;height: 28rpx;margin-right: 0;" ></image>
|
||||
<span class="white-space" style="width: 90rpx;text-align: center;">{{ detail.refund_info.title }}</span>
|
||||
<image src="/static/detail/zidong.png" mode="" style="width: 20rpx;height: 20rpx;margin-right: 0;" ></image>
|
||||
<image src="/static/detail/baohu.png" mode=""
|
||||
style="width: 28rpx;height: 28rpx;margin-right: 0;"></image>
|
||||
<span class="white-space" style="width: 90rpx;text-align: center;">{{
|
||||
detail.refund_info.title }}</span>
|
||||
<image src="/static/detail/zidong.png" mode=""
|
||||
style="width: 20rpx;height: 20rpx;margin-right: 0;"></image>
|
||||
</span>
|
||||
</span>
|
||||
|
||||
@ -50,32 +54,24 @@
|
||||
@click.stop="toMap(detail.latitude, detail.longitude, detail.address_detail)">
|
||||
<image src="/static/center/address.png" mode="" class="icon-size"></image>
|
||||
<span>{{ detail.address_detail }}</span>
|
||||
<image src="/static/detail/daohang.png" class="icon-size" style="width: 50rpx; height: 50rpx;"></image>
|
||||
<image src="/static/detail/daohang.png" class="icon-size" style="width: 50rpx; height: 50rpx;">
|
||||
</image>
|
||||
</span>
|
||||
<span class="line"></span>
|
||||
<view class="second-box flex align-items space-between">
|
||||
<view class="flex align-items">
|
||||
<u-avatar-group :urls="detail.join_info.users"
|
||||
keyName="avatar" size="30" gap="0.3" :maxCount="3"></u-avatar-group>
|
||||
<image
|
||||
src="/static/index/dian.png"
|
||||
<u-avatar-group :urls="detail.join_info.users" keyName="avatar" size="30" gap="0.3"
|
||||
:maxCount="3"></u-avatar-group>
|
||||
<image src="/static/index/dian.png"
|
||||
:class="detail.join_info.users && detail.join_info.users.length > 0 ? '' : 'smalld'"
|
||||
style="width: 60rpx;height: 60rpx;margin-left:-20rpx;z-index: 1;"
|
||||
></image>
|
||||
style="width: 60rpx;height: 60rpx;margin-left:-20rpx;z-index: 1;"></image>
|
||||
</view>
|
||||
<span class="number">{{detail.join_info.people_number}}/{{detail.join_info.stock >= 10000 ? '9999+' : detail.join_info.stock}}
|
||||
<span class="number">{{ detail.join_info.people_number }}/{{ detail.join_info.stock >= 10000 ?
|
||||
'9999+' : detail.join_info.stock}}
|
||||
人数</span>
|
||||
<view class="value_slide">
|
||||
<u-slider
|
||||
v-model="value_slide"
|
||||
showValue
|
||||
min="0"
|
||||
max="100"
|
||||
blockSize="12"
|
||||
inactiveColor="#EBEBEB"
|
||||
activeColor="#BBFC5B"
|
||||
disabled
|
||||
></u-slider>
|
||||
<u-slider v-model="value_slide" showValue min="0" max="100" blockSize="12"
|
||||
inactiveColor="#EBEBEB" activeColor="#BBFC5B" disabled></u-slider>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -92,7 +88,8 @@
|
||||
<view class="v_html">
|
||||
<rich-text :nodes="detail.content"></rich-text>
|
||||
</view>
|
||||
<image mode="widthFix" class="imgs" v-for="(item,index) in detail.images" :key="index" :src="item"></image>
|
||||
<image mode="widthFix" class="imgs" v-for="(item, index) in detail.images" :key="index" :src="item">
|
||||
</image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@ -152,8 +149,8 @@
|
||||
</u-popup>
|
||||
|
||||
<!-- 购买弹窗 -->
|
||||
<u-popup :show="buyShow" mode="center" :round="10" :zIndex="99999" :custom-style="popupStyle" @close="buyClose"
|
||||
@open="buyOpen" :safeAreaInsetBottom="false" :closeable="true">
|
||||
<u-popup :show="buyShow" mode="center" :round="10" :zIndex="99999" :custom-style="popupStyle"
|
||||
@close="buyClose" @open="buyOpen" :safeAreaInsetBottom="false" :closeable="true">
|
||||
<view class="popupBox flex justify-start align-items flex-column">
|
||||
<view class="pop-header flex align-items flex-column flex-start">
|
||||
<span class="name white-space">{{ detail.title }}</span>
|
||||
@ -214,12 +211,13 @@
|
||||
<view>
|
||||
<view class="c1t1">{{ formattedTitle }}</view>
|
||||
<view class="c2t2">￥{{ detail.price }}</view>
|
||||
<view class="c3t3">地址：{{ detail.address }}</view>
|
||||
<view class="c3t3 white-space">地址：{{ detail.address }}</view>
|
||||
</view>
|
||||
<view style="background-color: #ffffff;border-radius: 18rpx;">
|
||||
<l-painter>
|
||||
<l-painter-view css="margin:20rpx;">
|
||||
<l-painter-qrcode css="width: 160rpx; height: 160rpx;margin:0 auto;" :text="qrUrl"></l-painter-qrcode>
|
||||
<l-painter-qrcode css="width: 160rpx; height: 160rpx;margin:0 auto;"
|
||||
:text="qrUrl"></l-painter-qrcode>
|
||||
</l-painter-view>
|
||||
</l-painter>
|
||||
</view>
|
||||
@ -236,9 +234,8 @@
|
||||
<span>分 享</span>
|
||||
</button>
|
||||
</view>
|
||||
<canvas
|
||||
canvas-id="myCanvas"
|
||||
style="position: absolute;top:256rpx;left: 48rpx; width: 661rpx;height:1075rpx; visibility: hidden;">
|
||||
<canvas canvas-id="myCanvas"
|
||||
style="position: absolute;top:256rpx;left: 48rpx; width: 661rpx;height:1075rpx; visibility: hidden;z-index: 10;">
|
||||
</canvas>
|
||||
</u-overlay>
|
||||
|
||||
@ -371,6 +368,7 @@
|
||||
|
||||
methods: {
|
||||
capturePage() {
|
||||
let that = this;
|
||||
uni.canvasToTempFilePath({
|
||||
x: 0, // 起始x坐标（可选）
|
||||
y: 0, // 起始y坐标（可选）
|
||||
@ -381,7 +379,8 @@
|
||||
canvasId: 'myCanvas', // Canvas组件的id
|
||||
success: function (res) {
|
||||
console.log('tempFilePath:', res.tempFilePath); // 图片路径信息输出到控制台或进行其他处理
|
||||
this.save(res.tempFilePath)
|
||||
uni.previewImage({ urls: [res.tempFilePath] });
|
||||
that.save(res.tempFilePath);
|
||||
},
|
||||
fail: function (err) {
|
||||
console.error(err); // 输出错误信息到控制台进行调试
|
||||
@ -687,36 +686,47 @@
|
||||
|
||||
// 保存海报
|
||||
save(e) {
|
||||
let base64 = this.path.replace(/^data:image\/\w+;base64,/, ""); //图片替换
|
||||
let filePath = wx.env.USER_DATA_PATH + '/qrcode.png';
|
||||
uni.getFileSystemManager().writeFile({
|
||||
filePath: filePath, //创建一个临时文件名
|
||||
data: base64, //写入的文本或二进制数据
|
||||
encoding: 'base64', //写入当前文件的字符编码
|
||||
success: (res) => {
|
||||
uni.saveImageToPhotosAlbum({
|
||||
filePath: filePath,
|
||||
success: () => {
|
||||
uni.showToast({
|
||||
wx.saveImageToPhotosAlbum({
|
||||
filePath: e,
|
||||
success: function(res) {
|
||||
wx.showToast({
|
||||
title: '保存成功',
|
||||
icon: "none",
|
||||
duration: 5000
|
||||
})
|
||||
},
|
||||
fail: (err) => {
|
||||
console.log(err);
|
||||
uni.showToast({
|
||||
title: '保存失败',
|
||||
icon: "none",
|
||||
duration: 5000
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
fail: (err) => {
|
||||
console.log(err)
|
||||
fail: function(err) {
|
||||
console.log(err, '失败')
|
||||
}
|
||||
})
|
||||
// let base64 = this.path.replace(/^data:image\/\w+;base64,/, ""); //图片替换
|
||||
// let filePath = wx.env.USER_DATA_PATH + '/qrcode.png';
|
||||
// uni.getFileSystemManager().writeFile({
|
||||
// filePath: filePath, //创建一个临时文件名
|
||||
// data: base64, //写入的文本或二进制数据
|
||||
// encoding: 'base64', //写入当前文件的字符编码
|
||||
// success: (res) => {
|
||||
// uni.saveImageToPhotosAlbum({
|
||||
// filePath: filePath,
|
||||
// success: () => {
|
||||
// uni.showToast({
|
||||
// title: '保存成功',
|
||||
// icon: "none",
|
||||
// duration: 5000
|
||||
// })
|
||||
// },
|
||||
// fail: (err) => {
|
||||
// console.log(err);
|
||||
// uni.showToast({
|
||||
// title: '保存失败',
|
||||
// icon: "none",
|
||||
// duration: 5000
|
||||
// })
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
// fail: (err) => {
|
||||
// console.log(err)
|
||||
// }
|
||||
// })
|
||||
},
|
||||
//分享发布
|
||||
sharePoster() { //分享图片给好友按钮的点击事件函数
|
||||
@ -928,6 +938,7 @@
|
||||
background-color: #f7f7f7;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.w-100 {
|
||||
width: 100%;
|
||||
}
|
||||
@ -995,24 +1006,28 @@
|
||||
height: 118rpx;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.topimgs {
|
||||
position: absolute;
|
||||
top: -120rpx;
|
||||
width: 100%;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.top_texts {
|
||||
position: absolute;
|
||||
top: -151rpx;
|
||||
right: 68rpx;
|
||||
z-index: 3;
|
||||
color: #ffffff;
|
||||
|
||||
.xiao {
|
||||
margin-left: 4rpx;
|
||||
font-size: 22rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.first-box {
|
||||
width: 690rpx;
|
||||
background: #FFFFFF;
|
||||
@ -1021,6 +1036,7 @@
|
||||
// margin-top: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
z-index: 1;
|
||||
|
||||
.sigh {
|
||||
width: 88rpx;
|
||||
height: 40rpx;
|
||||
@ -1031,6 +1047,7 @@
|
||||
font-size: 24rpx;
|
||||
color: #222222;
|
||||
}
|
||||
|
||||
.first-name {
|
||||
width: 586rpx;
|
||||
height: 52rpx;
|
||||
@ -1074,6 +1091,7 @@
|
||||
font-size: 26rpx;
|
||||
color: #222222;
|
||||
}
|
||||
|
||||
.xieyi {
|
||||
background-color: #BBFC5B;
|
||||
width: 156rpx;
|
||||
@ -1093,6 +1111,7 @@
|
||||
.smalld {
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
|
||||
.number {
|
||||
height: 40rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
@ -1119,6 +1138,7 @@
|
||||
margin-top: 20rpx;
|
||||
border-radius: 44rpx;
|
||||
margin-bottom: 150rpx;
|
||||
|
||||
.third-top {
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: bold;
|
||||
@ -1130,8 +1150,10 @@
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
span {
|
||||
position: relative;
|
||||
|
||||
.icons {
|
||||
width: 37rpx;
|
||||
height: 20rpx;
|
||||
@ -1141,16 +1163,20 @@
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
|
||||
.third-center {
|
||||
padding: 30rpx;
|
||||
overflow: hidden;
|
||||
margin: 0 auto;
|
||||
height: 100%;
|
||||
|
||||
.v_html {
|
||||
word-wrap: break-word;word-break: break-all;
|
||||
word-wrap: break-word;
|
||||
word-break: break-all;
|
||||
font-size: 26rpx;
|
||||
line-height: 42rpx;
|
||||
}
|
||||
|
||||
.imgs {
|
||||
margin-top: 30rpx;
|
||||
width: 690rpx;
|
||||
@ -1507,29 +1533,35 @@
|
||||
// border-radius: 10px !important;
|
||||
background: #FFFFFF !important;
|
||||
}
|
||||
|
||||
.pos {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.Poster {
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
|
||||
.posterClose {
|
||||
position: absolute;
|
||||
right: 8rpx;
|
||||
top: 200rpx;
|
||||
}
|
||||
|
||||
.title_top {
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
width: 661rpx;height:1075rpx;
|
||||
width: 661rpx;
|
||||
height: 1075rpx;
|
||||
background-image: url('https://naweigetetest2.hschool.com.cn/dyqc/fenxiang.png');
|
||||
background-size: 100%;
|
||||
background-repeat: no-repeat;
|
||||
margin-top: 240rpx;
|
||||
|
||||
}
|
||||
|
||||
.toutop {
|
||||
position: absolute;
|
||||
top: 120rpx;
|
||||
@ -1537,12 +1569,14 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 80%;
|
||||
|
||||
.toutu {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
border-radius: 134rpx 134rpx 134rpx 134rpx;
|
||||
border: 2rpx solid #FFFFFF;
|
||||
}
|
||||
|
||||
.toututt {
|
||||
padding-left: 15rpx;
|
||||
height: 36rpx;
|
||||
@ -1556,8 +1590,10 @@
|
||||
text-transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
.center_con {
|
||||
padding-top: 200rpx;
|
||||
|
||||
.cenimg {
|
||||
width: 620rpx;
|
||||
height: 620rpx;
|
||||
@ -1565,15 +1601,19 @@
|
||||
margin: 0 auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.center_text {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
margin-top: 30rpx;
|
||||
|
||||
.c1t1 {
|
||||
color: #202020;font-size: 36rpx;
|
||||
color: #202020;
|
||||
font-size: 36rpx;
|
||||
// margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.c2t2 {
|
||||
font-family: D-DIN-PRO, D-DIN-PRO;
|
||||
font-weight: 900;
|
||||
@ -1581,12 +1621,14 @@
|
||||
color: #FF4810;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.c3t3 {
|
||||
margin-top: 20rpx;
|
||||
font-family: PingFang SC Regular, PingFang SC Regular;
|
||||
font-weight: 400;
|
||||
font-size: 26rpx;
|
||||
color: #9C9C9C;
|
||||
width: 340rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1672,9 +1714,11 @@
|
||||
<style lang="scss">
|
||||
.value_slide {
|
||||
width: 50%;
|
||||
|
||||
::v-deep .uni-slider-handle-wrapper {
|
||||
height: 10rpx;
|
||||
}
|
||||
|
||||
::v-deep .uni-slider-handle {
|
||||
background: url('@/static/detail/qiu.png') !important;
|
||||
border-radius: 0;
|
||||
@ -1684,16 +1728,20 @@
|
||||
top: 14rpx;
|
||||
margin-left: -18rpx !important;
|
||||
}
|
||||
|
||||
::v-deep .uni-slider-value {
|
||||
color: #323232;
|
||||
|
||||
&::after {
|
||||
content: '%';
|
||||
}
|
||||
}
|
||||
|
||||
// #ifdef MP-WEIXIN
|
||||
.wx-slider-handle-wrapper {
|
||||
height: 8rpx;
|
||||
}
|
||||
|
||||
.wx-slider-handle {
|
||||
background: url('@/static/detail/qiu.png') !important;
|
||||
border-radius: 0;
|
||||
@ -1703,12 +1751,13 @@
|
||||
top: 14rpx;
|
||||
margin-left: -14rpx !important;
|
||||
}
|
||||
|
||||
.wx-slider-value {
|
||||
display: flex;
|
||||
width: 30rpx;
|
||||
color: #323232;
|
||||
&::after{
|
||||
content: '%';
|
||||
|
||||
&::after { content: '%';
|
||||
}
|
||||
}
|
||||
// #endif
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user