123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179 |
- <template>
- <view class="i-h-v100 i-w-v100">
- <!-- 背景图片 -->
- <view class="i-pst-f i-z-index01">
- <image class="i-h-v100 i-w-v100" mode="scaleToFill" src="/static/image/homeBg.png"></image>
- </view>
- <!-- 内页按钮 -->
- <pageButton :buttonData="buttonData" :isShow="showModel != 'default'" :nowTitle="nowTitle"
- :pageStatus="pageStatus" @backEvent="backEvent" @tolastEvent="tolastEvent"></pageButton>
- <!-- 导航 -->
- <homeList :list="list" :isShow="showModel === 'default'" :pageStatus="pageStatus" :title="title" @customEvent="homeListEvent"
- @clearCacheEvent="clearCache">
- </homeList>
- <!-- 详情 -->
- <homeDetails :itemInfo="detail_info" :isShow="showModel === 'model_detail'" :pageStatus="pageStatus">
- </homeDetails>
- <!-- 列表 -->
- <listModel :list="detail_list" :isShow="showModel === 'model_list'" :pageStatus="pageStatus"
- :styleType="style_type" @toDetailEvent="toDetailEvent"></listModel>
- <!-- 名校列表 -->
- <schoolRank :list="rank_list" :schoolList="schoolList" :isShow="showModel === 'model_rank'" :pageStatus="pageStatus"
- @toDetailEvent="toDetailEvent"></schoolRank>
- </view>
- </template>
- <script>
- import data from '@/custom/data.js'
- export default {
- data() {
- return {
- // 后台设置的title
- title: ['金东方电子宣传册', '副标题'],
- buttonData: {
- lastpage: ['default'],
- lastpageIndex: 0 // 页面计数器
- },
- lastpageTitle: 'default',
- nowTitle: '',
- showModel: 'default',
- pageStatus: 1, //页面状态 1=进入,2=常态,3=退出
- homeAnimation: {},
- list: [], // 导航信息
- rank_list:[], // 名校排名列表
- schoolList:[],
- detail_list: [], // 列表信息
- detail_info: {
- img: '', // 详情信息
- },
- style_type: 1,
- timeStr:''
- }
- },
- onLoad() {
- // 加载字体
- uni.iCommon.getFontFamily()
- // 获取数据
- this.get_data()
- },
- onShow() {
- // 显示时检查后台数据是否刷新
- this.checkDataUpdate()
- },
- watch: {
- showModel(newVal) {
- // 回到首页重置返回按钮路径
- if (newVal == 'default') {
- this.buttonData.lastpage.splice(0, this.buttonData.lastpage.length)
- this.buttonData.lastpage.push('default')
- this.checkDataUpdate()
- } else if (this.buttonData.lastpage.length === this.buttonData.lastpageIndex) {
- // 进入内页
- this.buttonData.lastpage.push(newVal)
- }
- },
- list(newVal){
- if(uni.getStorageSync('school')){
- this.schoolList = uni.getStorageSync('school')
- }else{
- newVal[5].list.forEach((item, index) => {
- this.schoolList.push(item.list)
- });
- uni.getStorageSync('school',this.schoolList)
- }
- }
- },
- methods: {
- // 检查获取更新数据
- checkDataUpdate(){
- data.check_data_update(this)
- },
- // 执行各组件动画
- Animation_Controls(model_type) {
- this.pageStatus = 3
- setTimeout(() => {
- // 导航切换状态2 进入切换页
- // this.pageStatus = 2
- // 导航切换状态3 常态化切换页
- this.pageStatus = 1
- this.showModel = model_type
- setTimeout(() => {
- // this.pageStatus = 2
- }, 400)
- }, 300)
- },
- // 获取数据
- get_data() {
- data.get_home_list(this)
- },
- // 清除缓存并重新获取数据
- clearCache(e) {
- uni.removeStorageSync('list')
- console.log('已清除缓存')
- // 清空原有数据
- this.list = []
- this.detail_info = {}
- this.title = []
- // 重新获取数据
- this.get_data()
- },
- // list导航组件传递
- homeListEvent(e) {
- this.buttonData.lastpageIndex = 1 //页面计数器
- if (e.model_type != undefined) {
- // 按钮组件title
- this.nowTitle = e.title
- this.lastpageTitle = e.title
- // 当前显示组件
- this.detail_list = e.list
- this.style_type = e.style_type
- this.rank_list = e.list
- if (e.model_type === 'model_detail') {
- this.detail_info.img = e.list[0].inner_img
- }
- this.Animation_Controls(e.model_type) // 执行动画
-
- }
- },
- // 按钮组件回到首页传递
- backEvent() {
- this.Animation_Controls('default')
- },
- // 按钮组件返回上一页
- tolastEvent() {
- // 返回到首页
- if (this.buttonData.lastpage.length === 2) {
- // this.pageStatus = 2
- this.buttonData.lastpage = ['default']
- this.Animation_Controls(this.buttonData.lastpage[0])
- } else {
- // 返回上一页
- // this.pageStatus = 3
- this.buttonData.lastpageIndex -= 1
- this.buttonData.lastpage.pop()
- this.nowTitle = this.lastpageTitle
- this.Animation_Controls(this.buttonData.lastpage[1])
- }
- },
- // 内页传递(到3级页面)
- toDetailEvent(item) {
- // console.log(item)
- // this.pageStatus = 5
- this.buttonData.lastpageIndex += 1
- setTimeout(()=>{
- this.nowTitle = item.title
- },400)
- this.Animation_Controls('model_detail')
- this.detail_info.img = item.inner_img
- console.log(item.inner_img)
- }
- },
- }
- </script>
- <style>
- /* rem基准大小 */
- html {
- font-size: 9px;
- }
- </style>
|