uniProject/components/listCard/hetongCard.vue

<template>
	<view class="shouye-card-box hetong-card-box">
		<!-- card title -->
		<view class="card-head-box">
			<view class="card-line-title">合同</view>
			<view class="card-more" @click="checkMore">更多<icon class="more-jt"></icon></view>
		</view>
		<!-- 内容区域 -->
		<view class="card-body-box">
			<view class="card-body-row">
				<view class="body-row">
					<view class="title-text">
						<icon class="user-icon" :style="{ backgroundImage: 'url(' + data.iconsArr.jzgsIcon + ')' }"></icon>家政公司名称
					</view>
					<view class="value-text">{{data.jzName}}</view>
				</view>
				<view class="body-row">
					<view class="title-text">
						<icon class="user-icon" :style="{ backgroundImage: 'url(' + data.iconsArr.htJzIcon + ')' }"></icon>家政人员名称
					</view>
					<view class="value-text">{{data.realName}}</view>
				</view>
				<view class="body-row">
					<view class="title-text">
						<icon class="idcard-icon" :style="{ backgroundImage: 'url(' + data.iconsArr.htKhIcon + ')' }"></icon>客户名称
					</view>
					<view class="value-text">{{data.khName}}</view>
				</view>
			</view>
			<view class="card-body-row">
				<view class="body-row">
					<view class="title-text">
						<icon class="date-icon" :style="{ backgroundImage: 'url(' + data.iconsArr.htTimeIcon + ')' }"></icon>合同开始时间
					</view>
					<view class="value-text">{{data.startDate}}</view>
				</view>
				<view class="body-row">
					<view class="title-text">
						<icon class="date-icon" :style="{ backgroundImage: 'url(' + data.iconsArr.htTimeIcon + ')' }"></icon>合同结束时间
					</view>
					<view class="value-text">{{data.endDate}}</view>
				</view>
				<view class="body-row">
					<view class="title-text">
						<icon class="htzt-icon" :style="{ backgroundImage: 'url(' + data.iconsArr.htZtIcon + ')' }"></icon>合同状态
					</view>
					<view class="status-0" v-if="data.status== 0">待签字</view>
					<view class="status-1" v-if="data.status== 1">待审核</view>
					<view class="status-2" v-if="data.status== 2">有效</view>
					<view class="status-3" v-if="data.status== 3">失效</view>
				</view>
			</view>
		</view>
		<!-- 底部 -->
		<view class="card-bottom-box">
			<button type="default" class="index-card-btn" @click="handleStudy(data)">查看</button>
		</view>
	</view>
</template>

<script setup>
	defineProps({
		data: {
			type: Object,
		}
	})
	
	const Emits = defineEmits(['study'])
	
	function checkMore() {
		uni.navigateTo({
			url:"/pages/client/hetong/hetongList"
		})
	}
	
	function handleStudy(item) {
		Emits('study', item)
		/* uni.navigateTo({
			url: `/pages/client/hetong/hetongInfo?id=${item.id}`
		}) */
	}
</script>

<style>
</style>