考点扫描进度

src/pages/process/kdsmjd/[ykj_id].vue

@@ -4,7 +4,9 @@ import request from "~/utils/request";
 import {REQUEST} from "~/utils/request";
 import {user} from "~/store";
 import {useRouter} from "vue-router";
+
 const router = useRouter();
+console.log(router,7)
 const route = useRoute();
 const linkTo = (obj) => {
   router.push(obj);
@@ -16,21 +18,22 @@ let subject_id = $ref('')
 let school_list = $ref([])
 let subject_list = $ref([])
 let tableData = $ref([])
-let barSubject = $ref([]);
+let barSchool = $ref([]);
 let barPercent = $ref([]);
-let barUnusual = $ref(['缺考','学号异常','页码异常','缺考异常','客观题异常','选择题异常','判断题异常','填空题异常']);
-let barUnData = $ref([40,70,100,70,70,70,80,90])
+let barUnusual = $ref(['缺考', '学号异常', '页码异常', '缺考异常', '客观题异常', '选择题异常', '判断题异常', '填空题异常']);
+let barUnData = $ref([])
 let sub_nav = [{
-  id:'1',
-  name:'考场进度监控'
-},{
-  id:'2',
-  name:'异常分类监控'
+  id: '1',
+  name: '考场进度监控'
+}, {
+  id: '2',
+  name: '异常分类监控'
 }]
 let cur_sub = $ref({
-  id:'1',
-  name:'考场进度监控'
+  id: '1',
+  name: '考场进度监控'
 })
+
 function getFilterData() {
   let data = {
     ykj_id: ykj_id
@@ -45,6 +48,7 @@ function getFilterData() {
     }
   })
 }
+
 function getData() {
   let data = {
     ykj_id: ykj_id,
@@ -52,25 +56,27 @@ function getData() {
     subject_id: subject_id,
   };
   request({
-    url: "/yzy/scan/km",
+    url: "/yzy/scan/kd",
     data: data,
   }).then((res) => {
     if (res.code === '1') {
-     ykj_name = res.data.ksjh.ykj_ksrwmc;
-     tableData = res.data.list;
-     barSubject = [];
-     barPercent = [];
-     tableData.forEach(item =>{
-       barSubject.push(item.ze_xueke_name);
-       barPercent.push(item.scan_percent);
-     })
-      nextTick(()=>{
+      ykj_name = res.data.ksjh.ykj_ksrwmc;
+      tableData = res.data.list;
+      barSchool = [];
+      barPercent = [];
+      res.data.kdjd.forEach(item => {
+        barSchool.push(item.sm_name);
+        barPercent.push(item.scan_percent);
+      })
+      barUnData = [res.data.kcjk.qks,res.data.kcjk.xhycs,res.data.kcjk.ymycs,res.data.kcjk.qkycs,res.data.kcjk.kgtycs,res.data.kcjk.xztycs,res.data.kcjk.pdtycs,res.data.kcjk.tktycs];
+      nextTick(() => {
         initChart();
       })
 
     }
   })
 }
+
 function initChart() {
   // 基于准备好的dom，初始化echarts实例
   let myChart = echarts.init(document.getElementById('barBox'));
@@ -91,7 +97,7 @@ function initChart() {
       {
         type: 'category',
         name: '学校',
-        data: barSubject,
+        data: barSchool,
         axisTick: {
           alignWithLabel: true
         },
@@ -116,8 +122,8 @@ function initChart() {
           color: '#000',
           fontSize: 14
         },
-        itemStyle:{
-          color:'#6897FF',
+        itemStyle: {
+          color: '#6897FF',
           borderRadius: [16, 16, 0, 0]
         },
         data: barPercent
@@ -125,6 +131,7 @@ function initChart() {
     ]
   });
 }
+
 function initUnChart() {
   // 绘制图表
   let myChart_u = echarts.init(document.getElementById('unBox'));
@@ -144,7 +151,7 @@ function initUnChart() {
     xAxis: [
       {
         type: 'category',
-        name: '考点',
+        name: '异常',
         data: barUnusual,
         axisTick: {
           alignWithLabel: true
@@ -154,7 +161,7 @@ function initUnChart() {
     yAxis: [
       {
         type: 'value',
-        name: '人数（%）',
+        name: '人数',
         nameTextStyle: {
           fontSize: 14
         }
@@ -170,8 +177,8 @@ function initUnChart() {
           color: '#000',
           fontSize: 14
         },
-        itemStyle:{
-          color:'#6897FF',
+        itemStyle: {
+          color: '#6897FF',
           borderRadius: [16, 16, 0, 0]
         },
         data: barUnData
@@ -179,21 +186,23 @@ function initUnChart() {
     ]
   });
 }
+
 function switchSub(item) {
   cur_sub = item;
-  if(item.id === '1') {
-    nextTick(()=>{
+  if (item.id === '1') {
+    nextTick(() => {
       initChart();
     })
 
   } else {
-    nextTick(()=>{
+    nextTick(() => {
       initUnChart();
     })
 
   }
 
 }
+
 onMounted(() => {
   if (route.params.ykj_id) {
     ykj_id = route.params.ykj_id;
@@ -219,7 +228,7 @@ onMounted(() => {
       <button type="button" class="back-btn" @click="linkTo({name:'process'})">返回</button>
     </div>
     <div class="mt-10px w-full bg-hex-fff py-20px px-15px">
-      <h3 class="mb-20px text-16px text-center">{{ykj_name}}</h3>
+      <h3 class="mb-20px text-16px text-center">{{ ykj_name }}</h3>
       <ul class="tab-nav m-auto">
         <li @click="linkTo({name:'process-smpyjd-ykj_id',params:{ykj_id:ykj_id}})">科目扫描进度</li>
         <li class="selected">考点扫描进度</li>
@@ -249,7 +258,9 @@ onMounted(() => {
           </el-select>
         </div>
         <ul class="sub-nav">
-          <li v-for="item in sub_nav" :class="item.id === cur_sub.id?'selected':''" @click="switchSub(item)">{{item.name}}</li>
+          <li v-for="item in sub_nav" :class="item.id === cur_sub.id?'selected':''" @click="switchSub(item)">
+            {{ item.name }}
+          </li>
         </ul>
       </div>
       <div v-if="cur_sub.id === '1'">
@@ -271,20 +282,20 @@ onMounted(() => {
             <th>操作</th>
           </tr>
           <tr v-for="item in tableData">
-            <td>{{item.ze_xueke_name}}</td>
-            <td>{{item.scan_percent}}</td>
-            <td>{{item.student_num}}</td>
-            <td>{{item.scan_num}}</td>
-            <td>{{item.qks}}</td>
-            <td>{{item.xhycs}}</td>
-            <td>{{item.ymycs}}</td>
-            <td>{{item.qkycs}}</td>
-            <td>{{item.kgtycs}}</td>
-            <td>{{item.xztycs}}</td>
-            <td>{{item.pdtycs}}</td>
-            <td>{{item.tktycs}}</td>
+            <td>{{ item.ykg_name }}</td>
+            <td>{{ item.scan_percent }}%</td>
+            <td>{{ item.student_num }}</td>
+            <td>{{ item.scan_num }}</td>
+            <td>{{ item.qks }}</td>
+            <td>{{ item.xhycs }}</td>
+            <td>{{ item.ymycs }}</td>
+            <td>{{ item.qkycs }}</td>
+            <td>{{ item.kgtycs }}</td>
+            <td>{{ item.xztycs }}</td>
+            <td>{{ item.pdtycs }}</td>
+            <td>{{ item.tktycs }}</td>
             <td>
-              <button type="button" class="op-btn">查看详情</button>
+              <button type="button" class="op-btn" @click="linkTo({name:'process-kdsmjd-detail-ykj_id-ykg_id',params:{ykj_id:ykj_id,ykg_id:item.ykg_id}})">查看详情</button>
             </td>
           </tr>
         </table>
@@ -300,7 +311,7 @@ onMounted(() => {
 
 <style scoped lang="scss">
 $color: #0048e5;
-.tab-nav{
+.tab-nav {
   width: 457px;
   background: #ffffff;
   border: 1px solid #dbe7ec;
@@ -308,7 +319,8 @@ $color: #0048e5;
   display: flex;
   align-items: center;
   padding: 6px 9px;
-  li{
+
+  li {
     width: 140px;
     height: 28px;
     border-radius: 4px;
@@ -317,15 +329,18 @@ $color: #0048e5;
     text-align: center;
     line-height: 28px;
     cursor: pointer;
-    &+li{
+
+    & + li {
       margin-left: 10px;
     }
-    &.selected{
+
+    &.selected {
       background: #e2eaf9;
       color: #000;
     }
   }
 }
+
 .data-table {
   width: 100%;
   table-layout: fixed;
@@ -341,10 +356,12 @@ $color: #0048e5;
     text-align: center;
     font-size: 16px;
     color: #fff;
-    &:first-child{
+
+    &:first-child {
       border-radius: 6px 0 0 0;
     }
-    &:last-child{
+
+    &:last-child {
       border-radius: 0 6px 0 0;
     }
   }
@@ -370,6 +387,7 @@ $color: #0048e5;
     background: url("/images/no-data.png") center no-repeat;
   }
 }
+
 .op-btn {
   width: 82px;
   height: 30px;
@@ -379,18 +397,21 @@ $color: #0048e5;
   font-size: 14px;
   color: #003eee;
   text-align: center;
-  &:disabled{
+
+  &:disabled {
     background: #ccc;
     border-color: #ccc;
     color: #fff;
     pointer-events: none;
   }
 }
-.sub-nav{
+
+.sub-nav {
   width: 280px;
   height: 30px;
   display: flex;
-  li{
+
+  li {
     width: 50%;
     background: #ffffff;
     font-size: 16px;
@@ -399,17 +420,20 @@ $color: #0048e5;
     line-height: 28px;
     text-align: center;
     cursor: pointer;
-    &.selected{
-      border-radius: 4px!important;
-      background:#003eee;
+
+    &.selected {
+      border-radius: 4px !important;
+      background: #003eee;
       border-color: #003eee;
       color: #fff;
     }
-    &:first-child{
+
+    &:first-child {
       border-right: 0;
       border-radius: 4px 0 0 4px;
     }
-    &:last-child{
+
+    &:last-child {
       border-left: 0;
       border-radius: 0 4px 4px 0;
     }

src/pages/process/kdsmjd/detail/[id].vue

@@ -1,178 +0,0 @@
-<script setup>
-import request from "~/utils/request";
-import {REQUEST} from "~/utils/request";
-import {user} from "~/store";
-import {useRouter} from "vue-router";
-const router = useRouter();
-const route = useRoute();
-const linkTo = (name) => {
-  router.push({name});
-};
-let type_list = $ref([{
-  id:'1',
-  name:'缺考'
-},{
-  id:'2',
-  name:'学号异常'
-},{
-  id:'3',
-  name:'页码异常',
-},{
-  id:'4',
-  name:'缺考异常'
-},{
-  id:'5',
-  name:'客观题异常'
-},{
-  id:'6',
-  name:'选择题异常'
-},{
-  id:'7',
-  name:'判断题异常'
-},{
-  id:'8',
-  name:'填空题异常'
-}])
-let cur_type = $ref({
-  id:'1',
-  name:'缺考'
-})
-function switchType(item) {
-  cur_type = item;
-}
-function getListData() {
-
-}
-let limit = $ref(10);
-let total = $ref(0);
-let cur_page = $ref(1);
-const handleSelectionChange = (val) => {
-  cur_page = val;
-  getListData();
-};
-</script>
-<route lang="json">
-{
-"meta":{
-"title":"科目扫描进度详情",
-"breadcrumb":true
-}
-}
-</route>
-<template>
-  <NavHeader/>
-  <bread-crumb/>
-  <div class="w-1200px m-auto">
-    <div class="relative -mt-40px flex justify-end">
-      <button type="button" class="back-btn" @click="linkTo('process')">返回</button>
-    </div>
-    <div class="mt-10px w-full bg-hex-fff py-20px px-15px">
-      <h3 class="mb-45px text-18px text-center">语文</h3>
-      <ul class="type-list">
-        <li v-for="item in type_list" :class="item.id === cur_type.id?'selected':''" @click="switchType(item)">
-          {{item.name}}
-          <span></span>
-        </li>
-      </ul>
-      <ul class="mt-10px stu-list">
-        <li>
-          <h3 class="text-16px">蒙阴市中小学</h3>
-          <h3 class="text-16px mt-8px">第一考场</h3>
-          <h3 class="text-16px mt-8px">1392384789&nbsp;&nbsp;张大大</h3>
-        </li>
-        <li>
-          <h3 class="text-16px">蒙阴市中小学</h3>
-          <h3 class="text-16px mt-8px">第一考场</h3>
-          <h3 class="text-16px mt-8px">1392384789&nbsp;&nbsp;张大大</h3>
-        </li>
-        <li>
-          <h3 class="text-16px">蒙阴市中小学</h3>
-          <h3 class="text-16px mt-8px">第一考场</h3>
-          <h3 class="text-16px mt-8px">1392384789&nbsp;&nbsp;张大大</h3>
-        </li>
-        <li>
-          <h3 class="text-16px">蒙阴市中小学</h3>
-          <h3 class="text-16px mt-8px">第一考场</h3>
-          <h3 class="text-16px mt-8px">1392384789&nbsp;&nbsp;张大大</h3>
-        </li>
-        <li>
-          <h3 class="text-16px">蒙阴市中小学</h3>
-          <h3 class="text-16px mt-8px">第一考场</h3>
-          <h3 class="text-16px mt-8px">1392384789&nbsp;&nbsp;张大大</h3>
-        </li>
-        <li>
-          <h3 class="text-16px">蒙阴市中小学</h3>
-          <h3 class="text-16px mt-8px">第一考场</h3>
-          <h3 class="text-16px mt-8px">1392384789&nbsp;&nbsp;张大大</h3>
-        </li>
-        <li>
-          <h3 class="text-16px">蒙阴市中小学</h3>
-          <h3 class="text-16px mt-8px">第一考场</h3>
-          <h3 class="text-16px mt-8px">1392384789&nbsp;&nbsp;张大大</h3>
-        </li>
-      </ul>
-      <div class="mt-20px page-new flex justify-end">
-        <el-pagination v-model:current-page="cur_page" v-model:page-size="limit" layout="total,prev, pager, next"
-                       :total="total" :background="true" @current-change="handleSelectionChange"></el-pagination>
-      </div>
-    </div>
-  </div>
-</template>
-
-<style scoped lang="scss">
-$color: #0048e5;
-::v-deep .el-pagination.is-background .btn-next.is-active,
-::v-deep .el-pagination.is-background .btn-prev.is-active,
-::v-deep .el-pagination.is-background .el-pager li.is-active {
-  background-color: $color;
-}
-.type-list{
-  width: 100%;
-  border-bottom: 1px solid #D4E1FF;
-  display: flex;
-  align-items: center;
-  padding-left: 10px;
-  li{
-    position: relative;
-    width: 100px;
-    font-size: 16px;
-    color: #595959;
-    padding-bottom: 15px;
-    text-align: center;
-    cursor: pointer;
-    &+li{
-      margin-left: 25px;
-    }
-    &.selected{
-      font-size: 18px;
-      color: #0148E5;
-      span{
-        display: block;
-      }
-    }
-    span{
-      display: none;
-      position: absolute;
-      left: 0;
-      bottom: 0;
-      width: 100%;
-      height: 4px;
-      background: #0148e5;
-      border-radius: 2px;
-    }
-  }
-}
-.stu-list{
-  width: 100%;
-  display: flex;
-  flex-wrap: wrap;
-  li{
-    width: 237px;
-    background: #f1f7ff;
-    border-radius: 40px;
-    margin: 35px 0 0 35px;
-    padding: 20px 0;
-    text-align: center;
-  }
-}
-</style>

src/pages/process/kdsmjd/detail/[ykj_id]/[ykg_id].vue

@@ -0,0 +1,202 @@
+<script setup>
+import request from "~/utils/request";
+import {REQUEST} from "~/utils/request";
+import {user} from "~/store";
+import {useRouter} from "vue-router";
+const router = useRouter();
+console.log(router,7)
+const route = useRoute();
+const linkTo = (obj) => {
+  router.push(obj);
+};
+let type_list = $ref([{
+  id:'qks',
+  name:'缺考'
+},{
+  id:'xhycs',
+  name:'学号异常'
+},{
+  id:'ymycs',
+  name:'页码异常',
+},{
+  id:'qkycs',
+  name:'缺考异常'
+},{
+  id:'kgtycs',
+  name:'客观题异常'
+},{
+  id:'xztycs',
+  name:'选择题异常'
+},{
+  id:'pdtycs',
+  name:'判断题异常'
+},{
+  id:'tktycs',
+  name:'填空题异常'
+}])
+let cur_type = $ref({
+  id:'qks',
+  name:'缺考'
+})
+let ykj_id = $ref('')
+let ykg_id = $ref('')
+let ykg_name = $ref('')
+let limit = $ref(10);
+let total = $ref(0);
+let cur_page = $ref(1);
+let listData = $ref([]);
+let fullscreenLoading = $ref(false);
+function switchType(item) {
+  cur_type = item;
+  cur_page = 1;
+  getListData();
+}
+function getListData() {
+  fullscreenLoading = true;
+  let data = {
+    page: cur_page,
+    ykg_id:ykg_id,
+    limit: limit,
+    tab:cur_type.id
+  };
+  request({
+    url: "/yzy/scan/kd_detail",
+    data: data,
+  }).then((res) => {
+    fullscreenLoading = false;
+    if (res.code === '1') {
+      ykg_name = res.data.kc_info.ykg_name;
+      listData = res.data.page_data;
+      total = Number(res.data.total_rows);
+      cur_page = Number(res.data.page_now);
+    }
+  })
+}
+const handleSelectionChange = (val) => {
+  cur_page = val;
+  getListData();
+};
+if (route.params.ykg_id) {
+  ykg_id = route.params.ykg_id;
+  ykj_id = route.params.ykj_id;
+  getListData();
+}
+</script>
+<route lang="json">
+{
+"meta":{
+"title":"考点扫描进度详情",
+"breadcrumb":true
+}
+}
+</route>
+<template>
+  <NavHeader/>
+  <bread-crumb/>
+  <div class="w-1200px m-auto" v-loading.fullscreen.lock="fullscreenLoading">
+    <div class="relative -mt-40px flex justify-end">
+      <button type="button" class="back-btn" @click="linkTo({name:'process-kdsmjd-ykj_id',params:{ykj_id:ykj_id}})">返回</button>
+    </div>
+    <div class="mt-10px w-full bg-hex-fff py-20px px-15px">
+      <h3 class="mb-45px text-18px text-center">{{ykg_name}}</h3>
+      <ul class="type-list">
+        <li v-for="item in type_list" :class="item.id === cur_type.id?'selected':''" @click="switchType(item)">
+          {{item.name}}
+          <span></span>
+        </li>
+      </ul>
+      <div v-if="listData.length > 0">
+        <ul class="mt-10px stu-list min-h-400px">
+          <li v-for="item in listData">
+            <h3 class="text-16px">{{item.sm_name}}</h3>
+            <h3 class="text-16px mt-8px">{{item.ykg_name}}</h3>
+            <h3 class="text-16px mt-8px">{{item.student_no}}&nbsp;&nbsp;{{item.user_realname}}</h3>
+          </li>
+        </ul>
+        <div class="mt-20px page-new flex justify-end">
+          <el-pagination v-model:current-page="cur_page" v-model:page-size="limit" layout="total,prev, pager, next"
+                         :total="total" :background="true" @current-change="handleSelectionChange"></el-pagination>
+        </div>
+      </div>
+      <div v-else class="no-data">
+        <div>
+          <h3 class="no-data-img"></h3>
+          <h4 class="mt-25px text-18px text-hex-0048e5 text-center">暂无数据</h4>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped lang="scss">
+$color: #0048e5;
+::v-deep .el-pagination.is-background .btn-next.is-active,
+::v-deep .el-pagination.is-background .btn-prev.is-active,
+::v-deep .el-pagination.is-background .el-pager li.is-active {
+  background-color: $color;
+}
+.type-list{
+  width: 100%;
+  border-bottom: 1px solid #D4E1FF;
+  display: flex;
+  align-items: center;
+  padding-left: 10px;
+  li{
+    position: relative;
+    width: 100px;
+    font-size: 16px;
+    color: #595959;
+    padding-bottom: 15px;
+    text-align: center;
+    cursor: pointer;
+    &+li{
+      margin-left: 25px;
+    }
+    &.selected{
+      font-size: 18px;
+      color: #0148E5;
+      span{
+        display: block;
+      }
+    }
+    span{
+      display: none;
+      position: absolute;
+      left: 0;
+      bottom: 0;
+      width: 100%;
+      height: 4px;
+      background: #0148e5;
+      border-radius: 2px;
+    }
+  }
+}
+.stu-list{
+  width: 100%;
+  display: flex;
+  flex-wrap: wrap;
+  align-items:flex-start;
+  li{
+    width: 237px;
+    height: auto;
+    background: #f1f7ff;
+    border-radius: 40px;
+    margin: 35px 0 0 35px;
+    padding: 20px 0;
+    text-align: center;
+  }
+}
+.no-data {
+  width: 100%;
+  height: 450px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  .no-data-img {
+    width: 233px;
+    height: 199px;
+    background: url("/images/no-data.png") center no-repeat;
+  }
+}
+</style>

src/pages/process/smpyjd/[ykj_id].vue

@@ -185,7 +185,7 @@ onMounted(() => {
         </tr>
         <tr v-for="item in tableData">
           <td>{{item.ze_xueke_name}}</td>
-          <td>{{item.scan_percent}}</td>
+          <td>{{item.scan_percent}}%</td>
           <td>{{item.student_num}}</td>
           <td>{{item.scan_num}}</td>
           <td>{{item.qks}}</td>

src/pages/process/smpyjd/detail/[ykj_id]/[ze_id].vue

@@ -38,6 +38,7 @@ let cur_type = $ref({
   name:'缺考'
 })
 let ze_id = $ref('')
+let ze_xueke_name = $ref('')
 let ykj_id = $ref('')
 let limit = $ref(10);
 let total = $ref(0);
@@ -63,6 +64,7 @@ function getListData() {
   }).then((res) => {
     fullscreenLoading = false;
     if (res.code === '1') {
+      ze_xueke_name = res.data.ze_info.ze_xueke_name;
       listData = res.data.page_data;
       total = Number(res.data.total_rows);
       cur_page = Number(res.data.page_now);
@@ -95,7 +97,7 @@ if (route.params.ze_id) {
       <button type="button" class="back-btn" @click="linkTo({name:'process-smpyjd-ykj_id',params:{ykj_id:ykj_id}})">返回</button>
     </div>
     <div class="mt-10px w-full bg-hex-fff py-20px px-15px">
-      <h3 class="mb-45px text-18px text-center">语文</h3>
+      <h3 class="mb-45px text-18px text-center">{{ze_xueke_name}}</h3>
       <ul class="type-list">
         <li v-for="item in type_list" :class="item.id === cur_type.id?'selected':''" @click="switchType(item)">
           {{item.name}}