xiugai
This commit is contained in:
parent
6bf4f315e6
commit
94e54f4815
2
.gitignore
vendored
Normal file
2
.gitignore
vendored
Normal file
@ -0,0 +1,2 @@
|
||||
# 忽略 node_modules 文件夹及其内容
|
||||
/node_modules/
|
||||
13
.tea/entryFiles-development/config$.js
Normal file
13
.tea/entryFiles-development/config$.js
Normal file
@ -0,0 +1,13 @@
|
||||
|
||||
const g = typeof global !== 'undefined' ? global : self;
|
||||
g.appXAppJson = {
|
||||
"app": {
|
||||
"$homepage": "pages/index/index",
|
||||
"plugins": {
|
||||
"myPlugin": {
|
||||
"version": "*",
|
||||
"provider": "3000000091373235"
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
4
.tea/entryFiles-development/importScripts$.js
Normal file
4
.tea/entryFiles-development/importScripts$.js
Normal file
@ -0,0 +1,4 @@
|
||||
if(!self.Map || !self.Set || !self.Symbol) {
|
||||
importScripts('https://gw.alipayobjects.com/as/g/appx_release/deps/1.0.3/es6-set-map-symbol.js');
|
||||
}
|
||||
|
||||
30
.tea/entryFiles-development/index$.web.js
Normal file
30
.tea/entryFiles-development/index$.web.js
Normal file
@ -0,0 +1,30 @@
|
||||
require('@alipay/appx-compiler/lib/sjsEnvInit');
|
||||
require('./config$');
|
||||
require('../../app');
|
||||
require('../../node_modules/mini-antui/es/am-icon/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../components/myEmpty/myEmpty?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../components/pursueItem/pursueItem?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../components/myFooter/myFooter?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../node_modules/mini-antui/es/list/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../node_modules/mini-antui/es/list/list-item/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../node_modules/mini-antui/es/popup/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../node_modules/mini-antui/es/flex/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../node_modules/mini-antui/es/flex/flex-item/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../components/myPay/myPay?hash=95d4e6a1d744881766987015bf4637f54936e766');
|
||||
require('../../node_modules/mini-antui/es/search-bar/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../node_modules/mini-antui/es/modal/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../node_modules/mini-antui/es/badge/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../node_modules/mini-antui/es/tabs/index?hash=b998354db5b64281090d8969355b2b3db41cda49');
|
||||
require('../../node_modules/mini-antui/es/tabs/tab-content/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../pages/index/index?hash=4c436b8802cde3a53b8da3fd201d0c5d124d1427');
|
||||
require('../../pages/discover/discover?hash=c38b953af6bdab8fe399141b33dd1ad1ceb7ea7f');
|
||||
require('../../pages/binge/binge?hash=6164953b5a1ef04f4f4f6e6561b545255541aa0c');
|
||||
require('../../pages/my/my?hash=75b5b8f1ecfabe3e2ac25d83ad8d5dac4aa47c98');
|
||||
require('../../pages/search/search?hash=aba215d007624a3ae18a69066f7987a8463d4c8c');
|
||||
require('../../pages/history/history?hash=496b52f9f456db6a9f22580be95fd2756db9e17d');
|
||||
require('../../pages/transaction/transaction?hash=496b52f9f456db6a9f22580be95fd2756db9e17d');
|
||||
require('../../pages/give/give?hash=496b52f9f456db6a9f22580be95fd2756db9e17d');
|
||||
require('../../pages/purchaseNotes/purchaseNotes?hash=c38b953af6bdab8fe399141b33dd1ad1ceb7ea7f');
|
||||
require('../../pages/video/video?hash=ab3ed3fe15953ba710981e31c5a541336f6b549b');
|
||||
require('../../pages/recharge/recharge?hash=c38b953af6bdab8fe399141b33dd1ad1ceb7ea7f');
|
||||
require('../../pages/videoAndroid/videoAndroid?hash=ab3ed3fe15953ba710981e31c5a541336f6b549b');
|
||||
67
.tea/entryFiles-development/index$.worker.js
Normal file
67
.tea/entryFiles-development/index$.worker.js
Normal file
@ -0,0 +1,67 @@
|
||||
if(!self.__appxInited) {
|
||||
self.__appxInited = 1;
|
||||
require('@alipay/appx-compiler/lib/sjsEnvInit');
|
||||
|
||||
require('./config$');
|
||||
|
||||
|
||||
function getUserAgentInPlatformWeb() {
|
||||
return typeof navigator !== 'undefined' ? navigator.swuserAgent || navigator.userAgent || '' : '';
|
||||
}
|
||||
if(getUserAgentInPlatformWeb() && (getUserAgentInPlatformWeb().indexOf('LyraVM') > 0 || getUserAgentInPlatformWeb().indexOf('AlipayIDE') > 0) ) {
|
||||
var AFAppX = self.AFAppX.getAppContext ? self.AFAppX.getAppContext().AFAppX : self.AFAppX;
|
||||
} else {
|
||||
importScripts('https://appx/af-appx.worker.min.js');
|
||||
var AFAppX = self.AFAppX;
|
||||
}
|
||||
self.getCurrentPages = AFAppX.getCurrentPages;
|
||||
self.getApp = AFAppX.getApp;
|
||||
self.Page = AFAppX.Page;
|
||||
self.App = AFAppX.App;
|
||||
self.my = AFAppX.bridge || AFAppX.abridge;
|
||||
self.abridge = self.my;
|
||||
self.Component = AFAppX.WorkerComponent || function(){};
|
||||
self.$global = AFAppX.$global;
|
||||
self.requirePlugin = AFAppX.requirePlugin;
|
||||
|
||||
|
||||
if(AFAppX.registerApp) {
|
||||
AFAppX.registerApp({
|
||||
appJSON: appXAppJson,
|
||||
});
|
||||
}
|
||||
|
||||
if(AFAppX.compilerConfig){ AFAppX.compilerConfig.component2 = true; }
|
||||
|
||||
function success() {
|
||||
require('../../app');
|
||||
require('../../node_modules/mini-antui/es/am-icon/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../components/myEmpty/myEmpty?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../components/pursueItem/pursueItem?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../components/myFooter/myFooter?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../node_modules/mini-antui/es/list/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../node_modules/mini-antui/es/list/list-item/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../node_modules/mini-antui/es/popup/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../node_modules/mini-antui/es/flex/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../node_modules/mini-antui/es/flex/flex-item/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../components/myPay/myPay?hash=95d4e6a1d744881766987015bf4637f54936e766');
|
||||
require('../../node_modules/mini-antui/es/search-bar/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../node_modules/mini-antui/es/modal/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../node_modules/mini-antui/es/badge/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../node_modules/mini-antui/es/tabs/index?hash=b998354db5b64281090d8969355b2b3db41cda49');
|
||||
require('../../node_modules/mini-antui/es/tabs/tab-content/index?hash=05d2a9730dd6009bf9446182f9c985f40f8c0f43');
|
||||
require('../../pages/index/index?hash=4c436b8802cde3a53b8da3fd201d0c5d124d1427');
|
||||
require('../../pages/discover/discover?hash=c38b953af6bdab8fe399141b33dd1ad1ceb7ea7f');
|
||||
require('../../pages/binge/binge?hash=6164953b5a1ef04f4f4f6e6561b545255541aa0c');
|
||||
require('../../pages/my/my?hash=75b5b8f1ecfabe3e2ac25d83ad8d5dac4aa47c98');
|
||||
require('../../pages/search/search?hash=aba215d007624a3ae18a69066f7987a8463d4c8c');
|
||||
require('../../pages/history/history?hash=496b52f9f456db6a9f22580be95fd2756db9e17d');
|
||||
require('../../pages/transaction/transaction?hash=496b52f9f456db6a9f22580be95fd2756db9e17d');
|
||||
require('../../pages/give/give?hash=496b52f9f456db6a9f22580be95fd2756db9e17d');
|
||||
require('../../pages/purchaseNotes/purchaseNotes?hash=c38b953af6bdab8fe399141b33dd1ad1ceb7ea7f');
|
||||
require('../../pages/video/video?hash=ab3ed3fe15953ba710981e31c5a541336f6b549b');
|
||||
require('../../pages/recharge/recharge?hash=c38b953af6bdab8fe399141b33dd1ad1ceb7ea7f');
|
||||
require('../../pages/videoAndroid/videoAndroid?hash=ab3ed3fe15953ba710981e31c5a541336f6b549b');
|
||||
}
|
||||
self.bootstrapApp ? self.bootstrapApp({ success }) : success();
|
||||
}
|
||||
@ -27,3 +27,4 @@ require('../../pages/give/give?hash=496b52f9f456db6a9f22580be95fd2756db9e17d');
|
||||
require('../../pages/purchaseNotes/purchaseNotes?hash=c38b953af6bdab8fe399141b33dd1ad1ceb7ea7f');
|
||||
require('../../pages/video/video?hash=ab3ed3fe15953ba710981e31c5a541336f6b549b');
|
||||
require('../../pages/recharge/recharge?hash=c38b953af6bdab8fe399141b33dd1ad1ceb7ea7f');
|
||||
require('../../pages/videoAndroid/videoAndroid?hash=ab3ed3fe15953ba710981e31c5a541336f6b549b');
|
||||
|
||||
File diff suppressed because one or more lines are too long
3
app.json
3
app.json
@ -10,7 +10,8 @@
|
||||
"pages/give/give",
|
||||
"pages/purchaseNotes/purchaseNotes",
|
||||
"pages/video/video",
|
||||
"pages/recharge/recharge"
|
||||
"pages/recharge/recharge",
|
||||
"pages/videoAndroid/videoAndroid"
|
||||
],
|
||||
"plugins": {
|
||||
"myPlugin": {
|
||||
|
||||
@ -11,6 +11,9 @@ Page({
|
||||
likelistFlag: false,
|
||||
},
|
||||
onShow() {
|
||||
this.setData({
|
||||
systemInfo: getApp().globalData.systemInfo
|
||||
})
|
||||
this.isGetList();
|
||||
},
|
||||
isGetList() {
|
||||
@ -84,12 +87,20 @@ Page({
|
||||
toPathVideo(event) {
|
||||
const data = event.target.dataset.item;
|
||||
const isEdit = this.data.isEdit;
|
||||
const systemInfo = this.data.systemInfo;
|
||||
if (isEdit) {
|
||||
this.onDelItem(data);
|
||||
} else {
|
||||
if (systemInfo.platform == 'android') {
|
||||
my.navigateTo({
|
||||
url: `/pages/video/video?sid=${data.bookid || data.id}`
|
||||
url: `/pages/videoAndroid/videoAndroid?sid=${data.id}`,
|
||||
});
|
||||
} else {
|
||||
my.navigateTo({
|
||||
url: `/pages/video/video?sid=${data.id}`
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
@ -3,7 +3,8 @@ const { httpRequest } = getApp();
|
||||
Page({
|
||||
data: {
|
||||
historyList: [],
|
||||
listFlag: false
|
||||
listFlag: false,
|
||||
systemInfo: {}
|
||||
},
|
||||
onShow() {
|
||||
my.showLoading({
|
||||
@ -18,7 +19,8 @@ Page({
|
||||
if (res.status == 1 && Array.isArray(res.data)) {
|
||||
this.setData({
|
||||
historyList: res.data,
|
||||
listFlag: true
|
||||
listFlag: true,
|
||||
systemInfo: getApp().globalData.systemInfo
|
||||
})
|
||||
}
|
||||
})
|
||||
@ -26,8 +28,16 @@ Page({
|
||||
},
|
||||
toGetVideo(event) {
|
||||
const data = event.target.dataset.item;
|
||||
const systemInfo = this.data.systemInfo;
|
||||
if (systemInfo.platform == 'android') {
|
||||
my.navigateTo({
|
||||
url: `/pages/videoAndroid/videoAndroid?sid=${data.sid}&id=${data.chapterid || ""}`,
|
||||
});
|
||||
} else {
|
||||
my.navigateTo({
|
||||
url: `/pages/video/video?sid=${data.sid}&id=${data.chapterid || ""}`,
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
@ -10,9 +10,13 @@ Page({
|
||||
module1: [],
|
||||
module2: [],
|
||||
module3: [],
|
||||
}
|
||||
},
|
||||
systemInfo: {}
|
||||
},
|
||||
onShow() {
|
||||
this.setData({
|
||||
systemInfo: getApp().globalData.systemInfo
|
||||
})
|
||||
// 页面显示
|
||||
this.isGetList();
|
||||
},
|
||||
@ -69,10 +73,19 @@ Page({
|
||||
},
|
||||
|
||||
navgetHistory() {
|
||||
const systemInfo = this.data.systemInfo;
|
||||
if (systemInfo.platform == 'android') {
|
||||
my.navigateTo({
|
||||
url: `/pages/videoAndroid/videoAndroid?sid=${this.history.sid}&id=${this.history.id || ""
|
||||
}`,
|
||||
});
|
||||
} else {
|
||||
my.navigateTo({
|
||||
url: `/pages/video/video?sid=${this.history.sid}&id=${this.history.id || ""
|
||||
}`,
|
||||
});
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
getSearch() {
|
||||
@ -83,10 +96,17 @@ Page({
|
||||
|
||||
toPathVideo(event) {
|
||||
const data = event.target.dataset.item;
|
||||
console.log(data, "datadata")
|
||||
|
||||
const systemInfo = this.data.systemInfo;
|
||||
if (systemInfo.platform == 'android') {
|
||||
my.navigateTo({
|
||||
url: `/pages/videoAndroid/videoAndroid?sid=${data.id}`,
|
||||
});
|
||||
} else {
|
||||
my.navigateTo({
|
||||
url: `/pages/video/video?sid=${data.id}`
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
onHide() {
|
||||
|
||||
400
pages/videoAndroid/videoAndroid.acss
Normal file
400
pages/videoAndroid/videoAndroid.acss
Normal file
@ -0,0 +1,400 @@
|
||||
page {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color:#000;
|
||||
}
|
||||
|
||||
._video_html{
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
|
||||
._video_box {
|
||||
flex: 1;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
._video_swiper {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: 66;
|
||||
}
|
||||
|
||||
.swiper_item {
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.swiper_item_warp {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
._video_pay_warp {
|
||||
flex: 1;
|
||||
flex-shrink: 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.swiper_video_box{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 1;
|
||||
/* pointer-events:none; */
|
||||
will-change: transform;
|
||||
}
|
||||
|
||||
.swiper_video_box_android {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 1;
|
||||
pointer-events:none;
|
||||
will-change: transform;
|
||||
}
|
||||
|
||||
._video_pay_bg_cover {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
._video_pay_bg_cover_img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
._swiper_video_cover {
|
||||
position: absolute;
|
||||
bottom: 180rpx;
|
||||
right: 30rpx;
|
||||
z-index: 2;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
._chasing_dramas_cover {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
._chasing_dramas_text {
|
||||
background-color: transparent;
|
||||
color: #fff;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.swiper_pay_modal {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 3;
|
||||
background-color: rgba(0, 0, 0, 0.45);
|
||||
}
|
||||
|
||||
.sw_pay_mo_order {
|
||||
font-size: 46rpx;
|
||||
font-weight: 700;
|
||||
color: #fff;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.sw_pay_isAutoplay_tips {
|
||||
margin-top: 40rpx;
|
||||
background-color: transparent;
|
||||
font-size: 46rpx;
|
||||
font-weight: 700;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.sw_pay_isAutoplay_tips_support {
|
||||
margin-top: 40rpx;
|
||||
background-color: transparent;
|
||||
font-size: 30rpx;
|
||||
font-weight: 700;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.sw_pay_isAutoplay_btn {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 350rpx;
|
||||
height: 80rpx;
|
||||
line-height: 1;
|
||||
background-color: #FF2B2B;
|
||||
margin-top: 40rpx;
|
||||
border-radius: 16rpx;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.sw_pay_isAutoplay_btn >text {
|
||||
font-size: 26rpx;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
._video_series {
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
|
||||
._video_series_box {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 140rpx;
|
||||
padding: 0 30rpx;
|
||||
}
|
||||
|
||||
._video_series_left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
._video_series_right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
._video_series_right_text {
|
||||
font-size: 32rpx;
|
||||
color: #fff;
|
||||
margin-right: 10rpx;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
._vi_ser_le_img {
|
||||
width: 88rpx;
|
||||
height: 56rpx;
|
||||
}
|
||||
|
||||
._vi_ser_le_order {
|
||||
font-size: 28rpx;
|
||||
color: #fff;
|
||||
margin-left: 16rpx;
|
||||
}
|
||||
|
||||
/* 加入追剧 */
|
||||
/* ._chasing_dramas_modal {
|
||||
|
||||
} */
|
||||
|
||||
._chasing_dramas_mo_header {
|
||||
|
||||
}
|
||||
|
||||
._ch_dr_mp_he_title >text {
|
||||
font-size: 34rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
._ch_dr_mp_he_content >text {
|
||||
color: #7F7F7F;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
._ch_dr_mp_footer {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
._ch_mo_footer_close,
|
||||
._ch_mo_footer_submit {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
._ch_mo_footer_close> text {
|
||||
font-size: 30rpx;
|
||||
color: #e24848;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
._ch_mo_footer_submit {
|
||||
background-color: #e24848;
|
||||
}
|
||||
|
||||
._ch_mo_footer_submit >text {
|
||||
font-size: 30rpx;
|
||||
color: #fff;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
._popup_order_content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
height: 740rpx;
|
||||
background: linear-gradient(180deg, #ffe2e2 0%, #ffffff 50%);
|
||||
border-radius: 24rpx 24rpx 0 0;
|
||||
}
|
||||
|
||||
._pop_order_con_header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 100rpx;
|
||||
padding: 0 30rpx;
|
||||
}
|
||||
|
||||
._pop_order_con_tabs {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
._pop_ord_hea_left {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
._pop_ord_hea_le_title {
|
||||
max-width: 360rpx;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
._pop_ord_hea_le_title >text {
|
||||
font-size: 36rpx;
|
||||
color: #333;
|
||||
font-weight: 700;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
._pop_ord_hea_le_all{
|
||||
margin-left: 8rpx;
|
||||
}
|
||||
|
||||
._pop_ord_hea_le_all>text {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
|
||||
._video_html .am-popup {
|
||||
z-index: 99;
|
||||
}
|
||||
/* ._pop_order_con_tabs {
|
||||
padding: 0 30rpx;
|
||||
} */
|
||||
|
||||
/* ._pop_order_con_warp {
|
||||
padding-left:30rpx ;
|
||||
} */
|
||||
._pop_order__tabs .am-tabs-bar-tab {
|
||||
padding: 0 30rpx;
|
||||
justify-content: flex-start;
|
||||
width: auto !important;
|
||||
}
|
||||
|
||||
._pop_order__tabs .am-tabs-pane-wrap {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
._pop_order__tabs .am-tabs-bar-tab,
|
||||
._pop_order__tabs .am-tabs-bar{
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
._pop_order__tabs .am-tabs-scroll-right{
|
||||
background: transparent !important;
|
||||
}
|
||||
._pop_order__tabs .am-tabs-scroll-left{
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
._pop_order__tabs .am-tabs-content-wrap {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
._pop_order__tabs .tab_c_list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
padding: 30rpx 10rpx 0 30rpx ;
|
||||
}
|
||||
|
||||
.tab_c_list_ul {
|
||||
width: 16.66%;
|
||||
padding-right: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.tab_c_list_ul_li {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
background-color: #e1e1e1;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
|
||||
.tab_c_list_ul_li.active {
|
||||
background-color: #ff779e;
|
||||
}
|
||||
|
||||
.tab_c_list_ul_li.active text {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.tab_c_list_ul_li text {
|
||||
font-size: 26rpx;
|
||||
color: #333;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.tab_c__ul_li_lock {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
background-color: #B5C0C7;
|
||||
border-radius: 0 8rpx 0 8rpx ;
|
||||
}
|
||||
|
||||
._li_lock_image {
|
||||
display: block;
|
||||
width: 22rpx;
|
||||
height: 22rpx;
|
||||
}
|
||||
143
pages/videoAndroid/videoAndroid.axml
Normal file
143
pages/videoAndroid/videoAndroid.axml
Normal file
@ -0,0 +1,143 @@
|
||||
<view class="_video_html">
|
||||
<view class="_video_box" id="_video_box">
|
||||
<swiper class="_video_swiper" duration={{200}} vertical={{true}} current={{swiperCurrent}} onChange="handelswiperCurrent"
|
||||
disable-touch={{false}}>
|
||||
<block a:for={{batchAllList}}>
|
||||
<swiper-item key="swiper_item_{{index}}" class="swiper_item">
|
||||
<view class="swiper_item_warp">
|
||||
<!-- 播放 -->
|
||||
<view class="_video_pay_warp">
|
||||
<!--<view class="swiper_item" style="background:pink"></view> -->
|
||||
<!--<block a:if={{videoInfoObj.chackpay == 1 && swiperOrder == item.order}}> -->
|
||||
<block a:if={{videoInfoObj.chackpay == 1}}>
|
||||
<block a:if={{videoInfoObj.order == item.order}}>
|
||||
<video class="swiper_video_box" src={{videoInfoObj.video_url}} autoplay={{(videoInfoObj.chackpay == 1 && videoInfoObj.order == item.order && pageHideFlag) ? true: false }}
|
||||
poster={{posterCover}} onError="videoErrorFn" objectFit="contain" show-mute-btn={{false}} onEnded="videoEndedFn"
|
||||
></video>
|
||||
<!-- onTimeUpdate="onTimeUpdate" controls={{false}} -->
|
||||
</block>
|
||||
|
||||
<block a:else>
|
||||
<view class="_video_pay_bg_cover">
|
||||
<image mode="scaleToFill" src={{posterCover}} class="_video_pay_bg_cover_img" />
|
||||
</view>
|
||||
</block>
|
||||
</block>
|
||||
|
||||
<!--<block a:elif={{ item.isvip == 1}}> -->
|
||||
<!--<block a:if={{(iosPayment.status === 2 || systemInfo.platform != 'ios') && videoInfoObj.isvip == 1}}> -->
|
||||
<block a:if={{ videoInfoObj.chackpay == 2 && item.isvip == 1}}>
|
||||
<view class="_video_pay_bg_cover">
|
||||
<image mode="scaleToFill" src={{posterCover}} class="_video_pay_bg_cover_img" />
|
||||
</view>
|
||||
<!--<cover-view class="swiper_pay_modal" onTap="toPathPlayPage"><cover-view class="sw_pay_mo_order">第 {{videoInfoObj.order}} 集</cover-view><cover-view class="sw_pay_isAutoplay_tips">此剧为付费内容，您的K币不足</cover-view><cover-view class="sw_pay_isAutoplay_tips_support">支持创作作者，解锁后继续观看</cover-view><cover-view class="sw_pay_isAutoplay_btn" onTap="toPathPlayPage">立即充值</cover-view></cover-view> -->
|
||||
<view class="swiper_pay_modal">
|
||||
<view class="sw_pay_mo_order">第 {{videoInfoObj.order}} 集</view>
|
||||
<view class="sw_pay_isAutoplay_tips">此剧为付费内容，您的K币不足</view>
|
||||
<view class="sw_pay_isAutoplay_tips_support">支持创作作者，解锁后继续观看</view>
|
||||
<view class="sw_pay_isAutoplay_btn" onTap="toPathPlayPage">立即充值</view>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<block a:if={{ videoInfoObj.chackpay == 3 && item.isvip == 1}}>
|
||||
<view class="_video_pay_bg_cover">
|
||||
<image mode="scaleToFill" src={{posterCover}} class="_video_pay_bg_cover_img" />
|
||||
</view>
|
||||
<!--<cover-view class="swiper_pay_modal"><cover-view class="sw_pay_isAutoplay_tips">此剧为付费内容，需要购全集</cover-view><cover-view class="sw_pay_isAutoplay_tips_support">支持创作作者，解锁后继续观看</cover-view><cover-view class="sw_pay_isAutoplay_btn" onTap="toPathPlayAllOrder">立即购买 ( {{videoInfoObj.allprice}}K币 )</cover-view></cover-view> -->
|
||||
<view class="swiper_pay_modal">
|
||||
<view class="sw_pay_isAutoplay_tips">此剧为付费内容，需要购全集</view>
|
||||
<view class="sw_pay_isAutoplay_tips_support">支持创作作者，解锁后继续观看</view>
|
||||
<view class="sw_pay_isAutoplay_btn" onTap="toPathPlayAllOrder">立即购买 ( {{videoInfoObj.allprice}}K币 )</view>
|
||||
</view>
|
||||
</block>
|
||||
<!--</block> -->
|
||||
|
||||
<block a:if={{videoInfoObj.chackpay == 1 && item.isvip == 0}}>
|
||||
<!--<cover-view class="_swiper_video_cover"><cover-view class="_chasing_dramas_cover" onTap="addChasingDramasFn"><am-icon type="heart" size="{{30}}" color="{{videoInfoObj.iskeep === 0 ? '#ffffff' :'#FF2B2B'}}" /><cover-view class="_chasing_dramas_text">追剧</cover-view></cover-view></cover-view> -->
|
||||
<view class="_swiper_video_cover">
|
||||
<view class="_chasing_dramas_cover" onTap="addChasingDramasFn">
|
||||
<am-icon type="heart" size="{{30}}" color="{{videoInfoObj.iskeep === 0 ? '#ffffff' :'#FF2B2B'}}" />
|
||||
<view class="_chasing_dramas_text">追剧</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
|
||||
<block a:if={{swiperOrder}}>
|
||||
<view class="_video_series" onTap="selectEpisodesFn">
|
||||
<view class="_video_series_box">
|
||||
<view class="_video_series_left">
|
||||
<view class="_vi_ser_le_img">
|
||||
<image mode="scaleToFill" src="{{imageBasUrl}}/iamge/video-bottom.png" class="_is_image" />
|
||||
</view>
|
||||
<view class="_vi_ser_le_order">
|
||||
<!--<text>第 {{videoInfoObj.order}} 集</text> -->
|
||||
<text>第 {{item.order}} 集</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="_video_series_right">
|
||||
<view class="_video_series_right_text">
|
||||
选集
|
||||
</view>
|
||||
<am-icon type="arrow-right" size="{{18}}" color="#fff" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
</view >
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
</view>
|
||||
|
||||
<popup show="{{orderPopupShow}}" position="bottom" onClose="closeOrderPopup">
|
||||
<view class="_popup_order_content">
|
||||
<view class="_pop_order_con_header">
|
||||
<view class="_pop_ord_hea_left">
|
||||
<view class="_pop_ord_hea_le_title">
|
||||
<text>{{videoInfoObj.title}}</text>
|
||||
</view>
|
||||
<view class="_pop_ord_hea_le_all">
|
||||
<text>全{{videoInfoObj.total}}集</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="_pop_ord_hea_right" onTap="closeOrderPopup">
|
||||
<am-icon type="cross" size="{{18}}" color="#333" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="_pop_order_con_tabs">
|
||||
<tabs tabs={{orderList}} onTabClick="handleTabClick" activeTab="{{activeTab}} " className="_pop_order__tabs" tabBarActiveTextColor="#ff779e"
|
||||
tabBarInactiveTextColor="#333" tabBarUnderlineColor="#ff779e">
|
||||
|
||||
<block a:for={{orderList}}>
|
||||
<tab-content key={{index}}>
|
||||
<view class="tab_c_list">
|
||||
<block a:for="{{item.temp}}" a:for-index="idx" a:for-item="j">
|
||||
<view class="tab_c_list_ul" key={{j.order}}>
|
||||
<view class="tab_c_list_ul_li {{j.id == videoInfoObj.id ? 'active' :'' }}" data-item={{j}} onTap="handleOrderCurrent">
|
||||
<text>{{j.order}}</text>
|
||||
<block a:if={{j.isvip == 1}}>
|
||||
<view class="tab_c__ul_li_lock">
|
||||
<image mode="scaleToFill" src="{{imageBasUrl}}/iamge/videoLock.png" class="_li_lock_image" />
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</tab-content>
|
||||
</block>
|
||||
|
||||
</tabs>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</popup>
|
||||
|
||||
<view>
|
||||
<my-pay popupShow="{{popupShow}}" onClosePopup="onClosePopup" />
|
||||
</view>
|
||||
|
||||
</view>
|
||||
471
pages/videoAndroid/videoAndroid.js
Normal file
471
pages/videoAndroid/videoAndroid.js
Normal file
@ -0,0 +1,471 @@
|
||||
import { imageBasUrl } from '../../utils/config'
|
||||
const { httpRequest } = getApp();
|
||||
// import { throttle } from 'lodash';
|
||||
// import { throttle } from '../../utils/throttle'
|
||||
var _ = require('underscore');
|
||||
|
||||
|
||||
Page({
|
||||
data: {
|
||||
imageBasUrl,
|
||||
// swiperItemHeight: 0,
|
||||
orderList: [],
|
||||
videoInfoObj: {},
|
||||
posterCover: '',
|
||||
activeTab: 0,
|
||||
orderPopupShow: false,
|
||||
systemInfo: {},
|
||||
userInfo: {},
|
||||
iosPayment: {},
|
||||
swiperList: [],
|
||||
swiperCurrent: 0,
|
||||
changeCuurent: 0,
|
||||
swiperOrder: 0,
|
||||
sid: '',
|
||||
popupShow: false,
|
||||
batchAllOrder: 0,
|
||||
batchAllList: [],
|
||||
isThrottle: null,
|
||||
pageHideFlag: true
|
||||
},
|
||||
// 获取其它信息
|
||||
isOtherFn() {
|
||||
// my.createSelectorQuery().select('#_video_box').boundingClientRect().exec((r) => {
|
||||
// this.setData({
|
||||
// swiperItemHeight: r[0].height
|
||||
// })
|
||||
// });
|
||||
this.setData({
|
||||
userInfo: getApp().globalData.userInfo,
|
||||
systemInfo: getApp().globalData.systemInfo
|
||||
})
|
||||
},
|
||||
|
||||
// 处理弹框的集数
|
||||
handelOrder(isBatchlist) {
|
||||
|
||||
const num = 30;
|
||||
let remain = 0;
|
||||
let temp = [];
|
||||
const mlist = [];
|
||||
let orderObj = {};
|
||||
if (Array.isArray(isBatchlist.data)) {
|
||||
isBatchlist.data.forEach((m, idx) => {
|
||||
if ((num * remain + num) < m.order) {
|
||||
remain += 1;
|
||||
temp = [];
|
||||
}
|
||||
temp.push(m);
|
||||
orderObj[remain] = {
|
||||
firstNum: num * remain + 1,
|
||||
lastNum: m.order,
|
||||
title: `${num * remain + 1}-${m.order}`,
|
||||
temp: temp
|
||||
}
|
||||
});
|
||||
|
||||
Object.keys(orderObj).map((m) => {
|
||||
mlist.push(orderObj[m]);
|
||||
})
|
||||
return {
|
||||
orderList: mlist,
|
||||
batchAllOrder: isBatchlist.data.length,
|
||||
batchAllList: isBatchlist.data,
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
orderList: [],
|
||||
batchAllOrder: 0,
|
||||
batchAllList: []
|
||||
}
|
||||
},
|
||||
|
||||
handelOrderIsVip(resData) {
|
||||
const orderList = this.data.orderList;
|
||||
const batchAllList = this.data.batchAllList;
|
||||
// swiperList.splice(current, 1, resData);
|
||||
if (resData.chackpay == 1) {
|
||||
const ols = [];
|
||||
orderList.forEach((j) => {
|
||||
let jb = {
|
||||
...j
|
||||
}
|
||||
const yus = [];
|
||||
j.temp.forEach((y) => {
|
||||
let yobj = {
|
||||
...y,
|
||||
}
|
||||
if (yobj.id == resData.id) {
|
||||
yobj.isvip = 0;
|
||||
}
|
||||
yus.push(yobj);
|
||||
})
|
||||
jb.temp = yus;
|
||||
ols.push(jb);
|
||||
})
|
||||
let newBatchAllList = [...batchAllList];
|
||||
newBatchAllList[resData.order - 1].isvip = 0;
|
||||
this.setData({
|
||||
batchAllList: newBatchAllList
|
||||
})
|
||||
|
||||
return ols;
|
||||
}
|
||||
return orderList;
|
||||
},
|
||||
|
||||
// 获取 剧情
|
||||
async isVideoPaymentFn(sid) {
|
||||
const paramVideo = {
|
||||
path: '/videoread',
|
||||
method: 'POST',
|
||||
body: {
|
||||
sid: sid
|
||||
}
|
||||
}
|
||||
|
||||
const videoRead = await httpRequest(paramVideo);
|
||||
|
||||
if (Array.isArray(videoRead.data)) {
|
||||
|
||||
const videoInfoObj = videoRead.data[0];
|
||||
const paramenter = {
|
||||
path: '/batchlist',
|
||||
method: 'POST',
|
||||
body: {
|
||||
sid: videoInfoObj.sid,
|
||||
start: 1,
|
||||
end: videoInfoObj.total
|
||||
}
|
||||
}
|
||||
const isBatchlist = await httpRequest(paramenter);
|
||||
const selectOrderInfo = this.handelOrder(isBatchlist);
|
||||
console.log(selectOrderInfo, "selectOrderInfo")
|
||||
|
||||
this.setData({
|
||||
swiperOrder: videoInfoObj.order,
|
||||
videoInfoObj: videoInfoObj,
|
||||
swiperCurrent: videoInfoObj.order - 1,
|
||||
changeCuurent: videoInfoObj.order - 1,
|
||||
posterCover: videoInfoObj.videocover || videoInfoObj.cover,
|
||||
orderList: selectOrderInfo.orderList,
|
||||
batchAllOrder: selectOrderInfo.batchAllList,
|
||||
batchAllList: selectOrderInfo.batchAllList,
|
||||
})
|
||||
|
||||
my.setNavigationBar({
|
||||
title: videoInfoObj.title,
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
toPathPlayAllOrder() {
|
||||
|
||||
const videoInfoObj = this.data.videoInfoObj;
|
||||
const sid = this.data.sid;
|
||||
|
||||
const paramVideo = {
|
||||
path: '/buyall',
|
||||
method: 'POST',
|
||||
body: {
|
||||
sid: sid,
|
||||
id: videoInfoObj.id,
|
||||
allprice: videoInfoObj.allprice
|
||||
},
|
||||
errObj: {
|
||||
2: {
|
||||
showToastFlag: true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
httpRequest(paramVideo).then(res => {
|
||||
if (res.status == 1) {
|
||||
my.showToast({
|
||||
type: 'none',
|
||||
content: res.msg || '购买成功',
|
||||
duration: 1000,
|
||||
})
|
||||
this.isVideoPaymentFn(sid);
|
||||
}
|
||||
}).catch(err => {
|
||||
if (err.status == 2) {
|
||||
my.confirm({
|
||||
title: '温馨提示',
|
||||
content: err.msg,
|
||||
confirmButtonText: '去充值',
|
||||
cancelButtonText: '取消',
|
||||
success: (result) => {
|
||||
if (result.confirm) {
|
||||
this.setData({
|
||||
popupShow: true,
|
||||
})
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
handelswiperCurrent(ev) {
|
||||
const current = ev.detail.current;
|
||||
const isThrottle = this.data.isThrottle;
|
||||
isThrottle(current);
|
||||
},
|
||||
|
||||
videoErrorFn(e) {
|
||||
console.log(e, "eee")
|
||||
},
|
||||
|
||||
videoEndedFn() {
|
||||
const videoInfoObj = this.data.videoInfoObj;
|
||||
const sid = this.data.sid;
|
||||
// const swiperList = this.data.swiperList;
|
||||
const id = videoInfoObj.nextid;
|
||||
// const current = videoInfoObj.order;
|
||||
const paramVideo = {
|
||||
path: '/videoread',
|
||||
method: 'POST',
|
||||
body: {
|
||||
sid: sid,
|
||||
id: id
|
||||
}
|
||||
}
|
||||
|
||||
httpRequest(paramVideo).then(res => {
|
||||
// swiperList.map()
|
||||
const resData = res.data[0];
|
||||
const ols = this.handelOrderIsVip(resData);
|
||||
// swiperList.splice(current, 1, resData);
|
||||
this.setData({
|
||||
// swiperList: swiperList,
|
||||
swiperCurrent: resData.order - 1,
|
||||
changeCuurent: resData.order - 1,
|
||||
videoInfoObj: resData,
|
||||
orderList: ols,
|
||||
// swiperOrder: resData.order
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
onTimeUpdate(ed) {
|
||||
console.log(ed, "=========")
|
||||
},
|
||||
|
||||
//显示 选择集数
|
||||
selectEpisodesFn() {
|
||||
this.setData({
|
||||
orderPopupShow: true
|
||||
})
|
||||
},
|
||||
|
||||
// 关闭 选择集数
|
||||
closeOrderPopup() {
|
||||
this.setData({
|
||||
orderPopupShow: false
|
||||
})
|
||||
},
|
||||
|
||||
// 切换 级数的
|
||||
handleTabClick(ev) {
|
||||
// console.log(e, "handleTabClickhandleTabClick")
|
||||
this.setData({
|
||||
activeTab: ev.index
|
||||
})
|
||||
|
||||
},
|
||||
|
||||
handleOrderCurrent(ev) {
|
||||
const item = ev.target.dataset.item;
|
||||
// const orderList = this.data.orderList;
|
||||
// const batchAllOrder = this.data.batchAllOrder;
|
||||
const batchAllList = this.data.batchAllList;
|
||||
if (item.order != 1) {
|
||||
const nextVideoObj = batchAllList[item.order - 2];
|
||||
if (nextVideoObj.isvip == 1) {
|
||||
my.showToast({
|
||||
type: 'info',
|
||||
content: '为了保证剧情连贯，请按顺序观看'
|
||||
})
|
||||
return;
|
||||
}
|
||||
}
|
||||
// const current = item.order - 1;
|
||||
const sid = this.data.sid;
|
||||
// const swiperList = this.data.swiperList;
|
||||
const paramVideo = {
|
||||
path: '/videoread',
|
||||
method: 'POST',
|
||||
body: {
|
||||
sid: sid,
|
||||
id: item.id
|
||||
}
|
||||
}
|
||||
|
||||
httpRequest(paramVideo).then(res => {
|
||||
// swiperList.map()
|
||||
const resData = res.data[0];
|
||||
const ols = this.handelOrderIsVip(resData);
|
||||
this.setData({
|
||||
// swiperList: swiperList,
|
||||
// swiperCurrent: current,
|
||||
videoInfoObj: resData,
|
||||
// swiperOrder: resData.order,
|
||||
orderPopupShow: false,
|
||||
orderList: ols,
|
||||
swiperCurrent: resData.order - 1,
|
||||
changeCuurent: resData.order - 1,
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
onLoad(query) {
|
||||
const sid = query.sid;
|
||||
this.setData({
|
||||
sid: sid
|
||||
})
|
||||
},
|
||||
|
||||
onShow() {
|
||||
const sid = this.data.sid;
|
||||
this.isOtherFn();
|
||||
this.isVideoPaymentFn(sid);
|
||||
// const lodash = require('lodash');
|
||||
const isThrottle = _.throttle((current) => {
|
||||
let id = '';
|
||||
const changeCuurent = this.data.changeCuurent;
|
||||
const videoInfoObj = this.data.videoInfoObj;
|
||||
const sid = this.data.sid;
|
||||
if (current > changeCuurent) {
|
||||
id = videoInfoObj.nextid;
|
||||
} else {
|
||||
id = videoInfoObj.lastid;
|
||||
}
|
||||
const paramVideo = {
|
||||
path: '/videoread',
|
||||
method: 'POST',
|
||||
body: {
|
||||
sid: sid,
|
||||
id: id
|
||||
}
|
||||
}
|
||||
|
||||
httpRequest(paramVideo).then(res => {
|
||||
// swiperList.map()
|
||||
const resData = res.data[0]
|
||||
// swiperList.splice(current, 1, resData);
|
||||
const ols = this.handelOrderIsVip(resData);
|
||||
this.setData({
|
||||
// swiperList: swiperList,
|
||||
// swiperCurrent: current,
|
||||
changeCuurent: current,
|
||||
videoInfoObj: resData,
|
||||
orderList: ols,
|
||||
swiperOrder: resData.order
|
||||
})
|
||||
})
|
||||
}, 300, { trailing: false });
|
||||
this.setData({
|
||||
isThrottle: isThrottle,
|
||||
pageHideFlag: true
|
||||
})
|
||||
},
|
||||
|
||||
toPathPlayPage() {
|
||||
// my.navigateTo({
|
||||
// url: '/pages/recharge/recharge'
|
||||
// });
|
||||
this.setData({
|
||||
popupShow: true,
|
||||
})
|
||||
},
|
||||
|
||||
onClosePopup(mi) {
|
||||
const videoInfoObj = this.data.videoInfoObj;
|
||||
if (mi.resultCode == 9000 && videoInfoObj.chackpay == 2) {
|
||||
const sid = this.data.sid;
|
||||
const paramVideo = {
|
||||
path: '/videoread',
|
||||
method: 'POST',
|
||||
body: {
|
||||
sid: sid,
|
||||
id: videoInfoObj.id
|
||||
}
|
||||
}
|
||||
|
||||
httpRequest(paramVideo).then(res => {
|
||||
const resData = res.data[0];
|
||||
const ols = this.handelOrderIsVip(resData);
|
||||
this.setData({
|
||||
popupShow: false,
|
||||
videoInfoObj: resData,
|
||||
orderList: ols
|
||||
})
|
||||
})
|
||||
|
||||
} else {
|
||||
this.setData({
|
||||
popupShow: false,
|
||||
})
|
||||
}
|
||||
},
|
||||
// 添加追剧
|
||||
addChasingDramasFn() {
|
||||
const videoInfoObj = this.data.videoInfoObj;
|
||||
if (videoInfoObj.iskeep == 0) {
|
||||
|
||||
const paramenter = {
|
||||
path: '/addkeep',
|
||||
method: 'POST',
|
||||
body: {
|
||||
sid: videoInfoObj.sid
|
||||
}
|
||||
}
|
||||
httpRequest(paramenter).then(() => {
|
||||
my.showToast({
|
||||
icon: 'none',
|
||||
content: '追剧成功',
|
||||
duration: 1000,
|
||||
});
|
||||
this.setData({
|
||||
videoInfoObj: {
|
||||
...videoInfoObj,
|
||||
iskeep: 1
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
} else {
|
||||
const paramenter = {
|
||||
path: '/chasingdramadel',
|
||||
method: 'POST',
|
||||
body: {
|
||||
sid: videoInfoObj.sid
|
||||
}
|
||||
}
|
||||
httpRequest(paramenter).then(() => {
|
||||
my.showToast({
|
||||
type: 'none',
|
||||
content: '取消成功',
|
||||
duration: 1000,
|
||||
});
|
||||
this.setData({
|
||||
videoInfoObj: {
|
||||
...videoInfoObj,
|
||||
iskeep: 0
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
},
|
||||
onHide() {
|
||||
this.setData({
|
||||
pageHideFlag: false
|
||||
})
|
||||
}
|
||||
})
|
||||
14
pages/videoAndroid/videoAndroid.json
Normal file
14
pages/videoAndroid/videoAndroid.json
Normal file
@ -0,0 +1,14 @@
|
||||
{
|
||||
"pullRefresh": false,
|
||||
"allowsBounceVertical": "NO",
|
||||
"navigationBarTextStyle": "white",
|
||||
"titleBarColor": "#000",
|
||||
"usingComponents": {
|
||||
"am-icon": "mini-antui/es/am-icon/index",
|
||||
"modal": "mini-antui/es/modal/index",
|
||||
"popup": "mini-antui/es/popup/index",
|
||||
"tabs": "mini-antui/es/tabs/index",
|
||||
"tab-content": "mini-antui/es/tabs/tab-content/index",
|
||||
"my-pay": "/components/myPay/myPay"
|
||||
}
|
||||
}
|
||||
539
static/fontIcon/demo.css
Normal file
539
static/fontIcon/demo.css
Normal file
@ -0,0 +1,539 @@
|
||||
/* Logo 字体 */
|
||||
@font-face {
|
||||
font-family: "iconfont logo";
|
||||
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
|
||||
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'),
|
||||
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
|
||||
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
|
||||
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg');
|
||||
}
|
||||
|
||||
.logo {
|
||||
font-family: "iconfont logo";
|
||||
font-size: 160px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
/* tabs */
|
||||
.nav-tabs {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.nav-tabs .nav-more {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
#tabs {
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
#tabs li {
|
||||
cursor: pointer;
|
||||
width: 100px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
border-bottom: 2px solid transparent;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
margin-bottom: -1px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
|
||||
#tabs .active {
|
||||
border-bottom-color: #f00;
|
||||
color: #222;
|
||||
}
|
||||
|
||||
.tab-container .content {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* 页面布局 */
|
||||
.main {
|
||||
padding: 30px 100px;
|
||||
width: 960px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.main .logo {
|
||||
color: #333;
|
||||
text-align: left;
|
||||
margin-bottom: 30px;
|
||||
line-height: 1;
|
||||
height: 110px;
|
||||
margin-top: -50px;
|
||||
overflow: hidden;
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
.main .logo a {
|
||||
font-size: 160px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.helps {
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.helps pre {
|
||||
padding: 20px;
|
||||
margin: 10px 0;
|
||||
border: solid 1px #e7e1cd;
|
||||
background-color: #fffdef;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.icon_lists {
|
||||
width: 100% !important;
|
||||
overflow: hidden;
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
.icon_lists li {
|
||||
width: 100px;
|
||||
margin-bottom: 10px;
|
||||
margin-right: 20px;
|
||||
text-align: center;
|
||||
list-style: none !important;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.icon_lists li .code-name {
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.icon_lists .icon {
|
||||
display: block;
|
||||
height: 100px;
|
||||
line-height: 100px;
|
||||
font-size: 42px;
|
||||
margin: 10px auto;
|
||||
color: #333;
|
||||
-webkit-transition: font-size 0.25s linear, width 0.25s linear;
|
||||
-moz-transition: font-size 0.25s linear, width 0.25s linear;
|
||||
transition: font-size 0.25s linear, width 0.25s linear;
|
||||
}
|
||||
|
||||
.icon_lists .icon:hover {
|
||||
font-size: 100px;
|
||||
}
|
||||
|
||||
.icon_lists .svg-icon {
|
||||
/* 通过设置 font-size 来改变图标大小 */
|
||||
width: 1em;
|
||||
/* 图标和文字相邻时，垂直对齐 */
|
||||
vertical-align: -0.15em;
|
||||
/* 通过设置 color 来改变 SVG 的颜色/fill */
|
||||
fill: currentColor;
|
||||
/* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
|
||||
normalize.css 中也包含这行 */
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.icon_lists li .name,
|
||||
.icon_lists li .code-name {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
/* markdown 样式 */
|
||||
.markdown {
|
||||
color: #666;
|
||||
font-size: 14px;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
.highlight {
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.markdown img {
|
||||
vertical-align: middle;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.markdown h1 {
|
||||
color: #404040;
|
||||
font-weight: 500;
|
||||
line-height: 40px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.markdown h2,
|
||||
.markdown h3,
|
||||
.markdown h4,
|
||||
.markdown h5,
|
||||
.markdown h6 {
|
||||
color: #404040;
|
||||
margin: 1.6em 0 0.6em 0;
|
||||
font-weight: 500;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.markdown h1 {
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.markdown h2 {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
.markdown h3 {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.markdown h4 {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.markdown h5 {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.markdown h6 {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.markdown hr {
|
||||
height: 1px;
|
||||
border: 0;
|
||||
background: #e9e9e9;
|
||||
margin: 16px 0;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.markdown p {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
.markdown>p,
|
||||
.markdown>blockquote,
|
||||
.markdown>.highlight,
|
||||
.markdown>ol,
|
||||
.markdown>ul {
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.markdown ul>li {
|
||||
list-style: circle;
|
||||
}
|
||||
|
||||
.markdown>ul li,
|
||||
.markdown blockquote ul>li {
|
||||
margin-left: 20px;
|
||||
padding-left: 4px;
|
||||
}
|
||||
|
||||
.markdown>ul li p,
|
||||
.markdown>ol li p {
|
||||
margin: 0.6em 0;
|
||||
}
|
||||
|
||||
.markdown ol>li {
|
||||
list-style: decimal;
|
||||
}
|
||||
|
||||
.markdown>ol li,
|
||||
.markdown blockquote ol>li {
|
||||
margin-left: 20px;
|
||||
padding-left: 4px;
|
||||
}
|
||||
|
||||
.markdown code {
|
||||
margin: 0 3px;
|
||||
padding: 0 5px;
|
||||
background: #eee;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.markdown strong,
|
||||
.markdown b {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown>table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0px;
|
||||
empty-cells: show;
|
||||
border: 1px solid #e9e9e9;
|
||||
width: 95%;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.markdown>table th {
|
||||
white-space: nowrap;
|
||||
color: #333;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown>table th,
|
||||
.markdown>table td {
|
||||
border: 1px solid #e9e9e9;
|
||||
padding: 8px 16px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.markdown>table th {
|
||||
background: #F7F7F7;
|
||||
}
|
||||
|
||||
.markdown blockquote {
|
||||
font-size: 90%;
|
||||
color: #999;
|
||||
border-left: 4px solid #e9e9e9;
|
||||
padding-left: 0.8em;
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
.markdown blockquote p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.markdown .anchor {
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s ease;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.markdown .waiting {
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.markdown h1:hover .anchor,
|
||||
.markdown h2:hover .anchor,
|
||||
.markdown h3:hover .anchor,
|
||||
.markdown h4:hover .anchor,
|
||||
.markdown h5:hover .anchor,
|
||||
.markdown h6:hover .anchor {
|
||||
opacity: 1;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.markdown>br,
|
||||
.markdown>p>br {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
|
||||
.hljs {
|
||||
display: block;
|
||||
background: white;
|
||||
padding: 0.5em;
|
||||
color: #333333;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.hljs-comment,
|
||||
.hljs-meta {
|
||||
color: #969896;
|
||||
}
|
||||
|
||||
.hljs-string,
|
||||
.hljs-variable,
|
||||
.hljs-template-variable,
|
||||
.hljs-strong,
|
||||
.hljs-emphasis,
|
||||
.hljs-quote {
|
||||
color: #df5000;
|
||||
}
|
||||
|
||||
.hljs-keyword,
|
||||
.hljs-selector-tag,
|
||||
.hljs-type {
|
||||
color: #a71d5d;
|
||||
}
|
||||
|
||||
.hljs-literal,
|
||||
.hljs-symbol,
|
||||
.hljs-bullet,
|
||||
.hljs-attribute {
|
||||
color: #0086b3;
|
||||
}
|
||||
|
||||
.hljs-section,
|
||||
.hljs-name {
|
||||
color: #63a35c;
|
||||
}
|
||||
|
||||
.hljs-tag {
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.hljs-title,
|
||||
.hljs-attr,
|
||||
.hljs-selector-id,
|
||||
.hljs-selector-class,
|
||||
.hljs-selector-attr,
|
||||
.hljs-selector-pseudo {
|
||||
color: #795da3;
|
||||
}
|
||||
|
||||
.hljs-addition {
|
||||
color: #55a532;
|
||||
background-color: #eaffea;
|
||||
}
|
||||
|
||||
.hljs-deletion {
|
||||
color: #bd2c00;
|
||||
background-color: #ffecec;
|
||||
}
|
||||
|
||||
.hljs-link {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* 代码高亮 */
|
||||
/* PrismJS 1.15.0
|
||||
https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
|
||||
/**
|
||||
* prism.js default theme for JavaScript, CSS and HTML
|
||||
* Based on dabblet (http://dabblet.com)
|
||||
* @author Lea Verou
|
||||
*/
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
color: black;
|
||||
background: none;
|
||||
text-shadow: 0 1px white;
|
||||
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
|
||||
text-align: left;
|
||||
white-space: pre;
|
||||
word-spacing: normal;
|
||||
word-break: normal;
|
||||
word-wrap: normal;
|
||||
line-height: 1.5;
|
||||
|
||||
-moz-tab-size: 4;
|
||||
-o-tab-size: 4;
|
||||
tab-size: 4;
|
||||
|
||||
-webkit-hyphens: none;
|
||||
-moz-hyphens: none;
|
||||
-ms-hyphens: none;
|
||||
hyphens: none;
|
||||
}
|
||||
|
||||
pre[class*="language-"]::-moz-selection,
|
||||
pre[class*="language-"] ::-moz-selection,
|
||||
code[class*="language-"]::-moz-selection,
|
||||
code[class*="language-"] ::-moz-selection {
|
||||
text-shadow: none;
|
||||
background: #b3d4fc;
|
||||
}
|
||||
|
||||
pre[class*="language-"]::selection,
|
||||
pre[class*="language-"] ::selection,
|
||||
code[class*="language-"]::selection,
|
||||
code[class*="language-"] ::selection {
|
||||
text-shadow: none;
|
||||
background: #b3d4fc;
|
||||
}
|
||||
|
||||
@media print {
|
||||
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* Code blocks */
|
||||
pre[class*="language-"] {
|
||||
padding: 1em;
|
||||
margin: .5em 0;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
:not(pre)>code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
background: #f5f2f0;
|
||||
}
|
||||
|
||||
/* Inline code */
|
||||
:not(pre)>code[class*="language-"] {
|
||||
padding: .1em;
|
||||
border-radius: .3em;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.token.comment,
|
||||
.token.prolog,
|
||||
.token.doctype,
|
||||
.token.cdata {
|
||||
color: slategray;
|
||||
}
|
||||
|
||||
.token.punctuation {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.namespace {
|
||||
opacity: .7;
|
||||
}
|
||||
|
||||
.token.property,
|
||||
.token.tag,
|
||||
.token.boolean,
|
||||
.token.number,
|
||||
.token.constant,
|
||||
.token.symbol,
|
||||
.token.deleted {
|
||||
color: #905;
|
||||
}
|
||||
|
||||
.token.selector,
|
||||
.token.attr-name,
|
||||
.token.string,
|
||||
.token.char,
|
||||
.token.builtin,
|
||||
.token.inserted {
|
||||
color: #690;
|
||||
}
|
||||
|
||||
.token.operator,
|
||||
.token.entity,
|
||||
.token.url,
|
||||
.language-css .token.string,
|
||||
.style .token.string {
|
||||
color: #9a6e3a;
|
||||
background: hsla(0, 0%, 100%, .5);
|
||||
}
|
||||
|
||||
.token.atrule,
|
||||
.token.attr-value,
|
||||
.token.keyword {
|
||||
color: #07a;
|
||||
}
|
||||
|
||||
.token.function,
|
||||
.token.class-name {
|
||||
color: #DD4A68;
|
||||
}
|
||||
|
||||
.token.regex,
|
||||
.token.important,
|
||||
.token.variable {
|
||||
color: #e90;
|
||||
}
|
||||
|
||||
.token.important,
|
||||
.token.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.token.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.token.entity {
|
||||
cursor: help;
|
||||
}
|
||||
372
static/fontIcon/demo_index.html
Normal file
372
static/fontIcon/demo_index.html
Normal file
@ -0,0 +1,372 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<title>iconfont Demo</title>
|
||||
<link rel="shortcut icon" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg" type="image/x-icon"/>
|
||||
<link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg"/>
|
||||
<link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
|
||||
<link rel="stylesheet" href="demo.css">
|
||||
<link rel="stylesheet" href="iconfont.css">
|
||||
<script src="iconfont.js"></script>
|
||||
<!-- jQuery -->
|
||||
<script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
|
||||
<!-- 代码高亮 -->
|
||||
<script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
|
||||
<style>
|
||||
.main .logo {
|
||||
margin-top: 0;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.main .logo a {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.main .logo .sub-title {
|
||||
margin-left: 0.5em;
|
||||
font-size: 22px;
|
||||
color: #fff;
|
||||
background: linear-gradient(-45deg, #3967FF, #B500FE);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="main">
|
||||
<h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">
|
||||
<img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg">
|
||||
|
||||
</a></h1>
|
||||
<div class="nav-tabs">
|
||||
<ul id="tabs" class="dib-box">
|
||||
<li class="dib active"><span>Unicode</span></li>
|
||||
<li class="dib"><span>Font class</span></li>
|
||||
<li class="dib"><span>Symbol</span></li>
|
||||
</ul>
|
||||
|
||||
<a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=4338427" target="_blank" class="nav-more">查看项目</a>
|
||||
|
||||
</div>
|
||||
<div class="tab-container">
|
||||
<div class="content unicode" style="display: block;">
|
||||
<ul class="icon_lists dib-box">
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont"></span>
|
||||
<div class="name">video_play</div>
|
||||
<div class="code-name">&#xe625;</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont"></span>
|
||||
<div class="name">video</div>
|
||||
<div class="code-name">&#xe7c8;</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont"></span>
|
||||
<div class="name">暂停</div>
|
||||
<div class="code-name">&#xe651;</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont"></span>
|
||||
<div class="name">暂停</div>
|
||||
<div class="code-name">&#xe668;</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont"></span>
|
||||
<div class="name">Play</div>
|
||||
<div class="code-name">&#xeab5;</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont"></span>
|
||||
<div class="name">双箭头,双角符,右</div>
|
||||
<div class="code-name">&#xea50;</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont"></span>
|
||||
<div class="name">微信</div>
|
||||
<div class="code-name">&#xe643;</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont"></span>
|
||||
<div class="name">支付宝</div>
|
||||
<div class="code-name">&#xe607;</div>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
<div class="article markdown">
|
||||
<h2 id="unicode-">Unicode 引用</h2>
|
||||
<hr>
|
||||
|
||||
<p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
|
||||
<ul>
|
||||
<li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
|
||||
<li>默认情况下不支持多色，直接添加多色图标会自动去色。</li>
|
||||
</ul>
|
||||
<blockquote>
|
||||
<p>注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）</p>
|
||||
</blockquote>
|
||||
<p>Unicode 使用步骤如下：</p>
|
||||
<h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
|
||||
<pre><code class="language-css"
|
||||
>@font-face {
|
||||
font-family: 'iconfont';
|
||||
src: url('iconfont.woff2?t=1709520057934') format('woff2'),
|
||||
url('iconfont.woff?t=1709520057934') format('woff'),
|
||||
url('iconfont.ttf?t=1709520057934') format('truetype');
|
||||
}
|
||||
</code></pre>
|
||||
<h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
|
||||
<pre><code class="language-css"
|
||||
>.iconfont {
|
||||
font-family: "iconfont" !important;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
</code></pre>
|
||||
<h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
|
||||
<pre>
|
||||
<code class="language-html"
|
||||
><span class="iconfont">&#x33;</span>
|
||||
</code></pre>
|
||||
<blockquote>
|
||||
<p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
|
||||
</blockquote>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content font-class">
|
||||
<ul class="icon_lists dib-box">
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont icon-videoplay"></span>
|
||||
<div class="name">
|
||||
video_play
|
||||
</div>
|
||||
<div class="code-name">.icon-videoplay
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont icon-video"></span>
|
||||
<div class="name">
|
||||
video
|
||||
</div>
|
||||
<div class="code-name">.icon-video
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont icon-zanting"></span>
|
||||
<div class="name">
|
||||
暂停
|
||||
</div>
|
||||
<div class="code-name">.icon-zanting
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont icon-zanting1"></span>
|
||||
<div class="name">
|
||||
暂停
|
||||
</div>
|
||||
<div class="code-name">.icon-zanting1
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont icon-Play"></span>
|
||||
<div class="name">
|
||||
Play
|
||||
</div>
|
||||
<div class="code-name">.icon-Play
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont icon-double-arrow-right-full"></span>
|
||||
<div class="name">
|
||||
双箭头,双角符,右
|
||||
</div>
|
||||
<div class="code-name">.icon-double-arrow-right-full
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont icon-weixin"></span>
|
||||
<div class="name">
|
||||
微信
|
||||
</div>
|
||||
<div class="code-name">.icon-weixin
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont icon-zhifubao"></span>
|
||||
<div class="name">
|
||||
支付宝
|
||||
</div>
|
||||
<div class="code-name">.icon-zhifubao
|
||||
</div>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
<div class="article markdown">
|
||||
<h2 id="font-class-">font-class 引用</h2>
|
||||
<hr>
|
||||
|
||||
<p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
|
||||
<p>与 Unicode 使用方式相比，具有如下特点：</p>
|
||||
<ul>
|
||||
<li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
|
||||
<li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
|
||||
</ul>
|
||||
<p>使用步骤如下：</p>
|
||||
<h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
|
||||
<pre><code class="language-html"><link rel="stylesheet" href="./iconfont.css">
|
||||
</code></pre>
|
||||
<h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
|
||||
<pre><code class="language-html"><span class="iconfont icon-xxx"></span>
|
||||
</code></pre>
|
||||
<blockquote>
|
||||
<p>"
|
||||
iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
|
||||
</blockquote>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content symbol">
|
||||
<ul class="icon_lists dib-box">
|
||||
|
||||
<li class="dib">
|
||||
<svg class="icon svg-icon" aria-hidden="true">
|
||||
<use xlink:href="#icon-videoplay"></use>
|
||||
</svg>
|
||||
<div class="name">video_play</div>
|
||||
<div class="code-name">#icon-videoplay</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<svg class="icon svg-icon" aria-hidden="true">
|
||||
<use xlink:href="#icon-video"></use>
|
||||
</svg>
|
||||
<div class="name">video</div>
|
||||
<div class="code-name">#icon-video</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<svg class="icon svg-icon" aria-hidden="true">
|
||||
<use xlink:href="#icon-zanting"></use>
|
||||
</svg>
|
||||
<div class="name">暂停</div>
|
||||
<div class="code-name">#icon-zanting</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<svg class="icon svg-icon" aria-hidden="true">
|
||||
<use xlink:href="#icon-zanting1"></use>
|
||||
</svg>
|
||||
<div class="name">暂停</div>
|
||||
<div class="code-name">#icon-zanting1</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<svg class="icon svg-icon" aria-hidden="true">
|
||||
<use xlink:href="#icon-Play"></use>
|
||||
</svg>
|
||||
<div class="name">Play</div>
|
||||
<div class="code-name">#icon-Play</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<svg class="icon svg-icon" aria-hidden="true">
|
||||
<use xlink:href="#icon-double-arrow-right-full"></use>
|
||||
</svg>
|
||||
<div class="name">双箭头,双角符,右</div>
|
||||
<div class="code-name">#icon-double-arrow-right-full</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<svg class="icon svg-icon" aria-hidden="true">
|
||||
<use xlink:href="#icon-weixin"></use>
|
||||
</svg>
|
||||
<div class="name">微信</div>
|
||||
<div class="code-name">#icon-weixin</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<svg class="icon svg-icon" aria-hidden="true">
|
||||
<use xlink:href="#icon-zhifubao"></use>
|
||||
</svg>
|
||||
<div class="name">支付宝</div>
|
||||
<div class="code-name">#icon-zhifubao</div>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
<div class="article markdown">
|
||||
<h2 id="symbol-">Symbol 引用</h2>
|
||||
<hr>
|
||||
|
||||
<p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
|
||||
这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
|
||||
<ul>
|
||||
<li>支持多色图标了，不再受单色限制。</li>
|
||||
<li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
|
||||
<li>兼容性较差，支持 IE9+，及现代浏览器。</li>
|
||||
<li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
|
||||
</ul>
|
||||
<p>使用步骤如下：</p>
|
||||
<h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
|
||||
<pre><code class="language-html"><script src="./iconfont.js"></script>
|
||||
</code></pre>
|
||||
<h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
|
||||
<pre><code class="language-html"><style>
|
||||
.icon {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
vertical-align: -0.15em;
|
||||
fill: currentColor;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
</code></pre>
|
||||
<h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
|
||||
<pre><code class="language-html"><svg class="icon" aria-hidden="true">
|
||||
<use xlink:href="#icon-xxx"></use>
|
||||
</svg>
|
||||
</code></pre>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
$(document).ready(function () {
|
||||
$('.tab-container .content:first').show()
|
||||
|
||||
$('#tabs li').click(function (e) {
|
||||
var tabContent = $('.tab-container .content')
|
||||
var index = $(this).index()
|
||||
|
||||
if ($(this).hasClass('active')) {
|
||||
return
|
||||
} else {
|
||||
$('#tabs li').removeClass('active')
|
||||
$(this).addClass('active')
|
||||
|
||||
tabContent.hide().eq(index).fadeIn()
|
||||
}
|
||||
})
|
||||
})
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
47
static/fontIcon/iconfont.css
Normal file
47
static/fontIcon/iconfont.css
Normal file
@ -0,0 +1,47 @@
|
||||
@font-face {
|
||||
font-family: "iconfont"; /* Project id 4338427 */
|
||||
src: url('iconfont.woff2?t=1709520057934') format('woff2'),
|
||||
url('iconfont.woff?t=1709520057934') format('woff'),
|
||||
url('iconfont.ttf?t=1709520057934') format('truetype');
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
font-family: "iconfont" !important;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-videoplay:before {
|
||||
content: "\e625";
|
||||
}
|
||||
|
||||
.icon-video:before {
|
||||
content: "\e7c8";
|
||||
}
|
||||
|
||||
.icon-zanting:before {
|
||||
content: "\e651";
|
||||
}
|
||||
|
||||
.icon-zanting1:before {
|
||||
content: "\e668";
|
||||
}
|
||||
|
||||
.icon-Play:before {
|
||||
content: "\eab5";
|
||||
}
|
||||
|
||||
.icon-double-arrow-right-full:before {
|
||||
content: "\ea50";
|
||||
}
|
||||
|
||||
.icon-weixin:before {
|
||||
content: "\e643";
|
||||
}
|
||||
|
||||
.icon-zhifubao:before {
|
||||
content: "\e607";
|
||||
}
|
||||
|
||||
1
static/fontIcon/iconfont.js
Normal file
1
static/fontIcon/iconfont.js
Normal file
File diff suppressed because one or more lines are too long
65
static/fontIcon/iconfont.json
Normal file
65
static/fontIcon/iconfont.json
Normal file
@ -0,0 +1,65 @@
|
||||
{
|
||||
"id": "4338427",
|
||||
"name": "淘宝—古言剧场",
|
||||
"font_family": "iconfont",
|
||||
"css_prefix_text": "icon-",
|
||||
"description": "",
|
||||
"glyphs": [
|
||||
{
|
||||
"icon_id": "948002",
|
||||
"name": "video_play",
|
||||
"font_class": "videoplay",
|
||||
"unicode": "e625",
|
||||
"unicode_decimal": 58917
|
||||
},
|
||||
{
|
||||
"icon_id": "1096519",
|
||||
"name": "video",
|
||||
"font_class": "video",
|
||||
"unicode": "e7c8",
|
||||
"unicode_decimal": 59336
|
||||
},
|
||||
{
|
||||
"icon_id": "5831324",
|
||||
"name": "暂停",
|
||||
"font_class": "zanting",
|
||||
"unicode": "e651",
|
||||
"unicode_decimal": 58961
|
||||
},
|
||||
{
|
||||
"icon_id": "9447889",
|
||||
"name": "暂停",
|
||||
"font_class": "zanting1",
|
||||
"unicode": "e668",
|
||||
"unicode_decimal": 58984
|
||||
},
|
||||
{
|
||||
"icon_id": "12005047",
|
||||
"name": "Play",
|
||||
"font_class": "Play",
|
||||
"unicode": "eab5",
|
||||
"unicode_decimal": 60085
|
||||
},
|
||||
{
|
||||
"icon_id": "18174963",
|
||||
"name": "双箭头,双角符,右",
|
||||
"font_class": "double-arrow-right-full",
|
||||
"unicode": "ea50",
|
||||
"unicode_decimal": 59984
|
||||
},
|
||||
{
|
||||
"icon_id": "10621878",
|
||||
"name": "微信",
|
||||
"font_class": "weixin",
|
||||
"unicode": "e643",
|
||||
"unicode_decimal": 58947
|
||||
},
|
||||
{
|
||||
"icon_id": "15933089",
|
||||
"name": "支付宝",
|
||||
"font_class": "zhifubao",
|
||||
"unicode": "e607",
|
||||
"unicode_decimal": 58887
|
||||
}
|
||||
]
|
||||
}
|
||||
BIN
static/fontIcon/iconfont.ttf
Normal file
BIN
static/fontIcon/iconfont.ttf
Normal file
Binary file not shown.
BIN
static/fontIcon/iconfont.woff
Normal file
BIN
static/fontIcon/iconfont.woff
Normal file
Binary file not shown.
BIN
static/fontIcon/iconfont.woff2
Normal file
BIN
static/fontIcon/iconfont.woff2
Normal file
Binary file not shown.
0
static/fontIcon/iconfontStylesheet.acss
Normal file
0
static/fontIcon/iconfontStylesheet.acss
Normal file
Loading…
x
Reference in New Issue
Block a user