更新
This commit is contained in:
yziiy
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<view class="view-page">
|
||||
<view class="view-page" :style="backgroundStyle">
|
||||
<headerHeight />
|
||||
<navBar :navTitle="'青少年模式'" :emitBack="true" @backEvent="back">
|
||||
</navBar>
|
||||
@@ -9,13 +9,13 @@
|
||||
</NavigationTabs>
|
||||
</view>
|
||||
<view class="">
|
||||
<view class="flex-line flex-spaceB w-fill new-box" v-for="(item,index) in dataList" :key="index">
|
||||
<view class="flex-line flex-spaceB w-fill new-box" v-for="(item, index) in dataList" :key="index">
|
||||
<view class="">
|
||||
<view class="color-3 font-32 font-w500">
|
||||
{{item.title}}
|
||||
{{ item.title }}
|
||||
</view>
|
||||
<view class="color-6 mt-24 font-28 font-w400 multi-line">
|
||||
{{item.introduced}}
|
||||
{{ item.introduced }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="new-box-image">
|
||||
@@ -30,148 +30,165 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import http from '@/until/http.js';
|
||||
import headerHeight from '@/component/headerHeight.vue';
|
||||
import navBar from '@/component/nav.vue';
|
||||
import NavigationTabs from '@/component/tab.vue';
|
||||
export default {
|
||||
components: {
|
||||
headerHeight,
|
||||
navBar,
|
||||
NavigationTabs
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
errorPage: true,
|
||||
currentIndex: 0,
|
||||
pageConfig: {
|
||||
pageSize: 10,
|
||||
currentPage: 1,
|
||||
total: 0
|
||||
},
|
||||
loading: false,
|
||||
noMore: false,
|
||||
tabs: [],
|
||||
dataList: []
|
||||
}
|
||||
},
|
||||
onReachBottom() {
|
||||
if (!this.loading && !this.noMore) {
|
||||
this.getUnderageModeList(this.tabs[0].type)
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
this.errorPage = true
|
||||
this.dataList = []
|
||||
const {
|
||||
id
|
||||
} = options
|
||||
uni.setStorageSync('token', id)
|
||||
if (uni.getStorageSync('token')) this.getUnderageTypeList()
|
||||
},
|
||||
methods: {
|
||||
back() {
|
||||
this.closeWeb()
|
||||
import http from '@/until/http.js';
|
||||
import headerHeight from '@/component/headerHeight.vue';
|
||||
import navBar from '@/component/nav.vue';
|
||||
import NavigationTabs from '@/component/tab.vue';
|
||||
export default {
|
||||
components: {
|
||||
headerHeight,
|
||||
navBar,
|
||||
NavigationTabs
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
errorPage: true,
|
||||
currentIndex: 0,
|
||||
pageConfig: {
|
||||
pageSize: 10,
|
||||
currentPage: 1,
|
||||
total: 0
|
||||
},
|
||||
closeWeb() {
|
||||
const platform = uni.getSystemInfoSync().platform;
|
||||
if (platform === 'ios') {
|
||||
window.webkit.messageHandlers.nativeHandler.postMessage({
|
||||
'action': 'closeWeb'
|
||||
});
|
||||
} else if (platform === 'android') {
|
||||
window.Android.closeWeb();
|
||||
loading: false,
|
||||
noMore: false,
|
||||
tabs: [],
|
||||
dataList: [],
|
||||
ThemeData: null
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
backgroundStyle() {
|
||||
if (this.ThemeData.app_bg) {
|
||||
return {
|
||||
backgroundImage: `url(${this.ThemeData.app_bg})`
|
||||
}
|
||||
} else {
|
||||
return {
|
||||
background: 'linear-gradient(180deg, #B3FAEB 2%, #FFFFFF 40%)'
|
||||
}
|
||||
},
|
||||
async getUnderageTypeList() {
|
||||
http.get('/api/Usermode/getUnderageTypeList', {
|
||||
token: uni.getStorageSync('token') ?? ''
|
||||
}).then(response => {
|
||||
const {
|
||||
data,
|
||||
code
|
||||
} = response
|
||||
if (code) {
|
||||
this.tabs = data.map(ele => {
|
||||
return {
|
||||
type: ele.id,
|
||||
value: ele.type_name
|
||||
}
|
||||
})
|
||||
}
|
||||
this.errorPage = false
|
||||
this.$nextTick(() => {
|
||||
this.getUnderageModeList(this.tabs[0].type)
|
||||
})
|
||||
}).catch(error => {
|
||||
this.tabs = []
|
||||
this.errorPage = true
|
||||
});
|
||||
},
|
||||
async getUnderageModeList(type) {
|
||||
http.get('/api/Usermode/getUnderageModeList', {
|
||||
token: uni.getStorageSync('token') ?? '',
|
||||
type: type,
|
||||
page: this.pageConfig.currentPage,
|
||||
page_limit: this.pageConfig.pageSize
|
||||
}).then(response => {
|
||||
const {
|
||||
code,
|
||||
data
|
||||
} = response
|
||||
if (code) {
|
||||
this.pageConfig.total = data.total
|
||||
this.loading = false
|
||||
const newData = data.data || []
|
||||
if (newData.length === 0) {
|
||||
this.noMore = true
|
||||
return
|
||||
}
|
||||
this.dataList = [...this.dataList, ...newData]
|
||||
this.pageConfig.currentPage++
|
||||
if (this.dataList.length === this.pageConfig.total) {
|
||||
this.noMore = true
|
||||
return
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
handleTabChange(data) {
|
||||
this.dataList = []
|
||||
this.noMore = false
|
||||
this.loading = false
|
||||
this.pageConfig.currentPage = 1
|
||||
this.pageConfig.pageSize = 10
|
||||
this.getUnderageModeList(data.tab.type)
|
||||
}
|
||||
}
|
||||
},
|
||||
onReachBottom() {
|
||||
if (!this.loading && !this.noMore) {
|
||||
this.getUnderageModeList(this.tabs[0].type)
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
this.errorPage = true
|
||||
this.dataList = []
|
||||
const {
|
||||
id
|
||||
} = options
|
||||
uni.setStorageSync('token', id)
|
||||
if (uni.getStorageSync('token')) this.getUnderageTypeList()
|
||||
if (uni.getStorageSync('Theme_Data')) {
|
||||
this.ThemeData = JSON.parse(uni.getStorageSync('Theme_Data'))
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
back() {
|
||||
this.closeWeb()
|
||||
},
|
||||
closeWeb() {
|
||||
const platform = uni.getSystemInfoSync().platform;
|
||||
if (platform === 'ios') {
|
||||
window.webkit.messageHandlers.nativeHandler.postMessage({
|
||||
'action': 'closeWeb'
|
||||
});
|
||||
} else if (platform === 'android') {
|
||||
window.Android.closeWeb();
|
||||
}
|
||||
},
|
||||
async getUnderageTypeList() {
|
||||
http.get('/api/Usermode/getUnderageTypeList', {
|
||||
token: uni.getStorageSync('token') ?? ''
|
||||
}).then(response => {
|
||||
const {
|
||||
data,
|
||||
code
|
||||
} = response
|
||||
if (code) {
|
||||
this.tabs = data.map(ele => {
|
||||
return {
|
||||
type: ele.id,
|
||||
value: ele.type_name
|
||||
}
|
||||
})
|
||||
}
|
||||
this.errorPage = false
|
||||
this.$nextTick(() => {
|
||||
this.getUnderageModeList(this.tabs[0].type)
|
||||
})
|
||||
}).catch(error => {
|
||||
this.tabs = []
|
||||
this.errorPage = true
|
||||
});
|
||||
},
|
||||
async getUnderageModeList(type) {
|
||||
http.get('/api/Usermode/getUnderageModeList', {
|
||||
token: uni.getStorageSync('token') ?? '',
|
||||
type: type,
|
||||
page: this.pageConfig.currentPage,
|
||||
page_limit: this.pageConfig.pageSize
|
||||
}).then(response => {
|
||||
const {
|
||||
code,
|
||||
data
|
||||
} = response
|
||||
if (code) {
|
||||
this.pageConfig.total = data.total
|
||||
this.loading = false
|
||||
const newData = data.data || []
|
||||
if (newData.length === 0) {
|
||||
this.noMore = true
|
||||
return
|
||||
}
|
||||
this.dataList = [...this.dataList, ...newData]
|
||||
this.pageConfig.currentPage++
|
||||
if (this.dataList.length === this.pageConfig.total) {
|
||||
this.noMore = true
|
||||
return
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
handleTabChange(data) {
|
||||
this.dataList = []
|
||||
this.noMore = false
|
||||
this.loading = false
|
||||
this.pageConfig.currentPage = 1
|
||||
this.pageConfig.pageSize = 10
|
||||
this.getUnderageModeList(data.tab.type)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.view-page {
|
||||
// padding: 32rpx;
|
||||
background: linear-gradient(180deg, #B3FAEB 2%, #FFFFFF 40%);
|
||||
background-size: 100% 100%;
|
||||
min-height: 100vh;
|
||||
.view-page {
|
||||
// padding: 32rpx;
|
||||
background: linear-gradient(180deg, #B3FAEB 2%, #FFFFFF 40%);
|
||||
background-size: 100% 100%;
|
||||
min-height: 100vh;
|
||||
|
||||
.content-view {
|
||||
padding: 0 32rpx;
|
||||
}
|
||||
.content-view {
|
||||
padding: 0 32rpx;
|
||||
}
|
||||
|
||||
.new-box {
|
||||
margin-top: 32rpx;
|
||||
.new-box {
|
||||
margin-top: 32rpx;
|
||||
|
||||
.new-box-image {
|
||||
width: 240rpx;
|
||||
height: 144rpx;
|
||||
.new-box-image {
|
||||
width: 240rpx;
|
||||
height: 144rpx;
|
||||
border-radius: 12rpx;
|
||||
|
||||
img {
|
||||
border-radius: 12rpx;
|
||||
|
||||
img {
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user