| | |
|---|
| | | <div class="time-container flex justify-center text-white items-center shadow-md"> |
|---|
| | | <el-icon class="mr-1 text-xl" size="24"><Timer /></el-icon> |
|---|
| | | <div class="label mr-1">剩余时间:</div> |
|---|
| | | <el-countdown :value="time" /> |
|---|
| | | <el-countdown :value="time" @finish="timeFinish" /> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script setup> |
|---|
| | | import {ref} from 'vue'; |
|---|
| | | import dayjs from 'dayjs'; |
|---|
| | | import { storeToRefs } from 'pinia'; |
|---|
| | | import { Timer } from '@element-plus/icons-vue'; |
|---|
| | | import { useExamStore } from '@/store/index.js'; |
|---|
| | | |
|---|
| | | const time = ref(1000); |
|---|
| | | const examStore = useExamStore(); |
|---|
| | | const { examInfo } = storeToRefs(examStore); |
|---|
| | | |
|---|
| | | const emit = defineEmits(['timeOut']); |
|---|
| | | |
|---|
| | | const time = ref(dayjs().valueOf() + examInfo.value.examTime * 1000); |
|---|
| | | |
|---|
| | | const timeFinish = () => { |
|---|
| | | emit('timeOut'); |
|---|
| | | } |
|---|
| | | |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style lang="scss" scoped> |
|---|
