update

src/modules/course/create/components/Operation.vue

-<script setup lang="ts">
-import { setDepartment, setPlatform, setStatus, setBelong } from '../api'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { useProjectList } from '@/composables/useGetProjectList'
-
-const router = useRouter()
-
-const route = useRoute()
-
-const props = defineProps(['data'])
-
-// 详情id
-const id = route.query.id as string
-// 设置部门共享
-const handleDepartment = () => {
-  ElMessageBox.confirm(
-    `
-    ${
-      parseInt(props.data.department_public) === 0
-        ? `该操作将会使本视频资源在您所在的部门“${props.data.organ_id_name}”内部共享，管理者不变，其余人员只能共享使用该资源，确认部门共享吗？`
-        : `该操作将会取消本视频资源在您所在的部门“${props.data.organ_id_name}”内部共享，部门其余人员将不能再看到该共享资源，确认取消部门共享吗？`
-    }
-  `,
-    '提示',
-    {
-      confirmButtonText: '确认',
-      cancelButtonText: '取消',
-      type: 'warning'
-    }
-  ).then(() => {
-    setDepartment({ id: id }).then((res: any) => {
-      if (res.code === 0) {
-        ElMessage({ message: '更改成功', type: 'success' })
-        setTimeout(() => {
-          router.go(0)
-        }, 500)
-      }
-    })
-  })
-}
-
-// 设置平台共享
-const handlePlatform = () => {
-  ElMessageBox.confirm(
-    `
-    ${
-      parseInt(props.data.platform_public) === 0
-        ? '该操作将会使本视频资源在e-SaaS平台中公开共享供所有老师使用，资源的管理者不变，其余人员只能共享使用该资源，确认公开该资源吗？'
-        : '该操作将会取消本视频资源在e-SaaS平台中公开共享，平台所有人员将不能再看到该共享资源，确认取消平台共享吗？'
-    }
-  `,
-    '提示',
-    {
-      confirmButtonText: '确认',
-      cancelButtonText: '取消',
-      type: 'warning'
-    }
-  ).then(() => {
-    setPlatform({ id: id }).then((res: any) => {
-      if (res.code === 0) {
-        ElMessage({ message: '更改成功', type: 'success' })
-        setTimeout(() => {
-          router.go(0)
-        }, 500)
-      }
-    })
-  })
-}
-
-// 上下线设置
-const handleStatus = () => {
-  ElMessageBox.confirm(
-    `
-    ${
-      parseInt(props.data.status) === 1
-        ? '已下线的资源将不能被关联到课程使用，确认下线该资源吗？'
-        : '确认再次上线该资源吗？'
-    }
-  `,
-    '提示',
-    {
-      confirmButtonText: '确认',
-      cancelButtonText: '取消',
-      type: 'warning'
-    }
-  ).then(() => {
-    setStatus({ id: id }).then((res: any) => {
-      if (res.code === 0) {
-        ElMessage({ message: '更改成功', type: 'success' })
-        setTimeout(() => {
-          router.go(0)
-        }, 500)
-      }
-    })
-  })
-}
-
-// 更该负责人
-const form = reactive({
-  members: ''
-})
-const dialogFormVisible = ref(false)
-
-// 人员列表
-let members: any = ref([])
-
-// 点击更改负责人按钮弹窗
-const handleMembers = () => {
-  dialogFormVisible.value = true
-  members.value = useProjectList(props.data.organ_id).members
-}
-// 更改负责人确定
-const handlesetBelong = () => {
-  setBelong({ id: id, belong_operator: form.members }).then((res: any) => {
-    if (res.code === 0) {
-      ElMessage({ message: '更改成功', type: 'success' })
-      setTimeout(() => {
-        dialogFormVisible.value = false
-      }, 500)
-    }
-  })
-}
-</script>
-
-<template>
-  <div class="tool-btn-box" v-if="$route.query.id" style="margin-bottom: 20px">
-    <div v-if="props.data.auth_department" class="btn-item" @click="handleDepartment">
-      {{ props.data.department_public == 0 ? '部门共享' : '取消部门共享' }}
-    </div>
-    <div v-if="props.data.auth_platform" class="btn-item" @click="handlePlatform">
-      {{ props.data.platform_public == 0 ? '平台共享' : '取消平台共享' }}
-    </div>
-    <div
-      v-if="props.data.auth_status"
-      v-permission="'v1-resource-video-set-status'"
-      class="btn-item"
-      @click="handleStatus"
-    >
-      {{ props.data.status == 0 ? '资源上线' : '资源下线' }}
-    </div>
-    <div v-if="props.data.auth_belong" class="btn-item" @click="handleMembers">更改负责人</div>
-  </div>
-  <el-dialog v-model="dialogFormVisible" title="更改负责人" center>
-    <el-form :model="form">
-      <el-form-item>
-        <div style="width: 500px">
-          <el-row>
-            <el-col :span="12"
-              ><div class="grid-content ep-bg-purple" />
-              资源创建人: {{ props.data.created_operator_name }}
-            </el-col>
-            <el-col :span="12"
-              ><div class="grid-content ep-bg-purple-light" />
-              创建时间: {{ props.data.created_time }}
-            </el-col>
-          </el-row>
-          <el-row>
-            <el-col :span="12"
-              ><div class="grid-content ep-bg-purple" />
-              资源负责人: {{ props.data.belong_operator_name }}
-            </el-col>
-            <el-col :span="12"
-              ><div class="grid-content ep-bg-purple-light" />
-              更新时间: {{ props.data.updated_time }}
-            </el-col>
-          </el-row>
-        </div>
-        <el-select style="width: 500px; margin-top: 20px" v-model="form.members" placeholder="请选择新的资源负责人">
-          <el-option v-for="item in members.value" :label="item.name" :value="item.id" :key="item.id" />
-        </el-select>
-      </el-form-item>
-    </el-form>
-    <template #footer>
-      <span class="dialog-footer">
-        <el-button @click="dialogFormVisible = false">取消</el-button>
-        <el-button type="primary" @click="handlesetBelong">确认</el-button>
-      </span>
-    </template>
-  </el-dialog>
-</template>
-<style lang="scss" scoped>
-.tool-btn-box {
-  display: flex;
-  justify-content: right;
-  .btn-item {
-    width: 127px;
-    line-height: 36px;
-    background: #aa1941;
-    border-radius: 20px;
-    margin-right: 10px;
-    font-size: 14px;
-    color: #ffffff;
-    text-align: center;
-    cursor: pointer;
-  }
-}
-</style>

src/modules/course/create/components/AddCourseCover.vue → src/modules/course/create/components/stepOneComponents/AddCourseCover.vue

 <script setup lang="ts">
-import { getCoverList } from '../api'
+import { getCoverList } from '../../api'
 import { PictureFilled, ArrowLeftBold, ArrowRightBold } from '@element-plus/icons-vue'
 import UploadImg from './UploadImg.vue'
 
@@ -47,7 +47,6 @@ getCoverList().then(res => {
       swiperCovers.splice(index, 1)
     }
   })
-  console.log(swiperCovers, '123')
 })
 
 let isSwiperBtn = $ref(0)

src/modules/course/create/components/AddExam.vue → src/modules/course/create/components/stepOneComponents/AddExam.vue

 <script setup lang="ts">
-import { searchExam } from '../api'
+import { searchExam } from '../../api'
 
 const emit = defineEmits(['change'])
 
@@ -90,7 +90,6 @@ watch(
       lecturerValue.value = list
       allLecturers.value = value
       options.value = value as []
-      console.log(options.value, 1111)
     }
   },
   { immediate: true }
@@ -138,12 +137,12 @@ const changeData = () => {
           <el-option v-for="item in options" :key="item.id" :label="item.paper_title" :value="item.id" />
         </el-select>
       </div>
-      <!-- <template #footer>
+      <template #footer>
         <span class="dialog-footer">
-          <el-button @click="dialogVisible = false">取消</el-button>
-          <el-button type="primary" @click="changeLecturer">确认</el-button>
+          <!-- <el-button @click="dialogVisible = false">取消</el-button> -->
+          <el-button type="primary" @click="dialogVisible = false">确认</el-button>
         </span>
-      </template> -->
+      </template>
     </el-dialog>
   </div>
 </template>

src/modules/course/create/components/AddLecturer.vue → src/modules/course/create/components/stepOneComponents/AddLecturer.vue

 <script setup lang="ts">
-import { searchLecturer } from '../api'
+import { searchLecturer } from '../../api'
 
 const emit = defineEmits(['change'])
 
@@ -114,12 +114,12 @@ const changeData = () => {
           <el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id" />
         </el-select>
       </div>
-      <!-- <template #footer>
+      <template #footer>
         <span class="dialog-footer">
-          <el-button @click="dialogVisible = false">取消</el-button>
-          <el-button type="primary" @click="changeLecturer">确认</el-button>
+          <!-- <el-button @click="dialogVisible = false">取消</el-button> -->
+          <el-button type="primary" @click="dialogVisible = false">确认</el-button>
         </span>
-      </template> -->
+      </template>
     </el-dialog>
   </div>
 </template>

src/modules/course/create/components/AddLive.vue → src/modules/course/create/components/stepOneComponents/AddLive.vue

 <script setup lang="ts">
-import { searchLive } from '../api'
+import { searchLive } from '../../api'
 
 const emit = defineEmits(['change'])
 
@@ -139,12 +139,12 @@ const changeData = () => {
           <el-option v-for="item in options" :key="item.id" :label="item.subject" :value="item.id" />
         </el-select>
       </div>
-      <!-- <template #footer>
+      <template #footer>
         <span class="dialog-footer">
-          <el-button @click="dialogVisible = false">取消</el-button>
-          <el-button type="primary" @click="changeLecturer">确认</el-button>
+          <!-- <el-button @click="dialogVisible = false">取消</el-button> -->
+          <el-button type="primary" @click="dialogVisible = false">确认</el-button>
         </span>
-      </template> -->
+      </template>
     </el-dialog>
   </div>
 </template>

src/modules/course/create/index.ts

@@ -6,7 +6,7 @@ export const routes: Array<RouteRecordRaw> = [
     path: '/course/update-course',
     component: AppLayout,
     children: [
-      { path: '', component: () => import('./views/UpdateCourse.vue') }
+      { path: '', component: () => import('./views/StepOne.vue') }
     ]
   }
 ]

src/modules/course/create/components/StepOne.vue → src/modules/course/create/views/StepOne.vue

 <script setup lang="ts">
-import { createCourse, getCourseDetails, updateCourse, setStatus } from '../api'
+import { createCourse, getCourseDetails, updateCourse } from '../api'
+// setStatus
 import { useGetCategoryList } from '@/composables/useGetCategoryList'
 import { useMapStore } from '@/stores/map'
 import VEditor from '@/components/tinymce/Index.vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-// import Operation from './Operation.vue'
 // 课程封面
-import AddCourseCover from './AddCourseCover.vue'
+import AddCourseCover from '../components/stepOneComponents/AddCourseCover.vue'
 // 添加讲师
-import AddLecturer from './AddLecturer.vue'
+import AddLecturer from '../components/stepOneComponents/AddLecturer.vue'
 // 添加试卷
-import AddExam from './AddExam.vue'
+import AddExam from '../components/stepOneComponents/AddExam.vue'
 // 添加直播
-import AddLive from './AddLive.vue'
+import AddLive from '../components/stepOneComponents/AddLive.vue'
 
 const store = useMapStore()
 
 const route = useRoute()
 
-const router = useRouter()
+// const router = useRouter()
 
 const id = route.query.id as string
 
@@ -51,6 +50,7 @@ const defaultProps = {
 
 // form
 let form = $ref<Record<string, any>>({
+  status: 1,
   source: '2',
   cover: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/center_resource/course-cover.png'
 })
@@ -64,7 +64,8 @@ const rules = {
   credit: [{ required: true, message: '请输入学分' }],
   lecturer_id: [{ required: true, message: '' }],
   exam_id: [{ required: true, message: '' }],
-  live_id: [{ required: true, message: '' }]
+  live_id: [{ required: true, message: '' }],
+  status: [{ required: true, message: '' }]
 }
 
 // 课程封面dialog
@@ -105,6 +106,7 @@ if (isUpdate) {
     form.lecturer_id = setDefaultData(lecturerList.value)
     form.exam_id = setDefaultData(examList.value)
     form.live_id = setDefaultData(liveList.value)
+    switchFlag.value = !!parseInt(res.data.status)
   })
 }
 const setDefaultData = (data: object[]) => {
@@ -119,6 +121,7 @@ const setDefaultData = (data: object[]) => {
 const stepOneId = ref()
 // 新建课件
 const createCourseForm = () => {
+  form.status = switchFlag.value ? '1' : '0'
   if (isUpdate) {
     updateCourse(form).then((res: any) => {
       if (res.code === 0) {
@@ -136,112 +139,88 @@ const createCourseForm = () => {
   }
 }
 
-// 上下线设置
-const handleStatus = () => {
-  ElMessageBox.confirm(
-    `
-    ${
-      parseInt(form.status) === 1
-        ? '确认下线该资源吗？'
-        : '确认再次上线该资源吗？'
-    }
-  `,
-    '提示',
-    {
-      confirmButtonText: '确认',
-      cancelButtonText: '取消',
-      type: 'warning'
-    }
-  ).then(() => {
-    setStatus({ id: id }).then((res: any) => {
-      if (res.code === 0) {
-        ElMessage({ message: '更改成功', type: 'success' })
-        setTimeout(() => {
-          router.go(0)
-        }, 500)
-      }
-    })
-  })
-}
+// 开关
+const switchFlag = ref(true)
 </script>
 
 <template>
-  <!-- 基本信息 -->
-  <div class="update-course-info">
-    <div class="tool-btn-box">
-      <div
-        v-if="form.auth_status"
-        v-permission="'v1-resource-video-set-status'"
-        class="btn-item"
-        @click="handleStatus"
-      >
-        {{ form.status == 0 ? '资源上线' : '资源下线' }}
-      </div>
-    </div>
-    <div style="display: flex">
-      <div class="cover" :style="`background-image: url(${form.cover})`">
-        <div class="upload-btn" @click="dialogVisible = true">添加封面</div>
+  <AppCard :title="isUpdate ? '编辑课程' : '新建课程'">
+    <!-- 基本信息 -->
+    <div class="update-course-info">
+      <div style="display: flex">
+        <div class="cover" :style="`background-image: url(${form.cover})`">
+          <div class="upload-btn" @click="dialogVisible = true">添加封面</div>
+        </div>
+        <el-form ref="ruleFormRef" :model="form" :rules="rules" style="width: 50%">
+          <el-form-item label="课程名称：" prop="name">
+            <el-input v-model="form.name" maxlength="40" />
+          </el-form-item>
+          <el-form-item label="课程类型：" prop="online_type">
+            <el-radio-group v-model="form.online_type">
+              <el-radio :key="item.value" :label="item.value" v-for="item in courseType">{{ item.label }}</el-radio>
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item label="选课类型：" prop="elective_type">
+            <el-radio-group v-model="form.elective_type">
+              <el-radio :key="item.value" :label="item.value" v-for="item in electiveType">{{ item.label }}</el-radio>
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item label="课程分类：" prop="classification">
+            <el-tree-select
+              :render-after-expand="false"
+              :props="defaultProps"
+              style="width: 100%"
+              v-model="form.classification"
+              :data="selectTree"
+            />
+          </el-form-item>
+          <el-form-item label="课程学分：" prop="credit">
+            <el-input v-model="form.credit" maxlength="40" />
+          </el-form-item>
+          <el-form-item label="是否可用：" prop="status">
+            <el-switch v-model="switchFlag" />
+          </el-form-item>
+        </el-form>
       </div>
-      <el-form ref="ruleFormRef" :model="form" :rules="rules" style="width: 50%">
-        <el-form-item label="课程名称：" prop="name">
-          <el-input v-model="form.name" maxlength="40" />
+      <el-form
+        ref="ruleFormRef"
+        label-position="top"
+        :model="form"
+        :rules="rules"
+        style="width: 100%; margin-top: 30px"
+      >
+        <el-form-item label="课程讲师：" prop="lecturer_id">
+          <!-- 添加讲师 -->
+          <AddLecturer :data="lecturerList" @change="changeLecturer" style="width: 100%"></AddLecturer>
         </el-form-item>
-        <el-form-item label="课程类型：" prop="online_type">
-          <el-radio-group v-model="form.online_type">
-            <el-radio :key="item.value" :label="item.value" v-for="item in courseType">{{ item.label }}</el-radio>
-          </el-radio-group>
+        <el-form-item label="课程简介与描述：">
+          <v-editor v-model="form.represent" class="editor" :height="200"></v-editor>
         </el-form-item>
-        <el-form-item label="选课类型：" prop="elective_type">
-          <el-radio-group v-model="form.elective_type">
-            <el-radio :key="item.value" :label="item.value" v-for="item in electiveType">{{ item.label }}</el-radio>
-          </el-radio-group>
+        <el-form-item label="课程小论文：">
+          <v-editor v-model="form.essay" class="editor" :height="200"></v-editor>
         </el-form-item>
-        <el-form-item label="课程分类：" prop="classification">
-          <el-tree-select
-            :render-after-expand="false"
-            :props="defaultProps"
-            style="width: 100%"
-            v-model="form.classification"
-            :data="selectTree"
-          />
+        <el-form-item label="前期准备与预备知识：">
+          <v-editor v-model="form.previous_preparation" class="editor" :height="200"></v-editor>
         </el-form-item>
-        <el-form-item label="课程学分：" prop="credit">
-          <el-input v-model="form.credit" maxlength="40" />
+        <el-form-item label="授课目标：">
+          <v-editor v-model="form.target" class="editor" :height="200"></v-editor>
+        </el-form-item>
+        <el-form-item label="课程考试：" prop="exam_id">
+          <!-- 添加考试 -->
+          <AddExam :data="examList" @change="changeExam" style="width: 100%"></AddExam>
+        </el-form-item>
+        <el-form-item label="课程考试：" prop="live_id">
+          <!-- 添加直播 -->
+          <AddLive :data="liveList" @change="changeLive" style="width: 100%"></AddLive>
         </el-form-item>
       </el-form>
     </div>
-    <el-form ref="ruleFormRef" label-position="top" :model="form" :rules="rules" style="width: 100%; margin-top: 30px">
-      <el-form-item label="课程讲师：" prop="lecturer_id">
-        <!-- 添加讲师 -->
-        <AddLecturer :data="lecturerList" @change="changeLecturer" style="width: 100%"></AddLecturer>
-      </el-form-item>
-      <el-form-item label="课程简介与描述：">
-        <v-editor v-model="form.represent" class="editor" :height="200"></v-editor>
-      </el-form-item>
-      <el-form-item label="课程小论文：">
-        <v-editor v-model="form.essay" class="editor" :height="200"></v-editor>
-      </el-form-item>
-      <el-form-item label="前期准备与预备知识：">
-        <v-editor v-model="form.previous_preparation" class="editor" :height="200"></v-editor>
-      </el-form-item>
-      <el-form-item label="授课目标：">
-        <v-editor v-model="form.target" class="editor" :height="200"></v-editor>
-      </el-form-item>
-      <el-form-item label="课程考试：" prop="exam_id">
-        <!-- 添加考试 -->
-        <AddExam :data="examList" @change="changeExam" style="width: 100%"></AddExam>
-      </el-form-item>
-      <el-form-item label="课程考试：" prop="live_id">
-        <!-- 添加直播 -->
-        <AddLive :data="liveList" @change="changeLive" style="width: 100%"></AddLive>
-      </el-form-item>
-    </el-form>
-  </div>
-  <div class="btn-box" style="display: flex; justify-content: center">
-    <el-button type="primary" @click="createCourseForm">下一步</el-button>
-  </div>
-  <!-- 添加封面 -->
-  <AddCourseCover @change="coverChange" v-model:dialogVisible="dialogVisible"></AddCourseCover>
+    <div class="btn-box" style="display: flex; justify-content: center">
+      <el-button type="primary" @click="createCourseForm">下一步</el-button>
+    </div>
+    <!-- 添加封面 -->
+    <AddCourseCover @change="coverChange" v-model:dialogVisible="dialogVisible"></AddCourseCover>
+  </AppCard>
 </template>
 <style lang="scss">
 .update-course-info {

src/modules/course/create/views/UpdateCourse.vue

-<script setup lang="ts">
-// 第一步
-import StepOne from '../components/StepOne.vue'
-
-// is 编辑 新建
-const route = useRoute()
-const isUpdate = $computed(() => {
-  return !!route.query.id
-})
-</script>
-
-<template>
-<AppCard :title="isUpdate ? '编辑课程' : '新建课程'">
-  <StepOne></StepOne>
-</AppCard>
-</template>
-<style lang="scss">
-
-</style>