uni-zhihuikuangshan/pages/tabbar/index/index.vue

<template>
	<view>
		<!-- 首页风格切换-1-切换风格 -->
		<view class="top_bg_color" v-if="index_type == 1">
			<!-- 背景虚化轮播图 -->
			<!-- <view class="bg_img" :style="{backgroundImage:'url('+top_bg_color_img+')'}"></view> -->
			<!-- 固定安全色 -->
			<view class="bg_img" :style="{backgroundColor:top_bg_color}"></view>

			<t-i-navbar :mine_code="mine_code" :navbar_bg_color="navbar_bg_color"></t-i-navbar>
			<t-i-notice v-if="text != ''" :text="text"></t-i-notice>
			<t-i-banner :banner="banners" :mine_code="mine_code" @change_top_bg_color_img="change_top_bg_color_img"></t-i-banner>
		</view>
		<!-- 首页风格切换-2-默认风格 -->
		<view v-if="index_type == 2">
			<t-i-navbar-2 :mine_code="mine_code"></t-i-navbar-2>
			<t-i-notice-2 v-if="text != ''" :text="text"></t-i-notice-2>
			<t-i-banner-2 :banner="banners" :mine_code="mine_code" @change_top_bg_color_img="change_top_bg_color_img"></t-i-banner-2>
		</view>

		<!-- 宁东运营-信息平台 -->
		<view v-if="mine_code == 'ningdongyunying'">
			<t-i-ice :iceList="ice_list" :mine_code="mine_code"></t-i-ice>
		</view>
		
		<!-- <t-i-ice :iceList="ice_list" :mine_code="mine_code"></t-i-ice> -->
		<!-- 固定入口 -->
		<t-i-icon :iconList="iconList" :mine_code="mine_code"></t-i-icon>
		<!-- 新闻列表 -->
		<t-i-news :newsList="newsList" :mine_code="mine_code"></t-i-news>

		<!-- 常用功能 -->
		<t-i-common v-if="mine_code == 'ningdongyunying'"></t-i-common>

		<!-- 开屏通告 -->
		<openingNotice></openingNotice>

		<!-- 宁东运营 -->
		<view v-if="mine_code == 'ningdongyunying'">
			<t-i-ningdongyunying :mine_code="mine_code"></t-i-ningdongyunying>
		</view>

		<!-- 金家渠 -->
		<view v-if="mine_code == 'jinjiaqu' || mine_code == 'jinjiaqu_neiwang'">
			<t-i-jinjiaqu :mine_code="mine_code"></t-i-jinjiaqu>
		</view>
		
		<!-- 石槽村 -->
		<view v-if="mine_code == 'shicaocun'">
			<t-i-shicaocun :mine_code="mine_code"></t-i-shicaocun>
		</view>
		
		<!-- 金凤 -->
		<view v-if="mine_code == 'jinfeng' || mine_code == 'jinfeng_neiwang'">
			<t-i-jinfeng :mine_code="mine_code"></t-i-jinfeng>
		</view>

		<!-- 羊场湾 -->
		<view v-if="mine_code == 'yangchangwan'">
			<t-i-yangchangwan :mine_code="mine_code" :home_link="home_link"></t-i-yangchangwan>
		</view>

	</view>
</template>

<script>
	import {
		set_base_url
	} from '@/common/set_base_url.js'
	// 版本控制
	import upApp from "@/uni_modules/uni-upgrade-center-app/utils/check-update"

	export default {
		data() {
			return {
				// 当前煤矿编码
				mine_code: "",

				// 首页接口的基础请求路径  默认为当前矿编码的基础路径
				base_url: " ",


				// 轮播图
				banners: [],
				// 新闻列表
				newsList: "",
				// 值班公告
				text: "",
				// 固定入口
				iconList: [],
				// 首页链接
				home_link: [],

				// 背景虚化图片
				top_bg_color_img: "",
				// 背景安全色
				top_bg_color: "#7372c2",
				// top_bg_color_list: ['#3e88c6', '#e75038', '#305471', '#f8bf3c', '#37ba73', '#7372c2'],
				top_bg_color_list: ['#d62b2b', '#00a2e8', '#b08654'],
				// 标题栏背景色
				navbar_bg_color: "",

				index_type: 1,

				// 信息平台链接
				ice_list: []
			}
		},
		onPullDownRefresh() {
			uni.reLaunch({
				url: "./index"
			})
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);

		},
		onLoad() {
			// 检查更新
			upApp()
			// 初始化当前煤矿编码
			this.mine_code = uni.getStorageSync('mine_code')
			
			// 风格定义
			this.$api.home_style_setting({
			
			}).then((res) => {
				// console.log(res.data.data)
			
				this.index_type = res.data.data.value
			})
			
			// token过期验证
			this.$api.worksheet_classify_list({
			
			}).then((res) => {
				// console.log(res)
				if (res.data.code == 401) {
					uni.showToast({
						icon: "none",
						title: "登录失效、请重新登录"
					})
			
					uni.clearStorageSync('Authorization');
			
					setTimeout(function() {
						uni.redirectTo({
							url: "../../my/login/login"
						})
					}, 1500)
				} else {
					// console.log(res)
				}
			})

		},
		onPageScroll: function(e) {
			if (e.scrollTop > 300) {
				this.navbar_bg_color = "#009fe8"
			} else {
				this.navbar_bg_color = ""
			}
		},
		onShow() {
			// E信-切换矿
			uni.$on('update_kuang', (data) => {
				console.log('监听到事件来自 update_kuang ，携带参数 msg 为：' + data.msg);
				this.mine_code = data.msg
				console.log(this.mine_code)
			})
			this.$forceUpdate()

			// 根据矿编码切换首页接口不同的请求基础路径
			this.base_url = set_base_url(this.mine_code)
			// uni.setStorageSync('base_url',this.base_url)
			

			// 获取轮播图
			this.get_banner()
			// 获取首页新闻列表
			this.getNews()
			// 值班公告
			this.get_notice()
			// 固定入口
			this.get_list()
			this.get_home_link()
			// 获取信息平台
			this.get_ICE_list()

			// this.setTabBarBadge()
		},
		methods: {
			// 获取轮播图
			get_banner() {
				uni.request({
					url: this.base_url + "/scrollImg/list",
					method: "GET",
					success: (res) => {
						// console.log(res.data.data.data)
						this.banners = res.data.data.data
						this.top_bg_color_img = this.banners[0].imgURL
					}
				})
			},
			// 请求新闻动态
			getNews() {
				uni.request({
					url: this.base_url + "/article/list",
					method: "GET",
					data: {
						pageSize: 4
					},
					success: (res) => {
						this.newsList = res.data.data.data
					}
				})
			},
			// 信息平台
			get_ICE_list() {
				uni.request({
					url: this.base_url + "/home/links",
					success: (res) => {
						// console.log(res.data.data)

						if(this.mine_code == 'jinfeng'){
							this.ice_list = res.data.data[2].children
						}else if(this.mine_code == 'ningdongyunying'){
							this.ice_list = res.data.data[1].children
						}else if(this.mine_code == 'shicaocun'){
							this.ice_list = res.data.data[0].children
						}
					}
				})
			},
			// 值班公告
			get_notice() {
				uni.request({
					url: this.base_url + "/notice/list",
					method: "GET",
					success: (res) => {
						if (!res.data.data.content) {
							this.text = res.data.data.message
						} else {
							this.text = res.data.data.content.replace(/<br /g, " ").replace(/>/g, " ").replace(
								/\//g, " ")
						}
					}
				})
			},
			// 固定入口
			get_list() {
				// uni.request({
				// 	url: this.base_url + "/homeNav/list",
				// 	method: "GET",
				// 	success: (res) => {
				// 		console.log(res.data.data.data)
				// 		// this.iconList = res.data.data.data.slice(0, 5)
				// 		this.iconList = res.data.data.data
				// 	}
				// })

				// 加分组
				uni.request({
					url: this.base_url + "/homeNav/listByCategory",
					method: "GET",
					success: (res) => {
						// console.log(res.data)

						this.iconList = res.data.data
					}
				})
			},
			// 首页链接
			get_home_link() {
				uni.request({
					url: this.base_url + "/home/links",
					method: "GET",
					success: (res) => {
						// console.log(res)
						this.home_link = res.data.data
					}
				})
			},

			// 切换背景图片
			change_top_bg_color_img(index) {
				// this.top_bg_color_img = this.banners[index].imgURL
				if (index > 2) {
					index = parseInt(3 * Math.random())
				}

				this.top_bg_color = this.top_bg_color_list[index]
			},

			setTabBarBadge() {
				// 工作台
				this.$api.workflow_todo_query({
					staff_num: uni.getStorageSync('user').staff_num,
					query_type: 2
				}).then((res) => {
				
					let num_1 = res.data.content.data
					
					this.$api.workflow_todo_query({
						staff_num: uni.getStorageSync('user').staff_num,
						query_type: 1
					}).then((res) => {
					
						let num_2 = res.data.content.data
						
						let num = num_1 + num_2
						
						if(num > 0){
							uni.setTabBarBadge({
								index: 2,
								text: '' + num + ''
							})
						}
						
					})
				})
				
				// 消息
				this.$api.five_fixed_fiveFixedNewCategory({
					
				}).then((res)=>{
					// console.log(res.data.content.data)
					
					let data = res.data.content.data
					let num = 0
					
					data.forEach((item,index)=>{
						num = num + item.no_num
					})
					
					if(num > 0){
						uni.setTabBarBadge({
							index: 1,
							text: '' + num + ''
						})
					}
				})
				
			}

		}

	}
</script>

<style lang="scss">
	page {
		background-color: #F6FAF6;
	}

	.top_bg_color {
		position: relative;

		width: 750rpx;
		overflow: hidden;

		.bg_img {
			width: 750rpx;
			height: 440rpx;

			position: absolute;
			top: 0;
			left: 0;
			z-index: 0;
			background-position: center;
			background-size: 100% 100%;
			filter: blur(50px);
			transform: scale(2);
			opacity: 0.9;
		}
	}
</style>