完成订单模块和教师管理模块

src/api/exercises.js

@@ -15,6 +15,13 @@ const api = {
       data
     })
   },
+  editExercises : data => { // 编辑习题
+    return service({
+      url: '/question/update',
+      method: 'post',
+      data
+    })
+  },
   delExercises : data => { // 删除习题
     return service({
       url: '/question/delete',

src/api/order.js

@@ -28,6 +28,12 @@ const api = {
       method: 'post',
       data
     })
-  }
+  },
+  getOrderDetail : data => {
+    return service({
+      url: '/order/'+data.id,
+      method: 'get'
+    })
+  },
 }
 export default api

src/api/teacher.js

@@ -0,0 +1,25 @@
+import service from '@/utils/request'
+const api = {
+  // 教师
+  getTeacherList : data => {
+    return service({
+      url: '/teacher',
+      method: 'get',
+      params:data
+    })
+  },
+  getTeacherDetail : data => {
+    return service({
+      url: '/teacher/'+data.id,
+      method: 'get'
+    })
+  },
+  teacherOperator : data => {
+    return service({
+      url: '/teacher/change',
+      method: 'post',
+      data
+    })
+  }
+}
+export default api

src/view/examinationManage/index.vue

@@ -5,6 +5,7 @@ import api from '@/api/examination'
 import capi from '@/api/course'
 import custom from '@/utils/custom'
 import {formatDate} from '@/utils/format'
+import _ from 'lodash'
 // import { toSQLLine } from '@/utils/stringFun'
 import WarningBar from '@/components/warningBar/warningBar.vue'
 // import ckEditor from '@/components/richText/ckEditor5.vue'
@@ -122,17 +123,18 @@ const handleSelectionChange = (val) => {
   // console.log(exam_ids.value)
 }
 function editCourseFunc(row) {
-  row.exam.course_ids = JSON.parse(row.exam.course_ids)
+  console.log(row)
-  row.exam.question_ids = JSON.parse(row.exam.question_ids)
+  // row.exam.course_ids = JSON.parse(row.exam.course_ids)
+  // row.exam.question_ids = JSON.parse(row.exam.question_ids)
 
-  form.value = row.exam
+  form.value = _.cloneDeep(row.exam)
+  form.value.course_ids = JSON.parse(row.exam.course_ids)
+  form.value.question_ids = JSON.parse(row.exam.question_ids)
   exam_types.value = row.exam_types.map((item) => {
     return item.persons
   })
-  // console.log(form.value)
   current_subject.value = form.value.subject
   openDialog('edit')
-  // console.log(JSON.parse(row.question))
 }
 function deleteExamFunc(row) {
   // console.log(row); return

src/view/exercisesManage/index.vue

@@ -5,6 +5,7 @@ import api from '@/api/exercises'
 import capi from '@/api/course'
 import custom from '@/utils/custom'
 import {formatDate} from '@/utils/format'
+import _ from 'lodash'
 // import { toSQLLine } from '@/utils/stringFun'
 import WarningBar from '@/components/warningBar/warningBar.vue'
 import ckEditor from '@/components/richText/ckEditor5.vue'
@@ -50,7 +51,6 @@ const question_form = ref({
 onMounted(() => {
   getExercisesList()
   getSubject()
-  // console.log(options.value.size)
 })
 // 方法
 async function getExercisesList() {
@@ -64,7 +64,6 @@ async function getSubject(){ // 获取课程分类
   const res = await capi.getSubjectList(subjectParams.value)
   if(res.code === 0) {
     subjectList.value = custom.getStdSubject(res.data.records)
-    // console.log(subjectList.value)
   }
 }
 function onSubmit() {
@@ -95,7 +94,6 @@ function openDialog(type) {
   // router.push({name:'addCourse',params})
 }
 async function onDelete() {
-  // console.log(question_ids.value)
   const ids = question_ids.value.map(item => item.question_id)
   const res = await api.delExercises({ question_ids:ids })
   if (res.code === 0) {
@@ -111,26 +109,17 @@ async function onDelete() {
   }
 }
 const handleSelectionChange = (val) => {
-  // console.log(val)
   question_ids.value = val
 }
 function editCourseFunc(row) {
-  question_id.value = row.question_id
+  form.value = _.cloneDeep(row)
-  form.value = row
+  question_id.value = form.value.question_id
-  // console.log(JSON.parse(row.question))
+  content.value = JSON.parse(form.value.question).title
-  content.value = JSON.parse(row.question).title
+  question_form.value = JSON.parse(form.value.question)
-  // if(JSON.parse(row.question).option) {
+  console.log(question_form.value)
-  //   question_form.value.options =   JSON.parse(row.question).option
-  // }
-  // else{
-  //   question_form.value.options = []
-  // }
-  question_form.value =   JSON.parse(row.question)
   openDialog('edit')
-  console.log(JSON.parse(row.question))
 }
 function deleteCourseFunc(row) {
-  // console.log(row); return
   ElMessageBox.confirm('此操作将永久删除该数据, 是否继续?', '提示', {
     confirmButtonText: '确定',
     cancelButtonText: '取消',
@@ -171,8 +160,11 @@ async function enterDialog() { // 提交
   form.value.score = parseInt(form.value.score)
   form.value.teacher_id = 0
   form.value.question = JSON.stringify(question_form.value)
-  console.log(form.value)
+  let func_name = 'addExercises'
-  const res = await api.addExercises(form.value)
+  if(form.value.question_id) { // 编辑
+      func_name = 'editExercises'
+  }
+  const res = await api[func_name](form.value)
   if(res.code === 0) {
     ElMessage({
       type: 'success',
@@ -190,7 +182,6 @@ function viewCourseFunc(row) { // 查看课程
   router.push({name:'viewCourse',params:{question_id:row.question_id}})
 }
 function getExercisesName(row) {
-  // console.log(JSON.parse(row.question))
   return JSON.parse(row.question).title
 }
 const std_options_title = ref(['A','B','C','D','E','F'])
@@ -202,7 +193,6 @@ function addOptionFunc() {
   //     }
   // }
 
-  // console.log(options.value)
   for(let i=0 ;i<std_options_title.value.length;i++) {
     let has_flag = false
     for(let item of question_form.value.options){
@@ -301,13 +291,6 @@ function delet_func(item) {
         </el-table-column>
         <el-table-column align="left" fixed="right" label="操作" width="200">
           <template #default="scope">
-            <!--            <el-button-->
-            <!--              icon="view"-->
-            <!--              size="small"-->
-            <!--              type="primary"-->
-            <!--              link-->
-            <!--              @click="viewCourseFunc(scope.row)"-->
-            <!--            >查看</el-button>-->
             <el-button
               icon="edit"
               size="small"
@@ -369,7 +352,7 @@ function delet_func(item) {
         <el-form-item label="答案" >
           <!--          <el-input v-model="form.score" placeholder="请输入分值" />-->
           <view class="options-box">
-            <view class="option-item" v-if="question_form.options.length>0" v-for="(item,i) in question_form.options">
+            <view class="option-item" v-if="question_form" v-for="(item,i) in question_form.options">
               <view>{{item.name}}</view>
               <ckEditor v-model="item.value" :content="item.value" style="margin-left:5px" />
               <el-icon style="margin-left: 5px;cursor: pointer" v-if="(i+1) == question_form.options.length" @click="delet_func(item)"><Delete /></el-icon>

src/view/orderManage/index.vue

@@ -98,7 +98,6 @@ function openDialog(type) {
   // router.push({name:'addCourse',params})
 }
 async function onDelete() {
-  // console.log(question_ids.value)
   const ids = exam_ids.value
   const res = await api.delExamination({ exam_ids:ids })
   if (res.code === 0) {
@@ -114,11 +113,9 @@ async function onDelete() {
   }
 }
 const handleSelectionChange = (val) => {
-  // console.log(val)
   exam_ids.value = val.map((item) => {
       return item.exam_id
   })
-  // console.log(exam_ids.value)
 }
 function editCourseFunc(row) {
   row.course_ids = JSON.parse(row.course_ids)
@@ -128,13 +125,10 @@ function editCourseFunc(row) {
   exam_types.value = row.exam_types.map((item) => {
     return item.persons
   })
-  // console.log(form.value)
   current_subject.value = form.value.subject
   openDialog('edit')
-  // console.log(JSON.parse(row.question))
 }
 function deleteExamFunc(row) {
-  // console.log(row); return
   ElMessageBox.confirm('此操作将永久删除该数据, 是否继续?', '提示', {
     confirmButtonText: '确定',
     cancelButtonText: '取消',
@@ -173,7 +167,6 @@ async function enterDialog() { // 提交
     return item = parseInt(item)
   })
   form.value.duration = parseInt(form.value.duration)
-  // console.log(form.value,exam_types.value)
   // return
   const params = {
     ...form.value
@@ -195,10 +188,9 @@ async function enterDialog() { // 提交
   }
 }
 function viewOrderFunc(row) { // 查看订单
-  router.push({name:'viewOrder',params:{question_id:row.question_id}})
+  router.push({name:'viewOrder',params:{order_id:row.order_id}})
 }
 function getExercisesName(row) {
-  // console.log(JSON.parse(row.question))
   return JSON.parse(row.question).title
 }
 // const std_options_title = ref(['A','B','C','D','E','F'])
@@ -212,11 +204,14 @@ function getStateName(state) {
   let str = ''
   switch (state){
     case 1:
-        str = '已完成'
-      break;
-    case -1:
         str = '未付款'
       break;
+    case 2:
+        str = '已付款'
+      break;
+    case 3:
+        str = '已过期'
+      break;
   }
   return str
 }
@@ -244,25 +239,43 @@ function addExercisesFunc(data) {
 function addCourseFunc(data) {
   form.value.course_ids = data
 }
+function getTypeName(type) {
+  let name = ""
+  switch (type) {
+    case 1:
+      name = '课程';
+      break;
+    case 2:
+      name = '章节';
+      break;
+    case 3:
+      name = '子章节';
+      break;
+    case 4:
+      name = '试卷';
+      break;
+  }
+  return name
+}
 </script>
 <template>
   <div>
     <!--    搜索框-->
     <div class="gva-search-box">
       <el-form ref="searchForm" :inline="true" :model="queryParams">
-        <el-form-item label="试卷名称">
+        <el-form-item label="订单名称">
-          <el-input v-model="queryParams.name" placeholder="根据试卷名称进行查询" />
+          <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 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>
@@ -273,32 +286,36 @@ function addCourseFunc(data) {
     <div class="gva-table-box">
       <!--      批量操作-->
       <div class="gva-btn-list">
-        <el-button size="small" type="primary" icon="plus" @click="openDialog('add')">新增</el-button>
+<!--        <el-button size="small" type="primary" icon="plus" @click="openDialog('add')">新增</el-button>-->
         <el-popover v-model="deleteVisible" placement="top" width="160">
           <p>确定要删除吗？</p>
           <div style="text-align: right; margin-top: 8px;">
             <el-button size="small" type="primary" link @click="deleteVisible = false">取消</el-button>
             <el-button size="small" type="primary" @click="onDelete">确定</el-button>
           </div>
-          <template #reference>
+<!--          <template #reference>-->
-            <el-button icon="delete" size="small" type="danger" :disabled="!exam_ids.length" style="margin-left: 10px;" @click="deleteVisible = true">删除</el-button>
+<!--            <el-button icon="delete" size="small" type="danger" :disabled="!exam_ids.length" style="margin-left: 10px;" @click="deleteVisible = true">删除</el-button>-->
-          </template>
+<!--          </template>-->
         </el-popover>
       </div>
       <!--      数据列表-->
       <el-table :data="tableData" @selection-change="handleSelectionChange">
-        <el-table-column
+<!--        <el-table-column-->
-          type="selection"
+<!--          type="selection"-->
-          width="55"
+<!--          width="55"-->
-        />
+<!--        />-->
         <el-table-column align="center" label="ID"  prop="order_id" sortable="custom" />
         <el-table-column align="center" label="用户昵称" min-width="150" prop="nickname" />
         <el-table-column align="center" label="用户ID" prop="user_id" />
         <el-table-column align="center" label="手机号" min-width="150" prop="phone" />
-        <el-table-column align="center" label="类型" min-width="150" prop="order_type" />
+        <el-table-column align="center" label="类型" min-width="150" prop="order_type">
+          <template #default="scope">
+            {{getTypeName(scope.row.order_type)}}
+          </template>
+        </el-table-column>
         <el-table-column align="center" label="商品名称" min-width="150" prop="name" />
         <el-table-column align="center" label="订单金额" min-width="150" prop="price" />
-        <el-table-column align="center" label="所属区域" min-width="150" prop="" />
+        <el-table-column align="center" label="所属区域" min-width="150" prop="province" />
         <el-table-column align="center" label="状态"  >
           <template #default="scope">
             <div>{{getStateName(scope.row.status)}}</div>
@@ -318,13 +335,13 @@ function addCourseFunc(data) {
               link
               @click="viewOrderFunc(scope.row)"
             >查看</el-button>
-            <el-button
+<!--            <el-button-->
-              icon="delete"
+<!--              icon="delete"-->
-              size="small"
+<!--              size="small"-->
-              type="danger"
+<!--              type="danger"-->
-              link
+<!--              link-->
-              @click="deleteExamFunc(scope.row)"
+<!--              @click="deleteExamFunc(scope.row)"-->
-            >删除</el-button>
+<!--            >删除</el-button>-->
           </template>
         </el-table-column>
       </el-table>

src/view/orderManage/orderDetail.vue

@@ -0,0 +1,156 @@
+<script setup>
+// 引入依赖
+import api from '@/api/order'
+import capi from '@/api/course'
+import custom from '@/utils/custom'
+import {formatDate} from '@/utils/format'
+// import { toSQLLine } from '@/utils/stringFun'
+// import WarningBar from '@/components/warningBar/warningBar.vue'
+// import coursePool from './components/coursePool.vue'
+// import exercisesPool from '@/view/course/components/exercisesPool.vue'
+import {ref,onMounted,provide } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { useRouter, useRoute } from 'vue-router'
+const router = useRouter()
+const route = useRoute()
+// 变量
+// const order_id = ref(0)
+const orderInfo = ref({})
+// 生命周期
+onMounted(() => {
+  // console.log(route.params)
+  // order_id.value = route.params.order_id
+  getOrderDetail()
+})
+// funstions
+async function getOrderDetail() {
+  const res = await api.getOrderDetail({id:route.params.order_id})
+  if(res.code === 0) {
+    orderInfo.value = res.data
+  }
+}
+function getStateName(state) {
+  let str = ''
+  switch (state){
+    case 1:
+        str = '未付款'
+      break;
+    case 2:
+        str = '已付款'
+      break;
+    case 3:
+        str = '已过期'
+      break;
+  }
+  return str
+}
+</script>
+<template>
+  <div>
+    <!--    基本信息-->
+    <div class="gva-search-box">
+      <div class="baseInfo-box">
+        <div class="bd-img">
+          <img :src="orderInfo.cover" alt="">
+        </div>
+        <div class="bd-info">
+          <div class="bdi-title">{{orderInfo.name}}</div>
+          <div class="bdi-price">￥{{orderInfo.price}}</div>
+        </div>
+      </div>
+    </div>
+    <!--    章节信息-->
+    <div class="gva-table-box">
+      <div class="detail-info-box">
+        <div class="dib-item di-title">
+          用户信息
+        </div>
+        <div class="dib-item">
+          <div class="di-left">用户名称：</div>
+          <div class="di-right">{{orderInfo.nickname}}</div>
+        </div>
+        <div class="dib-item">
+          <div class="di-left">用户手机：</div>
+          <div class="di-right">{{orderInfo.phone}}</div>
+        </div>
+        <div class="dib-item di-title">
+          订单信息
+        </div>
+        <div class="dib-item">
+          <div class="di-left">订单编号：</div>
+          <div class="di-right">{{orderInfo.order_id}}</div>
+        </div>
+        <div class="dib-item">
+          <div class="di-left">提交时间：</div>
+          <div class="di-right">{{formatDate(orderInfo.CreatedAt)}}</div>
+        </div>
+        <div class="dib-item">
+          <div class="di-left">订单状态：</div>
+          <div class="di-right">{{getStateName(orderInfo.status)}}</div>
+        </div>
+      </div>
+      <!--    操作区域-->
+      <div class="action-box">
+        <div class="pay-btn">去付款</div>
+      </div>
+    </div>
+
+  </div>
+</template>
+<style scoped lang="scss">
+  .action-box{
+    display: flex;
+    margin-top: 20px;
+    .pay-btn{
+      background: rgb(60, 106, 112);
+      color: white;
+      padding: 10px 50px;
+      cursor: pointer;
+    }
+  }
+  /*章节信息*/
+  .gva-search-box{
+    .baseInfo-box{
+      display: flex;
+      .bd-img{
+        img{
+          width: 200px;
+          height: 100px;
+        }
+        margin-right: 10px;
+      }
+      .bd-info{
+        display: flex;
+        flex-direction: column;
+        justify-content: space-around;
+        .bdi-title,.bdi-price{
+          font-weight: 900;
+          font-size: 18px;
+        }
+        .bdi-title{
+          margin-bottom: 20px;
+        }
+        .bdi-price{
+
+        }
+      }
+    }
+  }
+  /*章节信息*/
+  .gva-table-box{
+    .detail-info-box{
+      .dib-item{
+        color: gray;
+        padding: 10px 0;
+        display: flex;
+        .di-left{
+        }
+      }
+      .di-title{
+        color: black;
+        font-weight: 900;
+        font-size: 15px;
+      }
+    }
+  }
+</style>

src/view/teacherManage/index.vue

@@ -0,0 +1,375 @@
+
+<script setup>
+// 引入依赖
+import api from '@/api/teacher'
+import capi from '@/api/course'
+import custom from '@/utils/custom'
+import {formatDate} from '@/utils/format'
+// import { toSQLLine } from '@/utils/stringFun'
+// import WarningBar from '@/components/warningBar/warningBar.vue'
+// import coursePool from './components/coursePool.vue'
+// import exercisesPool from '@/view/course/components/exercisesPool.vue'
+import {ref,onMounted,provide } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { useRouter, useRoute } from 'vue-router'
+const router = useRouter()
+const route = useRoute()
+// store
+import { useUserStore } from '@/pinia/modules/user'
+const userStore = useUserStore()
+// 变量
+const path = ref(import.meta.env.VITE_BASE_API)
+// const typeList = custom.getExercisesTypeList()
+const queryParams = ref({
+  page:1,
+  pageSize:10,
+  name:''
+})
+const subjectParams = ref({
+    pageIndex:1,
+    pageSize:100,
+})
+const tableData = ref([])
+const subjectList = ref([])
+const current_subject = ref('')
+const deleteVisible = ref(false)
+const question_ids = ref([])
+const total = ref(0)
+const dialogFormVisible = ref(false)
+const dialogTitle = ref('')
+const form =ref({})
+const rules = ref({
+  name: [{ required: true, message: '请输入课程名称', trigger: 'blur' }]
+})
+const question_id = ref(0)
+const content = ref(null)
+// const options = ref([]) // 答案选项数组
+const exam_types = ref([])
+const exam_ids = ref([])
+// 生命周期
+onMounted(() => {
+  getTeacherList()
+  // getSubject()
+})
+provide('subjectList', subjectList)
+provide('current_subject', current_subject)
+// 方法
+async function getTeacherList() {
+  const res = await api.getTeacherList(queryParams.value)
+  if(res.code === 0) {
+    tableData.value = res.data.records
+    total.value = res.data.total
+  }
+}
+async function getSubject(){ // 获取课程分类
+  const res = await capi.getSubjectList(subjectParams.value)
+  if(res.code === 0) {
+    subjectList.value = custom.getStdSubject(res.data.records)
+  }
+}
+function onSubmit() {
+  getTeacherList()
+}
+const onReset = () => {
+  queryParams.value = {
+    pageIndex:1,
+    pageSize:10,
+    name:'',
+    status:'',
+    subject:''
+  }
+}
+function openDialog(type) {
+  // let params = {}
+  switch (type){
+    case 'add':
+      dialogTitle.value = '新增试卷'
+        form.value = {}
+      break;
+    case 'edit':
+      // params.question_id = question_id.value
+      dialogTitle.value = '编辑试卷'
+      break;
+  }
+  dialogFormVisible.value = true
+  // router.push({name:'addCourse',params})
+}
+async function onDelete() {
+  const ids = exam_ids.value
+  const res = await api.delExamination({ exam_ids:ids })
+  if (res.code === 0) {
+    ElMessage({
+      type: 'success',
+      message: res.msg
+    })
+    // if (tableData.value.length === ids.length && page.value > 1) {
+    //   page.value--
+    // }
+    deleteVisible.value = false
+    getTeacherList()
+  }
+}
+const handleSelectionChange = (val) => {
+  exam_ids.value = val.map((item) => {
+      return item.exam_id
+  })
+}
+function editCourseFunc(row) {
+  row.course_ids = JSON.parse(row.course_ids)
+  row.question_ids = JSON.parse(row.question_ids)
+
+  form.value = row.exam
+  exam_types.value = row.exam_types.map((item) => {
+    return item.persons
+  })
+  current_subject.value = form.value.subject
+  openDialog('edit')
+}
+function deleteExamFunc(row) {
+  ElMessageBox.confirm('此操作将永久删除该数据, 是否继续?', '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
+  })
+  .then(async() => {
+    const res = await api.delExamination({
+          exam_ids:[row.exam_id]
+    })
+    if (res.code === 0) {
+      ElMessage({
+        type: 'success',
+        message: '删除成功!'
+      })
+      getTeacherList()
+    }
+  },() => {
+  })
+}
+function handleCurrentChange(val) {
+  queryParams.value.pageIndex = val
+  getTeacherList()
+}
+function handleSizeChange(val) {
+  queryParams.value.pageSize = val
+  getTeacherList()
+}
+function closeDialog(){
+  dialogFormVisible.value = false
+  exam_types.value = []
+  form.value = {}
+}
+async function enterDialog() { // 提交
+  form.value.teacher_id = 0
+  form.value.exam_type = exam_types.value.map((item) => {
+    return item = parseInt(item)
+  })
+  form.value.duration = parseInt(form.value.duration)
+  // return
+  const params = {
+    ...form.value
+  }
+  params.question_ids = JSON.stringify(form.value.question_ids)
+  params.course_ids = JSON.stringify(form.value.course_ids)
+  let func_name = 'addExamination'
+  if(form.value.exam_id) { // 编辑
+    func_name = 'editExamination'
+  }
+  const res = await api[func_name](params)
+  if(res.code === 0) {
+    ElMessage({
+      type: 'success',
+      message: res.msg
+    })
+    closeDialog()
+    getTeacherList()
+  }
+}
+function viewTeacherFunc(row) { // 查看订单
+  console.log(row)
+  router.push({name:'teacherDetail',params:{id:row.teacher_info_id}})
+}
+function getExercisesName(row) {
+  return JSON.parse(row.question).title
+}
+// const std_options_title = ref(['A','B','C','D','E','F'])
+function addOptionFunc() {
+  exam_types.value.push('')
+}
+function delet_func() {
+  exam_types.value.pop()
+}
+function getStateName(state) {
+  let str = ''
+  switch (state){
+    case 1:
+        str = '未付款'
+      break;
+    case 2:
+        str = '已付款'
+      break;
+    case 3:
+        str = '已过期'
+      break;
+  }
+  return str
+}
+function handleAvatarSuccess(res) {
+  form.value.cover = res.data.file.url
+  // handlerChange()
+}
+function beforeAvatarUpload(file) {
+  const isLt05M = file.size / 1024 / 1024 < 20
+  const isJPG = file.type.indexOf('image/') === -1
+  if (isJPG) {
+    ElMessage.error('文件格式错误，请上传图片类型,如：JPG，PNG后缀的文件')
+  }
+  if (!isLt05M) {
+    ElMessage.error('上传头像图片大小不能超过 2M!')
+  }
+  return !isJPG && isLt05M
+}
+function changeSubjectFunc(e) {
+  current_subject.value = e
+}
+function addExercisesFunc(data) {
+  form.value.question_ids = data
+}
+function addCourseFunc(data) {
+  form.value.course_ids = data
+}
+function getTypeName(type) {
+  let name = ""
+  switch (type) {
+    case 1:
+      name = '课程';
+      break;
+    case 2:
+      name = '章节';
+      break;
+    case 3:
+      name = '子章节';
+      break;
+    case 4:
+      name = '试卷';
+      break;
+  }
+  return name
+}
+</script>
+<template>
+  <div>
+    <!--    搜索框-->
+    <div class="gva-search-box">
+      <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>
+          <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="gva-table-box">
+      <!--      批量操作-->
+      <div class="gva-btn-list">
+        <el-popover v-model="deleteVisible" placement="top" width="160">
+          <p>确定要删除吗？</p>
+          <div style="text-align: right; margin-top: 8px;">
+            <el-button size="small" type="primary" link @click="deleteVisible = false">取消</el-button>
+            <el-button size="small" type="primary" @click="onDelete">确定</el-button>
+          </div>
+        </el-popover>
+      </div>
+      <!--      数据列表-->
+      <el-table :data="tableData" @selection-change="handleSelectionChange">
+        <el-table-column align="center" label="ID"  prop="teacher_info_id" sortable="custom" />
+        <el-table-column align="center" label="头像">
+          <template #default="scope">
+            <img class="avatar-box" :src="scope.row.avatar" alt="">
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="姓名" prop="name" />
+        <el-table-column align="center" label="手机号" min-width="150" prop="phone" />
+        <el-table-column align="center" label="所属区域" min-width="150" prop="province" />
+        <el-table-column align="center" label="申请时间" min-width="150" >
+          <template #default="scope">
+            {{formatDate(scope.row.CreatedAt)}}
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="推荐人ID" prop="invite_id" />
+        <el-table-column align="center" label="授课次数" prop="publish_course" />
+        <el-table-column align="center" label="测试次数" prop="publish_exam" />
+        <el-table-column align="center" label="累计销售" prop="exam_sale" />
+        <el-table-column align="center" label="状态" min-width="150" prop="exam_sale">
+          <template #default="scope">
+            <div>{{scope.row.status == 1?'查看':scope.row.status == 2?'已拒绝':'已同意'}}</div>
+          </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="viewTeacherFunc(scope.row)"
+            >查看</el-button>
+            <el-button v-if="scope.row.status == 1"
+              icon="edit"
+              size="small"
+              type="primary"
+              link
+              @click="viewTeacherFunc(scope.row)"
+            >同意</el-button>
+            <el-button v-if="scope.row.status == 1"
+              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>
+</template>
+<style scoped lang="scss">
+  .avatar-box{
+    width: 50px;
+    height: 50px;
+    border-radius: 50%;
+    border: 1px solid #dbdbdb;
+  }
+  .e-img{
+    width: 150px;
+    height: 100px;
+  }
+  .option-item{
+    display: flex;
+    align-items: center;
+    margin-bottom: 10px;
+  }
+  .button-box {
+    padding: 10px 20px;
+    .el-button {
+      float: right;
+    }
+  }
+  .warning {
+    color: #dc143c;
+  }
+</style>

src/view/teacherManage/teacherDetail.vue

@@ -0,0 +1,309 @@
+<script setup>
+// 引入依赖
+import api from '@/api/teacher'
+import capi from '@/api/course'
+import custom from '@/utils/custom'
+import {formatDate} from '@/utils/format'
+// import { toSQLLine } from '@/utils/stringFun'
+// import WarningBar from '@/components/warningBar/warningBar.vue'
+// import coursePool from './components/coursePool.vue'
+// import exercisesPool from '@/view/course/components/exercisesPool.vue'
+import {ref,onMounted,provide } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { useRouter, useRoute } from 'vue-router'
+const router = useRouter()
+const route = useRoute()
+// 变量
+const teacherInfo = ref({})
+const imgs = ref([])
+// 生命周期
+onMounted(() => {
+  getTeacherDetail()
+})
+// funstions
+async function getTeacherDetail() {
+  const res = await api.getTeacherDetail({id:route.params.id})
+  if(res.code === 0) {
+    teacherInfo.value = res.data
+    let teacher_cert = JSON.parse(res.data.teacher_cert)
+    let skill_cert = JSON.parse(res.data.skill_cert)
+    imgs.value = [...skill_cert,...teacher_cert]
+    // console.log(imgs.value)
+  }
+}
+const tip_text = ref('')
+const dialogVisible = ref(false)
+const a_type = ref(0)
+function actionFunc(type) {
+  dialogVisible.value = true
+  a_type.value = type
+  switch (type){
+    case 3:
+      tip_text.value = '是否同意该教师申请？';
+      break;
+    case 2:
+      tip_text.value = '是否拒绝该教师申请？';
+      break;
+  }
+}
+async function actionOk() { // 确认提交
+  const res = await api.teacherOperator({
+    teacher_id:teacherInfo.value.user_id,
+    status:a_type.value
+  })
+  if(res.code === 0) {
+    ElMessage({
+      type: 'success',
+      message: res.msg
+    })
+    getTeacherDetail()
+  }
+}
+function getStateName(state) {
+  let str = ''
+  switch (state){
+    case 1:
+        str = '待审核'
+      break;
+    case 2:
+        str = '已拒绝'
+      break;
+    case 3:
+        str = '已同意'
+      break;
+  }
+  return str
+}
+</script>
+<template>
+  <div>
+    <!--    基本信息-->
+    <div class="gva-search-box">
+      <div class="baseInfo-box">
+        <div class="bb-item">
+          <img class="avatar" :src="teacherInfo.avatar" alt="">
+        </div>
+        <div class="bb-item">
+          昵称：{{teacherInfo.name}}
+        </div>
+        <div class="bb-item">
+          ID：{{teacherInfo.user_id}}
+        </div>
+        <div class="bb-item">
+          注册时间：{{teacherInfo.CreatedAt}}
+        </div>
+        <div class="bb-item">
+          身份：教师
+        </div>
+        <div class="bb-item">
+          邀请人数：105人
+        </div>
+      </div>
+    </div>
+    <!--    章节信息-->
+    <div class="gva-table-box">
+      <div class="detail-info-box">
+        <div class="dib-row">
+          <div class="dib-item">
+            <div class="di-left">身份证号码：</div>
+            <div class="di-right">{{teacherInfo.id_card}}</div>
+          </div>
+          <div class="dib-item">
+            <div class="di-left">手机号码：</div>
+            <div class="di-right">{{teacherInfo.phone}}</div>
+          </div>
+        </div>
+        <div class="dib-row">
+          <div class="dib-item">
+            <div class="di-left">区域：</div>
+            <div class="di-right">{{teacherInfo.province}}</div>
+          </div>
+          <div class="dib-item">
+            <div class="di-left">提交时间：</div>
+            <div class="di-right">{{formatDate(teacherInfo.CreatedAt)}}</div>
+          </div>
+          <div class="dib-item">
+            <div class="di-left">就职单位：</div>
+            <div class="di-right">重庆大学</div>
+          </div>
+          <div class="dib-item">
+            <div class="di-left">任职行业：</div>
+            <div class="di-right">金融</div>
+          </div>
+        </div>
+        <div class="dib-row">
+          <div class="dib-item">
+            <div class="di-left">余额：</div>
+            <div class="di-right">{{teacherInfo.balance}}元</div>
+          </div>
+          <div class="dib-item">
+            <div class="di-left">累计收益：</div>
+            <div class="di-right">{{teacherInfo.income}}元</div>
+          </div>
+          <div class="dib-item link-item">
+            <div class="di-left">查看交易明细</div>
+          </div>
+        </div>
+        <div class="dib-row">
+          <div class="dib-item">
+            <div class="di-left">上架课程：</div>
+            <div class="di-right">{{teacherInfo.publish_course}}门</div>
+          </div>
+          <div class="dib-item link-item">
+            <div class="di-left">查看课程列表</div>
+          </div>
+        </div>
+        <div class="dib-row">
+          <div class="dib-item">
+            <div class="di-left">上架测试：</div>
+            <div class="di-right">{{teacherInfo.publish_exam}}份</div>
+          </div>
+          <div class="dib-item link-item">
+            <div class="di-left ">查看课程列表</div>
+          </div>
+        </div>
+        <div class="dib-row">
+          <div class="dib-item">
+            <div class="di-left">销售次数(课程)：</div>
+            <div class="di-right">{{teacherInfo.course_sale}}次</div>
+          </div>
+          <div class="dib-item">
+            <div class="di-left">累计金额：</div>
+            <div class="di-right">{{teacherInfo.course_income}}</div>
+          </div>
+          <div class="dib-item link-item">
+            <div class="di-left">查看学习记录</div>
+          </div>
+        </div>
+        <div class="dib-row">
+          <div class="dib-item">
+            <div class="di-left">销售次数(测试)：</div>
+            <div class="di-right">{{teacherInfo.exam_sale}}次</div>
+          </div>
+          <div class="dib-item">
+            <div class="di-left">累计金额：</div>
+            <div class="di-right">{{teacherInfo.exam_income}}</div>
+          </div>
+          <div class="dib-item link-item">
+            <div class="di-left">查看测试记录</div>
+          </div>
+        </div>
+        <div class="dib-row" style="margin-top: 50px">
+          <div class="dib-item">
+            <div class="di-left">资质证书（多张）</div>
+          </div>
+          <div class="dib-item">
+            <el-image
+              v-for="(item,i) in imgs"
+              class="img-css"
+              :src="item"
+              :zoom-rate="1.2"
+              :preview-src-list="imgs"
+              :initial-index="4"
+              fit="cover"
+            />
+          </div>
+        </div>
+
+      </div>
+      <!--    操作区域-->
+      <div class="action-box" v-if="teacherInfo.status == 1">
+        <div class="a-btn approved" @click="actionFunc(3)">同意</div>
+        <div class="a-btn refuse" @click="actionFunc(2)">拒绝</div>
+      </div>
+      <div class="action-box" v-else>
+        <div class="state-text" :class="{'reuse-text':teacherInfo.status == 2}">{{getStateName(teacherInfo.status)}}</div>
+      </div>
+    </div>
+    <el-dialog
+      v-model="dialogVisible"
+      title="操作提醒"
+      width="30%"
+      :before-close="handleClose"
+    >
+      <span>{{tip_text}}</span>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="dialogVisible = false">取消</el-button>
+          <el-button type="primary" @click="actionOk">
+            确定
+          </el-button>
+        </span>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+<style scoped lang="scss">
+  .action-box{
+    display: flex;
+    margin-top: 20px;
+    justify-content: center;
+    .a-btn{
+      background: rgb(60, 106, 112);
+      color: white;
+      padding: 10px 50px;
+      cursor: pointer;
+      margin: 10px;
+          border-radius: 5px;
+    }
+    .approved{
+
+    }
+    .refuse{
+      background: white !important;
+      color:rgb(60, 106, 112) !important;
+      border: 1px solid rgb(60, 106, 112) !important;
+    }
+  }
+  /*基本信息*/
+  .gva-search-box{
+    .baseInfo-box{
+      display: flex;
+      align-items: center;
+      //justify-content: space-around;
+      .bb-item{
+        margin: 10px 20px;
+        .avatar{
+          width: 50px;
+          height: 50px;
+          border-radius: 50%;
+          border: 1px solid #cdcdcd;
+        }
+      }
+    }
+  }
+  /*详细信息*/
+  .text{
+    color: red !important;
+  }
+  .state-text{
+    font-size: 15px;
+    color: gray;
+  }
+  .gva-table-box{
+    .detail-info-box{
+      .dib-row{
+        overflow: hidden;
+        .link-item{
+          color: #3C6A70 !important;
+          cursor: pointer;
+        }
+        .dib-item{
+          //color: gray;
+          padding: 10px 0;
+          display: flex;
+          float: left;
+          margin-right: 30px;
+          .di-left{
+          }
+          .img-css{
+            width: 100px;
+            height: 100px;
+            margin: 0 10px 10px 0;
+            cursor: pointer;
+          }
+        }
+      }
+    }
+  }
+</style>