update

src/modules/course/create/components/stepTwoComponents/AddVideoDialog.vue

@@ -2,11 +2,12 @@
 import { getVideoList, createCharacter, getCourseListSearch, getLessonList, getOtherList } from '../../api'
 import CardListItem from './CardListItem.vue'
 import { useGetCategoryList } from '@/composables/useGetCategoryList'
+import { ElMessage } from 'element-plus'
 const appList = ref()
 // 资源出处 tab触发
 const tabValue = ref('1')
 const path = ref('')
-let tableData: any = reactive({
+let tableData: any = $ref({
   list: [],
   title: '',
   total: ''
@@ -121,6 +122,57 @@ if (props.btnInfo.resource_type === '2') {
 } else if (props.btnInfo.resource_type === '4') {
   path.value = '/resource/other/view'
 }
+
+let checkName = $ref('全选')
+// 写到这了
+const checkboxAll = function () {
+  const data = tableData.list.reduce((a: any, b: any) => {
+    if (b.check_status) a.push(b)
+    return a
+  }, [])
+  if (data.length === tableData.list.length) {
+    tableData.list.map((item: any) => {
+      item.check_status = false
+      return item
+    })
+    checkName = '全选'
+  } else {
+    tableData.list.map((item: any) => {
+      item.check_status = true
+      return item
+    })
+    checkName = '取消全选'
+  }
+}
+
+const checkboxSelect = function () {
+  const data = tableData.list.reduce((a: any, b: any) => {
+    if (b.check_status) a.push(b)
+    return a
+  }, [])
+  data.length !== tableData.list.length ? (checkName = '全选') : (checkName = '取消全选')
+}
+
+const addVideo = function () {
+  const data = tableData.list.filter((item: any) => item.check_status === true)
+  data.forEach((item: any, index: number) => {
+    const params: any = {
+      name: item.name,
+      course_id: props.course_id,
+      resource_type: props.btnInfo.resource_type,
+      parent_id: props.chapterID,
+      resource_id: item.id
+    }
+    createCharacter(params).then(() => {
+      console.log(index === data.length, 'index === data.length')
+      if (index === data.length - 1) {
+        emit('update:isShowAddDialog', false)
+        emit('create', item)
+        ElMessage.success('添加成功')
+      }
+    })
+  })
+}
 </script>
 
 <template>
@@ -152,6 +204,10 @@ if (props.btnInfo.resource_type === '2') {
       </template>
       <template #body="{ data }">
         <div class="card-list" v-if="data.length">
+          <div style="display: flex; margin-bottom: 20px">
+            <el-button type="primary" @click="checkboxAll">{{ checkName }}</el-button>
+            <el-button type="primary" @click="addVideo">添加</el-button>
+          </div>
           <div class="card-list-con">
             <CardListItem
               v-for="(item, index) in data"
@@ -161,6 +217,7 @@ if (props.btnInfo.resource_type === '2') {
               :path="path"
               @add="handleAdd"
             >
+              <el-checkbox @change="checkboxSelect" v-model="item.check_status"></el-checkbox>
             </CardListItem>
           </div>
         </div>

src/modules/course/create/components/stepTwoComponents/CardListItem.vue

@@ -8,6 +8,7 @@ interface Emits {
   (e: 'add', id: object): void
 }
 const handleAdd = () => {
+  console.log(props.data, 'datas')
   emit('add', props.data)
 }
 const bytesToSize = (bytes: number) => {
@@ -48,6 +49,7 @@ const bytesToSize = (bytes: number) => {
       </div>
     </div>
     <div class="card-item-bottom">
+      <slot></slot>
       <div class="item-t">
         <el-popover trigger="hover" placement="right">
           <div v-html="props.data.created_operator_name + '/' + props.data.organ_id_name"></div>
@@ -61,7 +63,9 @@ const bytesToSize = (bytes: number) => {
       </div>
       <div class="item-b">
         <div class="time">{{ props.data.updated_time }}</div>
-        <div class="tag" v-if="tabIndex === '2'">{{ props.data.department_public === '0' ? '未共享' : '已共享' }}</div>
+        <div class="tag" v-if="tabIndex === '2'">
+          {{ props.data.department_public === '0' ? '未共享' : '已共享' }}
+        </div>
         <div class="tag" v-if="tabIndex === '3'">{{ props.data.platform_public === '0' ? '未共享' : '已共享' }}</div>
       </div>
     </div>
@@ -167,7 +171,7 @@ const bytesToSize = (bytes: number) => {
 }
 .card-item-bottom {
   background: #fff;
-  padding: 20px 16px 30px;
+  padding: 10px 16px 30px;
   .item-t {
     display: flex;
     align-items: center;