<template>
    <view class="h-[60px] fx-row fx-cen-cen gap-40 mx-shadow-up">
        <uv-button :loading="loading" :text="text" type="primary" size="large" shape="circle"
                   :custom-style="{width: '55vw', height: '44px'}" @click="handleComplete"/>
    </view>
</template>

<script setup>
import {computed} from 'vue'
import {createPropDefine} from "@/utils";
import {useInjectPaperService} from "@/components/mx-paper/usePaperInjection";
import {useInjectPaperNavigatorRef} from "@/components/mx-paper/components/usePaperNavigatorRefInjection";
import {useInjectPaperNavigationService} from "@/components/mx-paper/usePaperNavigationServiceInjection";

const props = defineProps({
    continueName: createPropDefine('')
})

const {loading, allowAnswer, allowScore, commitPaper, scorePaper, triggerContinueNext} = useInjectPaperService()
const {navigator} = useInjectPaperNavigatorRef()
const {uncompletedCheckForSubmit} = useInjectPaperNavigationService()

const text = computed(() => {
    if (allowAnswer.value) return '完成'
    if (allowScore.value) return '结束阅卷'
    return props.continueName || '继续做题'
})

const handleComplete = async () => {
    await uncompletedCheckForSubmit(navigator.value)

    if (allowAnswer.value) {
        commitPaper()
    } else if (allowScore.value) {
        scorePaper()
    } else {
        triggerContinueNext()
    }
}
</script>

<style scoped>

</style>