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.length" :data="{...data.hetongList[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({
		realName: '',
		defaultIndexImg: '',
		hetongList: [],
		iconsArr: {
			jzgsIcon: '',
			htJzIcon: '',
			htKhIcon: '',
			htTimeIcon: '',
			htZtIcon: '',
		},
	})

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


	onLoad(() => {
		const auth = cacheManager.get('auth');
		data.realName = auth.realName;
		data.defaultIndexImg = cacheManager.get('projectImg').index_default_img;
		data.iconsArr.jzgsIcon = cacheManager.get('projectImg').jzgs_icon;
		data.iconsArr.htJzIcon = cacheManager.get('projectImg').user_green_icon;
		data.iconsArr.htKhIcon = cacheManager.get('projectImg').zymc_icon;
		data.iconsArr.htTimeIcon = cacheManager.get('projectImg').date_icon;
		data.iconsArr.htZtIcon = cacheManager.get('projectImg').htzt_icon;
	})
	
	onShow(() => {
		initPage();
	})
</script>