浏览代码

Merge branch 'master' into liua

* master:
  更改路由模式
la 2 年之前
父节点
当前提交
760835bc79
共有 3 个文件被更改,包括 237 次插入248 次删除
  1. 2 2
      src/main.ts
  2. 2 2
      src/pages/process/api.js
  3. 233 244
      src/pages/process/index.vue

+ 2 - 2
src/main.ts

@@ -1,5 +1,5 @@
 import { createApp } from 'vue'
-import { createRouter, createWebHistory } from 'vue-router'
+import { createRouter, createWebHashHistory } from 'vue-router'
 import routes from 'virtual:generated-pages'
 import App from './App.vue'
 import 'virtual:windi.css'
@@ -9,7 +9,7 @@ import 'element-plus/es/components/message/style/css'
 import 'element-plus/es/components/message-box/style/css'
 const app = createApp(App)
 const router = createRouter({
-  history: createWebHistory(import.meta.env.BASE_URL),
+  history: createWebHashHistory(import.meta.env.BASE_URL),
   routes,
 })
 for (const [key, component] of Object.entries(ElementPlusIconsVue)) {

+ 2 - 2
src/pages/process/api.js

@@ -1,8 +1,8 @@
 import request from "~/utils/request";
 
-export const process_list = (data = {}) => {
+export const project_list = (data = {}) => {
   return request({
-    url: '/yzy/kmksyjlc/index',
+    url: '/yzy/ksjh/index',
     data,
   })
 }

+ 233 - 244
src/pages/process/index.vue

@@ -3,24 +3,20 @@
   <bread-crumb/>
   <div class="w-1200px m-auto">
     <div class="flex items-center">
-      <el-date-picker
-        v-model="exam_time"
-        value-format="YYYY-MM-DD"
-        type="date"
-        placeholder="考试时间"
-        size="large"
-      />
-      <el-select class="ml-10px" v-model="exam_form" placeholder="考试形式" size="large">
-        <el-option label="全部" value="0"
-        />
-        <el-option
-          v-for="item in form_list"
-          :key="item.value"
-          :label="item.label"
-          :value="item.value"
+      <div class="w-360px">
+        <el-date-picker
+          v-model="exam_time"
+          value-format="YYYY-MM-DD"
+          type="daterange"
+          range-separator="至"
+          start-placeholder="开始时间"
+          end-placeholder="结束时间"
+          @change="handleDateChange"
+          size="large"
         />
-      </el-select>
-      <el-select class="ml-20px" v-model="exam_form" placeholder="考试类型" size="large">
+      </div>
+
+      <el-select class="ml-10px" v-model="exam_type" placeholder="考试类型" size="large" @change="filterData">
         <el-option label="全部" value="0"
         />
         <el-option
@@ -36,9 +32,11 @@
         style="width: 200px;"
         size="large"
         clearable
+        @keyup.enter="filterData"
+        @clear="filterData"
         placeholder="请输入关键字"
       />
-      <el-button color="#003eee" class="ml-20px" type="primary" size="large">搜索</el-button>
+      <el-button color="#003eee" class="ml-20px" type="primary" size="large" @click="filterData">搜索</el-button>
     </div>
     <div class="flex mt-20px justify-between">
       <button type="button" class="add-btn" @click="linkTo({name:'process-create'})">
@@ -47,222 +45,196 @@
         </el-icon>
         <span class="ml-5px inline-block align-middle">新建考试计划</span>
       </button>
-      <button type="button" class="del-btn">批量删除</button>
+      <button type="button" class="del-btn" :disabled="chooseCheck.length === 0">批量删除</button>
     </div>
-    <div class="mt-20px process-list-table">
-      <div class="head">
-        <div class="w-60px">
-          <p class="set-check all">
-            <input type="checkbox" id="chooseAll" @change="chooseAll" v-model="checked">
-            <label for="chooseAll"></label>
-          </p>
+    <div class="mt-20px" v-if="listData.length > 0">
+      <div class="process-list-table">
+        <div class="head">
+          <div class="w-60px">
+            <p class="set-check all">
+              <input type="checkbox" id="chooseAll" @change="chooseAll" v-model="checked">
+              <label for="chooseAll"></label>
+            </p>
+          </div>
+          <div class="w-280px text-left">考试计划名称</div>
+          <div class="w-250px">状态</div>
+          <div class="w-130px">考试类型</div>
+          <div class="w-220px">考试时间</div>
+          <div class="w-300px">操作</div>
         </div>
-        <div class="w-150px text-left">考试计划名称</div>
-        <div class="w-250px">状态</div>
-        <div class="w-130px">考试形式</div>
-        <div class="w-130px">考试类型</div>
-        <div class="w-180px">考试时间</div>
-        <div class="w-300px">操作</div>
-      </div>
-      <div>
-        <div class="line">
-          <div class="up">
-            <div class="w-60px">
-              <p class="set-check single">
-                <input type="checkbox" id="1" :value="1" v-model="chooseCheck">
-                <label :for="1"></label>
-              </p>
-            </div>
-            <div class="w-150px text-left">考试计划名称</div>
-            <div class="w-250px">
-              <span class="inline-block align-middle">进行中</span>
-              <div class="inline-block align-middle ml-10px process-state">
-                <h3 class="state-line">
-                  <span style="width: 11%;"></span>
-                </h3>
+        <div>
+          <div v-for="item in listData" class="line">
+            <div class="up">
+              <div class="w-60px">
+                <p class="set-check single">
+                  <input type="checkbox" :id="item.ykj_id" :value="item.ykj_id" v-model="chooseCheck">
+                  <label :for="item.ykj_id"></label>
+                </p>
               </div>
-              <span class="ml-10px inline-block align-middle">11%</span>
-            </div>
-            <div class="w-130px text-left">线下考试</div>
-            <div class="w-130px text-left">联考</div>
-            <div class="w-180px text-left">2023.2.4~2023.2.17</div>
-            <div class="w-300px">
-              <button type="button" class="op-btn">编辑</button>
-              <button type="button" class="op-btn ml-10px" @click="linkTo({name:'process-detail-id',params:{id:'1'}})">详情</button>
-              <div class="ml-10px relative op-btn cursor-pointer">
-                <span class="inline-block align-middle leading-28px">更多</span>
-                <div class="more-list">
-                  <ul>
-                    <li>阅卷任务</li>
-                    <li>扫描批阅进度</li>
-                    <li>考试分析</li>
-                    <li>删除</li>
-                  </ul>
+              <div class="w-280px text-left">{{item.ykj_ksrwmc}}</div>
+              <div class="w-250px">
+                <span class="inline-block align-middle">进行中</span>
+                <div class="inline-block align-middle ml-10px process-state">
+                  <h3 class="state-line">
+                    <span style="width: 11%;"></span>
+                  </h3>
                 </div>
+                <span class="ml-10px inline-block align-middle">11%</span>
               </div>
-              <button type="button" class="ml-10px inline-block align-middle arrow-btn up"></button>
-            </div>
-          </div>
-          <div class="down pt-15px pl-35px">
-            <ul class="subject-list">
-              <li>
-                <div>
-                  <div class="w-140px h-195px m-auto">
-                    <img src="/images/yuwen.png" class="w-full" alt="">
-                  </div>
-                  <div class="mt-5px">
-                    <div class="inline-block align-middle process-state">
-                      <h3 class="state-line">
-                        <span style="width: 11%;"></span>
-                      </h3>
-                    </div>
-                    <span class="ml-10px text-14px inline-block align-middle">11%</span>
-                  </div>
-                  <div class="mt-5px text-center">
-                    <button type="button" class="op-btn">查看</button>
+              <div class="w-130px text-left">
+                <span v-if="item.ykj_kslx === '1'">周考</span>
+                <span v-if="item.ykj_kslx === '2'">月考</span>
+                <span v-if="item.ykj_kslx === '3'">作业</span>
+                <span v-if="item.ykj_kslx === '4'">测验</span>
+                <span v-if="item.ykj_kslx === '5'">期中</span>
+                <span v-if="item.ykj_kslx === '6'">期末</span>
+                <span v-if="item.ykj_kslx === '7'">联考</span>
+              </div>
+              <div class="w-220px text-left">{{item.ykj_ksrq}}~{{item.ykj_jsrq}}</div>
+              <div class="w-300px">
+                <button type="button" class="op-btn">编辑</button>
+                <button type="button" class="op-btn ml-10px" @click="linkTo({name:'process-detail-id',params:{id:'1'}})">详情</button>
+                <div class="ml-10px relative op-btn cursor-pointer">
+                  <span class="inline-block align-middle leading-28px">更多</span>
+                  <div class="more-list">
+                    <ul>
+                      <li>扫描批阅进度</li>
+                      <li>考试分析</li>
+                      <li>删除</li>
+                    </ul>
                   </div>
                 </div>
-              </li>
-              <li>
-                <div>
-                  <div class="w-140px h-195px m-auto">
-                    <img src="/images/shuxue.png" class="w-full" alt="">
-                  </div>
-                  <div class="mt-5px">
-                    <div class="inline-block align-middle process-state">
-                      <h3 class="state-line">
-                        <span style="width: 11%;"></span>
-                      </h3>
+                <button type="button" class="ml-10px inline-block align-middle arrow-btn up"></button>
+              </div>
+            </div>
+            <div class="down pt-15px pl-35px">
+              <ul class="subject-list">
+                <li>
+                  <div>
+                    <div class="w-140px h-195px m-auto">
+                      <img src="/images/yuwen.png" class="w-full" alt="">
                     </div>
-                    <span class="ml-10px text-14px inline-block align-middle">11%</span>
-                  </div>
-                  <div class="mt-5px text-center">
-                    <button type="button" class="op-btn">查看</button>
-                  </div>
-                </div>
-              </li>
-              <li>
-                <div>
-                  <div class="w-140px h-195px m-auto">
-                    <img src="/images/yingyu.png" class="w-full" alt="">
-                  </div>
-                  <div class="mt-5px">
-                    <div class="inline-block align-middle process-state">
-                      <h3 class="state-line">
-                        <span style="width: 11%;"></span>
-                      </h3>
+                    <div class="mt-5px">
+                      <div class="inline-block align-middle process-state">
+                        <h3 class="state-line">
+                          <span style="width: 11%;"></span>
+                        </h3>
+                      </div>
+                      <span class="ml-10px text-14px inline-block align-middle">11%</span>
                     </div>
-                    <span class="ml-10px text-14px inline-block align-middle">11%</span>
-                  </div>
-                  <div class="mt-5px text-center">
-                    <button type="button" class="op-btn">查看</button>
-                  </div>
-                </div>
-              </li>
-              <li>
-                <div>
-                  <div class="w-140px h-195px m-auto">
-                    <img src="/images/wuli.png" class="w-full" alt="">
-                  </div>
-                  <div class="mt-5px">
-                    <div class="inline-block align-middle process-state">
-                      <h3 class="state-line">
-                        <span style="width: 11%;"></span>
-                      </h3>
+                    <div class="mt-5px text-center">
+                      <button type="button" class="op-btn">查看</button>
                     </div>
-                    <span class="ml-10px text-14px inline-block align-middle">11%</span>
-                  </div>
-                  <div class="mt-5px text-center">
-                    <button type="button" class="op-btn">查看</button>
-                  </div>
-                </div>
-              </li>
-              <li>
-                <div>
-                  <div class="w-140px h-195px m-auto">
-                    <img src="/images/huaxue.png" class="w-full" alt="">
                   </div>
-                  <div class="mt-5px">
-                    <div class="inline-block align-middle process-state">
-                      <h3 class="state-line">
-                        <span style="width: 11%;"></span>
-                      </h3>
+                </li>
+                <li>
+                  <div>
+                    <div class="w-140px h-195px m-auto">
+                      <img src="/images/shuxue.png" class="w-full" alt="">
+                    </div>
+                    <div class="mt-5px">
+                      <div class="inline-block align-middle process-state">
+                        <h3 class="state-line">
+                          <span style="width: 11%;"></span>
+                        </h3>
+                      </div>
+                      <span class="ml-10px text-14px inline-block align-middle">11%</span>
+                    </div>
+                    <div class="mt-5px text-center">
+                      <button type="button" class="op-btn">查看</button>
                     </div>
-                    <span class="ml-10px text-14px inline-block align-middle">11%</span>
                   </div>
-                  <div class="mt-5px text-center">
-                    <button type="button" class="op-btn">查看</button>
+                </li>
+                <li>
+                  <div>
+                    <div class="w-140px h-195px m-auto">
+                      <img src="/images/yingyu.png" class="w-full" alt="">
+                    </div>
+                    <div class="mt-5px">
+                      <div class="inline-block align-middle process-state">
+                        <h3 class="state-line">
+                          <span style="width: 11%;"></span>
+                        </h3>
+                      </div>
+                      <span class="ml-10px text-14px inline-block align-middle">11%</span>
+                    </div>
+                    <div class="mt-5px text-center">
+                      <button type="button" class="op-btn">查看</button>
+                    </div>
                   </div>
-                </div>
-              </li>
-              <li>
-                <div>
-                  <div class="w-140px h-195px m-auto">
-                    <img src="/images/shengwu.png" class="w-full" alt="">
+                </li>
+                <li>
+                  <div>
+                    <div class="w-140px h-195px m-auto">
+                      <img src="/images/wuli.png" class="w-full" alt="">
+                    </div>
+                    <div class="mt-5px">
+                      <div class="inline-block align-middle process-state">
+                        <h3 class="state-line">
+                          <span style="width: 11%;"></span>
+                        </h3>
+                      </div>
+                      <span class="ml-10px text-14px inline-block align-middle">11%</span>
+                    </div>
+                    <div class="mt-5px text-center">
+                      <button type="button" class="op-btn">查看</button>
+                    </div>
                   </div>
-                  <div class="mt-5px">
-                    <div class="inline-block align-middle process-state">
-                      <h3 class="state-line">
-                        <span style="width: 11%;"></span>
-                      </h3>
+                </li>
+                <li>
+                  <div>
+                    <div class="w-140px h-195px m-auto">
+                      <img src="/images/huaxue.png" class="w-full" alt="">
+                    </div>
+                    <div class="mt-5px">
+                      <div class="inline-block align-middle process-state">
+                        <h3 class="state-line">
+                          <span style="width: 11%;"></span>
+                        </h3>
+                      </div>
+                      <span class="ml-10px text-14px inline-block align-middle">11%</span>
+                    </div>
+                    <div class="mt-5px text-center">
+                      <button type="button" class="op-btn">查看</button>
                     </div>
-                    <span class="ml-10px text-14px inline-block align-middle">11%</span>
                   </div>
-                  <div class="mt-5px text-center">
-                    <button type="button" class="op-btn">查看</button>
+                </li>
+                <li>
+                  <div>
+                    <div class="w-140px h-195px m-auto">
+                      <img src="/images/shengwu.png" class="w-full" alt="">
+                    </div>
+                    <div class="mt-5px">
+                      <div class="inline-block align-middle process-state">
+                        <h3 class="state-line">
+                          <span style="width: 11%;"></span>
+                        </h3>
+                      </div>
+                      <span class="ml-10px text-14px inline-block align-middle">11%</span>
+                    </div>
+                    <div class="mt-5px text-center">
+                      <button type="button" class="op-btn">查看</button>
+                    </div>
                   </div>
-                </div>
-              </li>
-              <li class="cursor-pointer" @click="dialogVisible = true">
-                <div class="subject-add-btn"></div>
-              </li>
-            </ul>
-          </div>
-        </div>
-        <div class="line">
-          <div class="up">
-            <div class="w-60px">
-              <p class="set-check single">
-                <input type="checkbox" id="1" :value="1" v-model="chooseCheck">
-                <label :for="1"></label>
-              </p>
-            </div>
-            <div class="w-150px text-left">考试计划名称</div>
-            <div class="w-250px">
-              <span class="inline-block align-middle">进行中</span>
-              <div class="inline-block align-middle ml-10px process-state">
-                <h3 class="state-line">
-                  <span style="width: 11%;"></span>
-                </h3>
-              </div>
-              <span class="ml-10px inline-block align-middle">11%</span>
-            </div>
-            <div class="w-130px text-left">线下考试</div>
-            <div class="w-130px text-left">联考</div>
-            <div class="w-180px text-left">2023.2.4~2023.2.17</div>
-            <div class="w-300px">
-              <button type="button" class="op-btn">编辑</button>
-              <button type="button" class="op-btn ml-10px">详情</button>
-              <div class="ml-10px relative op-btn cursor-pointer">
-                <span class="inline-block align-middle leading-28px">更多</span>
-                <div class="more-list">
-                  <ul>
-                    <li>阅卷任务</li>
-                    <li>扫描批阅进度</li>
-                    <li>考试分析</li>
-                    <li>删除</li>
-                  </ul>
-                </div>
-              </div>
-              <button type="button" class="ml-10px inline-block align-middle arrow-btn down"></button>
+                </li>
+                <li class="cursor-pointer" @click="dialogVisible = true">
+                  <div class="subject-add-btn"></div>
+                </li>
+              </ul>
             </div>
           </div>
         </div>
-      </div>
 
+      </div>
+      <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 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 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>
   <el-dialog
@@ -302,24 +274,16 @@
 }
 </route>
 <script setup>
-import {process_list} from "~/pages/process/api";
+import {project_list} from "~/pages/process/api";
 import { useRouter } from "vue-router";
 const router = useRouter();
 console.log(router,87)
 const linkTo = (obj) => {
   router.push(obj);
 };
-let exam_time = $ref('')
-let exam_form = $ref('')
+let exam_time = $ref([])
 let exam_type = $ref('')
 let keyword = $ref('')
-let form_list = [{
-  value: '1',
-  label: '线上考试'
-}, {
-  value: '2',
-  label: '线下考试'
-}]
 let type_list = [{
   value: '1',
   label: '周考'
@@ -328,36 +292,21 @@ let type_list = [{
   label: '月考'
 }, {
   value: '3',
-  label: '期中'
-},{
-  value: '4',
-  label: '期末'
-}, {
-  value: '5',
   label: '作业'
-}, {
-  value: '6',
-  label: '测试'
-}]
-let subject_list = [{
-  value: '1',
-  label: '语文'
-}, {
-  value: '2',
-  label: '数学'
-}, {
-  value: '3',
-  label: '英语'
 },{
   value: '4',
-  label: '物理'
+  label: '测验'
 }, {
   value: '5',
-  label: '生物'
+  label: '期中'
 }, {
   value: '6',
-  label: '化学'
+  label: '期末'
+},{
+  value: '7',
+  label: '联考'
 }]
+let subject_list = []
 let chooseCheck = $ref([]);
 let checked = $ref(false);
 let checkedIds = $ref([]);
@@ -375,16 +324,39 @@ function getListData() {
   let data = {
     page:cur_page,
     limit:limit,
+    keyword:keyword,
+    ykj_ksrq:exam_time[0],
+    ykj_jsrq:exam_time[1],
+    ykj_kslx:exam_type
+
   };
-  process_list(data).then(res=>{
+  project_list(data).then(res=>{
     if(res.code === '1') {
       listData = res.data.page_data;
+      console.log(listData,87)
       total = Number(res.data.total_rows);
       cur_page = Number(res.data.page_now);
     }
   })
 }
 getListData();
+function filterData() {
+  cur_page = 1;
+  getListData();
+}
+const handleSelectionChange = (val) => {
+  cur_page = val;
+  getListData();
+};
+const handleDateChange = (val) => {
+  if (val) {
+    exam_time = [val[0],val[1]];
+  } else {
+    exam_time = [];
+  }
+  cur_page = 1;
+  getListData();
+}
 </script>
 <style lang="scss" scoped>
 $color: #0048e5;
@@ -412,6 +384,10 @@ $color: #0048e5;
   font-size: 14px;
   color: #fff;
   text-align: center;
+  &:disabled{
+    opacity: .45;
+    cursor: default;
+  }
 }
 
 .process-list-table {
@@ -654,4 +630,17 @@ $color: #0048e5;
   height: 57px;
   background: url("/images/icon-add.png") center no-repeat;
 }
+.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>