mozhe
/
school_file_web
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

目录修改为树形结构加表格

This commit is contained in:
jiangzhe 2024-05-29 17:09:44 +08:00
parent 61cd232c40
commit c90dfc56cf
4 changed files with 226 additions and 92 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/api/resource/catalogResource/index.ts
View File

@ -16,6 +16,15 @@ export const listCatalogResource = (query?: CatalogResourceQuery): AxiosPromise<
});
};
export const pageCatalogResource = (query?: CatalogResourceQuery): AxiosPromise<CatalogResourceVO[]> => {
return request({
url: '/catalog/resource/pageList',
method: 'get',
params: query
});
};
/**
* 查询目录-专题资源详细
* @param catalogId

8
src/api/resource/catalogTextbook/index.ts
View File

@ -16,6 +16,14 @@ export const listCatalogTextbook = (query?: CatalogTextbookQuery): AxiosPromise<
});
};
export const pageCatalogTextbook = (query?: CatalogTextbookQuery): AxiosPromise<CatalogTextbookVO[]> => {
return request({
url: '/catalog/textbook/pageList',
method: 'get',
params: query
});
};
/**
* 查询目录-同步教材详细
* @param catalogId

144
src/views/resource/catalogResource/index.vue
View File

@ -17,40 +17,68 @@
</div>
</transition>
<el-card shadow="never">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="Plus" @click="handleAdd()"
v-hasPermi="['catalog:resource:add']">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="info" plain icon="Sort" @click="handleToggleExpandAll">展开/折叠</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
</template>
<el-table ref="catalogResourceTableRef" v-loading="loading" :data="catalogResourceList" row-key="catalogId"
:default-expand-all="isExpandAll" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
<el-table-column label="专题名称" align="center" prop="catalogName" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="修改" placement="top">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
v-hasPermi="['catalog:resource:edit']" />
</el-tooltip>
<el-tooltip content="新增" placement="top">
<el-button link type="primary" icon="Plus" @click="handleAdd(scope.row)"
v-hasPermi="['catalog:resource:add']" />
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
v-hasPermi="['catalog:resource:remove']" />
</el-tooltip>
<el-row :gutter="20">
<el-col :span="8">
<el-card shadow="never">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="Plus" @click="handleAdd()"
v-hasPermi="['catalog:resource:add']">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="info" plain icon="Sort" @click="handleToggleExpandAll">展开/折叠</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
</template>
</el-table-column>
</el-table>
</el-card>
<el-table ref="catalogResourceTableRef" @row-click="handleNodeClick" v-loading="loading"
:data="catalogResourceList" row-key="catalogId" :default-expand-all="isExpandAll"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
<el-table-column label="专题名称" align="center" prop="catalogName" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="修改" placement="top">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
v-hasPermi="['catalog:resource:edit']" />
</el-tooltip>
<el-tooltip content="新增" placement="top">
<el-button link type="primary" icon="Plus" @click="handleAdd(scope.row)"
v-hasPermi="['catalog:resource:add']" />
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
v-hasPermi="['catalog:resource:remove']" />
</el-tooltip>
</template>
</el-table-column>
</el-table>
</el-card>
</el-col>
<el-col :span="16">
<el-table v-loading="loadingTable" :data="catalogResourceTable">
<el-table-column label="分类名称" align="center" prop="catalogName" />
<el-table-column label="资源数量" align="center" prop="resourceNum" />
<el-table-column label="排序" align="center" prop="orderNum" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="修改" placement="top">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
v-hasPermi="['resource:catalogTextbook:edit']"></el-button>
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
v-hasPermi="['resource:catalogTextbook:remove']"></el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" v-model:page="queryTableParams.pageNum"
v-model:limit="queryTableParams.pageSize" @pagination="getTable" />
</el-col>
</el-row>
<!-- 添加或修改目录-专题资源对话框 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
<el-form ref="catalogResourceFormRef" :model="form" :rules="rules" label-width="80px">
@ -79,7 +107,7 @@
</template>
<script setup name="CatalogResource" lang="ts">
import { listCatalogResource, getCatalogResource, delCatalogResource, addCatalogResource, updateCatalogResource } from "@/api/resource/catalogResource";
import { listCatalogResource, pageCatalogResource, getCatalogResource, delCatalogResource, addCatalogResource, updateCatalogResource } from "@/api/resource/catalogResource";
import { CatalogResourceVO, CatalogResourceQuery, CatalogResourceForm } from '@/api/resource/catalogResource/types';
type CatalogResourceOption = {
@ -103,22 +131,22 @@ const catalogResourceFormRef = ref<ElFormInstance>();
const catalogResourceTableRef = ref<ElTableInstance>()
const dialog = reactive<DialogOption>({
visible: false,
title: ''
visible: false,
title: ''
});
const initFormData: CatalogResourceForm = {
catalogId: undefined,
parentId: undefined,
ancestors: undefined,
catalogName: undefined,
orderNum: undefined,
cover: undefined,
catalogId: undefined,
parentId: undefined,
ancestors: undefined,
catalogName: undefined,
orderNum: undefined,
cover: undefined,
}
const data = reactive<PageData<CatalogResourceForm, CatalogResourceQuery>>({
form: {...initFormData},
form: { ...initFormData },
queryParams: {
parentId: undefined,
ancestors: undefined,
@ -132,7 +160,7 @@ const data = reactive<PageData<CatalogResourceForm, CatalogResourceQuery>>({
parentId: [
{ required: true, message: "父目录id不能为空", trigger: "blur" }
],
catalogName: [
{ required: true, message: "专题名称不能为空", trigger: "blur" }
],
@ -172,7 +200,7 @@ const cancel = () => {
// 表单重置
const reset = () => {
form.value = {...initFormData}
form.value = { ...initFormData }
catalogResourceFormRef.value?.resetFields();
}
@ -253,6 +281,32 @@ const handleDelete = async (row: CatalogResourceVO) => {
proxy?.$modal.msgSuccess("删除成功");
}
const queryTableParams = ref({
pageNum: 1,
pageSize: 10,
catalogId: undefined,
parentId: undefined,
ancestors: undefined,
catalogName: undefined,
orderNum: undefined,
type: undefined,
})
const total = ref(0);
const loadingTable = ref(false);
const catalogResourceTable = ref<CatalogResourceVO[]>([]);
const getTable = async () => {
loadingTable.value = true;
const res = await pageCatalogResource(queryTableParams.value);
catalogResourceTable.value = res.rows;
total.value = res.total;
loadingTable.value = false;
}
const handleNodeClick = (row: any) => {
queryTableParams.value.catalogId = row.catalogId
getTable()
}
onMounted(() => {
getList();
});

157
src/views/resource/catalogTextbook/index.vue
View File

@ -17,51 +17,89 @@
</div>
</transition>
<el-card shadow="never">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="Plus" @click="handleAdd()"
v-hasPermi="['catalog:textbook:add']">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="info" plain icon="Sort" @click="handleToggleExpandAll">展开/折叠</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
</template>
<el-table ref="catalogTextbookTableRef" v-loading="loading" :data="catalogTextbookList" row-key="catalogId"
:default-expand-all="isExpandAll" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
<el-table-column label="教材名称" align="center" prop="catalogName" />
<el-table-column label="类型" align="center" prop="type">
<template #default="scope">
<el-tag v-if="scope.row.type === 1" type="success">暂定</el-tag>
<el-tag v-if="scope.row.type === 2" type="success">学段</el-tag>
<el-tag v-if="scope.row.type === 3" type="success">年级</el-tag>
<el-tag v-if="scope.row.type === 4" type="success">学科</el-tag>
<el-tag v-if="scope.row.type === 5" type="success">版本</el-tag>
<el-tag v-if="scope.row.type === 6" type="success">教材</el-tag>
<el-tag v-if="scope.row.type === 7" type="success">目录</el-tag>
<el-row :gutter="20">
<el-col :span="8">
<el-card shadow="never">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="Plus" @click="handleAdd()"
v-hasPermi="['catalog:textbook:add']">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="info" plain icon="Sort" @click="handleToggleExpandAll">展开/折叠</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="修改" placement="top">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
v-hasPermi="['catalog:textbook:edit']" />
</el-tooltip>
<el-tooltip content="新增" placement="top">
<el-button link type="primary" icon="Plus" @click="handleAdd(scope.row)"
v-hasPermi="['catalog:textbook:add']" />
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
v-hasPermi="['catalog:textbook:remove']" />
</el-tooltip>
</template>
</el-table-column>
</el-table>
</el-card>
<el-table ref="catalogTextbookTableRef" @row-click="handleNodeClick" v-loading="loading"
:data="catalogTextbookList" row-key="catalogId" :default-expand-all="isExpandAll"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
<el-table-column label="教材名称" align="center" prop="catalogName" />
<el-table-column label="目录类型" align="center" prop="type">
<template #default="scope">
<el-tag v-if="scope.row.type === 1" type="success">暂定</el-tag>
<el-tag v-if="scope.row.type === 2" type="success">学段</el-tag>
<el-tag v-if="scope.row.type === 3" type="success">年级</el-tag>
<el-tag v-if="scope.row.type === 4" type="success">学科</el-tag>
<el-tag v-if="scope.row.type === 5" type="success">版本</el-tag>
<el-tag v-if="scope.row.type === 6" type="success">教材</el-tag>
<el-tag v-if="scope.row.type === 7" type="success">目录</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="修改" placement="top">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
v-hasPermi="['catalog:textbook:edit']" />
</el-tooltip>
<el-tooltip content="新增" placement="top">
<el-button link type="primary" icon="Plus" @click="handleAdd(scope.row)"
v-hasPermi="['catalog:textbook:add']" />
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
v-hasPermi="['catalog:textbook:remove']" />
</el-tooltip>
</template>
</el-table-column>
</el-table>
</el-card>
</el-col>
<el-col :span="16">
<el-table v-loading="loadingTable" :data="catalogTextbookTable">
<el-table-column label="分类名称" align="center" prop="catalogName" />
<el-table-column label="目录类型" align="center" prop="type">
<template #default="scope">
<el-tag v-if="scope.row.type === 1" type="success">暂定</el-tag>
<el-tag v-if="scope.row.type === 2" type="success">学段</el-tag>
<el-tag v-if="scope.row.type === 3" type="success">年级</el-tag>
<el-tag v-if="scope.row.type === 4" type="success">学科</el-tag>
<el-tag v-if="scope.row.type === 5" type="success">版本</el-tag>
<el-tag v-if="scope.row.type === 6" type="success">教材</el-tag>
<el-tag v-if="scope.row.type === 7" type="success">目录</el-tag>
</template>
</el-table-column>
<el-table-column label="资源数量" align="center" prop="resourceNum" />
<el-table-column label="排序" align="center" prop="orderNum" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="修改" placement="top">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
v-hasPermi="['resource:catalogTextbook:edit']"></el-button>
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
v-hasPermi="['resource:catalogTextbook:remove']"></el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" v-model:page="queryTableParams.pageNum"
v-model:limit="queryTableParams.pageSize" @pagination="getTable" />
</el-col>
</el-row>
<!-- 添加或修改目录-同步教材对话框 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
<el-form ref="catalogTextbookFormRef" :model="form" :rules="rules" label-width="80px">
@ -90,7 +128,7 @@
</template>
<script setup name="CatalogTextbook" lang="ts">
import { listCatalogTextbook, getCatalogTextbook, delCatalogTextbook, addCatalogTextbook, updateCatalogTextbook } from "@/api/resource/catalogTextbook";
import { listCatalogTextbook, pageCatalogTextbook, getCatalogTextbook, delCatalogTextbook, addCatalogTextbook, updateCatalogTextbook } from "@/api/resource/catalogTextbook";
import { CatalogTextbookVO, CatalogTextbookQuery, CatalogTextbookForm } from '@/api/resource/catalogTextbook/types';
type CatalogTextbookOption = {
@ -99,8 +137,7 @@ type CatalogTextbookOption = {
children?: CatalogTextbookOption[];
}
const { proxy } = getCurrentInstance() as ComponentInternalInstance;;
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const catalogTextbookList = ref<CatalogTextbookVO[]>([]);
const catalogTextbookOptions = ref<CatalogTextbookOption[]>([]);
@ -294,6 +331,32 @@ const handleDelete = async (row: CatalogTextbookVO) => {
proxy?.$modal.msgSuccess("删除成功");
}
const queryTableParams = ref({
pageNum: 1,
pageSize: 10,
catalogId: undefined,
parentId: undefined,
ancestors: undefined,
catalogName: undefined,
orderNum: undefined,
type: undefined,
})
const total = ref(0);
const loadingTable = ref(false);
const catalogTextbookTable = ref<CatalogTextbookVO[]>([]);
const getTable = async () => {
loadingTable.value = true;
const res = await pageCatalogTextbook(queryTableParams.value);
catalogTextbookTable.value = res.rows;
total.value = res.total;
loadingTable.value = false;
}
const handleNodeClick = (row: any) => {
queryTableParams.value.catalogId = row.catalogId
getTable()
}
onMounted(() => {
getList();
});