完成试卷管理模块;新增订单模块

2023-02-23 10:12:05 +08:00
parent 40f5e10da7
commit db82d6ca21
10 changed files with 1687 additions and 69 deletions
--- a/src/view/course/components/chapter.vue
+++ b/src/view/course/components/chapter.vue
@@ -8,6 +8,7 @@ export default {
 </script>
 <script setup>
 // 引入依赖
+import _ from 'lodash'
 import api from '@/api/course'
 // import com_api from '@/api/common'
 // import custom from '@/utils/custom'
@@ -21,19 +22,20 @@ import { useUserStore } from '@/pinia/modules/user'
 const userStore = useUserStore()
 import mediaCom from '../components/mediaPool.vue'
 import exercisesCom from '../components/exercisesPool.vue'
+import examCom from '../components/examinationPool.vue'
 const props = defineProps(['course_id','chapter_info'])
 const emit = defineEmits(['reload'])
 import UploadCommon from '@/components/upload/common.vue'
 // 变量
 const dialogChapterVisible = ref(false)
 // const dialogChapterTitle = ref('')
-const chapterForm = ref({pid:0})
+const chapterForm = ref({pid:0,sort:0})
 const chapterRules = ref({
  name: [{ required: true, message: '请输入章节名称', trigger: 'blur' }]
 })
 const chapter_data = ref([])
 const dialogChapterChildVisible = ref(false)
-const chapterChildForm = ref({})
+const chapterChildForm = ref({sort:0})
 const chapterChildRules = ref({
  name: [{ required: true, message: '请输入章节名称', trigger: 'blur' }],
  price: [{ required: true, message: '请输入章节价格', trigger: 'blur' }]
@@ -54,12 +56,12 @@ watch(props,(old, newProps) => {
 })
 // 方法
 function addChapterFunc() { // 添加大章节
-  chapterForm.value = {pid:0}
+  chapterForm.value = {pid:0,sort:0}
  dialogChapterVisible.value = true
  dialogChapterTitle.value = '添加大章节'
 }
 async function deleteChapterFunc(item) { //删除大章节
-  delFunc(item.id)
+  delFunc(item.course_chapter_id)
 }
 function delFunc(id) {
  ElMessageBox.confirm('此操作将永久删除该数据, 是否继续?', '提示', {
@@ -91,21 +93,22 @@ function closeChapterDialog() {
 }
 function closeChapterChildDialog() {
  dialogChapterChildVisible.value = false
+  chapterChildForm.value = {sort:0}
 }
 async function enterChapterDialog() { // 提交大章节
-  // console.log(chapterForm.value)
  // return
  chapterForm.value.sort = parseInt(chapterForm.value.sort)
+
  const params = {
    ...chapterForm.value
  }
  let func_name = ''
-  if(chapterForm.value.id) { // 编辑
+  if(chapterForm.value.course_chapter_id) { // 编辑
    func_name = 'editChapter'
  }
  else{ // 新增
    func_name = 'addChapter'
-    params.course_id = props.course_id
+    params.course_id = parseInt(props.course_id)
  }
  const res = await api[func_name](params)
  if(res.code === 0) {
@@ -120,33 +123,34 @@ async function enterChapterDialog() { // 提交大章节
 function addChapterchildFunc(item) { // 打开新增子章节窗口
  dialogChapterChildTitle.value = '新增子章节'
  // current_chapter.value = item
-  console.log(item.course_chapter_id)
-  chapterChildForm.value = {pid:item.course_chapter_id}
+  chapterChildForm.value = {pid:item.course_chapter_id,sort:0}
  dialogChapterChildVisible.value = true
 }
 function editChapterChildFunc(item,main_index) { // 打开编辑子章节窗口
  dialogChapterChildTitle.value = '编辑子章节'
  // current_chapter.value = chapter_data.value[main_index]
-  chapterChildForm.value = item
+  item.exam_ids =item.exam_id?[item.exam_id]: []
+  item.examination_id = item.exam_id
+  chapterChildForm.value = _.cloneDeep(item)
  dialogChapterChildVisible.value = true
 }
 function deleteChapterChildFunc(item) { // 删除子章节
-  delFunc(item.id)
+  delFunc(item.course_subsection_id)
 }
 async function enterChapterChildDialog() { // 提交小章节
  chapterChildForm.value.sort = parseInt(chapterChildForm.value.sort)
+  chapterChildForm.value.price = parseInt(chapterChildForm.value.price)
  const params = {
    ...chapterChildForm.value
  }
  let func_name = ''
-  // console.log(params)
  // return
-  if(chapterChildForm.value.id){ // 编辑
+  if(chapterChildForm.value.course_subsection_id){ // 编辑
    func_name = 'editChapter'
  }
  else{ // 新增
    func_name = 'addChapter'
-    params.course_id = props.course_id
+    params.course_id = parseInt(props.course_id)
  }
  const res = await api[func_name](params)
  if(res.code === 0) {
@@ -159,7 +163,6 @@ async function enterChapterChildDialog() { // 提交小章节
  }
 }
 function getFilePath(file) { // 获取上传文件之后的地址
-  console.log(file)
  chapterChildForm.value.url = file.url
  chapterChildForm.value.url_name = file.url_name
 }
@@ -168,6 +171,10 @@ function chooseChapterChildExercises() { // 打开选择习题窗口
 }
 function openExercisesWinFunc() { // 打开媒体库

+}
+function addExamFunc(data) {
+  chapterChildForm.value.examination_id = data[0]
+  chapterChildForm.value.exam_ids = data
 }
 </script>
 <template>
@@ -207,7 +214,7 @@ function openExercisesWinFunc() { // 打开媒体库
        <!--表格数据-->
        <div class="lb-table-part" style="margin-bottom: 20px">
          <el-table :data="item.course_sub" >
-            <el-table-column align="left" label="ID" width="60" prop="course_chapter_id" />
+            <el-table-column align="left" label="ID" width="60" prop="course_subsection_id" />
            <el-table-column align="left" label="子章节名称" min-width="60" prop="name" />
            <el-table-column align="left" label="课件名称" min-width="60" prop="url_name" />

@@ -288,9 +295,9 @@ function openExercisesWinFunc() { // 打开媒体库
          <media-com @on-success="getFilePath" :url_name="chapterChildForm.url_name" />
          <!--          <el-button size="small" type="primary" @click="openExercisesWinFunc">点击上传</el-button>-->
        </el-form-item>
-        <el-form-item label="习题管理">
+        <el-form-item label="试卷管理">
          <!--          <el-button size="small" @click="chooseChapterChildExercises">添加习题</el-button>-->
-          <exercises-com @on-success="getFilePath" :url_name="chapterChildForm.url_name" />
+          <exam-com @addFunc="addExamFunc" :seleted_arr="chapterChildForm.exam_ids" />
        </el-form-item>
        <el-form-item label="章节价格" prop="price">
          <el-input type="number" v-model="chapterChildForm.price" placeholder="输入章节价格" autocomplete="off" />
--- a/src/view/course/components/examinationPool.vue
+++ b/src/view/course/components/examinationPool.vue
@@ -0,0 +1,254 @@
+<script setup>
+// 引入依赖
+// import api from '@/api/course'
+// import com_api from '@/api/common'
+// import WarningBar from '@/components/warningBar/warningBar.vue'
+import api from '@/api/examination'
+import { ref, onMounted, watch, inject, nextTick } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { useRouter, useRoute } from 'vue-router'
+import {formatDate} from '@/utils/format'
+const router = useRouter()
+const route = useRoute()
+import { useUserStore } from '@/pinia/modules/user'
+const userStore = useUserStore()
+// import chapterCom from '../components/chapter.vue'
+const props = defineProps(['url_name','seleted_arr'])
+const emit = defineEmits(['addFunc'])
+// import { clients, getNowDate } from '@/utils'
+import custom from '@/utils/custom'
+// import { getToken } from '@/utils/auth'
+// 监听
+watch(props,(val1,val2) => {
+  selected_exam_ids.value = val1.seleted_arr || []
+})
+// 变量
+const selected_exam_ids = ref(props.seleted_arr || [])
+
+// const headers = ref({ Authorization: 'Bearer ' + getToken() })
+const drawer = ref(false)
+const queryParams =ref({
+  page:1,
+  pageSize:10,
+  name:'',
+  // subject:'',
+  status:'',
+})
+const typeList = custom.getExercisesTypeList()
+const tableData =ref([])
+const total = ref(0)
+const exam_ids = ref([])
+// 生命周期
+const subjectList = inject('subjectList')
+// console.log(subjectList.value)
+// const current_subject_str = inject('current_subject')
+// const current_subject = ref(null)
+// watch(current_subject_str,(val1,val2) => {
+//   console.log(val1)
+//   queryParams.value.subject = getSubjectId(val1)
+//   console.log(queryParams.value.subject)
+// })
+// queryParams.value.subject = current_subject
+onMounted(() => {
+  // console.log(headers.value)
+  // getExaminationList()
+})
+// 方法
+function getSubjectId(str) {
+  // console.log(str)
+  let s_id = null
+  for(let item of subjectList.value) {
+    if(item.name === str) {
+      s_id = item.id
+    }
+  }
+  return s_id
+}
+async function getExaminationList() {
+  const res = await api.getExaminationList(queryParams.value)
+  if(res.code === 0) {
+    tableData.value = res.data.records
+    total.value = res.data.total
+    await nextTick()
+    toggleSelection(tableData.value)
+  }
+}
+function chooseChapterChildExercises() {
+  drawer.value = true
+  // getExaminationList()
+  onSubmit()
+}
+function onSubmit() {
+  queryParams.value.page = 1
+  getExaminationList()
+}
+function onReset() {
+  queryParams.value = {
+    page:1,
+    pageSize:10,
+    name:'',
+    subject:'',
+    status:'',
+  }
+}
+const handleSelectionChange = (val) => {
+  exam_ids.value = val
+}
+function handleCurrentChange(val) {
+  queryParams.value.page = val
+  getExaminationList()
+}
+function handleSizeChange(val) {
+  queryParams.value.pageSize = val
+  getExaminationList()
+}
+function addFunc() {
+  const list = exam_ids.value.map((item,i) => {
+    return item.exam.exam_id
+  })
+  // console.log(list)
+  emit('addFunc',list)
+  drawer.value = false
+}
+const multipleTableRef = ref(null)
+const toggleSelection = (rows) => { // 判断是否被选中
+  if (rows) {
+    rows.forEach((row) => {
+      if(selected_exam_ids.value.length>0 && selected_exam_ids.value.includes(row.exam.exam_id)) {
+        multipleTableRef.value.toggleRowSelection(row, true)
+      }
+      else{
+        multipleTableRef.value.toggleRowSelection(row, false)
+      }
+    })
+  } else {
+    multipleTableRef.value.clearSelection()
+  }
+}
+
+function getStateName(state) {
+  let str = ''
+  switch (state){
+    case 1:
+        str = '上架'
+      break;
+    case -1:
+        str = '下架'
+      break;
+  }
+  return str
+}
+</script>
+<template>
+  <div>
+    <el-button v-if="selected_exam_ids.length==0" size="small" @click="chooseChapterChildExercises">添加试卷</el-button>
+    <el-button v-else size="small" @click="chooseChapterChildExercises" type="plain">点击查看</el-button>
+    <div v-if="url_name">{{url_name}}</div>
+    <el-drawer v-model="drawer" title="试卷库" size="60%">
+      <div class="drawer-section">
+        <!--      搜索框-->
+        <div class="search-box gva-btn-list">
+          <el-form ref="searchForm" :inline="true" :model="queryParams">
+            <el-form-item label="试卷名称">
+              <el-input v-model="queryParams.name" placeholder="根据试卷名称进行查询" />
+            </el-form-item>
+<!--            <el-form-item label="试卷分类">-->
+<!--              <el-select v-model="queryParams.subject" clearable placeholder="请选择">-->
+<!--                <el-option-->
+<!--                  v-for="item in subjectList"-->
+<!--                  :key="item.id"-->
+<!--                  :label="item.name"-->
+<!--                  :value="item.name"-->
+<!--                />-->
+<!--              </el-select>-->
+<!--            </el-form-item>-->
+            <el-form-item>
+              <el-button size="small" type="primary" icon="search" @click="onSubmit">查询</el-button>
+              <el-button size="small" icon="refresh" @click="onReset">重置</el-button>
+            </el-form-item>
+          </el-form>
+        </div>
+        <!--      数据列表-->
+        <div class="list-box">
+          <el-table ref="multipleTableRef" row-key="exam.exam_id" :data="tableData" @selection-change="handleSelectionChange">
+            <el-table-column
+              type="selection"
+              width="55"
+              reserve-selection="true"
+            />
+            <el-table-column align="center" label="ID" min-width="60" prop="exam.exam_id" sortable="custom" />
+            <el-table-column align="center" label="试卷名称" min-width="150" prop="exam.name" />
+            <el-table-column align="center" label="科目" min-width="150" prop="exam.subject" />
+            <el-table-column align="center" label="封面" min-width="150" >
+              <template #default="scope">
+                <img class="e-img" :src="scope.row.exam.cover" alt="">
+              </template>
+            </el-table-column>
+            <el-table-column align="center" label="状态" min-width="150" >
+              <template #default="scope">
+                <div>{{getStateName(scope.row.exam.status)}}</div>
+              </template>
+            </el-table-column>
+            <el-table-column label="销量">
+              <template #default="scope">
+                <div>{{scope.row.exam.sale}}份</div>
+              </template>
+            </el-table-column>
+            <el-table-column align="center" label="组数" min-width="150" >
+              <template #default="scope">
+                <div>{{scope.row.exam_types.length}}组</div>
+              </template>
+            </el-table-column>
+            <el-table-column align="center" label="创建时间" min-width="150" >
+              <template #default="scope">
+                {{formatDate(scope.row.exam.CreatedAt)}}
+              </template>
+            </el-table-column>
+<!--            <el-table-column align="center" fixed="right" label="操作" width="200">-->
+<!--              <template #default="scope">-->
+<!--                <el-button-->
+<!--                  icon="edit"-->
+<!--                  size="small"-->
+<!--                  type="primary"-->
+<!--                  link-->
+<!--                  @click="editCourseFunc(scope.row)"-->
+<!--                >编辑</el-button>-->
+<!--                <el-button-->
+<!--                  icon="delete"-->
+<!--                  size="small"-->
+<!--                  type="danger"-->
+<!--                  link-->
+<!--                  @click="deleteExamFunc(scope.row)"-->
+<!--                >删除</el-button>-->
+<!--              </template>-->
+<!--            </el-table-column>-->
+          </el-table>
+          <div class="gva-pagination">
+            <el-pagination
+              :current-page="queryParams.page"
+              :page-size="queryParams.pageSize"
+              :page-sizes="[10, 30, 50, 100]"
+              :total="total"
+              layout="total, sizes, prev, pager, next, jumper"
+              @current-change="handleCurrentChange"
+              @size-change="handleSizeChange"
+            />
+          </div>
+        </div>
+        <!--  按钮-->
+        <div class="btn-box" style="text-align: right">
+          <el-button size="small" type="primary" icon="plus" @click="addFunc">添加</el-button>
+        </div>
+      </div>
+    </el-drawer>
+  </div>
+</template>
+<style scoped>
+  .drawer-section{
+    padding: 10px;
+  }
+  .e-img{
+    width: 150px;
+    height: 100px;
+  }
+</style>
--- a/src/view/course/components/exercisesPool.vue
+++ b/src/view/course/components/exercisesPool.vue
@@ -2,9 +2,9 @@
 // 引入依赖
 // import api from '@/api/course'
 // import com_api from '@/api/common'
-// import custom from '@/utils/custom'
 // import WarningBar from '@/components/warningBar/warningBar.vue'
-import {ref,onMounted,watch,inject  } from 'vue'
+import api from '@/api/exercises'
+import { ref, onMounted, watch, inject, nextTick } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { useRouter, useRoute } from 'vue-router'
 const router = useRouter()
@@ -12,52 +12,118 @@ const route = useRoute()
 import { useUserStore } from '@/pinia/modules/user'
 const userStore = useUserStore()
 // import chapterCom from '../components/chapter.vue'
-const props = defineProps(['url_name'])
-const emit = defineEmits(['on-success'])
-import { clients, getNowDate } from '@/utils'
+const props = defineProps(['url_name','seleted_arr'])
+const emit = defineEmits(['addFunc'])
+// import { clients, getNowDate } from '@/utils'
 import custom from '@/utils/custom'
 // import { getToken } from '@/utils/auth'
+// 监听
+watch(props,(val1,val2) => {
+  selected_question_ids.value = val2.seleted_arr || []
+})
 // 变量
+const selected_question_ids = ref(props.seleted_arr || [])
+
 // const headers = ref({ Authorization: 'Bearer ' + getToken() })
 const drawer = ref(false)
 const queryParams =ref({
-  pageIndex:1,
+  page:1,
  pageSize:10,
  content:'',
  subject:'',
-  subject_type:''
+  type:'',
+  teacherId:0
 })
 const typeList = custom.getExercisesTypeList()
+const tableData =ref([])
+const total = ref(0)
+const question_ids = ref([])
 // 生命周期
 const subjectList = inject('subjectList')
 const current_subject = inject('current_subject')
+queryParams.value.subject = current_subject
 onMounted(() => {
  // console.log(headers.value)
+  // getExercisesList()
 })
-
 // 方法
+async function getExercisesList() {
+  const res = await api.getExercisesList(queryParams.value)
+  if(res.code === 0) {
+    tableData.value = res.data.records
+    total.value = res.data.total
+    await nextTick()
+    toggleSelection(tableData.value)
+  }
+}
 function chooseChapterChildExercises() {
  drawer.value = true
+  // getExercisesList()
+  onSubmit()
 }
 function onSubmit() {
-
+  queryParams.value.page = 1
+  getExercisesList()
 }
 function onReset() {
  queryParams.value = {
-    pageIndex:1,
+    page:1,
    pageSize:10,
-    name:''
+    name:'',
+    type:'',
+    subject:'',
+    teacherId:0
+  }
+}
+const handleSelectionChange = (val) => {
+  question_ids.value = val
+}
+function getExercisesName(row) {
+  // console.log(JSON.parse(row.question))
+  return JSON.parse(row.question).title
+}
+function handleCurrentChange(val) {
+  queryParams.value.page = val
+  getExercisesList()
+}
+function handleSizeChange(val) {
+  queryParams.value.pageSize = val
+  getExercisesList()
+}
+function addFunc() {
+  // console.log(question_ids.value)
+  const list = question_ids.value.map((item,i) => {
+    return item.question_id
+  })
+  // console.log(list)
+  emit('addFunc',list)
+  drawer.value = false
+}
+const multipleTableRef = ref(null)
+
+const toggleSelection = (rows) => { // 判断是否被选中
+  if (rows) {
+    rows.forEach((row) => {
+      if(selected_question_ids.value.includes(row.question_id)) {
+        multipleTableRef.value.toggleRowSelection(row, true)
+      }else{
+        multipleTableRef.value.toggleRowSelection(row, false)
+      }
+    })
+  } else {
+    multipleTableRef.value.clearSelection()
  }
 }
 </script>
 <template>
  <div>
-    <el-button size="small" @click="chooseChapterChildExercises">添加习题</el-button>
+    <el-button v-if="selected_question_ids.length==0" size="small" @click="chooseChapterChildExercises">添加习题</el-button>
+    <el-button v-else size="small" @click="chooseChapterChildExercises" type="plain">点击查看（已选{{selected_question_ids.length}}道题）</el-button>
    <div v-if="url_name">{{url_name}}</div>
-    <el-drawer v-model="drawer" title="媒体库" size="60%">
+    <el-drawer v-model="drawer" title="习题库" size="60%">
      <div class="drawer-section">
        <!--      搜索框-->
-        <div class="search-box">
+        <div class="search-box gva-btn-list">
          <el-form ref="searchForm" :inline="true" :model="queryParams">
            <el-form-item label="题目">
              <el-input v-model="queryParams.content" placeholder="请输入" />
@@ -68,12 +134,12 @@ function onReset() {
                  v-for="item in subjectList"
                  :key="item.id"
                  :label="item.name"
-                  :value="item.id"
+                  :value="item.name"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="题目类型">
-              <el-select v-model="queryParams.subject_type" clearable placeholder="请选择">
+              <el-select v-model="queryParams.type" clearable placeholder="请选择">
                <el-option
                  v-for="item in typeList"
                  :key="item.value"
@@ -90,7 +156,41 @@ function onReset() {
        </div>
        <!--      数据列表-->
        <div class="list-box">
-
+          <el-table ref="multipleTableRef" row-key="question_id" :data="tableData" @selection-change="handleSelectionChange">
+            <el-table-column
+              type="selection"
+              width="55"
+              reserve-selection="true"
+            />
+            <el-table-column align="left" label="ID" min-width="60" prop="question_id" sortable="custom" />
+            <el-table-column align="left" label="题型" min-width="150" prop="name" >
+              <template #default="scope">
+                {{custom.getExercisesTypeName(scope.row.type)}}
+              </template>
+            </el-table-column>
+            <el-table-column align="left" label="科目" min-width="150" prop="subject" />
+            <el-table-column align="left" label="题目" min-width="150" >
+              <template #default="scope">
+                <div v-html="getExercisesName(scope.row)"></div>
+              </template>
+            </el-table-column>
+            <el-table-column align="left" label="创建者" min-width="150" prop="teacher_id" />
+          </el-table>
+          <div class="gva-pagination">
+            <el-pagination
+              :current-page="queryParams.page"
+              :page-size="queryParams.pageSize"
+              :page-sizes="[10, 30, 50, 100]"
+              :total="total"
+              layout="total, sizes, prev, pager, next, jumper"
+              @current-change="handleCurrentChange"
+              @size-change="handleSizeChange"
+            />
+          </div>
+        </div>
+        <!--  按钮-->
+        <div class="btn-box" style="text-align: right">
+          <el-button size="small" type="primary" icon="plus" @click="addFunc">添加</el-button>
        </div>
      </div>
    </el-drawer>