pj_h5_cloud/src/App.vue

<script lang="ts">
import { getLaunchParam, getUrlQueryParam } from "@/sheep/utils/app"
import { getAppInfo } from "@@/utils/app"
import { APPENV } from "./sheep/constant"

interface TabbarItem {
	pagePath: string
	text: string
	iconPath: string
	selectedIconPath: string
	launchParam: string[]
	auth: string[]
}

const tabbar: TabbarItem[] = [
	{
		pagePath: "pages/tabbar/index",
		text: "导航",
		iconPath: "",
		selectedIconPath: "",
		launchParam: [],
		auth: [],
	},
	{
		pagePath: "pages/tabbar/canteen",
		text: "食堂",
		iconPath: "/static/tabbar/canteen.png",
		selectedIconPath: "/static/tabbar/canteen-select.png",
		launchParam: ["canteen"],
		auth: [],
	},
	{
		pagePath: "pages/tabbar/canteenAnalyse",
		text: "喜好分析",
		iconPath: "/static/tabbar/canteen-analyse.png",
		selectedIconPath: "/static/tabbar/canteen-analyse-select.png",
		launchParam: ["canteen"],
		auth: [],
	},
	{
		pagePath: "pages/tabbar/selfMerchant",
		text: "自营商家",
		iconPath: "/static/tabbar/selfMerchant.png",
		selectedIconPath: "/static/tabbar/selfMerchant-select.png",
		launchParam: ["selfMerchant"],
		auth: ["user"],
	},
	{
		pagePath: "pages/tabbar/coopMerchant",
		text: "合作商家",
		iconPath: "/static/tabbar/coopMerchant.png",
		selectedIconPath: "/static/tabbar/coopMerchant-select.png",
		launchParam: ["coopMerchant"],
		auth: ["user"],
	},
	// 在线商城(商品展示)
	{
		pagePath: "pages/tabbar/onlineShop",
		text: "在线商城",
		iconPath: "/static/tabbar/online-shop.png",
		selectedIconPath: "/static/tabbar/online-shop-select.png",
		launchParam: ["onlineShop"],
		auth: ["user"],
	},
	{
		pagePath: "pages/tabbar/prosperityShop",
		text: "共富商城",
		iconPath: "/static/tabbar/prosperity-shop.png",
		selectedIconPath: "/static/tabbar/prosperity-shop-select.png",
		launchParam: ["prosperityShop"],
		auth: ["user"],
	},
	{
		pagePath: "pages/tabbar/prosperityShopMchList",
		text: "共富商城",
		iconPath: "/static/tabbar/prosperity-shop.png",
		selectedIconPath: "/static/tabbar/prosperity-shop-select.png",
		launchParam: ["prosperityShopMchList"],
		auth: ["user"],
	},
	{
		pagePath: "pages/tabbar/cabinet",
		text: "智能柜",
		iconPath: "/static/tabbar/cabinet.png",
		selectedIconPath: "/static/tabbar/cabinet-select.png",
		launchParam: [],
		auth: ["doorAdmin"],
	},
	{
		pagePath: "pages/tabbar/order",
		text: "订单",
		iconPath: "/static/tabbar/order.png",
		selectedIconPath: "/static/tabbar/order-select.png",
		launchParam: ["canteen", "selfMerchant", "coopMerchant", "onlineShop", "prosperityShop"],
		auth: ["user"],
	},
	{
		pagePath: "pages/tabbar/flowStatistics",
		text: "流水统计",
		iconPath: "/static/tabbar/order.png",
		selectedIconPath: "/static/tabbar/order-select.png",
		launchParam: [],
		auth: ["merchant"],
	},
	{
		pagePath: "pages/tabbar/individualOrder",
		text: "订单",
		iconPath: "/static/tabbar/order.png",
		selectedIconPath: "/static/tabbar/order-select.png",
		launchParam: [],
		auth: ["merchant"],
	},
	{
		pagePath: "pages/tabbar/integrated",
		text: "综合服务",
		iconPath: "/static/tabbar/integrated.png",
		selectedIconPath: "/static/tabbar/integrated-select.png",
		launchParam: ["integrated"],
		auth: ["user"],
	},
	{
		pagePath: "pages/tabbar/my",
		text: "我的",
		iconPath: "/static/tabbar/my.png",
		selectedIconPath: "/static/tabbar/my-select.png",
		launchParam: ["canteen", "selfMerchant", "onlineShop", "coopMerchant", "integrated", "prosperityShop", "prosperityShopMchList"],
		auth: ["user", "merchant", "doorAdmin"],
	},
]

// 设置tabbar
const setTabbarItem = (index: number, item: TabbarItem, visible: boolean) => {
	uni.setTabBarItem({
		index,
		pagePath: item.pagePath,
		text: item.text,
		iconPath: item.iconPath,
		selectedIconPath: item.selectedIconPath,
		visible,
	})
}

// 根据启动参数和用户角色设置tabbar
const setTabbar = (launchParam?: string, auth?: string) => {
	if (launchParam && !auth) {
		tabbar.forEach((item, index) => {
			const visible = item.launchParam.includes(launchParam)
			setTabbarItem(index, item, visible)
		})
		return
	}
	if (!launchParam && auth) {
		tabbar.forEach((item, index) => {
			const visible = item.auth.includes(auth)
			setTabbarItem(index, item, visible)
		})
	}
	if (launchParam && auth) {
		tabbar.forEach((item, index) => {
			const visible = item.launchParam.includes(launchParam) && item.auth.includes(auth)
			setTabbarItem(index, item, visible)
		})
	}
}

export default {
	async onLaunch() {
		try {
			const lp = getUrlQueryParam("launchParam")
			if (lp) {
				uni.setStorageSync("launchParam", lp)
			}
			const { tryZzdEntryLogin } = await import("@/sheep/utils/request")
			await tryZzdEntryLogin()
			const { onZzdAppLaunchTrack } = await import("@/sheep/utils/zzd-aplus-track")
			await onZzdAppLaunchTrack()
		} catch (e) {
			console.warn("[App.onLaunch] tryZzdEntryLogin", e)
		}
	},
	async onShow() {
		try {
			const { onZzdAppShowTrack } = await import("@/sheep/utils/zzd-aplus-track")
			await onZzdAppShowTrack()
		} catch (e) {
			console.warn("[App.onShow] zzd track", e)
		}
	},
	methods: {
		async _initTabbar() {
			const launchParam = getLaunchParam()
			const appInfo = await getAppInfo()

			// 浙政钉环境
			if (appInfo == APPENV.ZZD) {
				if (!launchParam) return uni.hideTabBar()

				setTabbar(launchParam)
				uni.showTabBar()
				return
			}

			// 诗画环境
			if (appInfo == APPENV.SH) {
				if (!launchParam) return uni.hideTabBar()

				const userRole = uni.getStorageSync("userRole")
				switch (userRole) {
					case "user":
						setTabbar(launchParam, "user")
						uni.showTabBar()
						break
					case "merchant":
						setTabbar(undefined, "merchant")
						uni.showTabBar()
						break
					case "doorAdmin":
						setTabbar(undefined, "doorAdmin")
						uni.showTabBar()
						break
					default:
						uni.hideTabBar()
						uni.removeStorageSync("userRole")
						uni.showToast({ title: "用户身份未确认", icon: "none" })
						uni.reLaunch({ url: "/pages/user/userRole" })
						break
				}
			}
		},
	},
}
</script>

<style lang="scss">
@import "@/sheep/scss/global.scss";
@import "@/uni_modules/tm-ui/css/remixicon.min.css";

$theme-green: #06be36;
$theme-blue: #0094ff;
$theme-gray: #999;

.botder_btn {
	border: 1px solid #999;
	color: #999;
	font-weight: 500;
	font-size: 28rpx;
	border-radius: 10rpx;
	padding: 8rpx 15rpx;
}

.prefix_title {
	font-size: 32rpx;
	font-weight: 500;
	color: #333;

	&::before {
		content: "";
		display: inline-block;
		width: 8rpx;
		height: 24rpx;
		background: $theme-blue;
		border-radius: 4rpx;
		margin-right: 10rpx;
	}
}
</style>