new_app/pages/index/index.vue

402 lines
9.3 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="indexStyle">
<image src="@/static/index/indexbh.png" mode="">
</image>
<view class="indexStyleTwo">
<image src="@/static/logo.png" mode=""></image>
<!-- <view @tap="moreVideo">
<image src="@/static/sosuo.png" style="height: 34rpx;width: 34rpx;" mode=""></image>
点击搜索更多好剧
</view> -->
</view>
<template v-if="datas.isExamine">
<view class="gongao">
<view class="gongaoicon">
公告
</view>
<swiper :autoplay="true" :vertical="true" :interval="4000" :circular="true" :indicator-dots="false"
class="swiperstyle">
<swiper-item v-for="(item, index) in datas.noticeList" :key="index">
<view style="height: 80rpx;line-height: 80rpx;">{{ item.title }}</view>
</swiper-item>
</swiper>
</view>
</template>
</view>
<view class="navTop">
<view :class="datas.active == 1 ? 'navTop-active' : ''" @tap="getrecomVideo('', 1)">
最新
</view>
<view :class="datas.active == 2 ? 'navTop-active' : ''" @tap="getrecomVideo('1', 2)">
排行
</view>
<view :class="datas.active == 3 ? 'navTop-active' : ''" @tap="getrecomVideo('2', 3)">
最热
</view>
<view :class="datas.active == 4 ? 'navTop-active' : ''" @tap="getrecomVideo('1', 4)">
剧情
</view>
<view :class="datas.active == 5 ? 'navTop-active' : ''" @tap="getrecomVideo('2', 5)">
飙升
</view>
</view>
<contentlist :list='datas.list'></contentlist>
<image v-if="datas.isExamine" @click="goMsg()" src="@/static/index/red-pack-new.gif"
style="width: 200rpx;height: 200rpx;position: fixed;right: 10rpx;bottom: 180rpx;" mode=""></image>
<up-modal :show="datas.version.show" :confirm-text="datas.version.confirmText"
:showCancelButton="datas.version.cancelText!=''" @cancel="cancelUpdateVersion" @confirm='confirmUpdateVersion'
:title="datas.version.title" :title-style="{ fontWeight: '700' }" confirm-color="rgb(255, 117, 129)">
<view class="" style="padding-top: 30rpx;text-align: left;">
<scroll-view scroll-y="true" style="max-height: 50vh;">
<!-- <rich-text style="color:#666" :nodes="datas.version.content"></rich-text> -->
<view style="text-align: justify;font-size: 18px;color: #666;" v-html="datas.version.content"></view>
</scroll-view>
</view>
</up-modal>
<!-- h5关闭通知 -->
<!-- #ifdef H5 -->
<up-modal :show="datas.stopShow"
cancel-text="知道了"
show-cancel-button
confirm-text="去下载" title="重要通知"
@cancel="stopCancel"
:title="datas.rule_title" :title-style="{fontWeight:'700'}" @confirm="stopConfirm"
confirm-color="rgb(255, 117, 129)">
<view class="color-red u-text-left">
<text>2025年2月8日将关闭网页访问请及时下载最新APP</text>
</view>
</up-modal>
<!-- #endif -->
</template>
<script setup>
import {
reactive,
nextTick
} from 'vue';
import {
announcement,
messageselectMessage,
courseselectCourse
} from '@/api/index/index.js'
import {
onLoad,
onReady,
onReachBottom,
onShow
} from '@dcloudio/uni-app'
import contentlist from './components/contentlist.vue'
import {
selectNewApp
} from '@/api/user/user.js';
import config from '@/commons/config.js';
import {
linkTo
} from '@/utils/app.js';
import {
useCommonStore
} from '@/store/common.js'
const $common = useCommonStore()
onShow(() => {
// console.log('cash:' + uni.getStorageSync('userInfo').userId + "" + new Date().getTime(), 'debug')
// 判断ios是否审核
$common.init()
// #ifdef H5
datas.isExamine = $common.isIosExamine
// #endif
// let sysInfo = uni.getSystemInfoSync()
// let isIos = sysInfo.platform == 'ios'
// if (isIos) {
// datas.setindexdata = $common.setversion
// console.log(datas.setindexdata,'seaeasdas')
// }
})
let datas = reactive({
noticeList: [], //公告列表
active: 1, // 最新、最热。。。切换顶部导航栏
list: [], // 底部短剧内容
page: 1, // 首页推荐分页
stopShow:true,//h5关闭弹窗
ruleShow: false,
rule_title: '', // 首页弹窗标题
rule_content: '', // 首页弹窗内容
ruleIndex: 0,
ruleList: [],
version: {
show: false,
title: "",
content: "",
confirmText: "",
cancelText: "",
downloadLink: ""
},
setindexdata: false
})
onLoad(() => {
versionUpdate()
getMsg()
getrecomVideo()
})
onReady(() => {
if (!uni.getStorageSync('ruleShow')) {
announcement({
type: 0
}).then(res => {
if (res) {
datas.ruleShow = true
datas.ruleList = res
ruleInit()
}
})
}
})
onReachBottom(() => {
++datas.page
getrecomVideo()
})
function stopConfirm(){
datas.stopShow=false
uni.navigateTo({
url:'/pages/login/download'
})
}
function stopCancel(){
datas.stopShow=false
}
function versionUpdate() {
//#ifdef APP-PLUS
plus.screen.lockOrientation('portrait-primary'); //竖屏正方向锁定
//获取当前系统版本信息
plus.runtime.getProperty(plus.runtime.appid, widgetInfo => {
//请求后台接口 解析数据 对比版本
selectNewApp().then(async res => {
res = res[0];
console.log(uni.getSystemInfoSync().platform == 'ios', 1101)
let version;
if (uni.getSystemInfoSync().platform == 'android') {
version = res.version
}
if (uni.getSystemInfoSync().platform == 'ios') {
version = res.iosVersion
}
let isVersion = await $common.setversion(widgetInfo.version, version)
datas.isExamine = $common.isIosExamine
console.log(isVersion, '')
if (isVersion == 1) {
datas.version.downloadLink = res.androidWgtUrl;
datas.version.show = true;
datas.version.title = "发现新版本";
datas.version.content = res.des;
uni.hideTabBar()
if (res.method == "true") {
datas.version.confirmText = "立即更新"
} else {
datas.version.confirmText = "立即更新"
datas.version.cancelText = "下次更新"
}
}
});
});
//#endif
}
function cancelUpdateVersion() {
uni.showTabBar()
datas.version.show = false
}
function confirmUpdateVersion() {
// plus.runtime.openURL(config.baseUrl + '/pages/login/appEq')
linkTo('/pages/login/download')
return
uni.showLoading({
title: '下载中...',
mask: true
});
if (uni.getSystemInfoSync().platform == 'android') {
uni.downloadFile({
url: datas.version.downloadLink,
success: downloadResult => {
console.log(downloadResult)
if (downloadResult.statusCode === 200) {
plus.runtime.install(
downloadResult.tempFilePath, {
force: false
},
d => {
console.log('install success...');
plus.runtime
.restart();
},
e => {
console.log(e)
console.error('install fail...');
}
);
}
}
});
}
if (uni.getSystemInfoSync().platform == 'ios') {
plus.runtime.openURL(datas.version.downloadLink, function(res) {});
}
}
function ruleInit() {
datas.rule_title = datas.ruleList[datas.ruleIndex].title
datas.rule_content = datas.ruleList[datas.ruleIndex].content
}
/**
* 规则确认
*/
function ruleConfirm() {
datas.ruleShow = false
datas.ruleIndex++
if (datas.ruleIndex >= datas.ruleList.length) {
datas.ruleIndex = 0
uni.setStorageSync('ruleShow', true)
return
}
setTimeout(res => {
ruleInit()
datas.ruleShow = true
}, 300)
}
// 跳转公告链接
function goMsg(url) {
uni.navigateTo({
url: '/pages/index/prizeDraw/kevy-luckydraw'
});
}
// 搜索跳转
function moreVideo() {
uni.navigateTo({
url: '/pages/index/search/index'
});
}
// 公告
async function getMsg() {
let res = await messageselectMessage()
datas.noticeList = res.list
}
//获取推荐视频
async function getrecomVideo(sort, active = 1) {
datas.active = active
if (sort) {
datas.page = 1
}
let res = await courseselectCourse({
page: datas.page,
limit: 12,
sort: sort,
classifyId: ''
})
if (datas.page == 1) {
datas.list = res.list
} else {
datas.list = [...datas.list, ...res.list]
}
}
</script>
<style lang="scss" scoped>
.indexStyle {
height: 555rpx;
position: relative;
>image {
width: 100%;
height: 555rpx;
position: absolute;
}
.indexStyleTwo {
display: flex;
align-items: center;
justify-content: space-between;
padding: 88rpx 25rpx;
>image {
width: 187rpx;
height: 50rpx;
}
>view {
z-index: 50;
width: 236rpx;
line-height: 43rpx;
background: rgba(255, 255, 255, 0.29);
border-radius: 7rpx 7rpx 7rpx 7rpx;
font-weight: 400;
font-size: 21rpx;
color: rgba(255, 255, 255, 0.85);
display: flex;
align-items: center;
}
}
.gongao {
position: absolute;
bottom: 75rpx;
left: 70rpx;
border-radius: 21rpx 21rpx 21rpx 21rpx;
width: 611rpx;
height: 78rpx;
background-color: rgba(255, 255, 255, .65);
display: flex;
align-items: center;
padding: 12rpx;
box-sizing: border-box;
.gongaoicon {
color: #ffffff;
width: 98rpx;
height: 50rpx;
line-height: 50rpx;
text-align: center;
font-size: 25rpx;
background-image: url('../../static/index/gonggaobg.png');
background-size: 98rpx 50rpx;
}
.swiperstyle {
height: 78rpx;
width: 80%;
}
}
}
.navTop-active {
color: #cb5d68;
}
.navTop {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 20rpx;
>view {
background-color: #f0f0f0;
margin-left: 20rpx;
padding: 6rpx 20rpx
}
}
</style>