<template>
	<view class="application">
		<block v-for="item in appDataList" :key="item.title">
			<view class="apply_line">
				<view class="title flex_a_c">
					<view class="text flex_a_c">
						{{item.type==1?'假勤':item.type==2?'行政':item.type==3?'财务':item.type==4?'人事':item.type==5?'财务':item.type==6?'报销':item.type==7?'发票':'合同' }}
					</view>
				</view>
				<view class="line_cent">
					<block v-for="(itemData,i) in item.data" :key="i">
						<view class="line_item" @click="lineCentClick(itemData)">
							<u--image :showLoading="true" :src="itemData.img" width="77.19rpx"
								height="77.19rpx"></u--image>
							<view class="name">{{ itemData.title }}</view>
						</view>
					</block>
				</view>
			</view>
		</block>
	</view>
</template>

<script>
	import {
		Toast
	} from '@/libs/uniApi.js'

	import {
		oaapprove,
		
	} from '@/api/oa.js'
	export default {
		data() {
			return {
				appDataList: [],
				src: 'https://cdn.uviewui.com/uview/album/1.jpg'
			}
		},
		onReady() {
			uni.setNavigationBarColor({
				frontColor: '#ffffff',
				backgroundColor: '#0122c7'
			})

		},
		onLoad() {
			this.getList()
		},
		onShow() {},
		methods: {
			//获取公列表
			async getList() {
				const res = await oaapprove()
				// this.appDataList = res.data
				const groupedData = res.data.reduce((result, item) => {
					const type = item.type;
					if (!result[type]) {
						result[type] = {
							type: type,
							data: []
						};
					}
					result[type].data.push(item);
					return result;
				}, {});
				
				this.appDataList=groupedData
		


			},
			lineCentClick(item) {
		uni.navigateTo({
			url: '/pages/leaveapplication/index?type='+item.id
		})
			
			},
			
		},
		onPullDownRefresh() {
			uni.stopPullDownRefresh()
		}
	}
</script>

<style lang="scss">
	.application {}

	.apply_line {
		width: 100%;
		padding: 0 28.07rpx;
		background-color: #fff;
		margin-bottom: 31.58rpx;

		.title {
			width: 100%;
			height: 77.19rpx;
			border-bottom: 1px solid rgba(204, 204, 204, 0.5);

			.text {
				font-size: 31.58rpx;

				&::before {
					content: '';
					display: inline-block;
					width: 2px;
					height: 33.33rpx;
					background-color: $theme-oa-color;
					margin-right: 10.53rpx;
				}
			}
		}

		.line_cent {
			display: flex;
			flex-wrap: wrap;

			.line_item {
				width: 220rpx;
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				padding: 28.07rpx 0;

				.name {
					font-size: 24.56rpx;
					margin-top: 14.04rpx;
				}
			}
		}

	}
</style>