公共筛选提取修改

.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

@@ -52,4 +52,9 @@ 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,21 +17,16 @@ 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(() => {
+
+const listOptions = $computed(() => {
   return {
     remote: {
       httpRequest: getLessonList,
@@ -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/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,41 +18,49 @@ 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(() => {
-      setDepartment({ id: id }).then((res: any) => {
-        if (res.code === 0) {
-          ElMessage({ message: '更改成功', type: 'success' })
-          setTimeout(() => {
-            router.go(0)
-          }, 500)
-        }
-      })
+  `,
+    '提示',
+    {
+      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(`
+  ElMessageBox.confirm(
+    `
     ${
       props.data.platform_public == 0
         ? '该操作将会使本视频资源在e-SaaS平台中公开共享供所有老师使用，资源的管理者不变，其余人员只能共享使用该资源，确认公开该资源吗？'
         : '该操作将会取消本视频资源在e-SaaS平台中公开共享，平台所有人员将不能再看到该共享资源，确认取消平台共享吗？'
     }
-  `, '提示', {
-    confirmButtonText: '确认',
-    cancelButtonText: '取消',
-    type: 'warning',
-  }).then(() => {
+  `,
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      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'
     }
-  `, '提示', {
-    confirmButtonText: '确认',
-    cancelButtonText: '取消',
-    type: 'warning',
-  }).then(() => {
+  ).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',