|
|
@@ -1,196 +1,232 @@
|
|
|
<template>
|
|
|
- <ContentWrap>
|
|
|
- <!-- 搜索工作栏 -->
|
|
|
- <el-form
|
|
|
- class="-mb-15px"
|
|
|
- :model="queryParams"
|
|
|
- ref="queryFormRef"
|
|
|
- :inline="true"
|
|
|
- label-width="90px"
|
|
|
- >
|
|
|
- <el-form-item label="大纲课程" prop="bcType">
|
|
|
- <el-tree-select
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <!-- 左侧课程类型树 -->
|
|
|
+ <el-col :span="5" :xs="24">
|
|
|
+ <ContentWrap class="h-1/1 custom-scrollbar" style="overflow-x: auto; overflow-y: auto; height: calc(100vh - 100px);">
|
|
|
+ <!-- 课程类型切换 -->
|
|
|
+ <div class="mb-20px">
|
|
|
+ <el-form-item label="课程类型" class="!mb-0">
|
|
|
+ <el-select
|
|
|
+ v-model="queryParams.ctTypeNode"
|
|
|
+ placeholder="请选择课程类型"
|
|
|
+ class="!w-full"
|
|
|
+ @change="handleCtTypeNodeChange"
|
|
|
+ >
|
|
|
+ <el-option label="ai通识课" value="1" />
|
|
|
+ <el-option label="ai实操课" value="2" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 搜索条件框 -->
|
|
|
+ <div class="mb-20px">
|
|
|
+ <el-input
|
|
|
+ v-model="treeSearchValue"
|
|
|
+ placeholder="搜索课程类型"
|
|
|
+ prefix-icon="ep:search"
|
|
|
+ clearable
|
|
|
+ @input="handleTreeSearch"
|
|
|
+ class="!w-full"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 课程类型树形选择器 -->
|
|
|
+ <el-tree
|
|
|
v-model="queryParams.bcType"
|
|
|
- :data="bcTypeTree"
|
|
|
- :props="{...defaultProps,
|
|
|
- label: (node) => `${node.ctTypeNode === undefined ? node.ctType : node.ctTypeSort + '、' + node.ctType}`,
|
|
|
- }"
|
|
|
- placeholder="请选择课程类型"
|
|
|
+ :data="filteredCourseTypeTree"
|
|
|
+ :props="{
|
|
|
+ label: (node) => `${node.ctTypeNode === '0' || node.ctTypeNode === undefined ? node.ctType : node.ctTypeSort + '、' + node.ctType}`,
|
|
|
+ children: 'children',
|
|
|
+ value: 'id'
|
|
|
+ }"
|
|
|
:default-expand-all="true"
|
|
|
- class="!w-240px"
|
|
|
- @change="handleQuery"
|
|
|
+ node-key="id"
|
|
|
+ highlight-current
|
|
|
+ @node-click="handleCourseTypeClick"
|
|
|
/>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="内容类型" prop="bcContentType">
|
|
|
- <el-select
|
|
|
- v-model="queryParams.bcContentType"
|
|
|
- placeholder="请选择内容类型"
|
|
|
- clearable
|
|
|
- class="!w-240px"
|
|
|
- @change="handleQuery"
|
|
|
+ </ContentWrap>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="19" :xs="24">
|
|
|
+ <!-- 搜索工作栏 -->
|
|
|
+ <ContentWrap>
|
|
|
+ <el-form
|
|
|
+ class="-mb-15px"
|
|
|
+ :model="queryParams"
|
|
|
+ ref="queryFormRef"
|
|
|
+ :inline="true"
|
|
|
+ label-width="90px"
|
|
|
>
|
|
|
- <el-option
|
|
|
- v-for="dict in getStrDictOptions(DICT_TYPE.BLOCKLY_COURSE_COUTNET_TYPE)"
|
|
|
- :key="dict.value"
|
|
|
- :label="dict.label"
|
|
|
- :value="dict.value"
|
|
|
- />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="课程名称" prop="bcName">
|
|
|
- <el-input
|
|
|
- v-model="queryParams.bcName"
|
|
|
- placeholder="请输入课程名称"
|
|
|
- clearable
|
|
|
- @keyup.enter="handleQuery"
|
|
|
- class="!w-240px"
|
|
|
+ <el-form-item label="内容类型" prop="bcContentType">
|
|
|
+ <el-select
|
|
|
+ v-model="queryParams.bcContentType"
|
|
|
+ placeholder="请选择内容类型"
|
|
|
+ clearable
|
|
|
+ class="!w-240px"
|
|
|
+ @change="handleQuery"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="dict in getStrDictOptions(DICT_TYPE.BLOCKLY_COURSE_COUTNET_TYPE)"
|
|
|
+ :key="dict.value"
|
|
|
+ :label="dict.label"
|
|
|
+ :value="dict.value"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="课程名称" prop="bcName">
|
|
|
+ <el-input
|
|
|
+ v-model="queryParams.bcName"
|
|
|
+ placeholder="请输入课程名称"
|
|
|
+ clearable
|
|
|
+ @keyup.enter="handleQuery"
|
|
|
+ class="!w-240px"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="是否有检查" prop="bcIsInspect">
|
|
|
+ <el-select
|
|
|
+ v-model="queryParams.bcIsInspect"
|
|
|
+ placeholder="请选择是否有检查"
|
|
|
+ clearable
|
|
|
+ class="!w-240px"
|
|
|
+ @change="handleQuery"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="dict in getStrDictOptions(DICT_TYPE.INFRA_BOOLEAN_STRING)"
|
|
|
+ :key="dict.value"
|
|
|
+ :label="dict.label"
|
|
|
+ :value="dict.value"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="课程标签" prop="bcLabel">
|
|
|
+ <el-select
|
|
|
+ v-model="queryParams.bcLabel"
|
|
|
+ placeholder="请选择课程标签"
|
|
|
+ clearable
|
|
|
+ class="!w-240px"
|
|
|
+ @change="handleQuery"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="dict in getStrDictOptions(DICT_TYPE.BLOCKLY_COURSE_LABEL)"
|
|
|
+ :key="dict.value"
|
|
|
+ :label="dict.label"
|
|
|
+ :value="dict.value"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="课程状态" prop="bcStatus">
|
|
|
+ <el-select
|
|
|
+ v-model="queryParams.bcStatus"
|
|
|
+ placeholder="请选择课程状态"
|
|
|
+ clearable
|
|
|
+ class="!w-240px"
|
|
|
+ @change="handleQuery"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="dict in getStrDictOptions(DICT_TYPE.COMMON_STATUS)"
|
|
|
+ :key="dict.value"
|
|
|
+ :label="dict.label"
|
|
|
+ :value="dict.value"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
|
|
|
+ <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ plain
|
|
|
+ @click="openForm('create')"
|
|
|
+ v-hasPermi="['blockly:blockly:create']"
|
|
|
+ >
|
|
|
+ <Icon icon="ep:plus" class="mr-5px" /> 新增
|
|
|
+ </el-button>
|
|
|
+ <el-button
|
|
|
+ type="success"
|
|
|
+ plain
|
|
|
+ @click="handleExport"
|
|
|
+ :loading="exportLoading"
|
|
|
+ v-hasPermi="['blockly:blockly:export']"
|
|
|
+ >
|
|
|
+ <Icon icon="ep:download" class="mr-5px" /> 导出
|
|
|
+ </el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </ContentWrap>
|
|
|
+
|
|
|
+ <!-- 列表 -->
|
|
|
+ <ContentWrap>
|
|
|
+ <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
|
|
|
+ <el-table-column label="课程类型" align="center" prop="bcTypeName" />
|
|
|
+ <el-table-column label="课程名称" align="center" prop="bcName" />
|
|
|
+ <el-table-column label="内容类型" align="center" prop="bcContentType" >
|
|
|
+ <template #default="scope">
|
|
|
+ <dict-tag :type="DICT_TYPE.BLOCKLY_COURSE_COUTNET_TYPE" :value="scope.row.bcContentType" />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="课程内容" align="center" prop="bcContent" width="120px">
|
|
|
+ 【预览查看】
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="是否有检查" align="center" prop="bcIsInspect">
|
|
|
+ <template #default="scope">
|
|
|
+ <dict-tag :type="DICT_TYPE.INFRA_BOOLEAN_STRING" :value="scope.row.bcIsInspect" />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="课程标签" align="center" prop="bcLabel">
|
|
|
+ <template #default="scope">
|
|
|
+ <dict-tag :type="DICT_TYPE.BLOCKLY_COURSE_LABEL" :value="scope.row.bcLabel" />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="课程排序" align="center" prop="bcOrder"/>
|
|
|
+ <el-table-column label="课程状态" align="center" prop="bcStatus">
|
|
|
+ <template #default="scope">
|
|
|
+ <dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.bcStatus" />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" align="center" min-width="180px">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-button
|
|
|
+ link
|
|
|
+ type="primary"
|
|
|
+ v-if="scope.row.tenantId == getTenantId()"
|
|
|
+ @click="openForm('update', scope.row.id)"
|
|
|
+ v-hasPermi="['blockly:blockly:update']"
|
|
|
+ >
|
|
|
+ 编辑
|
|
|
+ </el-button>
|
|
|
+ <el-button
|
|
|
+ link
|
|
|
+ type="success"
|
|
|
+ :disabled="scope.row.bcContentType !== 'video'"
|
|
|
+ title="仅视频课程可配置"
|
|
|
+ @click="handleConfig(scope.row.id,scope.row.bcName,scope.row.tenantId)"
|
|
|
+ >
|
|
|
+ 配置
|
|
|
+ </el-button>
|
|
|
+ <el-button
|
|
|
+ link
|
|
|
+ type="danger"
|
|
|
+ v-if="scope.row.tenantId == getTenantId()"
|
|
|
+ @click="handleDelete(scope.row.id)"
|
|
|
+ v-hasPermi="['blockly:blockly:delete']"
|
|
|
+ >
|
|
|
+ 删除
|
|
|
+ </el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <!-- 分页 -->
|
|
|
+ <Pagination
|
|
|
+ :total="total"
|
|
|
+ v-model:page="queryParams.pageNo"
|
|
|
+ v-model:limit="queryParams.pageSize"
|
|
|
+ @pagination="getList"
|
|
|
/>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="是否有检查" prop="bcIsInspect">
|
|
|
- <el-select
|
|
|
- v-model="queryParams.bcIsInspect"
|
|
|
- placeholder="请选择是否有检查"
|
|
|
- clearable
|
|
|
- class="!w-240px"
|
|
|
- @change="handleQuery"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="dict in getStrDictOptions(DICT_TYPE.INFRA_BOOLEAN_STRING)"
|
|
|
- :key="dict.value"
|
|
|
- :label="dict.label"
|
|
|
- :value="dict.value"
|
|
|
- />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="课程标签" prop="bcLabel">
|
|
|
- <el-select
|
|
|
- v-model="queryParams.bcLabel"
|
|
|
- placeholder="请选择课程标签"
|
|
|
- clearable
|
|
|
- class="!w-240px"
|
|
|
- @change="handleQuery"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="dict in getStrDictOptions(DICT_TYPE.BLOCKLY_COURSE_LABEL)"
|
|
|
- :key="dict.value"
|
|
|
- :label="dict.label"
|
|
|
- :value="dict.value"
|
|
|
- />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="课程状态" prop="bcStatus">
|
|
|
- <el-select
|
|
|
- v-model="queryParams.bcStatus"
|
|
|
- placeholder="请选择课程状态"
|
|
|
- clearable
|
|
|
- class="!w-240px"
|
|
|
- @change="handleQuery"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="dict in getStrDictOptions(DICT_TYPE.COMMON_STATUS)"
|
|
|
- :key="dict.value"
|
|
|
- :label="dict.label"
|
|
|
- :value="dict.value"
|
|
|
- />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item>
|
|
|
- <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
|
|
|
- <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
|
|
|
- <el-button
|
|
|
- type="primary"
|
|
|
- plain
|
|
|
- @click="openForm('create')"
|
|
|
- v-hasPermi="['blockly:blockly:create']"
|
|
|
- >
|
|
|
- <Icon icon="ep:plus" class="mr-5px" /> 新增
|
|
|
- </el-button>
|
|
|
- <el-button
|
|
|
- type="success"
|
|
|
- plain
|
|
|
- @click="handleExport"
|
|
|
- :loading="exportLoading"
|
|
|
- v-hasPermi="['blockly:blockly:export']"
|
|
|
- >
|
|
|
- <Icon icon="ep:download" class="mr-5px" /> 导出
|
|
|
- </el-button>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- </ContentWrap>
|
|
|
-
|
|
|
- <!-- 列表 -->
|
|
|
- <ContentWrap>
|
|
|
- <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
|
|
|
- <el-table-column label="课程类型" align="center" prop="bcTypeName" />
|
|
|
- <el-table-column label="课程名称" align="center" prop="bcName" />
|
|
|
- <el-table-column label="内容类型" align="center" prop="bcContentType" >
|
|
|
- <template #default="scope">
|
|
|
- <dict-tag :type="DICT_TYPE.BLOCKLY_COURSE_COUTNET_TYPE" :value="scope.row.bcContentType" />
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="课程内容" align="center" prop="bcContent" width="120px">
|
|
|
- 【预览查看】
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="是否有检查" align="center" prop="bcIsInspect">
|
|
|
- <template #default="scope">
|
|
|
- <dict-tag :type="DICT_TYPE.INFRA_BOOLEAN_STRING" :value="scope.row.bcIsInspect" />
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="课程标签" align="center" prop="bcLabel">
|
|
|
- <template #default="scope">
|
|
|
- <dict-tag :type="DICT_TYPE.BLOCKLY_COURSE_LABEL" :value="scope.row.bcLabel" />
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="课程排序" align="center" prop="bcOrder"/>
|
|
|
- <el-table-column label="课程状态" align="center" prop="bcStatus">
|
|
|
- <template #default="scope">
|
|
|
- <dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.bcStatus" />
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="操作" align="center" min-width="180px"> <!-- 调整列宽适配新按钮 -->
|
|
|
- <template #default="scope">
|
|
|
- <el-button
|
|
|
- link
|
|
|
- type="primary"
|
|
|
- v-if="scope.row.tenantId == getTenantId()"
|
|
|
- @click="openForm('update', scope.row.id)"
|
|
|
- v-hasPermi="['blockly:blockly:update']"
|
|
|
- >
|
|
|
- 编辑
|
|
|
- </el-button>
|
|
|
- <el-button
|
|
|
- link
|
|
|
- type="success"
|
|
|
- :disabled="scope.row.bcContentType !== 'video'"
|
|
|
- title="仅视频课程可配置"
|
|
|
- @click="handleConfig(scope.row.id,scope.row.bcName,scope.row.tenantId)"
|
|
|
- >
|
|
|
- 配置
|
|
|
- </el-button>
|
|
|
- <el-button
|
|
|
- link
|
|
|
- type="danger"
|
|
|
- v-if="scope.row.tenantId == getTenantId()"
|
|
|
- @click="handleDelete(scope.row.id)"
|
|
|
- v-hasPermi="['blockly:blockly:delete']"
|
|
|
- >
|
|
|
- 删除
|
|
|
- </el-button>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- <!-- 分页 -->
|
|
|
- <Pagination
|
|
|
- :total="total"
|
|
|
- v-model:page="queryParams.pageNo"
|
|
|
- v-model:limit="queryParams.pageSize"
|
|
|
- @pagination="getList"
|
|
|
- />
|
|
|
- </ContentWrap>
|
|
|
+ </ContentWrap>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
|
|
|
<!-- 表单弹窗:添加/修改 -->
|
|
|
<BlocklyForm ref="formRef" @success="getList" />
|
|
|
-
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
@@ -199,10 +235,9 @@ import download from '@/utils/download'
|
|
|
import { BlocklyApi, BlocklyVO } from '@/api/blockly/blockly'
|
|
|
import BlocklyForm from './BlocklyForm.vue'
|
|
|
import { useRouter } from 'vue-router'
|
|
|
-import { defaultProps, handleTree } from '@/utils/tree'
|
|
|
+import { handleTree } from '@/utils/tree'
|
|
|
import { BlocklyTypeApi } from '@/api/blockly/blocklyType'
|
|
|
import { getTenantId } from '@/utils/auth'
|
|
|
-import { ElButton } from 'element-plus'
|
|
|
|
|
|
/** 课程 列表 */
|
|
|
defineOptions({ name: 'Blockly' })
|
|
|
@@ -213,6 +248,7 @@ const { t } = useI18n() // 国际化
|
|
|
const loading = ref(true) // 列表的加载中
|
|
|
const list = ref<BlocklyVO[]>([]) // 列表的数据
|
|
|
const total = ref(0) // 列表的总页数
|
|
|
+const treeSearchValue = ref('') // 树形搜索值
|
|
|
const queryParams = reactive({
|
|
|
pageNo: 1,
|
|
|
pageSize: 10,
|
|
|
@@ -229,6 +265,7 @@ const queryParams = reactive({
|
|
|
blocklyWalkablePoints: undefined,
|
|
|
|
|
|
bcIsInspect: undefined,
|
|
|
+ ctTypeNode: "1",//课程类型
|
|
|
bcType: undefined,
|
|
|
bcTypeName: undefined,
|
|
|
bcLabel: undefined,
|
|
|
@@ -237,7 +274,37 @@ const queryParams = reactive({
|
|
|
})
|
|
|
const queryFormRef = ref() // 搜索的表单
|
|
|
const exportLoading = ref(false) // 导出的加载中
|
|
|
-const bcTypeTree = ref() // 树形结构
|
|
|
+const bcTypeTree = ref() // 原始树形结构
|
|
|
+const filteredCourseTypeTree = computed(() => {
|
|
|
+ if (!treeSearchValue.value) {
|
|
|
+ return bcTypeTree.value
|
|
|
+ }
|
|
|
+
|
|
|
+ const filterTree = (tree, searchText) => {
|
|
|
+ return tree.map(node => {
|
|
|
+ const newNode = { ...node }
|
|
|
+ // 检查节点是否匹配搜索文本
|
|
|
+ const isMatch = newNode.ctType && newNode.ctType.toLowerCase().includes(searchText.toLowerCase())
|
|
|
+
|
|
|
+ // 如果有子节点,递归过滤
|
|
|
+ if (newNode.children && newNode.children.length > 0) {
|
|
|
+ const filteredChildren = filterTree(newNode.children, searchText)
|
|
|
+ if (filteredChildren.length > 0 || isMatch) {
|
|
|
+ newNode.children = filteredChildren
|
|
|
+ return newNode
|
|
|
+ }
|
|
|
+ } else if (isMatch) {
|
|
|
+ // 没有子节点但节点本身匹配
|
|
|
+ return newNode
|
|
|
+ }
|
|
|
+
|
|
|
+ // 如果既没有匹配的子节点也不匹配自身,则返回null
|
|
|
+ return null
|
|
|
+ }).filter(node => node !== null) // 过滤掉null值
|
|
|
+ }
|
|
|
+
|
|
|
+ return filterTree([...bcTypeTree.value], treeSearchValue.value)
|
|
|
+})
|
|
|
|
|
|
/** 查询列表 */
|
|
|
const getList = async () => {
|
|
|
@@ -257,11 +324,35 @@ const handleQuery = async () => {
|
|
|
getList()
|
|
|
}
|
|
|
|
|
|
+/** 处理课程类型节点变更 */
|
|
|
+const handleCtTypeNodeChange = (ctTypeNode) => {
|
|
|
+ queryParams.bcType = undefined
|
|
|
+ getbcTypeTree(ctTypeNode).then(() => {
|
|
|
+ // 选择课程类型后自动搜索
|
|
|
+ handleQuery()
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+/** 处理课程类型节点点击 */
|
|
|
+const handleCourseTypeClick = (data) => {
|
|
|
+ queryParams.bcType = data.id
|
|
|
+ handleQuery()
|
|
|
+}
|
|
|
+
|
|
|
+/** 处理树搜索 */
|
|
|
+const handleTreeSearch = () => {
|
|
|
+ // 搜索时不需要自动查询列表,只过滤树节点
|
|
|
+}
|
|
|
+
|
|
|
/** 重置按钮操作 */
|
|
|
const resetQuery = () => {
|
|
|
queryFormRef.value.resetFields()
|
|
|
- getbcTypeTree()
|
|
|
- handleQuery()
|
|
|
+ queryParams.ctTypeNode = "1"
|
|
|
+ queryParams.bcType = undefined
|
|
|
+ treeSearchValue.value = ''
|
|
|
+ getbcTypeTree().then(() => {
|
|
|
+ handleQuery()
|
|
|
+ })
|
|
|
}
|
|
|
|
|
|
/** 添加/修改操作 */
|
|
|
@@ -285,14 +376,13 @@ const handleDelete = async (id: number) => {
|
|
|
|
|
|
/** 配置按钮操作 */
|
|
|
const router = useRouter()
|
|
|
-const handleConfig = (id: number,bcName: string,tenantId: number) => {
|
|
|
+const handleConfig = (id: number, bcName: string, tenantId: number) => {
|
|
|
router.push({
|
|
|
path: '/blockly/blockly-config',
|
|
|
- query: { bcId: id , bcName: bcName, tenantId: tenantId}
|
|
|
+ query: { bcId: id, bcName: bcName, tenantId: tenantId }
|
|
|
})
|
|
|
}
|
|
|
|
|
|
-
|
|
|
/** 导出按钮操作 */
|
|
|
const handleExport = async () => {
|
|
|
try {
|
|
|
@@ -309,13 +399,17 @@ const handleExport = async () => {
|
|
|
}
|
|
|
|
|
|
/** 获得课程-类型树 */
|
|
|
-const getbcTypeTree = async () => {
|
|
|
+const getbcTypeTree = async (filterCtTypeNode = "1") => {
|
|
|
bcTypeTree.value = []
|
|
|
const data = await BlocklyTypeApi.getBlocklyTypeSimpleList()
|
|
|
|
|
|
- const root: Tree = { id: 0, ctType: '课程类型', children: [] }
|
|
|
- root.children = handleTree(data, 'id', 'ctParentId')
|
|
|
- bcTypeTree.value.push(root)
|
|
|
+ let filteredData = data
|
|
|
+ if (filterCtTypeNode !== undefined) {
|
|
|
+ filteredData = data.filter(item => item.ctTypeNode === '0' || item.ctTypeNode === filterCtTypeNode)
|
|
|
+ }
|
|
|
+ const root = { id: 0, ctType: '课程类型' + (filterCtTypeNode === "1" ? '(ai通识课)' : '(ai实操课)'), children: [] }
|
|
|
+ root.children = handleTree(filteredData, 'id', 'ctParentId')
|
|
|
+ bcTypeTree.value = [root]
|
|
|
}
|
|
|
|
|
|
/** 初始化 **/
|
|
|
@@ -324,3 +418,32 @@ onMounted(() => {
|
|
|
getbcTypeTree()
|
|
|
})
|
|
|
</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+/* 优化滚动条样式 */
|
|
|
+:deep(.custom-scrollbar) {
|
|
|
+ scrollbar-width: thin;
|
|
|
+ scrollbar-color: #c0c4cc #f0f2f5;
|
|
|
+}
|
|
|
+
|
|
|
+/* 兼容WebKit浏览器(Chrome、Safari等) */
|
|
|
+:deep(.custom-scrollbar::-webkit-scrollbar) {
|
|
|
+ width: 3px;
|
|
|
+ height: 3px;
|
|
|
+}
|
|
|
+
|
|
|
+:deep(.custom-scrollbar::-webkit-scrollbar-track) {
|
|
|
+ background: #f0f2f5;
|
|
|
+ border-radius: 3px;
|
|
|
+}
|
|
|
+
|
|
|
+:deep(.custom-scrollbar::-webkit-scrollbar-thumb) {
|
|
|
+ background: #c0c4cc;
|
|
|
+ border-radius: 3px;
|
|
|
+ transition: background 0.3s;
|
|
|
+}
|
|
|
+
|
|
|
+:deep(.custom-scrollbar::-webkit-scrollbar-thumb:hover) {
|
|
|
+ background: #909399;
|
|
|
+}
|
|
|
+</style>
|