<template>
	<view class="jobDetails-box">
        <navbar class="navbarSticky" bg="#F6F6F6">
			<view class="jobDetails-header-box">
				<van-icon class="jobDetails-header-left" name="arrow-left" @click="back"/>
                <text class="jobDetails-header-title">作业情况</text>
            </view>
		</navbar>
        <view class="jobDetails-content">
            <view class="jobDetails-content-header">
                <view class="jobDetails-conten-title flex">
                    <text>成都2022科学益智L4 -05乐思会</text>
                    <view>高一作业11</view>
                </view>
                <view class="jobDetails-num-box flex">
                    <view class="jobDetails-num flex">
                        <text>学生数</text>
                        <view>15</view>
                    </view>
                    <view class="jobDetails-num flex">
                        <text>已提交</text>
                        <view>12</view>
                    </view>
                    <view class="jobDetails-num flex">
                        <text>已批阅</text>
                        <view>10</view>
                    </view>
                    <view class="jobDetails-num flex">
                        <text>优秀</text>
                        <view>5</view>
                    </view>
                </view>
            </view>
            <view class="index-student-information">
                <jobDetailsComponents></jobDetailsComponents>
            </view>
        </view>
	</view>
</template>
<script>
    import jobDetailsComponents from '@/components/index/scoreDetails/jobDetailsComponents'
	import {
		reactive,
		toRefs,
		onMounted,
		getCurrentInstance,
		inject
	} from "vue";

	export default {
		props: {
			
		},
		components: {
            jobDetailsComponents
        },
		setup() {

			let data = reactive({
				obj: {
					Name: '',
					Photo: '',
				},
				showPhone: false,
				showLogin: true, //多次点击
			});
            let methods = {
                back(){
                    uni.reLaunch({
                        url: '/pages/index/workSituation?tabNme=' + '作业情况' 
					});
                }
            }
			return {
				...toRefs(data),
                ...methods
			};
		}
	};
</script>
<style scoped>
    .index-student-information{
        min-height: 800rpx;
		background: #FFFFFF;
		border-radius: 50rpx 50rpx 0 0;
		padding: 71rpx 0 30rpx 0;
    }
    .jobDetails-num view{
        font-size: 36rpx;
        font-weight: 800;
        font-style: italic;
        margin-top: 15rpx;
    }
    .jobDetails-num text{
        font-size: 20rpx;
        font-weight: 400;
    }
    .jobDetails-num{
        flex-direction: column;
        color: #CE8086;
    }
    .jobDetails-num-box{
        justify-content: space-between;
        padding: 70rpx 100rpx 35rpx 100rpx;
    }
    .jobDetails-conten-title view{
        font-size: 50rpx;
        font-weight: 800;
    }
    .jobDetails-conten-title text{
        font-size: 36rpx;
        font-weight: 400;
        margin-bottom: 10rpx;
    }
    .jobDetails-conten-title{
        padding: 50rpx 50rpx 0 50rpx;
        flex-direction: column;
        color: #282828;
        letter-spacing: 1rpx;
    }
    .jobDetails-content-header{
        
    }
    .jobDetails-content{
        position: relative;
        z-index: 2;
    }
    .jobDetails-box{
        background: #FCEEEF;
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 0;
    }
    .jobDetails-header-title{
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        padding: 37rpx 31rpx;
        text-align: center;
        letter-spacing: 1rpx;
        font-size: 32rpx;
        font-weight: 500;
        color: #282828;
    }
    .jobDetails-header{
        margin: 50rpx 50rpx 0 50rpx;
        align-items: center;
    }
    .jobDetails-header-left{
        font-size: 40rpx;
        position: relative;
        z-index: 3;
    }
	.jobDetails-header-box{
        padding: 37rpx 31rpx;
        position: relative;
    }
    .navbarSticky {
		display: sticky;
		top: 0;
		z-index: 9;
	}
</style>
