添加下架功能

auto-imports.d.ts

@@ -1,5 +1,5 @@
 // Generated by 'unplugin-auto-import'
 export {}
 declare global {
-
+  const ElMessageBox: typeof import('element-plus/es')['ElMessageBox']
 }

src/views/user-info/components/item/index.tsx

@@ -1,4 +1,4 @@
-import { ElImage } from 'element-plus'
+import { ElButton, ElImage } from 'element-plus'
 import { defineComponent } from 'vue'
 import iconTeacher from '@/common/images/icon_teacher.png'
 
@@ -8,6 +8,10 @@ export default defineComponent({
     item: {
       type: Object,
       default: () => ({})
+    },
+    onOffCourse: {
+      type: Function,
+      default: (item: any) => {}
     }
   },
   render() {
@@ -62,9 +66,16 @@ export default defineComponent({
             fit="cover"
             src={item.backgroundPic}
           />
-          <div class="text-sm text-[#52FFDC] h-7 leading-7 px-3 flex items-center justify-end absolute left-0 right-0 bottom-0 bg-black/60">
-            <i class="w-1 h-1 bg-[#52FFDC] rounded-full mr-1.5 inline-block"></i>
-            {item.studentCount}人已购买
+          <div class="text-sm text-[#52FFDC] h-7 leading-7 px-3 flex items-center justify-between absolute left-0 right-0 bottom-0 bg-black/60">
+            <div>
+              <div class="text-base text-[#FF5F22] leading-none">
+                {item.courseNum}课时
+              </div>
+            </div>
+            <div>
+              <i class="w-1 h-1 bg-[#52FFDC] rounded-full mr-1.5 inline-block"></i>
+              {item.studentCount}人已购买
+            </div>
           </div>
         </div>
 
@@ -83,9 +94,20 @@ export default defineComponent({
             <span class="text-sm leading-7">￥</span>
             {item.coursePrice}
           </div>
-          <div class="text-base text-[#FF5F22] leading-none">
-            {item.courseNum}课时
-          </div>
+          {item.type === 'video' && item.status === 'PASS' && (
+            <div>
+              <ElButton
+                type="primary"
+                round
+                onClick={(e: MouseEvent) => {
+                  e.stopPropagation()
+                  this.onOffCourse(item)
+                }}
+              >
+                下架课程
+              </ElButton>
+            </div>
+          )}
         </div>
       </div>
     )

src/views/user-info/music-class/item.tsx

@@ -6,6 +6,7 @@ import music from './images/music.png'
 import arrow from './images/arrow.png'
 import { goodsType } from '@/constant'
 import { useRouter } from 'vue-router'
+import { ElButton } from 'element-plus'
 
 type Props = {
   id?: number
@@ -16,6 +17,7 @@ type Props = {
   composer: string
   titleImg: string
   chargeType: string
+  auditStatus?: string
 }
 const chargeTypes = {
   CHARGE: '点播',
@@ -33,6 +35,10 @@ export default defineComponent({
     onClick: {
       type: Function,
       default: (item: any) => {}
+    },
+    onChangeState: {
+      type: Function,
+      default: (item: any) => {}
     }
   },
 
@@ -97,6 +103,24 @@ export default defineComponent({
             </div>
           </div>
           <div class={classes.right}>
+            {state.item.auditStatus === 'PASS' && (
+              <ElButton
+                plain
+                type="danger"
+                round
+                size="small"
+                style={{
+                  padding: '8px 12px'
+                }}
+                onClick={(e: MouseEvent) => {
+                  e.stopPropagation()
+                  props.onChangeState(state.item)
+                }}
+              >
+                下架
+              </ElButton>
+            )}
+
             <img class={classes.arrow} src={arrow} alt="" />
           </div>
         </div>

src/views/user-info/music-class/list.tsx

@@ -2,7 +2,12 @@ import ColEmpty from '@/components/col-empty'
 import Pagination from '@/components/pagination'
 import request from '@/helpers/request'
 import styles from './index.module.less'
-import { ElSkeleton, ElSkeletonItem } from 'element-plus'
+import {
+  ElMessage,
+  ElMessageBox,
+  ElSkeleton,
+  ElSkeletonItem
+} from 'element-plus'
 import { defineComponent } from 'vue'
 import { state } from '@/state'
 import MusicItem from './item'
@@ -71,6 +76,20 @@ export default defineComponent({
           this.loading = false
         }, 200)
       }
+    },
+    async onChangeState(item: any) {
+      ElMessageBox.confirm(`是否下架曲谱?`, '提示', {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(async () => {
+        try {
+          await request.post('/api-website/music/sheet/state/' + item.id)
+          ElMessage.success('下架成功')
+          this.pageInfo.page = 1
+          this.getList()
+        } catch {}
+      })
     }
   },
   render() {
@@ -131,8 +150,10 @@ export default defineComponent({
                         })
                       }
                     }}
+                    onChangeState={(item: any) => this.onChangeState(item)}
                     item={{
                       id: item.id,
+                      auditStatus: this.auditStatus,
                       addName: item.addName,
                       addUserAvatar: item.addUserAvatar,
                       musicSheetName: item.musicSheetName,

src/views/user-info/video-class/list.tsx

@@ -2,7 +2,7 @@ import ColEmpty from '@/components/col-empty'
 import Pagination from '@/components/pagination'
 import request from '@/helpers/request'
 import { state } from '@/state'
-import { ElSkeleton, ElSkeletonItem } from 'element-plus'
+import { ElMessage, ElMessageBox, ElSkeleton, ElSkeletonItem } from 'element-plus'
 import { defineComponent } from 'vue'
 import Item from '../components/item'
 import styles from './index.module.less'
@@ -77,6 +77,25 @@ export default defineComponent({
       } else {
         // 跳转对应详情 个人中心不跳转到详情
       }
+    },
+    async onOffCourse(item: any) {
+      ElMessageBox.confirm(`是否下架课程?`, '提示', {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(async () => {
+        try {
+          await request.post('/api-website/videoLessonGroup/updateShelves', {
+            data: {
+              id: item.id,
+              shelvesFlag: 0
+            }
+          })
+          ElMessage.success('下架成功')
+          this.pageInfo.page = 1
+          this.getList()
+        } catch {}
+      })
     }
   },
   render() {
@@ -137,6 +156,7 @@ export default defineComponent({
                     <Item
                       item={{
                         type: 'video',
+                        status: this.auditStatus,
                         id: item.id,
                         backgroundPic: item.lessonCoverUrl,
                         courseGroupName: item.lessonName,
@@ -147,6 +167,9 @@ export default defineComponent({
                         courseNum: item.lessonCount,
                         shelvesFlag: item.shelvesFlag
                       }}
+                      onOffCourse={(item: any) => {
+                        this.onOffCourse(item)
+                      }}
                     />
                   </div>
                 ))}

src/views/user-info/video-operation/course-info/index.tsx

@@ -26,7 +26,7 @@ export default defineComponent({
   name: 'course-info',
   data() {
     return {
-      url: '',
+      url: ''
       // calcRatePrice: 0 as any
     }
   },
@@ -143,7 +143,7 @@ export default defineComponent({
               class="w-full"
               v-model={createState.lessonGroup.lessonSubject}
               placeholder="请选择课程声部"
-              disabled={createState.lessonGroup.id ? true : false}
+              // disabled={createState.lessonGroup.id ? true : false}
             >
               {createState.subjectList.map((item: any) => (
                 <ElOption key={item.id} value={item.id} label={item.name} />
@@ -189,7 +189,7 @@ export default defineComponent({
               v-slots={{
                 suffix: () => <span class="text-base text-[#999]">元</span>
               }}
-              disabled={createState.lessonGroup.id ? true : false}
+              // disabled={createState.lessonGroup.id ? true : false}
             />
           </ElFormItem>
           <div class="text-sm text-[#999] pl-[120px] leading-relaxed pb-2">

src/views/user-info/video-operation/index.tsx

@@ -44,9 +44,9 @@ export default defineComponent({
         ...group
       } = result.lessonGroup
       // 判断模板图片是否在模板列表中，如果不在则是用户自己上传的图片
-      const statusUrl = createState.templateList.includes(lessonCoverUrl)
-        ? true
-        : false
+      // const statusUrl = createState.templateList.includes(lessonCoverUrl)
+      //   ? true
+      //   : false
 
       createState.lessonGroup = {
         id: id,
@@ -54,8 +54,8 @@ export default defineComponent({
         lessonSubject: Number(lessonSubject),
         lessonDesc: lessonDesc,
         lessonPrice: lessonPrice,
-        lessonCoverTemplateUrl: statusUrl ? lessonCoverUrl : '',
-        lessonCoverUrl: statusUrl ? '' : lessonCoverUrl
+        // lessonCoverTemplateUrl: statusUrl ? lessonCoverUrl : '',
+        lessonCoverUrl: lessonCoverUrl
       }
 
       createState.lessonList = []