TmOct5/BlockChainH5
1
0
Fork 0
Code Issues Pull Requests Projects Releases 1 Wiki Activity

merge

Browse Source
This commit is contained in:
唐明明
2021-10-29 16:54:35 +08:00
parent 5960d1cf8c b3690d82a8
commit cb0da38a87
13 changed files with 1040 additions and 429 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
App.vue
View File

@@ -25,24 +25,36 @@
// 获取系统版本号 // 获取系统版本号
console.log(plus.runtime.versionCode) console.log(plus.runtime.versionCode)
console.log(plus.runtime.uniVersion) console.log(plus.runtime.uniVersion)
// 请求一个接口 // 请求一个接口
// 是否需要更新 // 是否需要更新
// 弹出更新提示 // 弹出更新提示
// 下载文件安装 // 下载文件安装
console.log('检查更新')
//#endif //#endif
}, },
onShow() { onShow() {
uni.getClipboardData({ uni.getClipboardData({
success: res=> { success: res=> {
if(res.data.indexOf('$InviTaTiOn$CoDe/$-?') === 2){ // 包含分享邀请码
this.globalData.parentId = res.data.replace('$InviTaTiOn$CoDe/$-?', '') if(res.data.indexOf('$InviTaTiOn$CoDe/$-?') === 2){
} let parentId = res.data.replace('$InviTaTiOn$CoDe/$-?', '')
}, this.globalData.parentId = parentId.substr(0, 10)
fail(err) { if(res.data.indexOf('^GoodsId/$-?') === 30){
console.log(err) let goodsId = res.data.substr(42, res.data.length - 1)
setTimeout(() => {
if(this.$Route.name === 'goodsDetails' && this.$Route.query.id === goodsId) return
this.$Router.push({name: 'goodsDetails', params: {id: goodsId}})
}, 1000)
}
return
}
// 不包含用户信息
if(res.data.indexOf('^GoodsId/$-?') > -1){
let goodsId = res.data.substr(12, res.data.length - 1)
setTimeout(() => {
if(this.$Route.name === 'goodsDetails' && this.$Route.query.id === goodsId) return
this.$Router.push({name: 'goodsDetails', params: {id: goodsId}})
}, 1000)
}
} }
}) })
}, },
@@ -50,7 +62,8 @@
console.log('App Hide'); console.log('App Hide');
}, },
globalData: { globalData: {
mainColor: 'white' mainColor: 'white',
parentId:''
} }
}; };
</script> </script>

8
pages.json
View File

@@ -20,7 +20,6 @@
}, { }, {
"path": "pages/equity/index", "path": "pages/equity/index",
"name": "equity", "name": "equity",
"auth": true,
"style": { "style": {
"navigationBarTitleText": "通证商城", "navigationBarTitleText": "通证商城",
"navigationStyle": "custom", "navigationStyle": "custom",
@@ -283,13 +282,14 @@
"path": "pages/goods/details", "path": "pages/goods/details",
"name": "goodsDetails", "name": "goodsDetails",
"style": { "style": {
"navigationBarTitleText": "", "navigationBarTitleText": "商品详情",
"navigationBarTextStyle":"white",
"titleNView": { "titleNView": {
"backgroundColor": "#FFFFFF", "backgroundColor": "#8b64fd",
"type": "transparent", "type": "transparent",
"buttons": [{ "buttons": [{
"text": "分享", "text": "分享",
"fontSize": "12", "fontSize": "14",
"color": "#555555" "color": "#555555"
}] }]
} }

61
pages/goods/details.vue
View File

@@ -28,7 +28,9 @@
</view> </view>
</view> </view>
<view class="title"> <view class="title">
<view class="title-hot" v-if="goodsObj.specal_tags.is_allow_values">{{goodsObj.specal_tags.is_allow_values}}</view> <view class="title-hot" v-if="goodsObj.specal_tags.is_allow_values">
{{goodsObj.specal_tags.is_allow_values}}
</view>
<view class="title-hot" v-if="goodsObj.specal_tags.is_self">{{goodsObj.specal_tags.is_self}}</view> <view class="title-hot" v-if="goodsObj.specal_tags.is_self">{{goodsObj.specal_tags.is_self}}</view>
{{goodsObj.name}} {{goodsObj.name}}
</view> </view>
@@ -175,9 +177,7 @@
</view> </view>
</view> </view>
</view> </view>
<view class="coupons-true" @click="serveClose"> <view class="coupons-true" @click="serveClose">确定</view>
确定
</view>
</view> </view>
</uni-popup> </uni-popup>
</view> </view>
@@ -189,6 +189,9 @@
managesCoupons managesCoupons
} from '@/apis/interfaces/goods' } from '@/apis/interfaces/goods'
import userAuth from '@/public/userAuth' import userAuth from '@/public/userAuth'
import UniShare from 'uni_modules/uni-share/js_sdk/uni-share.js'
const uniShare = new UniShare()
import {config} from '@/apis/index.js'
export default { export default {
data() { data() {
return { return {
@@ -210,6 +213,17 @@
this.coupons = res.coupons this.coupons = res.coupons
}) })
}, },
onBackPress({
from
}) {
console.log(from);
if (from == 'backbutton') {
this.$nextTick(function() {
uniShare.hide()
})
return uniShare.isShow;
}
},
methods: { methods: {
// 提交购买单 // 提交购买单
buyGoods() { buyGoods() {
@@ -298,6 +312,43 @@
// 查看保障服务-隐藏 // 查看保障服务-隐藏
serveClose() { serveClose() {
this.$refs.servePopup.close() this.$refs.servePopup.close()
},
// 顶部菜单点击了分享功能
onNavigationBarButtonTap() {
let invite = this.goodsObj.user_invite || ''
let goods ='^GoodsId/$-?' + this.goodsObj.goods_id
let shareCode = invite === '' ?goods:invite.slice(0,2) + '$InviTaTiOn$CoDe/$-?' + invite.substring(2)+goods
uniShare.show({
content: {
type: 0,
href: 'https://www.lianshang.vip/app?invite=' + shareCode,
title: '链商星球 共创未来，一起搭建 链商经济的世界~',
summary: '链商星球APP你值得拥有~每日签到领贡献值~',
imageUrl: config.apiUrls+'images/top_logo.png'
},
menus: [{
"img": "/static/icons/payWay_icon_00.png",
"text": "微信好友",
"share": { //当前项的分享参数配置。可覆盖公共的配置如下：分享到微信小程序，配置了type=5
"provider": "weixin",
"scene": "WXSceneSession"
}
},
{
"img": "/static/icons/share-pyq.png",
"text": "微信朋友圈",
"share": {
"provider": "weixin",
"scene": "WXSenceTimeline"
}
}
],
cancelText: "取消分享",
}, e => {
if(uniShare.isShow){
console.log('shareCode',shareCode)
}
})
} }
} }
} }
@@ -353,7 +404,7 @@
.title-hot { .title-hot {
display: inline-block; display: inline-block;
background-image: linear-gradient(to left,#fee195,#fee195); background-image: linear-gradient(to left, #fee195, #fee195);
font-size: 24rpx; font-size: 24rpx;
border-radius: 50rpx; border-radius: 50rpx;
padding: 0 10rpx; padding: 0 10rpx;

2
pages/login/login.vue
View File

@@ -57,6 +57,8 @@
}, },
onShow(){ onShow(){
this.parentId = getApp().globalData.parentId this.parentId = getApp().globalData.parentId
}, },
methods: { methods: {
// 用户登录 // 用户登录

851
pages/user/code.vue
View File

@@ -7,27 +7,29 @@
<view class="code-lay" @click="coverCode"></view> <view class="code-lay" @click="coverCode"></view>
<image class="code-back-image" :src="item.cover" mode="aspectFill"></image> <image class="code-back-image" :src="item.cover" mode="aspectFill"></image>
<view class="codDate"> <view class="codDate">
<view class="codDate-year"> <view class="codDate-year">
{{item.date.solar.month}} {{item.date.solar.month}}
</view> </view>
<view class="codDate-day"> <view class="codDate-day">
{{item.date.solar.day}} {{item.date.solar.day}}
</view> </view>
<view class="codDate-lunar"> <view class="codDate-lunar">
{{item.date.lunar}} {{item.date.lunar}}
</view> </view>
</view> </view>
<view class="codeCont"> <view class="codeCont">
<image class="codeCont-avatar" :src="item.user_info.avatar ? item.user_info.avatar : '/static/user/user-portrait.png'" mode="aspectFill"></image> <image class="codeCont-avatar"
<view class="codeCont-text"> :src="item.user_info.avatar ? item.user_info.avatar : '/static/user/user-portrait.png'"
<view class="codeCont-name"> mode="aspectFill"></image>
{{item.user_info.nickname}} <view class="codeCont-text">
</view> <view class="codeCont-name">
<view class="codeCont-number"> {{item.user_info.nickname}}
邀请码：{{item.invite}} </view>
</view> <view class="codeCont-number">
</view> 邀请码：{{item.invite}}
<image class="codeCont-img" :src="item.code" mode="widthFix"></image> </view>
</view>
<image class="codeCont-img" :src="item.code" mode="widthFix"></image>
</view> </view>
</view> </view>
</swiper-item> </swiper-item>
@@ -37,454 +39,495 @@
<view class="hith">朋友通过你的邀请注册成功后，将与您绑定好友关系通过成为平台用户，你都可以获得贡献值奖励。</view> <view class="hith">朋友通过你的邀请注册成功后，将与您绑定好友关系通过成为平台用户，你都可以获得贡献值奖励。</view>
<view class="number"> <view class="number">
<view class="title">邀请码 : {{inviteData[0].invite}}</view> <view class="title">邀请码 : {{inviteData[0].invite}}</view>
<view class="value" @click="copyCenter(inviteData[0].invite)">复制邀请码</view> <view class="value" @click="copyCenter(inviteData[0].invite)">复制邀请码</view>
</view> </view>
<!-- <view class="button" @click="coverCode">生成分享海报</view> --> <!-- <view class="button" @click="coverCode">生成分享海报</view> -->
</view> </view>
<canvas class="my-canvas" canvas-id="myCanvas" id="myCanvas"/> <canvas class="my-canvas" canvas-id="myCanvas" id="myCanvas" />
<view v-if="posterShow"> <view v-if="posterShow">
<view class="posterBack"></view> <view class="posterBack"></view>
<view class="poster"> <view class="poster">
<view class="poster-img"> <view class="poster-img">
<image class="img" :src="posterImg" mode="widthFix" /> <image class="img" :src="posterImg" mode="widthFix" />
</view> </view>
<view class="poster-btn"> <view class="poster-btn">
<view class="operate operate-cancel" @click="saveImage">保存图片至相册</view> <view class="operate operate-cancel" @click="saveImage">保存图片至相册</view>
<view class="operate" @tap="posterShow = false">取消</view> <view class="operate" @tap="posterShow = false">取消</view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</template> </template>
<script> <script>
import { userInvite } from '@/apis/interfaces/user' import {
import { saveImageToPhotosAlbum, showToast, downloadFile } from '@/uni_modules/sakura-canvas/js_sdk/util' userInvite
import Draw from '@/uni_modules/sakura-canvas/js_sdk/draw' } from '@/apis/interfaces/user'
let draw = null import {
saveImageToPhotosAlbum,
showToast,
downloadFile
} from '@/uni_modules/sakura-canvas/js_sdk/util'
import Draw from '@/uni_modules/sakura-canvas/js_sdk/draw'
let draw = null
export default { export default {
data() { data() {
return { return {
Popinvite : {}, //下载海报数据 Popinvite: {}, //下载海报数据
inviteData: [] ,//二维码信息 inviteData: [], //二维码信息
codeIndex : 0, codeIndex: 0,
posterImg : '', posterImg: '',
defaultImg: '', defaultImg: '',
loaded : false, loaded: false,
posterShow: false posterShow: false
}; };
}, },
onLoad() { onLoad() {
// 获取二维码 // 获取二维码
this.inviteInfo() this.inviteInfo()
}, },
async created() {}, async created() {},
methods:{ methods: {
// 二维码 // 二维码
inviteInfo(){ inviteInfo() {
userInvite().then(res => { userInvite().then(res => {
this.loaded = true this.loaded = true
this.inviteData = res this.inviteData = res
}).catch(err => { }).catch(err => {
uni.showToast({ uni.showToast({
icon: 'none', icon: 'none',
title: err.message title: err.message
}) })
}) })
},
// 生成海报
async coverCode(){
let img = this.inviteData[this.codeIndex].code
let back = this.inviteData[this.codeIndex].cover
let name = this.inviteData[this.codeIndex].user_info.nickname
let invite = this.inviteData[this.codeIndex].invite
let avatar = this.inviteData[this.codeIndex].user_info.avatar || '/static/user/user-portrait.png'
let date = this.inviteData[this.codeIndex].date
draw = new Draw({
width: 375,
height: 667,
canvasId:'myCanvas',
_this: this,
background: {
type: 'color',
color: 'white',
w: 375,
h: 667,
},
})
let res = await draw.createdSharePoster(({ bgObj }) => {
let { width, height } = bgObj
this.Popinvite = bgObj
// 绘制内容
return [
// 背景
{
type: 'image',
x: 0,
y: 0,
src: back,
w: 375,
h: 667,
zIndex: 0,
},
// 日历-边框
{
type: 'rect',
x: 280,
y: 10,
w: 60, // 宽度 必填
h: 80, // 高度 必填
zIndex: 99,
isFill: false, // 是否是填充矩形, false: 线性矩形
lineWidth: 1 ,// 当矩形为线性时，矩形的边框宽度
color: '#ffffff',
},
// 日历-线条
{
type: 'line',
zIndex: 99,
x: 280,
y: 62,
w: 60, // 宽度 默认整个画布的宽度 - x轴的距离
color: '#ffffff', // 颜色 默认#000000 在不考虑字节跳动小程序的前提下可简写(#000)
alpha: 1, // 透明度 默认1 取值范围 0~1
lineType: 'solid', // 线条类型 默认 solid: 实线 可选 dashed: 虚线
lineWidth: 1, // 线条高度
lineCap: 'butt' // 线条端点样式 默认 butt 可选 round, square
},
// 日历-年月
{
type: 'text',
x: 284,
y: 18,
zIndex: 99,
w: width - (20 * 2),
text: date.solar.month,
color: '#ffffff',
font: {
size: 14
}
},
// 日历-日
{
type: 'text',
x: 298,
y: 40,
zIndex: 99,
w: width - (20 * 2),
text: date.solar.day,
color: '#ffffff',
font: {
size: 18,
weight: 'bold'
}
},
// 日历-农历日期
{
type: 'text',
x: 282,
y: 70,
zIndex: 99,
w: width - (20 * 2),
text: date.lunar,
color: '#ffffff',
font: {
size: 14
}
},
// 用户昵称
{
type: 'text',
x: 86,
y: 600,
zIndex: 99,
w: width - (20 * 2),
text: name,
color: '#ffffff',
font: {
size: 16
}
},
// 邀请码
{
type: 'text',
x: 86,
y: 628,
zIndex: 99,
w: width - (20 * 2),
text: '邀请码：' + invite,
color: '#c4a1cb',
font: {
size: 14
}
},
// 用户头像
{
type: 'image',
x: 24,
y: 598,
src: avatar,
w: 46,
h: 46,
drawType: 'arc',
zIndex: 99,
borderWidth: 5, // 图片边框大小 默认0
borderColor: '#ffffff' // 图片边框颜色 默认无颜色
},
// 二维码
{
type: 'image',
x: 280,
y: 585,
w: 72,
h: 72,
zIndex: 99,
src: img
}
]
})
if (!res.success) return
this.posterImg = res.data
this.posterShow = true
}, },
// 保存图片 // 生成海报
async saveImage() { async coverCode() {
let { posterImg } = this let img = this.inviteData[this.codeIndex].code
let res = await saveImageToPhotosAlbum(posterImg) let back = this.inviteData[this.codeIndex].cover
if (!res.success) return let name = this.inviteData[this.codeIndex].user_info.nickname
showToast('保存成功,去相册分享给朋友吧') let invite = this.inviteData[this.codeIndex].invite
this.posterShow = false let avatar = this.inviteData[this.codeIndex].user_info.avatar || '/static/user/user-portrait.png'
}, let date = this.inviteData[this.codeIndex].date
draw = new Draw({
// 复制邀请码 width: 375,
copyCenter(e) { height: 667,
canvasId: 'myCanvas',
_this: this,
background: {
type: 'color',
color: 'white',
w: 375,
h: 667,
},
})
let res = await draw.createdSharePoster(({
bgObj
}) => {
let {
width,
height
} = bgObj
this.Popinvite = bgObj
// 绘制内容
return [
// 背景
{
type: 'image',
x: 0,
y: 0,
src: back,
w: 375,
h: 667,
zIndex: 0,
},
// 日历-边框
{
type: 'rect',
x: 280,
y: 10,
w: 60, // 宽度 必填
h: 80, // 高度 必填
zIndex: 99,
isFill: false, // 是否是填充矩形, false: 线性矩形
lineWidth: 1, // 当矩形为线性时，矩形的边框宽度
color: '#ffffff',
},
// 日历-线条
{
type: 'line',
zIndex: 99,
x: 280,
y: 62,
w: 60, // 宽度 默认整个画布的宽度 - x轴的距离
color: '#ffffff', // 颜色 默认#000000 在不考虑字节跳动小程序的前提下可简写(#000)
alpha: 1, // 透明度 默认1 取值范围 0~1
lineType: 'solid', // 线条类型 默认 solid: 实线 可选 dashed: 虚线
lineWidth: 1, // 线条高度
lineCap: 'butt' // 线条端点样式 默认 butt 可选 round, square
},
// 日历-年月
{
type: 'text',
x: 284,
y: 18,
zIndex: 99,
w: width - (20 * 2),
text: date.solar.month,
color: '#ffffff',
font: {
size: 14
}
},
// 日历-日
{
type: 'text',
x: 298,
y: 40,
zIndex: 99,
w: width - (20 * 2),
text: date.solar.day,
color: '#ffffff',
font: {
size: 18,
weight: 'bold'
}
},
// 日历-农历日期
{
type: 'text',
x: 282,
y: 70,
zIndex: 99,
w: width - (20 * 2),
text: date.lunar,
color: '#ffffff',
font: {
size: 14
}
},
// 用户昵称
{
type: 'text',
x: 86,
y: 600,
zIndex: 99,
w: width - (20 * 2),
text: name,
color: '#ffffff',
font: {
size: 16
}
},
// 邀请码
{
type: 'text',
x: 86,
y: 628,
zIndex: 99,
w: width - (20 * 2),
text: '邀请码：' + invite,
color: '#c4a1cb',
font: {
size: 14
}
},
// 用户头像
{
type: 'image',
x: 24,
y: 598,
src: avatar,
w: 46,
h: 46,
drawType: 'arc',
zIndex: 99,
borderWidth: 5, // 图片边框大小 默认0
borderColor: '#ffffff' // 图片边框颜色 默认无颜色
},
// 二维码
{
type: 'image',
x: 280,
y: 585,
w: 72,
h: 72,
zIndex: 99,
src: img
}
]
})
if (!res.success) return
this.posterImg = res.data
this.posterShow = true
},
// 保存图片
async saveImage() {
let {
posterImg
} = this
let res = await saveImageToPhotosAlbum(posterImg)
if (!res.success) return
showToast('保存成功,去相册分享给朋友吧')
this.posterShow = false
},
// 复制邀请码
copyCenter(e) {
console.log(e)
// e.slice(0,2) + '$InviTaTiOn$CoDe/$-?' + e.substring(2) // e.slice(0,2) + '$InviTaTiOn$CoDe/$-?' + e.substring(2)
uni.setClipboardData({ uni.setClipboardData({
data: e, data: e,
success(){ success() {
uni.showToast({ uni.showToast({
title: '邀请码已复制', title: '邀请码已复制',
icon : 'none' icon: 'none'
}) })
} }
}) })
}, },
// 切换海报背景index // 切换海报背景index
swiperChange(e) { swiperChange(e) {
this.codeIndex = e.detail.current this.codeIndex = e.detail.current
} }
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.content{ .content {
background: white; background: white;
padding: $padding 0; padding: $padding 0;
box-sizing: border-box; box-sizing: border-box;
min-height: 100vh; min-height: 100vh;
@extend .vertical; @extend .vertical;
} }
// 轮播 // 轮播
.code{ .code {
position: relative; position: relative;
width: 100%; width: 100%;
padding-top: calc(183% - 280rpx - #{$padding * 2}); padding-top: calc(183% - 280rpx - #{$padding * 2});
.code-swiper{
.code-swiper {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
.code-item{
.code-item {
height: 100%; height: 100%;
width: 100%; width: 100%;
padding: 0 $padding/2; padding: 0 $padding/2;
.code-lay{
.code-lay {
position: absolute; position: absolute;
width: 100%; width: 100%;
height: 100%; height: 100%;
z-index: 10; z-index: 10;
} }
.code-back-image{
.code-back-image {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
} }
} }
} }
// 提示信息 // 提示信息
.footer{ .footer {
padding: 0 $padding + 10; padding: 0 $padding + 10;
.hith{
.hith {
color: $text-gray; color: $text-gray;
font-size: $title-size-sm; font-size: $title-size-sm;
padding-top: $padding + 10; padding-top: $padding + 10;
} }
.number {
background-color: $border-color-lg; .number {
padding: $padding - 5; background-color: $border-color-lg;
margin: $margin + 20 0; padding: $padding - 5;
font-size: $title-size-lg; margin: $margin + 20 0;
border-radius: 8rpx; font-size: $title-size-lg;
display: flex; border-radius: 8rpx;
.title { display: flex;
flex: 1;
} .title {
.value { flex: 1;
font-size: $title-size-m; }
color: $text-price;
} .value {
} font-size: $title-size-m;
.button { color: $text-price;
background: $text-price; }
border-radius: 0; }
height: 90rpx;
line-height: 90rpx; .button {
font-size: $title-size; background: $text-price;
color: white; border-radius: 0;
text-align: center; height: 90rpx;
border-radius: 8rpx; line-height: 90rpx;
} font-size: $title-size;
color: white;
text-align: center;
border-radius: 8rpx;
}
// number // number
// title // title
// value // value
// button // button
// title // title
} }
// 头像昵称 // 头像昵称
.codeCont { .codeCont {
position: absolute; position: absolute;
left: 10rpx; left: 10rpx;
bottom: 0; bottom: 0;
width: 100%; width: 100%;
padding: 16rpx 30rpx 20rpx; padding: 16rpx 30rpx 20rpx;
box-sizing: border-box; box-sizing: border-box;
z-index: 9; z-index: 9;
.codeCont-avatar {
width: 80rpx; .codeCont-avatar {
height: 80rpx; width: 80rpx;
border-radius: 50%; height: 80rpx;
border: 4rpx solid #FFFFFF; border-radius: 50%;
} border: 4rpx solid #FFFFFF;
.codeCont-text { }
position: absolute;
width: 100%; .codeCont-text {
left: 0; position: absolute;
top: 0; width: 100%;
padding: 14rpx 40rpx 0 140rpx; left: 0;
box-sizing: border-box; top: 0;
.codeCont-name { padding: 14rpx 40rpx 0 140rpx;
color: #FFFFFF; box-sizing: border-box;
font-size: $title-size;
margin-bottom: 10rpx; .codeCont-name {
} color: #FFFFFF;
.codeCont-number { font-size: $title-size;
font-size: $title-size-sm; margin-bottom: 10rpx;
display: flex; }
color: #c4a1cb;
} .codeCont-number {
} font-size: $title-size-sm;
.codeCont-img { display: flex;
width: 120rpx; color: #c4a1cb;
height: 120rpx; }
position: absolute; }
right: 50rpx;
bottom: 10rpx; .codeCont-img {
} width: 120rpx;
} height: 120rpx;
position: absolute;
right: 50rpx;
bottom: 10rpx;
}
}
// 日历 // 日历
.codDate { .codDate {
position: absolute; position: absolute;
top: 15rpx; top: 15rpx;
right: 70rpx; right: 70rpx;
z-index: 9; z-index: 9;
color: #FFFFFF; color: #FFFFFF;
text-align: center; text-align: center;
font-size: 24rpx; font-size: 24rpx;
border: 2rpx solid #fffefc; border: 2rpx solid #fffefc;
.codDate-year {
padding-top: 5rpx; .codDate-year {
} padding-top: 5rpx;
.codDate-day { }
padding: 5rpx 0;
font-size: 32rpx; .codDate-day {
font-weight: 600; padding: 5rpx 0;
border-bottom: 2rpx solid #a980c6; font-size: 32rpx;
} font-weight: 600;
.codDate-lunar { border-bottom: 2rpx solid #a980c6;
font-size: 24rpx; }
transform: scale(.9);
padding: 4rpx 0; .codDate-lunar {
} font-size: 24rpx;
} transform: scale(.9);
padding: 4rpx 0;
// canvas }
.my-canvas{ }
width: 375px;
height: 667px; // canvas
position: fixed; .my-canvas {
top: -99999999999rpx; width: 375px;
left: -99999999999rpx; height: 667px;
z-index: -99999999999; position: fixed;
opacity: 0; top: -99999999999rpx;
} left: -99999999999rpx;
.posterBack { z-index: -99999999999;
width: 100%; opacity: 0;
height: 100%; }
position: fixed;
background-color: rgba(0,0,0,.7); .posterBack {
left: 0; width: 100%;
top: 0; height: 100%;
} position: fixed;
.poster{ background-color: rgba(0, 0, 0, .7);
width: 100vw; left: 0;
height: 100vh; top: 0;
display: flex; }
flex-flow: column nowrap;
justify-content: center; .poster {
overflow: hidden; width: 100vw;
position: fixed; height: 100vh;
top: 0; display: flex;
left: 0; flex-flow: column nowrap;
z-index: 9; justify-content: center;
&-img{ overflow: hidden;
width: 580rpx; position: fixed;
position: relative; top: 0;
margin: 70rpx auto 20rpx; left: 0;
.img{ z-index: 9;
width: 100%;
} &-img {
} width: 580rpx;
&-btn{ position: relative;
padding: 0 $padding * 2; margin: 70rpx auto 20rpx;
.operate {
width: 100%; .img {
margin-bottom: 20rpx; width: 100%;
height: 80rpx; }
line-height: 80rpx; }
border-radius: 40rpx;
display: inline-block; &-btn {
text-align: center; padding: 0 $padding * 2;
color: #fff;
&-cancel{ .operate {
background-color: $text-price; width: 100%;
} margin-bottom: 20rpx;
} height: 80rpx;
} line-height: 80rpx;
} border-radius: 40rpx;
display: inline-block;
text-align: center;
color: #fff;
&-cancel {
background-color: $text-price;
}
}
}
}
</style> </style>

BIN
static/icons/share-pyq.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.6 KiB

BIN
static/icons/share-wx.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.5 KiB

14
uni_modules/uni-share/changelog.md Normal file
View File

@@ -0,0 +1,14 @@
## 2.0.0（2021-10-14）
支持监听返回操作(如：物理返回，全面屏手机侧滑)关闭分享弹窗
## 1.0.6（2021-08-25）
兼容vue3
## 1.0.5（2021-08-05）
优化代码实现，修改原来用`eval()`函数实现的逻辑
## 1.0.4（2021-06-07）
为符合苹果应用市场的审核，只显示存在对应的分享客户端的选项。如：配置包含微信分享，但是用户手机上并没有安装微信，就不显示微信分享。
## 1.0.2（2021-05-06）
修复错误的提示：“打包时未添加oauth模块”
## 1.0.1（2021-04-30）
新增完整示例
## 1.0.0（2021-04-28）
第1版发布

203
uni_modules/uni-share/js_sdk/uni-image-menu.js Normal file
View File

@@ -0,0 +1,203 @@
var nvMask, nvImageMenu;
class NvImageMenu {
constructor(arg) {
this.isShow = false
}
show({
list,
cancelText
}, callback) {
if (!list) {
list = [{
"img": "/static/sharemenu/wechatfriend.png",
"text": "图标文字"
}]
}
//以下为计算菜单的nview绘制布局，为固定算法，使用者无关关心
var screenWidth = plus.screen.resolutionWidth
//以360px宽度屏幕为例，上下左右边距及2排按钮边距留25像素，图标宽度55像素，同行图标间的间距在360宽的屏幕是30px，但需要动态计算，以此原则计算4列图标分别的left位置
//图标下的按钮文字距离图标5像素，文字大小12像素
//底部取消按钮高度固定为44px
//TODO 未处理横屏和pad，这些情况6个图标应该一排即可
var margin = 20,
iconWidth = 60,
icontextSpace = 5,
textHeight = 12
var left1 = margin / 360 * screenWidth
var iconSpace = (screenWidth - (left1 * 2) - (iconWidth * 4)) / 3 //屏幕宽度减去左右留白间距，再减去4个图标的宽度，就是3个同行图标的间距
if (iconSpace <= 5) { //屏幕过窄时，缩小边距和图标大小，再算一次
margin = 15
iconWidth = 40
left1 = margin / 360 * screenWidth
iconSpace = (screenWidth - (left1 * 2) - (iconWidth * 4)) / 3 //屏幕宽度减去左右留白间距，再减去4个图标的宽度，就是3个同行图标的间距
}
var left2 = left1 + iconWidth + iconSpace
var left3 = left1 + (iconWidth + iconSpace) * 2
var left4 = left1 + (iconWidth + iconSpace) * 3
var top1 = left1
var top2 = top1 + iconWidth + icontextSpace + textHeight + left1
const TOP = {
top1,
top2
},
LEFT = {
left1,
left2,
left3,
left4
};
nvMask = new plus.nativeObj.View("nvMask", { //先创建遮罩层
top: '0px',
left: '0px',
height: '100%',
width: '100%',
backgroundColor: 'rgba(0,0,0,0.2)'
});
nvImageMenu = new plus.nativeObj.View("nvImageMenu", { //创建底部图标菜单
bottom: '0px',
left: '0px',
height: (iconWidth + textHeight + 2 * margin) * Math.ceil(list.length / 4) + 44 +
'px', //'264px',
width: '100%',
backgroundColor: 'rgb(255,255,255)'
});
nvMask.addEventListener("click", () => { //处理遮罩层点击
// console.log('处理遮罩层点击');
this.hide()
callback({
event: "clickMask"
})
})
let myList = []
list.forEach((item, i) => {
myList.push({
tag: 'img',
src: item.img,
position: {
top: TOP['top' + (parseInt(i / 4) + 1)],
left: LEFT['left' + (1 + i % 4)],
width: iconWidth,
height: iconWidth
}
})
myList.push({
tag: 'font',
text: item.text,
textStyles: {
size: textHeight
},
position: {
top: TOP['top' + (parseInt(i / 4) + 1)] + iconWidth + icontextSpace,
left: LEFT['left' + (1 + i % 4)],
width: iconWidth,
height: textHeight
}
})
})
//绘制底部图标菜单的内容
nvImageMenu.draw([{
tag: 'rect', //菜单顶部的分割灰线
color: '#e7e7e7',
position: {
top: '0px',
height: '1px'
}
},
{
tag: 'font',
text: cancelText, //底部取消按钮的文字
textStyles: {
size: '14px'
},
position: {
bottom: '0px',
height: '44px'
}
},
{
tag: 'rect', //底部取消按钮的顶部边线
color: '#e7e7e7',
position: {
bottom: '45px',
height: '1px'
}
},
...myList
])
nvMask.show()
nvImageMenu.show()
// 开始动画
/*
plus.nativeObj.View.startAnimation({
type: 'slide-in-bottom',
duration: 300
}, nvImageMenu, {}, function() {
console.log('plus.nativeObj.View.startAnimation动画结束');
// 关闭原生动画
plus.nativeObj.View.clearAnimation();
nvImageMenu.show()
});
*/
this.isShow = true
nvImageMenu.addEventListener("click", e => { //处理底部图标菜单的点击事件，根据点击位置触发不同的逻辑
// console.log("click menu"+JSON.stringify(e));
if (e.screenY > plus.screen.resolutionHeight - 44) { //点击了底部取消按钮
// callback({event:"clickCancelButton"})
this.hide()
} else if (e.clientX < 5 || e.clientX > screenWidth - 5 || e.clientY < 5) {
//屏幕左右边缘5像素及菜单顶部5像素不处理点击
} else { //点击了图标按钮
var iClickIndex = -1 //点击的图标按钮序号，第一个图标按钮的index为0
var iRow = e.clientY < (top2 - (left1 / 2)) ? 0 : 1
var iCol = -1
if (e.clientX < (left2 - (iconSpace / 2))) {
iCol = 0
} else if (e.clientX < (left3 - (iconSpace / 2))) {
iCol = 1
} else if (e.clientX < (left4 - (iconSpace / 2))) {
iCol = 2
} else {
iCol = 3
}
if (iRow == 0) {
iClickIndex = iCol
} else {
iClickIndex = iCol + 4
}
// console.log("点击按钮的序号: " + iClickIndex);
// if (iClickIndex >= 0 && iClickIndex <= 5) { //处理具体的点击逻辑，此处也可以自行定义逻辑。如果增减了按钮，此处也需要跟着修改
// }
callback({
event: "clickMenu",
index: iClickIndex
})
}
})
/* nvImageMenu.addEventListener("touchstart", function(e) {
if (e.screenY > (plus.screen.resolutionHeight - 44)) {
//TODO 这里可以处理按下背景变灰的效果
}
})
nvImageMenu.addEventListener("touchmove", function(e) {
//TODO 这里可以处理按下背景变灰的效果
if (e.screenY > plus.screen.resolutionHeight - 44) {}
})
nvImageMenu.addEventListener("touchend", function(e) {
//TODO 这里可以处理释放背景恢复的效果
})
*/
}
hide() {
nvMask.hide()
nvImageMenu.hide()
this.isShow = false
}
}
export default NvImageMenu

98
uni_modules/uni-share/js_sdk/uni-share.js Normal file
View File

@@ -0,0 +1,98 @@
import UniImageMenu from './uni-image-menu.js';
class UniShare extends UniImageMenu{
constructor(arg) {
super()
this.isShow = super.isShow
}
async show(param, callback){
var menus = []
plus.share.getServices(services => { //只显示有服务的项目
services = services.filter(item => item.nativeClient)
let servicesList = services.map(e => e.id)
param.menus.forEach(item => {
if (servicesList.includes(item.share.provider) || typeof(item.share) == 'string') {
menus.push(item)
}
})
super.show({
list: menus,
cancelText: param.cancelText
}, e => {
callback(e)
if(e.event == 'clickMenu'){
if (typeof(menus[e.index]['share']) == 'string') {
this[menus[e.index]['share']](param)
} else {
uni.share({
...param.content,
...menus[e.index].share,
success: res=> {
console.log("success:" + JSON.stringify(res));
super.hide()
},
fail: function(err) {
console.log("fail:" + JSON.stringify(err));
uni.showModal({
content: JSON.stringify(err),
showCancel: false,
confirmText: "知道了"
});
}
})
}
}
})
}, err => {
uni.showModal({
title: '获取服务供应商失败：' + JSON.stringify(err),
showCancel: false,
confirmText: '知道了'
});
console.error('获取服务供应商失败：' + JSON.stringify(err));
})
}
hide(){
super.hide()
}
copyurl(param) {
console.log('copyurl',param);
uni.setClipboardData({
data: param.content.href,
success: ()=>{
console.log('success');
uni.hideToast() //关闭自带的toast
uni.showToast({
title: '复制成功',
icon: 'none'
});
super.hide();
},
fail: (err) => {
uni.showModal({
content: JSON.stringify(err),
showCancel: false
});
}
});
}
// 使用系统分享发送分享消息
shareSystem(param) {
console.log('shareSystem',param);
plus.share.sendWithSystem({
type: 'text',
content: param.content.title + param.content.summary || '',
href: param.content.href,
}, (e)=> {
console.log('分享成功');
super.hide()
}, (err)=> {
console.log('分享失败：' + JSON.stringify(err));
uni.showModal({
title: '获取服务供应商失败：' + JSON.stringify(err),
showCancel: false,
confirmText: '知道了'
});
});
}
}
export default UniShare

80
uni_modules/uni-share/package.json Normal file
View File

@@ -0,0 +1,80 @@
{
"id": "uni-share",
"displayName": "uni-share",
"version": "2.0.0",
"description": "底部弹出宫格图标式的分享菜单，可覆盖原生组件。",
"keywords": [
"分享菜单"
],
"repository": "",
"engines": {
"HBuilderX": "^3.1.0"
},
"dcloudext": {
"category": [
"JS SDK",
"通用 SDK"
],
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": ""
},
"uni_modules": {
"dependencies": [],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "n",
"Android Browser": "n",
"微信浏览器(Android)": "n",
"QQ浏览器(Android)": "n"
},
"H5-pc": {
"Chrome": "n",
"IE": "n",
"Edge": "n",
"Firefox": "n",
"Safari": "n"
},
"小程序": {
"微信": "n",
"阿里": "n",
"百度": "n",
"字节跳动": "n",
"QQ": "n"
},
"快应用": {
"华为": "n",
"联盟": "n"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}

85
uni_modules/uni-share/readme.md Normal file
View File

@@ -0,0 +1,85 @@
#### 本功能基于[底部图标菜单](https://ext.dcloud.net.cn/plugin?id=4858)封装而成。
### 示例代码
```
<template>
<button type="default" @click="uniShare">显示</button>
</template>
<script>
import uniShare from '@/uni_modules/uni-share/js_sdk/uni-share.js';
export default {
methods: {
uniShare() {
uniShare({
content: { //公共的分享参数配置 类型（type）、链接（herf）、标题（title）、summary（描述）、imageUrl（缩略图）
type: 0,
href: 'https://uniapp.dcloud.io/',
title: '标题',
summary: '描述',
imageUrl: 'https://img-cdn-aliyun.dcloud.net.cn/stream/icon/__UNI__HelloUniApp.png'
},
menus: [{
"img": "/static/app-plus/sharemenu/wechatfriend.png",
"text": "微信好友",
"share": { //当前项的分享参数配置。可覆盖公共的配置如下：分享到微信小程序，配置了type=5
"provider": "weixin",
"scene": "WXSceneSession"
}
},
{
"img": "/static/app-plus/sharemenu/wechatmoments.png",
"text": "微信朋友圈",
"share": {
"provider": "weixin",
"scene": "WXSenceTimeline"
}
},
{
"img": "/static/app-plus/sharemenu/mp_weixin.png",
"text": "微信小程序",
"share": {
provider: "weixin",
scene: "WXSceneSession",
type: 5,
miniProgram: {
id: '123',
path: '/pages/list/detail',
webUrl: '/#/pages/list/detail',
type: 0
},
}
},
{
"img": "/static/app-plus/sharemenu/weibo.png",
"text": "微博",
"share": {
"provider": "sinaweibo"
}
},
{
"img": "/static/app-plus/sharemenu/qq.png",
"text": "QQ",
"share": {
"provider": "qq"
}
},
{
"img": "/static/app-plus/sharemenu/copyurl.png",
"text": "复制",
"share": "copyurl"
},
{
"img": "/static/app-plus/sharemenu/more.png",
"text": "更多",
"share": "shareSystem"
}
],
cancelText: "取消分享",
}, e => { //callback
console.log(e);
})
}
}
}
</script>
```

32
unpackage/dist/dev/app-plus/app-service.js vendored
View File

File diff suppressed because one or more lines are too long