公共筛选提取修改

.eslintrc-auto-import.json

@@ -134,6 +134,7 @@
     "useDisplayMedia": true,
     "useDocumentVisibility": true,
     "useDraggable": true,
+    "useDropZone": true,
     "useElementBounding": true,
     "useElementByPoint": true,
     "useElementHover": true,

auto-imports.d.ts

@@ -135,6 +135,7 @@ declare global {
   const useDisplayMedia: typeof import('@vueuse/core')['useDisplayMedia']
   const useDocumentVisibility: typeof import('@vueuse/core')['useDocumentVisibility']
   const useDraggable: typeof import('@vueuse/core')['useDraggable']
+  const useDropZone: typeof import('@vueuse/core')['useDropZone']
   const useElementBounding: typeof import('@vueuse/core')['useElementBounding']
   const useElementByPoint: typeof import('@vueuse/core')['useElementByPoint']
   const useElementHover: typeof import('@vueuse/core')['useElementHover']

src/api/base.ts

@@ -53,3 +53,8 @@ export function updateAuth(data: { source_id: string }) {
 export function getCategoryList(params: { type: string; category_name?: string }) {
   return httpRequest.get('/api/resource/v1/backend/category/list', { params })
 }
+
+// 获取项目列表
+export function getProjectList(params: { organization_id: string }) {
+  return httpRequest.get('/api/resource/v1/util/members', { params })
+}
\ No newline at end of file

src/composables/useCategory.ts → src/composables/useGetCategoryList.ts

 import { getCategoryList } from '@/api/base'
 
-export function useCategory() {
+export function useGetCategoryList() {
   const list = ref([])
   onMounted(() => {
     getCategoryList({ type: 'tree' }).then((res: any) => {

src/composables/useGetProjectList.ts

+import { getProjectList } from '@/api/base'
+
+export function useProjectList(id?: string) {
+  const list = ref([])
+  onMounted(() => {
+    getProjectList({ organization_id: id || '' }).then((res: any) => {
+      list.value = res.data.departments
+    })
+  })
+  return { list }
+}
\ No newline at end of file

src/modules/resource/courseware/api.ts

@@ -23,11 +23,6 @@ export function createCourse(data: {
   return httpRequest.post('/api/resource/v1/resource/courseware/create', data)
 }
 
-// 获取分类列表
-export function getCategoryList(params: { type: string; category_name?: string }) {
-  return httpRequest.get('/api/resource/v1/backend/category/list', { params })
-}
-
 // 更新课件
 export function updateCourse(data: {
   id: string
@@ -43,10 +38,7 @@ export function updateCourse(data: {
 export function getCourseDetails(params: { id: string }) {
   return httpRequest.get('/api/resource/v1/resource/courseware/view', { params })
 }
-// 获取项目列表
-export function getProjectList(params: { organization_id: string }) {
-  return httpRequest.get('/api/resource/v1/util/members', { params })
-}
+
 // 部门共享
 export function setDepartment(data: { id: string }) {
   return httpRequest.post('/api/resource/v1/resource/courseware/set-department', data)

src/modules/resource/courseware/components/Operation.vue

 <script setup lang="ts">
-import { setDepartment, setPlatform, setStatus, getProjectList, setBelong } from '../api'
+import { setDepartment, setPlatform, setStatus, setBelong } from '../api'
+import { useProjectList } from '@/composables/useGetProjectList'
 
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { useMapStore } from '@/stores/map'
@@ -103,9 +104,7 @@ const dialogFormVisible = ref(false)
 // 人员列表
 let members: any = ref([])
 const getMembers = () => {
-  getProjectList({ organization_id: props.data.organ_id }).then((res: any) => {
-    members.value = res.data.members
-  })
+  members.value = useProjectList(props.data.organ_id)
 }
 // 点击更改负责人按钮弹窗
 const handleMembers = () => {

src/modules/resource/courseware/views/List.vue

 <script setup lang="ts">
-import { getCourseList, getProjectList, getCategoryList } from '../api'
+import { getCourseList } from '../api'
 import CardListItem from '@/components/base/CardListItem.vue'
 import { Expand, Search } from '@element-plus/icons-vue'
 import { useMapStore } from '@/stores/map'
+import { useGetCategoryList } from '@/composables/useGetCategoryList'
+import { useProjectList } from '@/composables/useGetProjectList'
 const store = useMapStore()
 
 const appList = ref()
@@ -16,20 +18,16 @@ const tabChange = () => {
 }
 
 // 筛选项目列表
-let projectList: any = $ref([])
-getProjectList({ organization_id: '' }).then((res: any) => {
-  projectList = res.data.departments
-})
+let { list: projectList } = useProjectList()
+
 // 下拉选择tree 视频分类
-let selectTree = $ref([])
-getCategoryList({ type: 'tree' }).then((res: any) => {
-  selectTree = res.data
-})
+let { list: selectTree } = useGetCategoryList()
 const defaultProps = {
   children: 'children',
   label: 'category_name',
   value: 'id'
 }
+
 const listOptions = $computed(() => {
   return {
     remote: {
@@ -47,7 +45,7 @@ const listOptions = $computed(() => {
         label: '状态',
         options: store.mapList?.filter((item: any) => item.key === 'system_status')[0]?.values
       },
-      { type: 'select', prop: 'authorized', label: '项目', options: projectList, labelKey: 'name', valueKey: 'id' },
+      { type: 'select', prop: 'authorized', label: '项目', options: projectList.value, labelKey: 'name', valueKey: 'id' },
       { prop: 'classification', label: '类别', slots: 'filter-type' },
       { prop: 'search', slots: 'filter-search' }
       // { type: 'input', prop: 'category_id', prefixIcon: 'Search' }

src/modules/resource/courseware/views/Update.vue

 <script setup lang="ts">
-import { createCourse, updateCourse, getCategoryList, getCourseDetails } from '../api'
+import { createCourse, updateCourse, getCourseDetails } from '../api'
 import { ElMessage } from 'element-plus'
 import UploadAuth from '@/components/base/UploadAuth.vue'
 import type { FormInstance, FormRules } from 'element-plus'
+import { useGetCategoryList } from '@/composables/useGetCategoryList'
 // 路由
 const router = useRouter()
 const ruleFormRef = ref<FormInstance>()
@@ -38,16 +39,13 @@ const upload = (res: any) => {
   videoUpload.progress = 0
 }
 
-// 下拉选择tree 课件分类
+// 下拉选择tree 视频分类
+let { list: selectTree } = useGetCategoryList()
 const defaultProps = {
   children: 'children',
   label: 'category_name',
   value: 'id'
 }
-let selectTree = $ref([])
-getCategoryList({ type: 'tree' }).then(res => {
-  selectTree = res.data
-})
 
 const handleConfirm = async (formEl: FormInstance | undefined) => {
   if (!formEl) return

src/modules/resource/lessonplan/api.ts

@@ -12,15 +12,6 @@ export function getLessonList(params?: {
   return httpRequest.get('/api/resource/v1/resource/lesson-plan/list', { params })
 }
 
-// 获取项目列表
-export function getProjectList(params: { organization_id: string }) {
-  return httpRequest.get('/api/resource/v1/util/members', { params })
-}
-// 获取分类列表
-export function getCategoryList(params: { type: string; category_name?: string }) {
-  return httpRequest.get('/api/resource/v1/backend/category/list', { params })
-}
-
 // 创建教案
 export function createLessonPlan(data: { name: string; source: string; classification: string; knowledge_points: string; url: string; type: string; size: string }) {
   return httpRequest.post('/api/resource/v1/resource/lesson-plan/create', data)

src/modules/resource/lessonplan/views/List.vue

 <script setup lang="ts">
-import { getLessonList, getProjectList, getCategoryList } from '../api'
+import { getLessonList } from '../api'
 import CardListItem from '@/components/base/CardListItem.vue'
 import { Expand, Search } from '@element-plus/icons-vue'
 import { useMapStore } from '@/stores/map'
+import { useGetCategoryList } from '@/composables/useGetCategoryList'
+import { useProjectList } from '@/composables/useGetProjectList'
+
 const store = useMapStore()
 const appList = ref()
 
@@ -14,20 +17,15 @@ const tabChange = () => {
   appList.value.refetch()
 }
 // 筛选项目列表
-let projectList: any = $ref([])
-getProjectList({ organization_id: '' }).then((res: any) => {
-  projectList = res.data.departments
-})
+let { list: projectList } = useProjectList()
 // 下拉选择tree 视频分类
-let selectTree = $ref([])
-getCategoryList({ type: 'tree' }).then((res: any) => {
-  selectTree = res.data
-})
+let { list: selectTree } = useGetCategoryList()
 const defaultProps = {
   children: 'children',
   label: 'category_name',
   value: 'id'
 }
+
 const listOptions = $computed(() => {
   return {
     remote: {
@@ -45,7 +43,7 @@ const listOptions =  $computed(() => {
         label: '状态',
         options: store.mapList?.filter((item: any) => item.key === 'system_status')[0]?.values
       },
-      { type: 'select', prop: 'authorized', label: '项目', options: projectList, labelKey: 'name', valueKey: 'id' },
+      { type: 'select', prop: 'authorized', label: '项目', options: projectList.value, labelKey: 'name', valueKey: 'id' },
       { prop: 'classification', label: '类别', slots: 'filter-type' },
       { prop: 'search', slots: 'filter-search' }
       // { type: 'input', prop: 'category_id', prefixIcon: 'Search' }

src/modules/resource/lessonplan/views/Update.vue

 <script setup lang="ts">
-  import AppUpload from '@/components/base/AppUpload.vue'
-  import { getCategoryList } from '@/api/base'
-  import type { FormInstance } from 'element-plus'
-  import { ElMessage } from 'element-plus'
-  import { createLessonPlan } from '../api'
+import AppUpload from '@/components/base/AppUpload.vue'
+import type { FormInstance } from 'element-plus'
+import { ElMessage } from 'element-plus'
+import { createLessonPlan } from '../api'
+import { useGetCategoryList } from '@/composables/useGetCategoryList'
 
-  // 路由
-  const router = useRouter()
+// 路由
+const router = useRouter()
 
-  // 下拉选择tree 视频分类
-  const defaultProps = {
+// 下拉选择tree 视频分类
+let { list: selectTree } = useGetCategoryList()
+const defaultProps = {
   children: 'children',
   label: 'category_name',
   value: 'id'
-  }
-  let selectTree = $ref([])
-  getCategoryList({ type: 'tree' }).then((res: any) => {
-    selectTree = res.data
-  })
+}
 
-  // form表单
-  const form:any = reactive({ file: [], name: '', source: '2', classification: '', knowledge_points: '', url: '', type: '', size: '' })
-  // 表单验证
-  const rules = {
+// form表单
+const form: any = reactive({
+  file: [],
+  name: '',
+  source: '2',
+  classification: '',
+  knowledge_points: '',
+  url: '',
+  type: '',
+  size: ''
+})
+// 表单验证
+const rules = {
   name: [{ required: true, message: '请输入标题', trigger: 'blur' }],
   classification: [{ required: true, message: '请选择分类', trigger: 'change' }],
   file: [{ required: true, message: '' }]
-  }
-  // 新建编辑表单提交
-  const ruleFormRef = ref<FormInstance>()
-  const submitForm = async (formEl: FormInstance | undefined) => {
+}
+// 新建编辑表单提交
+const ruleFormRef = ref<FormInstance>()
+const submitForm = async (formEl: FormInstance | undefined) => {
   if (!formEl) return
   await formEl.validate((valid, fields) => {
     console.log(valid, 'valid', fields)
@@ -58,7 +64,7 @@
         //   }
         // })
       } else {
-          createLessonPlan(params).then((res:any) => {
+        createLessonPlan(params).then((res: any) => {
           if (res.code === 0) {
             ElMessage({ message: '创建成功', type: 'success' })
             setTimeout(() => {
@@ -69,15 +75,14 @@
           }
         })
       }
-        
     } else {
       ElMessage('请完善信息')
       console.log('error submit!', fields)
     }
   })
-  }
-  // 协议
-  const protocol = ref(false)
+}
+// 协议
+const protocol = ref(false)
 </script>
 
 <template>
@@ -94,9 +99,7 @@
           <div class="upload-video">
             <div class="upload-box">
               <AppUpload :limit="1" v-model="form.file"></AppUpload>
-              <div class="upload-btn">
-                本地文件
-              </div>
+              <div class="upload-btn">本地文件</div>
             </div>
           </div>
           <div class="tips">课件支持格式包含：doc docx pdf ppt pptx，大小不超过50M</div>
@@ -106,14 +109,10 @@
         <el-input v-model="form.name" />
       </el-form-item>
       <el-form-item label="教案分类：" prop="classification">
-        <el-tree-select :props="defaultProps" style="width:100%" v-model="form.classification" :data="selectTree" />
+        <el-tree-select :props="defaultProps" style="width: 100%" v-model="form.classification" :data="selectTree" />
       </el-form-item>
       <el-form-item label="&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;知识点：">
-        <el-input
-          v-model="form.knowledge_points"
-          :rows="2"
-          type="textarea"
-        />
+        <el-input v-model="form.knowledge_points" :rows="2" type="textarea" />
       </el-form-item>
     </el-form>
     <div class="protocol-box">
@@ -128,67 +127,67 @@
   </AppCard>
 </template>
 <style lang="scss">
-.upload-box{
+.upload-box {
   position: relative;
-  .app-upload-btn{
+  .app-upload-btn {
     position: relative;
     z-index: 99;
     opacity: 0.0001 !important;
   }
 }
-.tips{
+.tips {
   font-size: 12px;
   line-height: 100%;
   color: #999999;
   margin-top: 8px;
 }
-.tool-btn-box{
+.tool-btn-box {
   display: flex;
   justify-content: right;
-  .btn-item{
+  .btn-item {
     width: 127px;
     line-height: 36px;
-    background: #AA1941;
+    background: #aa1941;
     border-radius: 20px;
     margin-right: 10px;
     font-size: 14px;
-    color: #FFFFFF;
+    color: #ffffff;
     text-align: center;
   }
 }
-.demo-progress{
+.demo-progress {
   width: 350px;
 }
-.video-cover{
+.video-cover {
   display: flex;
-  .img-box{
+  .img-box {
     width: 208px;
     height: 130px;
     border-radius: 4px;
-    background: #F7F7F7;
+    background: #f7f7f7;
     font-size: 20px;
     display: flex;
     align-items: center;
     justify-content: center;
-    img{
+    img {
       width: 100%;
       height: 100%;
       display: block;
     }
   }
-  .video-cover_right{
+  .video-cover_right {
     margin-left: 20px;
-    .list{
-      .item{
+    .list {
+      .item {
         display: flex;
         align-items: center;
         margin-top: 12px;
-        img{
+        img {
           width: 9px;
           display: block;
           margin-right: 5px;
         }
-        .text{
+        .text {
           font-size: 12px;
           color: #999999;
           line-height: 100%;
@@ -197,29 +196,29 @@
     }
   }
 }
-.swiper-box{
+.swiper-box {
   min-width: 660px;
   margin-top: 20px;
   padding: 0 40px;
   position: relative;
-  .arrow{
+  .arrow {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
     font-size: 30px;
-    color: #D5D5D5;
+    color: #d5d5d5;
     cursor: pointer;
-    &.left{
+    &.left {
       left: 0;
     }
-    &.right{
+    &.right {
       right: 10px;
     }
   }
-  .cover-list{
+  .cover-list {
     display: flex;
     flex-wrap: wrap;
-    .cover-list_item{
+    .cover-list_item {
       display: block;
       width: 155px;
       height: 96px;
@@ -229,26 +228,26 @@
     }
   }
 }
-:deep(.el-carousel__indicators--horizontal){
+:deep(.el-carousel__indicators--horizontal) {
   display: none;
 }
-.protocol-box{
+.protocol-box {
   font-size: 14px;
   line-height: 24px;
   padding-left: 90px;
   padding-top: 20px;
   color: #666666;
-  span{
-    color: #AA1941;
+  span {
+    color: #aa1941;
   }
 }
-.btn-box{
+.btn-box {
   display: flex;
   margin-top: 20px;
   margin-left: 90px;
-  .confirm{
+  .confirm {
     width: 94px;
-    background: #AA1941;
+    background: #aa1941;
     border-radius: 20px;
     text-align: center;
     line-height: 36px;
@@ -256,44 +255,44 @@
     margin-right: 26px;
     cursor: pointer;
   }
-  .cancel{
+  .cancel {
     width: 94px;
     line-height: 36px;
-    border: 1px solid #AA1941;
+    border: 1px solid #aa1941;
     border-radius: 20px;
     text-align: center;
-    color: #AA1941;
+    color: #aa1941;
     cursor: pointer;
   }
 }
-.upload-video{
+.upload-video {
   display: flex;
   align-items: center;
-  .upload-btn{
+  .upload-btn {
     position: absolute;
     top: 0;
     left: 0;
     width: 94px;
     line-height: 36px;
     background: rgba(250, 223, 230, 0.39);
-    border: 1px solid #AA1941;
+    border: 1px solid #aa1941;
     border-radius: 20px;
     font-size: 14px;
-    color: #AA1941;
+    color: #aa1941;
     margin-right: 30px;
     text-align: center;
   }
-  .video-info{
+  .video-info {
     display: flex;
-    .name{
+    .name {
       color: #333333;
       font-size: 16px;
       line-height: 100%;
     }
-    .view{
+    .view {
       font-size: 16px;
       line-height: 100%;
-      color: #399EE8;
+      color: #399ee8;
       margin-left: 20px;
       cursor: pointer;
     }

src/modules/resource/other/api.ts

@@ -16,14 +16,6 @@ export function getOtherDetails(params: { id: string }) {
   return httpRequest.get('/api/resource/v1/resource/other-information/view', { params })
 }
 
-// 获取项目列表
-export function getProjectList(params: { organization_id: string }) {
-  return httpRequest.get('/api/resource/v1/util/members', { params })
-}
-// 获取分类列表
-export function getCategoryList(params: { type: string; category_name?: string }) {
-  return httpRequest.get('/api/resource/v1/backend/category/list', { params })
-}
 // 部门共享
 export function setDepartment(data: { id: string }) {
   return httpRequest.post('/api/resource/v1/resource/other-information/set-department', data)

src/modules/resource/other/components/Operation.vue

 <script setup lang="ts">
-import { setDepartment, setPlatform, setStatus, getProjectList, setBelong } from '../api'
+import { setDepartment, setPlatform, setStatus, setBelong } from '../api'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { useMapStore } from '@/stores/map'
+import { useProjectList } from '@/composables/useGetProjectList'
 const store = useMapStore()
 console.log(store)
 
@@ -102,9 +103,7 @@ const dialogFormVisible = ref(false)
 // 人员列表
 let members: any = ref([])
 const getMembers = () => {
-  getProjectList({ organization_id: props.data.organ_id }).then((res: any) => {
-    members.value = res.data.members
-  })
+  members.value = useProjectList(props.data.organ_id)
 }
 // 点击更改负责人按钮弹窗
 const handleMembers = () => {

src/modules/resource/other/views/List.vue

 <script setup lang="ts">
-import { getOtherList, getProjectList, getCategoryList } from '../api'
+import { getOtherList } from '../api'
 import CardListItem from '@/components/base/CardListItem.vue'
 import { Expand, Search } from '@element-plus/icons-vue'
 import { useMapStore } from '@/stores/map'
+import { useProjectList } from '@/composables/useGetProjectList'
+// 下拉选择tree 视频分类
+import { useGetCategoryList } from '@/composables/useGetCategoryList'
 const store = useMapStore()
 
 const appList = ref()
@@ -16,20 +19,16 @@ const tabChange = () => {
 }
 
 // 筛选项目列表
-let projectList: any = $ref([])
-getProjectList({ organization_id: '' }).then((res: any) => {
-  projectList = res.data.departments
-})
+let { list: projectList } = useProjectList()
+
 // 下拉选择tree 视频分类
-let selectTree = $ref([])
-getCategoryList({ type: 'tree' }).then((res: any) => {
-  selectTree = res.data
-})
+let { list: selectTree } = useGetCategoryList()
 const defaultProps = {
   children: 'children',
   label: 'category_name',
   value: 'id'
 }
+
 const listOptions = $computed(() => {
   return {
     remote: {
@@ -47,7 +46,7 @@ const listOptions = $computed(() => {
         label: '状态',
         options: store.mapList?.filter((item: any) => item.key === 'system_status')[0]?.values
       },
-      { type: 'select', prop: 'authorized', label: '项目', options: projectList, labelKey: 'name', valueKey: 'id' },
+      { type: 'select', prop: 'authorized', label: '项目', options: projectList.value, labelKey: 'name', valueKey: 'id' },
       { prop: 'classification', label: '类别', slots: 'filter-type' },
       { prop: 'search', slots: 'filter-search' }
       // { type: 'input', prop: 'category_id', prefixIcon: 'Search' }

src/modules/resource/video/api.ts

@@ -20,11 +20,6 @@ export function getVideoDetails(params: { id: string }) {
   return httpRequest.get('/api/resource/v1/resource/video/view', { params })
 }
 
-// 获取项目列表
-export function getProjectList(params: { organization_id: string }) {
-  return httpRequest.get('/api/resource/v1/util/members', { params })
-}
-
 // 更新视频
 export function updateVideo(data: { id: string; name: string; classification: string; knowledge_points?: string; cover?: string }) {
   return httpRequest.post('/api/resource/v1/resource/video/update', data)

src/modules/resource/video/components/Operation.vue

 <script setup lang="ts">
-import { setDepartment, setPlatform, setStatus, getProjectList, setBelong } from '../api'
+import { setDepartment, setPlatform, setStatus, setBelong } from '../api'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { useMapStore } from '@/stores/map'
-const store= useMapStore()
+import { useProjectList } from '@/composables/useGetProjectList'
+
+const store = useMapStore()
 console.log(store)
 
 const router = useRouter()
@@ -16,17 +18,21 @@ console.log(path, 'path')
 const id = router.currentRoute.value.query.id as string
 // 设置部门共享
 const handleDepartment = () => {
-  ElMessageBox.confirm(`
+  ElMessageBox.confirm(
+    `
     ${
       props.data.status == 0
         ? `该操作将会使本视频资源在您所在的部门“${props.data.organ_id_name}”内部共享，管理者不变，其余人员只能共享使用该资源，确认部门共享吗？`
         : `该操作将会取消本视频资源在您所在的部门“${props.data.organ_id_name}”内部共享，部门其余人员将不能再看到该共享资源，确认取消部门共享吗？`
     }
-  `, '提示', {
+  `,
+    '提示',
+    {
       confirmButtonText: '确认',
       cancelButtonText: '取消',
-    type: 'warning',
-  }).then(() => {
+      type: 'warning'
+    }
+  ).then(() => {
     setDepartment({ id: id }).then((res: any) => {
       if (res.code === 0) {
         ElMessage({ message: '更改成功', type: 'success' })
@@ -40,17 +46,21 @@ const handleDepartment = () => {
 
 // 设置平台共享
 const handlePlatform = () => {
-  ElMessageBox.confirm(`
+  ElMessageBox.confirm(
+    `
     ${
       props.data.platform_public == 0
         ? '该操作将会使本视频资源在e-SaaS平台中公开共享供所有老师使用，资源的管理者不变，其余人员只能共享使用该资源，确认公开该资源吗？'
         : '该操作将会取消本视频资源在e-SaaS平台中公开共享，平台所有人员将不能再看到该共享资源，确认取消平台共享吗？'
     }
-  `, '提示', {
+  `,
+    '提示',
+    {
       confirmButtonText: '确认',
       cancelButtonText: '取消',
-    type: 'warning',
-  }).then(() => {
+      type: 'warning'
+    }
+  ).then(() => {
     setPlatform({ id: id }).then((res: any) => {
       if (res.code === 0) {
         ElMessage({ message: '更改成功', type: 'success' })
@@ -64,17 +74,17 @@ const handlePlatform = () => {
 
 // 上下线设置
 const handleStatus = () => {
-  ElMessageBox.confirm(`
-    ${
-      props.data.status == 0
-        ? '已下线的资源将不能被关联到课程使用，确认下线该资源吗？'
-        : '确认再次上线该资源吗？'
-    }
-  `, '提示', {
+  ElMessageBox.confirm(
+    `
+    ${props.data.status == 0 ? '已下线的资源将不能被关联到课程使用，确认下线该资源吗？' : '确认再次上线该资源吗？'}
+  `,
+    '提示',
+    {
       confirmButtonText: '确认',
       cancelButtonText: '取消',
-    type: 'warning',
-  }).then(() => {
+      type: 'warning'
+    }
+  ).then(() => {
     setStatus({ id: id }).then((res: any) => {
       if (res.code === 0) {
         ElMessage({ message: '更改成功', type: 'success' })
@@ -91,13 +101,13 @@ const form = reactive({
   members: ''
 })
 const dialogFormVisible = ref(false)
+
 // 人员列表
-let members:any = ref([])
+let members: any = ref([])
 const getMembers = () => {
-  getProjectList({ organization_id: props.data.organ_id }).then((res: any) => {
-    members.value = res.data.members
-  })
+  members.value = useProjectList(props.data.organ_id)
 }
+
 // 点击更改负责人按钮弹窗
 const handleMembers = () => {
   getMembers()
@@ -117,7 +127,7 @@ const handlesetBelong = () => {
 </script>
 
 <template>
-  <div class="tool-btn-box" v-if="$route.query.id" style="margin-bottom: 20px;">
+  <div class="tool-btn-box" v-if="$route.query.id" style="margin-bottom: 20px">
     <template v-if="path === '/resource/video/view'">
       <router-link :to="`/resource/video/update?id=${id}`">
         <div class="btn-item">编辑视频信息</div>
@@ -126,59 +136,65 @@ const handlesetBelong = () => {
         <div class="btn-item">编辑视频课件</div>
       </router-link>
     </template>
-    <div class="btn-item" @click="handleDepartment">{{ props.data.department_public == 0 ? '部门共享' : '取消部门共享' }}</div>
-    <div class="btn-item" @click="handlePlatform">{{ props.data.platform_public == 0 ? '平台共享' : '取消平台共享' }}</div>
+    <div class="btn-item" @click="handleDepartment">
+      {{ props.data.department_public == 0 ? '部门共享' : '取消部门共享' }}
+    </div>
+    <div class="btn-item" @click="handlePlatform">
+      {{ props.data.platform_public == 0 ? '平台共享' : '取消平台共享' }}
+    </div>
     <div class="btn-item" @click="handleStatus">{{ props.data.status == 0 ? '资源上线' : '资源下线' }}</div>
     <div 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">
+        <div style="width: 500px">
           <el-row>
-            <el-col :span="12"><div class="grid-content ep-bg-purple" />
+            <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" />
+            <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" />
+            <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" />
+            <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" :label="item.name" :value="item.id" :key="item.id"/>
+        <el-select style="width: 500px; margin-top: 20px" v-model="form.members" placeholder="请选择新的资源负责人">
+          <el-option v-for="item in members" :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
-        >
+        <el-button type="primary" @click="handlesetBelong">确认</el-button>
       </span>
     </template>
   </el-dialog>
 </template>
 <style lang="scss" scoped>
-.tool-btn-box{
+.tool-btn-box {
   display: flex;
   justify-content: right;
-  .btn-item{
+  .btn-item {
     width: 127px;
     line-height: 36px;
-    background: #AA1941;
+    background: #aa1941;
     border-radius: 20px;
     margin-right: 10px;
     font-size: 14px;
-    color: #FFFFFF;
+    color: #ffffff;
     text-align: center;
     cursor: pointer;
   }

src/modules/resource/video/views/List.vue

 <script setup lang="ts">
-import { getVideoList, getProjectList } from '../api'
-// import { getCategoryList } from '@/api/base'
+import { getVideoList } from '../api'
 import CardListItem from '../components/CardListItem.vue'
 import { Expand, Search } from '@element-plus/icons-vue'
-import { useCategory } from '@/composables/useCategory'
+import { useGetCategoryList } from '@/composables/useGetCategoryList'
+import { useProjectList } from '@/composables/useGetProjectList'
 
 // 筛选项目列表
-let projectList: any = $ref([])
-getProjectList({ organization_id: '' }).then(res => {
-  projectList = res.data.departments
-})
+let { list: projectList } = useProjectList()
 
 // 资源出处 tab触发
 const tabValue = ref('1')
@@ -42,7 +39,14 @@ const listOptions = $computed(() => {
           { label: '失效', value: '0' }
         ]
       },
-      { type: 'select', prop: 'authorized', label: '项目', options: projectList, labelKey: 'name', valueKey: 'id' },
+      {
+        type: 'select',
+        prop: 'authorized',
+        label: '项目',
+        options: projectList.value,
+        labelKey: 'name',
+        valueKey: 'id'
+      },
       { prop: 'classification', label: '类别', slots: 'filter-type' },
       { prop: 'title', slots: 'filter-search' }
     ],
@@ -62,11 +66,7 @@ const listOptions = $computed(() => {
 })
 
 // 下拉选择tree 视频分类
-let { list: selectTree } = useCategory()
-console.log(selectTree)
-// getCategoryList({ type: 'tree' }).then((res: any) => {
-//   selectTree = res.data
-// })
+let { list: selectTree } = useGetCategoryList()
 const defaultProps = {
   children: 'children',
   label: 'category_name',