~

components.d.ts

@@ -10,12 +10,20 @@ export {}
 declare module '@vue/runtime-core' {
   export interface GlobalComponents {
     ElButton: typeof import('element-plus/es')['ElButton']
+    ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
+    ElCheckboxGroup: typeof import('element-plus/es')['ElCheckboxGroup']
+    ElDialog: typeof import('element-plus/es')['ElDialog']
+    ElForm: typeof import('element-plus/es')['ElForm']
+    ElFormItem: typeof import('element-plus/es')['ElFormItem']
     ElLink: typeof import('element-plus/es')['ElLink']
+    ElRadio: typeof import('element-plus/es')['ElRadio']
+    ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
     ElStep: typeof import('element-plus/es')['ElStep']
     ElSteps: typeof import('element-plus/es')['ElSteps']
     'I:healthiconsYes': typeof import('~icons/healthicons/yes')['default']
     'I:mdi:horizontalLine': typeof import('~icons/mdi/horizontal-line')['default']
     'I:mdi:tick': typeof import('~icons/mdi/tick')['default']
+    Qxsz: typeof import('./src/components/step/link/qxsz.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
     TheCard: typeof import('./src/components/TheCard.vue')['default']

shims.d.ts

@@ -19,5 +19,6 @@ declare class LeaderLine {
 
 declare interface Window {
   handleCompleteTask: (gid: number, pid: number, idy: number) => void
+  handleAutoCompleteTask: () => void
 }
 

src/composables/steps.ts

@@ -1,6 +1,6 @@
 export const stepsMap = reactive([
   [
-    [1, 0, 0],
+    [0, 0, 1],
     [0, 0],
     [0],
   ],
@@ -28,6 +28,11 @@ export const stepsMap = reactive([
 //   sessionStorage.setItem('stepsMap', JSON.stringify(stepsMap))
 // }, { deep: true })
 
-window.handleCompleteTask = function (gid: number, pid: number, idy: number) {
-  stepsMap[gid][pid][idy] = 1
+window.handleCompleteTask = function (gid: number, pid: number, cid: number) {
+  stepsMap[gid][pid][cid] = 1
+}
+
+window.handleAutoCompleteTask = function () {
+  const { gid, pid, cid } = JSON.parse(sessionStorage.getItem('StepId')!)
+  window.handleCompleteTask(gid, pid, cid)
 }

src/main.ts

@@ -3,7 +3,7 @@ import { createRouter, createWebHistory } from 'vue-router'
 import routes from 'virtual:generated-pages'
 import App from './App.vue'
 
-import '@unocss/reset/tailwind.css'
+// import '@unocss/reset/tailwind.css'
 import './styles/main.css'
 import 'uno.css'
 import 'element-plus/es/components/message/style/css'

src/pages/[gid]/[pid]/[idy].vue

@@ -1,23 +0,0 @@
-<script setup lang='ts'>
-const props = defineProps<{
-  gid: string
-  pid: string
-  idy: string
-}>()
-const router = useRouter()
-function handleCompleteTask() {
-  window.handleCompleteTask(parseInt(props.gid), parseInt(props.pid), parseInt(props.idy))
-  router.back()
-}
-</script>
-
-<template>
-  <div>
-    <el-button @click="handleCompleteTask">
-      完成任务
-    </el-button>
-    <el-button @click="router.back()">
-      back
-    </el-button>
-  </div>
-</template>

src/pages/index.vue

@@ -197,7 +197,8 @@ const steps = reactive(
             },
           ],
         },
-      ])
+      ],
+)
 
 let gid = $ref<number>(0)
 let pids = $ref<number[]>([])
@@ -300,7 +301,8 @@ function handleClickTask(currentStep: number, idx: number, idy: number) {
     else
       return item
   })) {
-    router.push(`/${currentStep}/${idx}/${idy}`)
+    sessionStorage.setItem('StepId', JSON.stringify({ gid: currentStep, pid: idx, cid: idy }))
+    router.push('/detail')
   }
   else {
     ElMessage({
@@ -311,6 +313,18 @@ function handleClickTask(currentStep: number, idx: number, idy: number) {
   }
 }
 
+function beforeClickTask() {
+  const continueDoTask = Math.random() > 0.8// false
+  if (!continueDoTask) {
+    ElMessage({
+      message: '无权操作',
+      type: 'warning',
+      grouping: true,
+    })
+  }
+  return continueDoTask
+}
+
 function handleCompleteTask(gid: number, pid: number, idy: number) {
   if (stepsMap[gid][pid][idy] === 1) {
     return ElMessage({
@@ -319,12 +333,12 @@ function handleCompleteTask(gid: number, pid: number, idy: number) {
       grouping: true,
     })
   }
-  stepsMap[gid][pid][idy] = 1
+  window.handleCompleteTask(gid, pid, idy)
   if (pid === stepsMap[gid].length - 1)
     return
   const line = lineList[gid][pid][idy]
   line.setOptions({ color: '#003eee' })
-  document.querySelectorAll('.leader-line')[line._id as number - 1]?.classList.add('z10')
+  document.querySelectorAll('.leader-line')[line._id - 1]?.classList.add('z10')
 }
 
 onBeforeRouteLeave(() => {
@@ -337,8 +351,8 @@ onBeforeRouteLeave(() => {
     <div class="h-full w-220px">
       <el-steps direction="vertical" :active="gid">
         <el-step
-          v-for="({ title, children }, idx) in steps" :key="title" class="cursor-pointer hover:bg-light-600" :class="idx === currentStep && 'bg-light-400'"
-          @click="handleSwitchGid(idx)"
+          v-for="({ title, children }, idx) in steps" :key="title" class="cursor-pointer hover:bg-light-600"
+          :class="idx === currentStep && 'bg-light-400'" @click="handleSwitchGid(idx)"
         >
           <template #title>
             <div class="mb-4 font-normal">
@@ -363,9 +377,9 @@ onBeforeRouteLeave(() => {
       <!-- <div ref="Ref1" class="Ref1" h-10 w-10 bg-red-500 />
       <div ref="Ref2" class="Ref2" mt-100 h-10 w-10 bg-red-500 /> -->
       <div class="h-full flex justify-between">
-        <div v-for="(step, idx) in steps[currentStep].children" :key="idx" class="h-full flex flex-col justify-evenly">
+        <div v-for="(step, idx) in steps[currentStep].children " :key="idx" class="h-full flex flex-col justify-evenly">
           <the-card
-            v-for="(task, idy) in step.children" :key="idy"
+            v-for="(task, idy) in step.children " :key="idy"
             :ref="el => { CardsRef[idx] = CardsRef[idx] || []; CardsRef[idx][idy] = el as any }" :title="task.title"
             :description="task.description" :completed="!!stepsMap[currentStep][idx][idy]"
           >
@@ -373,13 +387,13 @@ onBeforeRouteLeave(() => {
               <template v-if="task.title === '预划考号区域'">
                 <div
                   class="min-w-60px cursor-pointer rounded bg-light-50 py-3px text-center text-xs"
-                  @click="handleClickTask(currentStep, idx, idy)"
+                  @click="beforeClickTask() && handleClickTask(currentStep, idx, idy)"
                 >
                   {{ !!stepsMap[currentStep][idx][idy] ? '已经完成' : '立即开始' }}
                 </div>
                 <div
                   class="min-w-60px cursor-pointer rounded bg-light-50 py-3px text-center text-xs"
-                  @click="handleCompleteTask(currentStep, idx, idy)"
+                  @click="beforeClickTask() && handleCompleteTask(currentStep, idx, idy)"
                 >
                   {{ '跳过' }}
                 </div>
@@ -387,7 +401,7 @@ onBeforeRouteLeave(() => {
               <template v-else>
                 <div
                   class="min-w-60px cursor-pointer rounded bg-light-50 py-3px text-center text-xs"
-                  @click="handleClickTask(currentStep, idx, idy)"
+                  @click="beforeClickTask() && handleClickTask(currentStep, idx, idy)"
                 >
                   {{ !!stepsMap[currentStep][idx][idy] ? '已经完成' : '立即开始' }}
                 </div>
@@ -400,9 +414,7 @@ onBeforeRouteLeave(() => {
                   <el-link type="primary">
                     修改试题答案
                   </el-link>
-                  <el-link type="primary">
-                    设置成绩查看权限
-                  </el-link>
+                  <qxsz :disabled="!!stepsMap[currentStep][idx][idy]" />
                   <el-link type="primary">
                     标记缺考
                   </el-link>
@@ -411,7 +423,6 @@ onBeforeRouteLeave(() => {
             </template>
           </the-card>
         </div>
-        <div />
       </div>
     </div>
   </div>