uniProject/pages/kehu/shouye/shouye.vue

<template>
	<view class="client-shouye-page">
		<customNavbarVue title="首页"></customNavbarVue>
	
		<template v-if="data.hetongList.length">
			<!-- 合同 -->
			<hetongCardVue v-if="data.hetongList!={}" :data="{ count: data.kaoshiCount, ...data.kaoshiList[0],iconsArr:data.iconsArr}"></hetongCardVue>
		</template>
		<view class="default-img-box" v-else>
			<icon :style="{ backgroundImage: 'url(' + data.defaultIndexImg + ')' }"></icon>
			<text>没有可培训的内容...</text>
		</view>
		<!-- 底部区域 -->
		<customTabbarKehu :currentTab="0"></customTabbarKehu>
	</view>
</template>

<script setup>
	import customNavbarVue from "@/components/custom-navbar/custom-navbar.vue";
	import hetongCardVue from '@/components/listCard/hetongCard.vue';
	import customTabbarKehu from "@/components/custom-tabbar/custom-tabbar-kehu.vue"

	import * as httpApi from "@/api/khShouye.js"
	import {
		onLoad, onShow
	} from "@dcloudio/uni-app"
	import {
		reactive
	} from "vue"
	import cacheManager from '@/utils/cacheManager.js'

	const data = reactive({
		hetongList: [],
		realName: '',
		defaultIndexImg: '',
		iconsArr: {
			jzIcon: '',
			keIcon: '',
			timeIcon: '',
			hzIcon: '',
		},
	})

	function initPage() {
		httpApi.getKehuIndex().then(res => {
			const {hetong} = res.data;
			data.hetongList = hetong || [];
		})
	}


	onLoad(() => {
		const auth = cacheManager.get('auth');
		data.realName = auth.realName;
		data.defaultIndexImg = cacheManager.get('projectImg').index_default_img;
		data.iconsArr.jzIcon = cacheManager.get('projectImg').index_content_icon2;
		data.iconsArr.keIcon = cacheManager.get('projectImg').index_content_icon3;
		data.iconsArr.timeIcon = cacheManager.get('projectImg').index_content_icon1;
		data.iconsArr.hzIcon = cacheManager.get('projectImg').index_content_icon4;
	})
	
	onShow(() => {
		initPage();
	})
</script>