ys-app/src/pages/business/CRM/leave/backApply.vue

<template>
	<view class="con-body">
		<view class="con-bg">
			<!-- 头部 -->
			<customHeader ref="customHeaderRef" :title="'销假申请'" :leftFlag="true" :rightFlag="true">
			</customHeader>

			<!-- 高度来避免头部遮挡 -->
			<view class="top-height" :style="{ paddingTop: navBarPaddingTop + 'px' }"></view>

			<!-- 正文内容 -->
			<view class="white-bg">
				<view class="tabs-container">
					<view class="white-bg-2" v-for="(item, index) in list" :key="index" @click="handleDetail(item)">
						<view class="report-list">

							<view class="title" style="margin-top: 10rpx;font-size: 30rpx">
								{{ item.typeval == '1' ? '全天' : item.typeval == '2' ? '前半个班次' : '后半个班次' }}

								<label v-if="item.applyType == '请假'" style="float: right;color: #03aa03;">
									{{ item.applyType }}</label>
								<label v-if="item.applyType == '销假'" style="float: right;color: #aa9303;">
									{{ item.applyType }}</label>
							</view>
							<view class="apply-row" style="margin-top: 10px;">
								<view class="r-left" style="font-size: 15px;font-weight: 500;">
									申请日期  {{ item.applyDate }}
								</view>
							</view>
							<view class="r-list">
								<view class="r-left">休假日期</view>
								<view class="r-right">{{ item.startDate }} 至 {{ item.endDate }}
									（ <label style="color: #03aa03;">
										{{ item.days.replace('.0', '') }}天</label> ）
								</view>
							</view>
							<view class="r-list">
								<view class="r-left">详细说明</view>
								<view v-if="item.reason && item.reason.length <= 18" class="r-right">{{ item.reason }}
								</view>
							</view>
							<view class="r-list" style="margin-top: -30rpx;"
								v-if="item.reason && item.reason.length > 18">
								<view class="r-right">{{ item.reason }}</view>
							</view>
							<view class="border-bottom" style="margin: 20rpx 0;"></view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
import {
	ref,
	onMounted
} from 'vue'
import {
	onShow
} from '@dcloudio/uni-app'
import customHeader from '@/components/customHeader.vue'
import {
	getNavBarPaddingTop
} from '@/utils/system.js'
import {
	getBackLeaveList
} from '@/api/crm/activity/activity'

let list = ref([]);
// 获取导航栏高度用于内容区域padding
const navBarPaddingTop = ref(0);
onMounted(() => {
	navBarPaddingTop.value = getNavBarPaddingTop() * 2;
	getApplyList();
})

onShow(() => {
	uni.$on('isRefresh', function () {
		getApplyList();
	})
})

async function getApplyList() {
	let param = {
		num: 0,
		size: 10
	}
	let res = await getBackLeaveList(param);
	list.value = res.rows;
}

// 跳转到添加申请
let handleDetail = (item) => {
	uni.navigateTo({
		url: "/pages/business/CRM/leave/addBackApply?data=" + encodeURIComponent(JSON
			.stringify(item))
	})
}
</script>

<style scoped>
.all-body {
	/* #ifdef APP-PLUS */
	top: 150rpx;
	height: calc(100vh - 75px);
	/* #endif */
	/* #ifndef APP-PLUS */
	top: 120rpx;
	height: calc(100vh);
	/* #endif */
}

.search {
	display: flex;
}

.search .btn-search {
	border: none;
	background: none;
	line-height: normal;
	color: #fff;
	line-height: 56rpx !important;
	padding: 10rpx 0 0;
	text-align: left;
	cursor: pointer;
}

.search .btn-search::after {
	display: none;
}

.search .custom-search {
	width: 80%;

}

.search .custom-search.uni-searchbar {
	padding-right: 0 !important;
}

.scroll-h {
	/* #ifdef APP-PLUS */
	height: calc(100vh - 120px);
	/* #endif */
	/* #ifndef APP-PLUS */
	height: calc(100vh - 110px);
	/* #endif */
}

.white-bg {
	padding-bottom: 10rpx;
}

:deep(.report-list .r-list) {
	padding: 0.5rem 0;
}
</style>