Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
M
mallapp
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
viitto
mallapp
Commits
588687ad
Commit
588687ad
authored
Aug 13, 2020
by
罗超
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
调整部分样式
parent
ca7feb03
Hide whitespace changes
Inline
Side-by-side
Showing
8 changed files
with
675 additions
and
285 deletions
+675
-285
App.vue
App.vue
+1
-0
index.vue
components/tabbar/index.vue
+3
-7
pages.json
pages.json
+50
-51
index.vue
pages/index/index.vue
+40
-12
draw.vue
pages/live/components/draw.vue
+0
-0
index.vue
pages/live/index.vue
+252
-215
share.vue
pages/live/share.vue
+329
-0
share.png
static/images/share.png
+0
-0
No files found.
App.vue
View file @
588687ad
...
...
@@ -31,6 +31,7 @@ export default {
},
(
res
)
=>
{
uni
.
setStorageSync
(
"basedata"
,
res
.
data
);
uni
.
setStorageSync
(
'navs'
,
res
.
data
.
navbar
.
navs
??[])
this
.
basedata
=
res
.
data
;
this
.
$uiConfig
.
mainColor
=
res
.
data
.
mall
.
setting
.
mallStyle
.
main
this
.
$uiConfig
.
secondary
=
res
.
data
.
mall
.
setting
.
mallStyle
.
secondary
...
...
components/tabbar/index.vue
View file @
588687ad
...
...
@@ -158,15 +158,11 @@ export default {
}
// #endif
});
if
(
uni
.
getStorageSync
(
"basedata"
)){
this
.
navs
=
uni
.
getStorageSync
(
"basedata"
)
?
uni
.
getStorageSync
(
"basedata"
).
navbar
.
navs
:
[];
if
(
uni
.
getStorageSync
(
"navs"
)){
this
.
navs
=
uni
.
getStorageSync
(
"navs"
)??[];
}
else
{
setTimeout
(()
=>
{
this
.
navs
=
uni
.
getStorageSync
(
"basedata"
)
?
uni
.
getStorageSync
(
"basedata"
).
navbar
.
navs
:
[];
this
.
navs
=
uni
.
getStorageSync
(
"navs"
)??[];
this
.
activeHandler
();
},
3000
)
}
...
...
pages.json
View file @
588687ad
...
...
@@ -2,13 +2,12 @@
"easycom"
:
{
"^u-(.*)"
:
"uview-ui/components/u-$1/u-$1.vue"
},
"pages"
:
[
{
"pages"
:
[{
"path"
:
"pages/index/index"
,
"enablePullDownRefresh"
:
true
,
"style"
:
{
"navigationStyle"
:
"custom"
}
"style"
:
{
"navigationStyle"
:
"custom"
}
},
{
"path"
:
"pages/cart/cart"
...
...
@@ -64,9 +63,8 @@
//
},
{
"root"
:
"pages/balance"
,
"pages"
:
[
{
"path"
:
"recharge"
"pages"
:
[{
"path"
:
"recharge"
},
{
"path"
:
"balance"
...
...
@@ -88,6 +86,8 @@
},
"pages"
:
[{
"path"
:
"index"
},
{
"path"
:
"share"
}]
},
{
...
...
@@ -97,41 +97,40 @@
},
{
"path"
:
"user-center"
,
"style"
:
{
"navigationStyle"
:
"custom"
}
"style"
:
{
"navigationStyle"
:
"custom"
}
}
]
},
{
"root"
:
"pages/mySupplier"
,
"pages"
:
[{
"path"
:
"index/index"
,
"style"
:
{
"navigationStyle"
:
"custom"
}
},
{
"path"
:
"myBill"
},
{
"path"
:
"billDetails"
},
{
"path"
:
"mySupplierList"
},
{
"path"
:
"myProduct"
},
{
"path"
:
"supplierOrder"
}
]
},
{
"root"
:
"pages/mySupplier"
,
"pages"
:
[
{
"path"
:
"index/index"
,
"style"
:
{
"navigationStyle"
:
"custom"
}
},{
"path"
:
"myBill"
},{
"path"
:
"billDetails"
},{
"path"
:
"mySupplierList"
},{
"path"
:
"myProduct"
},{
"path"
:
"supplierOrder"
}
]
},
{
"root"
:
"pages/share"
,
"pages"
:
[{
"path"
:
"index/index"
,
"style"
:
{
"navigationStyle"
:
"custom"
}
"style"
:
{
"navigationStyle"
:
"custom"
}
},
{
"path"
:
"add/add"
...
...
@@ -142,24 +141,24 @@
{
"path"
:
"level/level"
},
{
"path"
:
"level/level_t"
},
{
"path"
:
"level/level_t"
},
{
"path"
:
"examine"
},
{
"path"
:
"buyVip/index"
},
{
"path"
:
"vipBuyCommission/vipBuyCommission"
},
{
"path"
:
"buyRecord/index"
},
{
"path"
:
"buyInterest/index"
}
{
"path"
:
"buyVip/index"
},
{
"path"
:
"vipBuyCommission/vipBuyCommission"
},
{
"path"
:
"buyRecord/index"
},
{
"path"
:
"buyInterest/index"
}
]
},
{
...
...
pages/index/index.vue
View file @
588687ad
...
...
@@ -175,11 +175,26 @@ export default {
//兼容之前小程序的调转
this
.
getjump
(
options
.
scene
);
}
// #ifdef MP-WEIXIN
wx
.
showShareMenu
({
withShareTicket
:
true
,
menus
:
[
"shareAppMessage"
,
"shareTimeline"
],
});
if
(
uni
.
getStorageSync
(
'mall_UserInfo'
)){
let
uid
=
uni
.
getStorageSync
(
'mall_UserInfo'
).
UserId
wx
.
getUserInfo
({
success
:
function
(
res
)
{
let
msg
=
{
Id
:
uid
,
AliasName
:
res
.
userInfo
.
nickName
,
Photo
:
res
.
userInfo
.
avatarUrl
}
that
.
updateuserinfo
(
msg
)
},
});
}
// #endif
this
.
init
();
let
set
=
uni
.
getStorageSync
(
"basedata"
)
?
uni
.
getStorageSync
(
"basedata"
).
mall
.
setting
...
...
@@ -196,6 +211,7 @@ export default {
this
.
isShowBack
();
uni
.
showNavigationBarLoading
();
},
// #ifdef MP-WEIXIN
onShareTimeline
()
{
setTimeout
(()
=>
{
console
.
log
(
"分享调用"
);
...
...
@@ -227,6 +243,7 @@ export default {
imageUrl
:
this
.
setting
.
share_pic
?
this
.
setting
.
share_pic
:
""
,
};
},
// #endif
onShow
()
{
setTimeout
(()
=>
{
uni
.
hideNavigationBarLoading
();
...
...
@@ -236,15 +253,25 @@ export default {
},
methods
:
{
updateuserinfo
(
msg
){
this
.
request2
(
{
url
:
"/api/MemberUser/SetMemberPhoto"
,
data
:
msg
,
},
(
res
)
=>
{
//静默处理不做任何提示
},
(
error
)
=>
{}
);
},
goback
()
{
uni
.
navigateBack
({
delta
:
1
,
});
},
isShowBack
()
{
let
navs
=
uni
.
getStorageSync
(
"basedata"
)
?
uni
.
getStorageSync
(
"basedata"
).
navbar
.
navs
:
[];
let
navs
=
uni
.
getStorageSync
(
"navs"
)
??
[];
if
(
navs
)
{
let
t
=
getCurrentPages
();
let
query
=
t
[
t
.
length
-
1
].
__displayReporter
.
query
;
...
...
@@ -255,10 +282,10 @@ export default {
if
(
queryString
!=
""
)
{
queryString
=
"?"
+
queryString
.
substring
(
1
,
queryString
.
length
);
}
this
.
crtPath
=
"/"
+
t
[
t
.
length
-
1
].
route
+
queryString
;
let
crtPath
=
"/"
+
t
[
t
.
length
-
1
].
route
+
queryString
;
let
isExsit
=
false
;
navs
.
forEach
((
x
,
i
)
=>
{
if
(
x
.
url
==
this
.
crtPath
)
{
if
(
x
.
url
==
crtPath
)
{
isExsit
=
true
;
}
});
...
...
@@ -304,6 +331,9 @@ export default {
(
res
)
=>
{
this
.
indexPageData
=
res
.
data
.
home_pages
.
navs
[
0
].
template
.
data
;
this
.
myPageData
=
res
.
data
;
if
(
res
.
data
.
navbar
.
navs
)
{
uni
.
setStorageSync
(
"navs"
,
res
.
data
.
navbar
.
navs
);
}
uni
.
setStorageSync
(
"basedata"
,
res
.
data
);
if
(
res
.
data
.
home_pages
.
title
!=
""
)
{
if
(
this
.
pageId
==
0
)
{
...
...
@@ -344,7 +374,6 @@ export default {
},
formatBg
()
{
this
.
myPageData
.
home_pages
.
navs
.
forEach
((
y
)
=>
{
y
.
template
.
data
.
forEach
((
x
)
=>
{
if
(
x
.
id
==
"background"
)
{
let
t
=
""
;
...
...
@@ -379,10 +408,10 @@ export default {
}
// y.templateBg +="padding-bottom:"+(this.$uiConfig.is_bang ? '88px' : '60px')+";box-sizing: border-box;";
}
});
if
(
!
y
.
templateBg
)
{
y
.
templateBg
=
{
titleColor
:
"#000"
};
}
});
if
(
!
y
.
templateBg
)
{
y
.
templateBg
=
{
titleColor
:
"#000"
};
}
});
},
getReceive
()
{
...
...
@@ -443,7 +472,6 @@ export default {
border-bottom
:
12px
solid
black
;
position
:
fixed
;
right
:
65px
;
}
.index-title
{
line-height
:
45px
!important
;
...
...
pages/live/components/draw.vue
0 → 100644
View file @
588687ad
pages/live/index.vue
View file @
588687ad
<
template
>
<view
class=
"liveStyle"
:style=
"
{ height: contentHeight }">
<view
class=
"liveStyle"
:style=
"
{ height: contentHeight }">
<u-empty
v-if=
"g.length == 0"
text=
"暂无相关直播列表"
mode=
"list"
></u-empty>
<template
v-if=
"g.length > 0"
>
<view
style=
"
<template
v-if=
"g.length > 0"
>
<view
style=
"
height: calc(100vh - 50px);
width: calc(100vw - 20px);
margin-left: 10px;
overflow: hidden;
padding-top: 10px;
"
>
<scroll-view
:scroll-y=
"true"
:enable-back-to-top=
"true"
:enable-flex=
"true"
@
scrolltolower=
"lower"
:style=
"
{ height: '100%' ,}"
>
<view
class=
"u-good-list"
>
<u-row
gutter=
"20"
>
<u-col
span=
"6"
v-for=
"(cx, ci) in g"
:key=
"ci"
>
<view
class=
"good"
@
click=
"clickHandler(cx)"
>
<!--
<view
class=
"good-img"
:style=
"
{ 'background-image': 'url(' + (cx.cover_img ? cx.cover_img : '') + ')', backgroundSize: '100% 100%' }"> -->
<view
class=
"good-img"
:style=
"
{ 'background-image': 'url(' + (cx.cover_img ? cx.cover_img : '') + ')', backgroundSize: 'cover' ,'background-repeat': 'no-repeat'}">
<!-- 播放按钮 -->
<view
class=
"livebtn"
v-if=
'cx.live_status==104 || cx.live_status==105|| cx.live_status==106 '
></view>
<u-icon
name=
"play-circle-o"
v-if=
'cx.live_status==105'
color=
"#fff"
size=
"100"
style=
'position: absolute;left: 50%;top:50%;margin-left: -50rpx;margin-top: -50rpx;'
></u-icon>
<image
src=
"/static/images/jinbo.png"
v-if=
"cx.live_status==104"
style=
"width: 50px; height: 50px;position: absolute;left: 50%;top:50%;margin-left: -25px;margin-top: -25px;"
/>
<image
src=
"/static/images/yic.png"
v-if=
"cx.live_status==106"
style=
"width: 50px; height: 50px;position: absolute;left: 50%;top:50%;margin-left: -25px;margin-top: -25px;"
/>
</view>
<view
style=
"position: absolute;left: 0;bottom: 0;color: #FFFFFF;background: rgba(0, 0, 0, 0.5);width: 100%; padding: 5px 0;"
>
<view
class=
"good-info"
>
<u-avatar
:src=
"cx.anchor_img"
size=
"30"
></u-avatar>
<Text
style=
"font-size: 11px;margin-left: 5px;"
>
{{
cx
.
anchor_name
}}
</Text>
</view>
<view
class=
"good-name"
>
{{
cx
.
name
}}
</view>
</view>
<!-- 直播的状态 -->
<view
class=
"liveState"
v-if=
'cx.live_status==101'
style=
" background-image: linear-gradient(to right,#FF8FB9,#FF002A);"
>
<Text>
直播中
</Text>
</view>
<view
class=
"liveState"
v-if=
'cx.live_status==102'
style=
"background: #FFFFFF;color: #111111;"
>
<Text>
未开始
</Text>
</view>
<view
class=
"liveState"
v-if=
'cx.live_status==103'
>
<Text>
已结束
</Text>
</view>
<view
class=
"liveState"
v-if=
'cx.live_status==104'
>
<Text>
禁播
</Text>
</view>
<view
class=
"liveState"
v-if=
'cx.live_status==105'
>
<Text>
暂停
</Text>
</view>
<view
class=
"liveState"
v-if=
'cx.live_status==106'
>
<Text>
异常
</Text>
</view>
<view
class=
"liveState"
v-if=
'cx.live_status==107'
>
<Text>
已过期
</Text>
</view>
</view>
</u-col>
</u-row>
</view>
<u-loadmore
:status=
"status"
:load-text=
"loadText"
:font-size=
"24"
:margin-top=
"20"
:margin-bottom=
"20"
bg-color=
"#f3f4f6"
/>
</scroll-view>
</view>
"
>
<scroll-view
:scroll-y=
"true"
:enable-back-to-top=
"true"
:enable-flex=
"true"
@
scrolltolower=
"lower"
:style=
"
{ height: '100%' ,}"
>
<view
class=
"u-good-list"
>
<u-row
gutter=
"20"
>
<u-col
span=
"6"
v-for=
"(cx, ci) in g"
:key=
"ci"
>
<view
class=
"good"
@
click=
"clickHandler(cx)"
>
<image
src=
"../../static/images/share.png"
mode=
"widthFix"
class=
"share"
v-if=
"cx.ExtensionImg&&cx.ExtensionImg!=''"
@
click=
"goshare(cx.ExtensionImg)"
/>
<!--
<view
class=
"good-img"
:style=
"
{ 'background-image': 'url(' + (cx.cover_img ? cx.cover_img : '') + ')', backgroundSize: '100% 100%' }"> -->
<view
class=
"good-img"
:style=
"
{ 'background-image': 'url(' + (cx.cover_img ? cx.cover_img : '') + ')', backgroundSize: 'cover' ,'background-repeat': 'no-repeat'}"
>
<!-- 播放按钮 -->
<view
class=
"livebtn"
v-if=
"cx.live_status==104 || cx.live_status==105|| cx.live_status==106 "
></view>
<u-icon
name=
"play-circle-o"
v-if=
"cx.live_status==105"
color=
"#fff"
size=
"100"
style=
"position: absolute;left: 50%;top:50%;margin-left: -50rpx;margin-top: -50rpx;"
></u-icon>
<image
src=
"/static/images/jinbo.png"
v-if=
"cx.live_status==104"
style=
"width: 50px; height: 50px;position: absolute;left: 50%;top:50%;margin-left: -25px;margin-top: -25px;"
/>
<image
src=
"/static/images/yic.png"
v-if=
"cx.live_status==106"
style=
"width: 50px; height: 50px;position: absolute;left: 50%;top:50%;margin-left: -25px;margin-top: -25px;"
/>
</view>
<view
style=
"position: absolute;left: 0;bottom: 0;color: #FFFFFF;background: rgba(0, 0, 0, 0.5);width: 100%; padding: 5px 0;"
>
<view
class=
"good-info"
>
<u-avatar
:src=
"cx.anchor_img"
size=
"30"
></u-avatar>
<Text
style=
"font-size: 11px;margin-left: 5px;"
>
{{
cx
.
anchor_name
}}
</Text>
</view>
<view
class=
"good-name"
>
{{
cx
.
name
}}
</view>
</view>
<!-- 直播的状态 -->
<view
class=
"liveState"
v-if=
"cx.live_status==101"
style=
" background-image: linear-gradient(to right,#FF8FB9,#FF002A);"
>
<Text>
直播中
</Text>
</view>
<view
class=
"liveState"
v-if=
"cx.live_status==102"
style=
"background: #FFFFFF;color: #111111;"
>
<Text>
未开始
</Text>
</view>
<view
class=
"liveState"
v-if=
"cx.live_status==103"
>
<Text>
已结束
</Text>
</view>
<view
class=
"liveState"
v-if=
"cx.live_status==104"
>
<Text>
禁播
</Text>
</view>
<view
class=
"liveState"
v-if=
"cx.live_status==105"
>
<Text>
暂停
</Text>
</view>
<view
class=
"liveState"
v-if=
"cx.live_status==106"
>
<Text>
异常
</Text>
</view>
<view
class=
"liveState"
v-if=
"cx.live_status==107"
>
<Text>
已过期
</Text>
</view>
</view>
</u-col>
</u-row>
</view>
<u-loadmore
:status=
"status"
:load-text=
"loadText"
:font-size=
"24"
:margin-top=
"20"
:margin-bottom=
"20"
bg-color=
"#f3f4f6"
/>
</scroll-view>
</view>
</
template
>
<auth
v-if=
"showAuth"
@
changeuserinfo=
"reloadUserinfo"
@
gbAuth=
"gbAuth"
></auth>
<tabbars></tabbars>
<auth
v-if=
"showAuth"
@
changeuserinfo=
"reloadUserinfo"
@
gbAuth=
"gbAuth"
></auth>
<tabbars></tabbars>
</view>
</template>
<
script
>
import
auth
from
"@/components/auth/index.vue"
;
import
tabbars
from
'@/components/tabbar/index'
;
import
auth
from
"@/components/auth/index.vue"
;
import
tabbars
from
"@/components/tabbar/index"
;
export
default
{
components
:
{
tabbars
,
auth
},
components
:
{
tabbars
,
auth
,
},
data
()
{
return
{
mc
:
""
,
secondary
:
""
,
pageTitle
:
"直播列表"
,
contentHeight
:
0
,
g
:
[],
msg
:{
pageIndex
:
1
,
pageSize
:
10
,
contentHeight
:
0
,
g
:
[],
msg
:
{
pageIndex
:
1
,
pageSize
:
10
,
},
page_count
:
1
,
status
:
"loadmore"
,
...
...
@@ -112,31 +138,36 @@ export default {
loading
:
"努力加载中"
,
nomore
:
"没有更多了"
,
},
u
:
{},
showAuth
:
false
u
:
{},
showAuth
:
false
,
};
},
onLoad
(
option
)
{
this
.
mc
=
this
.
$uiConfig
.
mainColor
;
this
.
secondary
=
this
.
$uiConfig
.
secondary
;
let
c
=
this
.
$uiConfig
.
is_bang
?
80
:
52
;
this
.
contentHeight
=
this
.
$utils
.
calcContentHeight
(
c
-
40
)
+
"px"
;
let
c
=
this
.
$uiConfig
.
is_bang
?
80
:
52
;
this
.
contentHeight
=
this
.
$utils
.
calcContentHeight
(
c
-
40
)
+
"px"
;
this
.
initPage
();
uni
.
showNavigationBarLoading
();
this
.
u
=
uni
.
getStorageSync
(
'mall_UserInfo'
);
if
(
!
this
.
u
)
{
this
.
u
=
{
nickName
:
'未登录'
,
avatarUrl
:
''
};
this
.
showAuth
=
true
;
}
else
{
this
.
init
();
}
uni
.
showNavigationBarLoading
();
if
(
option
.
user_id
)
{
uni
.
setStorageSync
(
"pid"
,
{
pid
:
options
.
user_id
});
}
this
.
u
=
uni
.
getStorageSync
(
"mall_UserInfo"
);
if
(
!
this
.
u
)
{
this
.
u
=
{
nickName
:
"未登录"
,
avatarUrl
:
""
,
};
this
.
showAuth
=
true
;
}
else
{
this
.
init
();
}
},
methods
:
{
goshare
(
img
){
console
.
log
(
img
)
uni
.
navigateTo
({
url
:
'/pages/live/share?pic='
+
img
});
},
initPage
()
{
let
currentPages
=
getCurrentPages
();
let
u
=
"/"
+
currentPages
[
currentPages
.
length
-
1
].
route
;
...
...
@@ -152,124 +183,130 @@ export default {
title
:
this
.
pageTitle
,
});
},
clickHandler
(
cx
){
let
uid
=
uni
.
getStorageSync
(
'mall_UserInfo'
)
?
uni
.
getStorageSync
(
'mall_UserInfo'
).
UserId
:
0
;
let
customParams
=
encodeURIComponent
(
JSON
.
stringify
({
user_id
:
uid
}))
wx
.
navigateTo
({
url
:
`plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=
${
cx
.
roomid
}
&custom_params=
${
customParams
}
`
})
},
clickHandler
(
cx
)
{
let
uid
=
uni
.
getStorageSync
(
"mall_UserInfo"
)
?
uni
.
getStorageSync
(
"mall_UserInfo"
).
UserId
:
0
;
let
customParams
=
encodeURIComponent
(
JSON
.
stringify
({
user_id
:
uid
}));
wx
.
navigateTo
({
url
:
`plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=
${
cx
.
roomid
}
&custom_params=
${
customParams
}
`
,
});
},
init
()
{
uni
.
showLoading
({
title
:
'加载中'
});
this
.
request2
(
{
url
:
'/api/LiveHouse/GetLiveHouseList'
,
data
:
this
.
msg
},
res
=>
{
uni
.
hideLoading
();
uni
.
hideNavigationBarLoading
();
if
(
res
.
resultCode
==
1
){
this
.
g
=
this
.
g
.
concat
(
res
.
data
.
pageData
);
this
.
page_count
=
res
.
data
.
pageCount
;
if
(
this
.
page_count
==
1
)
{
this
.
status
=
"nomore"
;
}
}
}
);
uni
.
showLoading
({
title
:
"加载中"
,
});
this
.
request2
(
{
url
:
"/api/LiveHouse/GetLiveHouseList"
,
data
:
this
.
msg
,
},
(
res
)
=>
{
uni
.
hideLoading
();
uni
.
hideNavigationBarLoading
();
if
(
res
.
resultCode
==
1
)
{
this
.
g
=
this
.
g
.
concat
(
res
.
data
.
pageData
);
this
.
page_count
=
res
.
data
.
pageCount
;
if
(
this
.
page_count
==
1
)
{
this
.
status
=
"nomore"
;
}
}
}
);
},
lower
(
e
)
{
if
(
this
.
msg
.
pageIndex
<
this
.
page_count
)
{
this
.
msg
.
pageIndex
++
;
this
.
status
=
"loading"
;
this
.
init
();
}
else
{
this
.
status
=
"nomore"
;
}
},
reloadUserinfo
()
{
this
.
u
=
uni
.
getStorageSync
(
"mall_UserInfo"
);
// this.showAuth = false;
this
.
init
();
},
//关闭登录窗口
gbAuth
()
{
this
.
showAuth
=
false
;
},
lower
(
e
)
{
if
(
this
.
msg
.
pageIndex
<
this
.
page_count
)
{
this
.
msg
.
pageIndex
++
;
this
.
status
=
"loading"
;
this
.
init
();
}
else
{
this
.
status
=
"nomore"
;
}
},
reloadUserinfo
()
{
this
.
u
=
uni
.
getStorageSync
(
'mall_UserInfo'
);
// this.showAuth = false;
this
.
init
()
},
//关闭登录窗口
gbAuth
(){
this
.
showAuth
=
false
;
},
},
};
</
script
>
<
style
>
.liveStyle
{
background
:
#f3f4f6
;
}
.liveStyle
.u-good-list
.good
{
background
:
#fff
;
border-radius
:
10px
;
overflow
:
hidden
;
margin-bottom
:
10px
;
height
:
243px
;
position
:
relative
;
}
.liveStyle
.u-good-list
.good
.good-img
{
width
:
100%
;
height
:
243px
;
display
:
block
;
position
:
relative
;
}
.liveStyle
.u-good-list
.good
.good-name
{
overflow
:
hidden
;
text-overflow
:
ellipsis
;
display
:
-webkit-box
;
-webkit-line-clamp
:
1
;
-webkit-box-orient
:
vertical
;
margin-bottom
:
3px
;
font-size
:
13px
;
margin
:
7px
10px
;
height
:
18px
;
}
.liveStyle
.u-good-list
.good
.good-info
{
display
:
flex
;
margin
:
7px
10px
;
margin-top
:
0
;
flex-direction
:
row
;
align-items
:
center
;
}
.liveStyle
.u-good-list
.liveState
{
width
:
50px
;
height
:
20px
;
position
:
absolute
;
left
:
0
;
top
:
5px
;
display
:
flex
;
flex-direction
:
row
;
align-items
:
center
;
justify-content
:
center
;
background
:
rgba
(
0
,
0
,
0
,
0.5
);
border-bottom-right-radius
:
10px
;
border-top-right-radius
:
10px
;
font-size
:
11px
;
color
:
#FFFFFF
;
text-align
:
center
;
}
.liveStyle
{
background
:
#f3f4f6
;
}
.liveStyle
.u-good-list
.good
{
background
:
#fff
;
border-radius
:
10px
;
overflow
:
hidden
;
margin-bottom
:
10px
;
height
:
243px
;
position
:
relative
;
}
.liveStyle
.u-good-list
.good
.share
{
width
:
50
rpx
;
height
:
50
rpx
;
position
:
absolute
;
right
:
10px
;
top
:
5px
;
z-index
:
5
;
}
.liveStyle
.u-good-list
.good
.good-img
{
width
:
100%
;
height
:
243px
;
display
:
block
;
position
:
relative
;
}
.liveStyle
.u-good-list
.good
.good-name
{
overflow
:
hidden
;
text-overflow
:
ellipsis
;
display
:
-webkit-box
;
-webkit-line-clamp
:
1
;
-webkit-box-orient
:
vertical
;
margin-bottom
:
3px
;
font-size
:
13px
;
margin
:
7px
10px
;
height
:
18px
;
}
.liveStyle
.u-good-list
.good
.good-info
{
display
:
flex
;
margin
:
7px
10px
;
margin-top
:
0
;
flex-direction
:
row
;
align-items
:
center
;
}
.liveStyle
.u-good-list
.liveState
{
width
:
50px
;
height
:
20px
;
position
:
absolute
;
left
:
0
;
top
:
5px
;
display
:
flex
;
flex-direction
:
row
;
align-items
:
center
;
justify-content
:
center
;
background
:
rgba
(
0
,
0
,
0
,
0.5
);
.liveStyle
.livebtn
{
position
:
absolute
;
left
:
0
;
top
:
0
;
width
:
100%
;
height
:
100%
;
background
:
#999999
;
opacity
:
0.3
;
border-bottom-right-radius
:
10px
;
border-top-right-radius
:
10px
;
font-size
:
11px
;
color
:
#ffffff
;
text-align
:
center
;
}
}
.liveStyle
.livebtn
{
position
:
absolute
;
left
:
0
;
top
:
0
;
width
:
100%
;
height
:
100%
;
background
:
#999999
;
opacity
:
0.3
;
}
</
style
>
pages/live/share.vue
0 → 100644
View file @
588687ad
<
template
>
<view
class=
"qrcodeLiveStyle"
:style=
"
{'height':contentHeight}">
<u-top-tips
ref=
"uTips"
></u-top-tips>
<img
:src=
"tempPic"
mode=
"widthFix"
style=
"width: 320px;margin-top: 20px;"
/>
<canvas
canvas-id=
"firstCanvas"
class=
"sty-box"
@
error=
"canvasIdErrorCallback"
></canvas>
<view
class=
"btn"
:style=
"
{background:mainColor}" @click="preservation">
<Text>
保存海报
</Text>
</view>
</view>
</
template
>
<
script
>
export
default
{
data
()
{
return
{
pageTitle
:
"直播海报"
,
contentHeight
:
0
,
mainColor
:
""
,
qrcode
:
""
,
fenxqrcode
:
""
,
UserInfo
:
""
,
tempPic
:
""
,
bgPic
:
""
,
};
},
created
()
{
this
.
contentHeight
=
this
.
$utils
.
calcContentHeight
(
-
40
)
+
"px"
;
this
.
mainColor
=
this
.
$uiConfig
.
mainColor
;
this
.
secondary
=
this
.
$uiConfig
.
secondary
;
this
.
UserInfo
=
uni
.
getStorageSync
(
"mall_UserInfo"
)
?
uni
.
getStorageSync
(
"mall_UserInfo"
)
:
{};
},
onLoad
(
option
)
{
this
.
bgPic
=
option
.
pic
??
"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1597312414000_253.jpg"
;
},
onReady
()
{
this
.
init
();
},
mounted
()
{
uni
.
setNavigationBarTitle
({
title
:
this
.
pageTitle
,
});
},
methods
:
{
init
()
{
// uni.showNavigationBarLoading();
// this.request2(
// {
// url: "/api/AppletUser/GetFenXiaoPoster",
// data: {},
// },
// (res) => {
// uni.hideNavigationBarLoading();
// this.qrcode = res.data;
// this.getWeiXinQRCode();
// }
// );
this
.
getWeiXinQRCode
();
},
getWeiXinQRCode
()
{
let
that
=
this
;
uni
.
showNavigationBarLoading
();
that
.
request2
(
{
url
:
"/api/AppletUser/GetWeiXinQRCodeForApplet"
,
data
:
{
Path
:
"pages/live/index?user_id="
+
that
.
UserInfo
.
UserId
,
With
:
that
.
qrcode
.
QrCodeSize
,
},
},
(
res
)
=>
{
uni
.
hideNavigationBarLoading
();
that
.
fenxqrcode
=
that
.
host2
+
res
.
data
;
console
.
log
(
that
.
fenxqrcode
);
let
tmpTimeout
=
setTimeout
(()
=>
{
that
.
drawCtx
();
clearTimeout
(
tmpTimeout
);
},
100
);
}
);
},
drawCtx
()
{
uni
.
showLoading
({
title
:
"正在生成"
,
});
let
ctx
=
uni
.
createCanvasContext
(
"firstCanvas"
,
this
);
let
that
=
this
;
uni
.
getImageInfo
({
src
:
that
.
bgPic
,
success
:
function
(
image
)
{
console
.
log
(
"绘制"
);
ctx
.
drawImage
(
image
.
path
,
0
,
0
,
750
,
1344
);
//绘制图
uni
.
getImageInfo
({
//头像
src
:
that
.
fenxqrcode
,
success
:
function
(
image
)
{
ctx
.
save
();
ctx
.
beginPath
();
ctx
.
arc
(
595
+
63
,
1200
+
63
,
63
,
0
,
Math
.
PI
*
2
);
ctx
.
setFillStyle
(
"#ffffff"
);
ctx
.
fill
();
ctx
.
clip
();
ctx
.
drawImage
(
image
.
path
,
595
,
1200
,
126
,
126
);
//绘制头像
that
.
drawQrCode
(
ctx
);
},
});
// if (that.qrcode.IsShowNick == 0) {
// console.log("绘制文字");
// that.drawTitle(ctx); //绘制文字
// }
// if (that.qrcode.IsShowHead == 0) {
// console.log("绘制头像");
// uni.getImageInfo({
// //头像
// src: that.UserInfo.Photo,
// success: function (image) {
// ctx.save(); // 先保存状态 已便于画完圆再用
// ctx.beginPath(); //开始绘制
// //先画个圆
// ctx.arc(
// that.qrcode.HeadSize / 2 + that.qrcode.HeadPaddingLeft,
// that.qrcode.HeadSize / 2 + that.qrcode.HeadPaddingTop,
// that.qrcode.HeadSize / 2,
// 0,
// Math.PI * 2,
// false
// );
// ctx.clip(); //画了圆 再剪切 原始画布中剪切任意形状和尺寸。一旦剪切了某个区域,则所有之后的绘图都会被限制在被剪切的区域内
// ctx.drawImage(
// image.path,
// that.qrcode.HeadPaddingLeft,
// that.qrcode.HeadPaddingTop,
// that.qrcode.HeadSize,
// that.qrcode.HeadSize
// ); //绘制头像
// ctx.restore(); //恢复之前保存的绘图上下文 恢复之前保存的绘图上下午即状态 可以继续绘制
// if (that.qrcode.IsShowQrCode == 0) {
// //二维码
// console.log("绘制二维码");
// uni.getImageInfo({
// // src: that.UserInfo.Photo,
// src: that.fenxqrcode,
// success: function (image) {
// ctx.drawImage(
// image.path,
// that.qrcode.QrCodePaddingLeft,
// that.qrcode.QrCodePaddingTop,
// that.qrcode.QrCodeSize,
// that.qrcode.QrCodeSize
// ); //绘制头像
// that.drawQrCode(ctx);
// },
// });
// } else {
// that.drawQrCode(ctx);
// }
// },
// });
// } else {
// if (that.qrcode.IsShowQrCode == 0) {
// console.log("绘制二维码");
// } else {
// that.drawQrCode(ctx);
// }
// }
},
});
},
drawTitle
(
ctx
)
{
let
that
=
this
;
let
text
=
that
.
UserInfo
.
Name
;
ctx
.
setFillStyle
=
that
.
qrcode
.
NickColor
;
ctx
.
setFontSize
(
that
.
qrcode
.
NickSize
);
ctx
.
fillText
(
text
,
that
.
qrcode
.
NickPaddingLeft
,
that
.
qrcode
.
NickPaddingTop
);
ctx
.
restore
();
},
drawQrCode
(
ctx
)
{
let
that
=
this
;
console
.
log
(
"生成海报12"
);
setTimeout
(()
=>
{
ctx
.
draw
(
false
,
()
=>
{
uni
.
canvasToTempFilePath
(
{
x
:
0
,
y
:
0
,
width
:
750
,
height
:
1344
,
destWidth
:
750.0
,
destHeight
:
1344.0
,
canvasId
:
"firstCanvas"
,
success
:
(
res
)
=>
{
uni
.
hideLoading
();
that
.
tempPic
=
res
.
tempFilePath
;
},
fail
(
e
)
{
console
.
log
(
e
);
},
},
that
);
});
},
200
);
},
preservation
()
{
uni
.
showLoading
({
title
:
"正在生成"
,
});
let
that
=
this
;
uni
.
canvasToTempFilePath
(
{
canvasId
:
"firstCanvas"
,
success
:
(
res
)
=>
{
uni
.
hideLoading
();
uni
.
showLoading
({
title
:
"正在保存"
,
});
uni
.
saveImageToPhotosAlbum
({
filePath
:
res
.
tempFilePath
,
success
:
function
()
{
uni
.
showToast
({
title
:
"保存成功"
,
});
},
fail
:
function
(
err
)
{
if
(
err
.
errMsg
===
"saveImageToPhotosAlbum:fail auth deny"
)
{
uni
.
authorize
({
scope
:
"scope.writePhotosAlbum"
,
success
:
(
res
)
=>
{
console
.
log
(
"11111"
);
},
fail
:
(
res
)
=>
{
uni
.
showModal
({
content
:
"检测到您没打开保存到相册权限,是否去设置打开?"
,
confirmText
:
"确认"
,
cancelText
:
"取消"
,
success
:
(
res
)
=>
{
if
(
res
.
confirm
)
{
uni
.
openSetting
({
success
:
(
res
)
=>
{
console
.
log
(
res
);
if
(
res
.
authSetting
[
"scope.writePhotosAlbum"
])
{
that
.
preservation
();
}
},
});
}
else
{
console
.
log
(
"取消"
);
}
},
});
},
});
}
else
{
that
.
$refs
.
uTips
.
show
({
title
:
"保存失败,请稍后重试"
,
type
:
"error"
,
duration
:
"2300"
,
});
}
},
complete
:
function
()
{
uni
.
hideLoading
();
},
});
},
fail
:
function
(
e
)
{
console
.
log
(
e
);
that
.
$refs
.
uTips
.
show
({
title
:
"生成失败,请稍后重试"
,
type
:
"error"
,
duration
:
"2300"
,
});
},
},
this
);
},
},
};
</
script
>
<
style
>
.qrcodeLiveStyle
{
background
:
#f3f4f6
;
display
:
flex
;
flex-direction
:
column
;
align-items
:
center
;
}
.qrcodeLiveStyle
.btn
{
width
:
80%
;
height
:
50px
;
border-radius
:
25px
;
color
:
#fff
;
display
:
flex
;
align-items
:
center
;
justify-content
:
center
;
margin-top
:
20px
;
}
.qrcodeLiveStyle
.imgbox
{
width
:
70%
;
height
:
515px
;
margin-left
:
15%
;
position
:
relative
;
background-repeat
:
no-repeat
;
background-size
:
100%
515px
;
}
.qrcodeLiveStyle
.sty-box
{
width
:
750px
;
height
:
1344px
;
position
:
absolute
;
top
:
-1344px
;
left
:
-750px
;
}
</
style
>
static/images/share.png
0 → 100644
View file @
588687ad
1.2 KB
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment