From 622bd47fa98ca01db72caf367b7c0bf99ed411f8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=BB=84=E6=B5=B7?= <10402852@qq.com> Date: Mon, 4 Nov 2024 08:15:04 +0800 Subject: [PATCH] update --- src/api/interface/index.ts | 13 +++ src/api/modules/base.ts | 8 +- src/api/modules/res.ts | 14 ++- src/components/TreeFilter/index.vue | 19 ++- src/views/base/scheme/index.vue | 1 + src/views/res/resource/index.scss | 44 +++++++ src/views/res/resource/index.vue | 108 ++++++++++++++++++ .../res/test/components/uploadDialog.vue | 51 ++++++++- src/views/res/test/index.vue | 98 ++++++++++++++-- 9 files changed, 331 insertions(+), 25 deletions(-) create mode 100644 src/views/res/resource/index.scss create mode 100644 src/views/res/resource/index.vue diff --git a/src/api/interface/index.ts b/src/api/interface/index.ts index 5138549..fb2b5fb 100644 --- a/src/api/interface/index.ts +++ b/src/api/interface/index.ts @@ -95,6 +95,19 @@ export namespace Structure { } } +//资源 +export namespace Resource { + export interface ReqResourceParams extends ReqPage { + structure_id: any; + } + export interface ResResourceList { + resource_id_int: number; + resource_title: string; + extension: string; + create_time: string; + } +} + // 用户管理模块 export namespace User { export interface ReqUserParams extends ReqPage { diff --git a/src/api/modules/base.ts b/src/api/modules/base.ts index c0f7733..3ed5e42 100644 --- a/src/api/modules/base.ts +++ b/src/api/modules/base.ts @@ -2,11 +2,11 @@ import { ResPage, Stage, Subject, Scheme, Structure } from "@/api/interface/inde import http from "@/api"; export const getStageList = () => { - return http.get>(`/dsRes/base/getStageList`); + return http.get>(`/dsRes/base/getStageList`, { loading: false }); }; export const getSubjectList = (params: Subject.ReqSubjectParams) => { - return http.get>(`/dsRes/base/listSubject`, params); + return http.get>(`/dsRes/base/listSubject`, params, { loading: false }); }; export const getSubjectInfoById = params => { @@ -26,7 +26,7 @@ export const deleteSubject = params => { }; export const getSchemeList = (params: Scheme.ReqSchemeParams) => { - return http.get>(`/dsRes/base/listScheme`, params); + return http.get>(`/dsRes/base/listScheme`, params, { loading: false }); }; export const getSchemeInfoById = params => { @@ -46,7 +46,7 @@ export const deleteScheme = params => { }; export const getStructureList = params => { - return http.get>(`/dsRes/base/fetchStructure`, params); + return http.get>(`/dsRes/base/fetchStructure`, params, { loading: false }); }; export const getStructureInfoById = params => { diff --git a/src/api/modules/res.ts b/src/api/modules/res.ts index 080b676..b06112a 100644 --- a/src/api/modules/res.ts +++ b/src/api/modules/res.ts @@ -1,6 +1,18 @@ -import { ResPage, Stage, Subject, Scheme, Structure } from "@/api/interface/index"; +import { ResPage, Resource } from "@/api/interface/index"; import http from "@/api"; export const getFileExtIcon = () => { return http.get(`/dsRes/res/getThumbs`); }; + +export const getUpladFileSignature = params => { + return http.get(`/dsRes/res/getSignature`, params); +}; + +export const getResList = (params: Resource.ReqResourceParams) => { + return http.get>(`/dsRes/res/getResourceBaseList`, params, { loading: false }); +}; + +export const addResData = params => { + return http.post(`/dsRes/res/addResourceBase`, params, { loading: false }); +}; diff --git a/src/components/TreeFilter/index.vue b/src/components/TreeFilter/index.vue index 5d5b446..010d230 100644 --- a/src/components/TreeFilter/index.vue +++ b/src/components/TreeFilter/index.vue @@ -16,7 +16,6 @@ :check-on-click-node="multiple" :props="defaultProps" :filter-node-method="filterNode" - :default-checked-keys="multiple ? selected : []" @node-click="handleNodeClick" @check="handleCheckChange" > @@ -44,6 +43,7 @@ interface TreeFilterProps { label?: string; // 显示的label ==> 非必传，默认为 “label” multiple?: boolean; // 是否为多选 ==> 非必传，默认为 false defaultValue?: any; // 默认选中的值 ==> 非必传 + refreshApi?: (data?: any) => Promise; // 刷新数据的 api ==> 非必传 } const props = withDefaults(defineProps(), { id: "id", @@ -62,8 +62,11 @@ const treeAllData = ref<{ [key: string]: any }[]>([]); const selected = ref(); const setSelected = () => { - if (props.multiple) selected.value = Array.isArray(props.defaultValue) ? props.defaultValue : [props.defaultValue]; - else selected.value = typeof props.defaultValue === "string" ? props.defaultValue : ""; + if (props.multiple) { + selected.value = Array.isArray(props.defaultValue) ? props.defaultValue : [props.defaultValue]; + } else { + selected.value = typeof props.defaultValue === "string" ? props.defaultValue : ""; + } }; onBeforeMount(async () => { @@ -87,7 +90,8 @@ watch( () => { if (props.data?.length) { treeData.value = props.data; - treeAllData.value = [{ id: "", [props.label]: "全部" }, ...props.data]; + // treeAllData.value = [{ id: "", [props.label]: "全部" }, ...props.data]; + treeAllData.value = [...props.data]; } }, { deep: true, immediate: true } @@ -147,10 +151,13 @@ const refresh = scheme_id => { const refreshTree = async (scheme_id: number) => { setSelected(); - if (props.requestApi) { - const { data } = await props.requestApi!(scheme_id); + if (props.refreshApi) { + const { data } = await props.refreshApi!(scheme_id); treeData.value = data; treeAllData.value = [...data]; + if (data[0]) { + selected.value = data[0].structure_id; + } } }; diff --git a/src/views/base/scheme/index.vue b/src/views/base/scheme/index.vue index 206b31d..4d7780c 100644 --- a/src/views/base/scheme/index.vue +++ b/src/views/base/scheme/index.vue @@ -117,6 +117,7 @@ const openDrawer = (title: string, scheme_id: number = 0) => { getTableList: proTable.value?.getTableList, updateId: scheme_id }; + dialogRef.value?.acceptParams(params); }; diff --git a/src/views/res/resource/index.scss b/src/views/res/resource/index.scss new file mode 100644 index 0000000..34c89ff --- /dev/null +++ b/src/views/res/resource/index.scss @@ -0,0 +1,44 @@ +.filter { + box-sizing: border-box; + width: 250px; + height: 100%; + padding: 15px; + margin-right: 10px; + .title { + margin: 0 0 15px; + font-size: 18px; + font-weight: bold; + color: var(--el-color-info-dark-2); + letter-spacing: 0.5px; + } + .search { + display: flex; + align-items: center; + margin: 0 0 15px; + .el-icon { + cursor: pointer; + transform: rotate(90deg) translateY(-8px); + } + } + .el-scrollbar { + :deep(.el-tree) { + height: 80%; + overflow: auto; + .el-tree-node__content { + height: 33px; + } + } + :deep(.el-tree--highlight-current) { + .el-tree-node.is-current > .el-tree-node__content { + background-color: var(--el-color-primary); + .el-tree-node__label, + .el-tree-node__expand-icon { + color: white; + } + .is-leaf { + color: transparent; + } + } + } + } +} diff --git a/src/views/res/resource/index.vue b/src/views/res/resource/index.vue new file mode 100644 index 0000000..86c0969 --- /dev/null +++ b/src/views/res/resource/index.vue @@ -0,0 +1,108 @@ + + + + diff --git a/src/views/res/test/components/uploadDialog.vue b/src/views/res/test/components/uploadDialog.vue index 3b3cf79..fc01a28 100644 --- a/src/views/res/test/components/uploadDialog.vue +++ b/src/views/res/test/components/uploadDialog.vue @@ -6,13 +6,15 @@ append-to-body :destroy-on-close="true" width="500" + @close="closeDialog" > import { ref, onMounted } from "vue"; import { ElMessage, UploadUserFile } from "element-plus"; -import { getFileExtIcon } from "@/api/modules/res"; +import { getFileExtIcon, getUpladFileSignature, addResData } from "@/api/modules/res"; const dialogFormVisible = ref(false); @@ -38,6 +40,10 @@ const fileList = ref([]); const iconList = ref([]); +const signature = ref( + "http://10.10.14.210:9000/dsideal/resources/d0a9a28e-ca25-4844-b6c0-5f66f0fd631b.doc?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AOxWewe7pywwEc1NQeP6%2F20241031%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20241031T082920Z&X-Amz-Expires=604800&X-Amz-SignedHeaders=host&X-Amz-Signature=7f596c972b5c22f73a001460504e1aaa905431a32e3dab456e57e9bc40ad7094" +); + const paramsProps = ref({ title: "", row: {}, @@ -46,11 +52,21 @@ const paramsProps = ref({ }); const acceptParams = (params: View.DefaultParams) => { - console.log(params); paramsProps.value = params; dialogFormVisible.value = true; }; +const uploadBefore = async rawFile => { + const fileExt = rawFile.name.split(".").pop(); + //获取上传文件签名 + const res = await getUpladFileSignature({ extension: fileExt }); + signature.value = res.data.signature; + + //给rawFile增加属性，用于保存资源数据的参数 + rawFile.file_ext = fileExt; + rawFile.file_name = res.data.object_name; +}; + const uploadChange = async (uploadFile, uploadFiles) => { if (uploadFile.status == "ready") { const fileExt = uploadFile.name.split(".").pop(); @@ -73,6 +89,17 @@ const uploadSuccess = (response, uploadFile, uploadFiles) => { const _index = fileList.value.findIndex(item => item.name === uploadFile.name); fileList.value.splice(_index, 1); }, 3000); + + addRes( + uploadFile.name.split(".").slice(0, -1).join("."), + uploadFile.size, + uploadFile.raw.file_ext, + uploadFile.raw.file_name, + paramsProps.value.row.scheme_id, + paramsProps.value.row.structure_id, + paramsProps.value.row.stage_id, + paramsProps.value.row.subject_id + ); }; const uploadExceed = () => { @@ -84,6 +111,24 @@ const getFileExtIconList = async () => { iconList.value = res.data; }; +const addRes = async (resource_title, resource_size_int, extension, file_name, scheme_id, structure_id, stage_id, subject_id) => { + await addResData({ + resource_title, + resource_size_int, + extension, + file_name, + file_md5: "1", + scheme_id, + structure_id, + stage_id, + subject_id + }); +}; + +const closeDialog = () => { + paramsProps.value.getTableList!(); +}; + onMounted(() => { getFileExtIconList(); }); diff --git a/src/views/res/test/index.vue b/src/views/res/test/index.vue index 3cc4a33..df6f5d6 100644 --- a/src/views/res/test/index.vue +++ b/src/views/res/test/index.vue @@ -60,14 +60,27 @@ - +
- + + +
@@ -82,11 +95,15 @@ import { Stage } from "@/api/interface"; import ProTable from "@/components/ProTable/index.vue"; import TreeFilter from "@/components/TreeFilter/index.vue"; import { CirclePlus, Delete, EditPen } from "@element-plus/icons-vue"; +import { ElMessage } from "element-plus"; import { getStructureList, getStageList, getSubjectList, getSchemeList } from "@/api/modules/base"; +import { getResList } from "@/api/modules/res"; import UploadDialog from "@/views/res/test/components/uploadDialog.vue"; +const treeFilterData = ref([]); + const stageList = ref([]); const stageSelect = ref(""); const stageSelectTxt = ref(""); @@ -99,24 +116,43 @@ const schemeList = ref([]); const schemeSelect = ref(""); const schemeSelectTxt = ref(""); +const structureSelect = ref(""); + const sssTxt = ref(""); const visible = ref(false); const tooltipShow = ref(false); -const getSchemeTree = (scheme_id: number = 500124397) => { - return getStructureList({ scheme_id }); +// ProTable 实例 +const proTable = ref(); + +const initParam = reactive({ structure_id: "" }); + +const getSchemeTree = async () => { + const { data } = await getStructureList({ scheme_id: schemeSelect.value }); + treeFilterData.value = data; + initParam.structure_id = data[0].structure_id; +}; + +const getSchemeTreeRefresh = async scheme_id => { + const res = await getStructureList({ scheme_id: schemeSelect.value }); + return res; +}; + +const getTableList = (params: any) => { + return getResList(params); }; const columns = reactive[]>([ { type: "index", width: 70, label: "序号" }, - { prop: "stage_id", label: "学段ID" }, - { prop: "stage_name", label: "学段名称" } + { prop: "resource_title", label: "资源名称" }, + { prop: "extension", label: "资源类型" }, + { prop: "create_time", label: "上传时间" } // { prop: "operation", label: "操作", fixed: "right", width: 330 } ]); -const treeRef = ref>(); +const treeFilterRef = ref>(); const getStageSelectList = async () => { const res = await getStageList(); @@ -160,7 +196,7 @@ const openpopover = e => { const well = () => { if (schemeSelect.value) { sssTxt.value = stageSelectTxt.value + "-" + subjectSelectTxt.value + "-" + schemeSelectTxt.value; - treeRef.value?.refresh(schemeSelect.value); + treeFilterRef.value?.refresh(schemeSelect.value); visible.value = false; } }; @@ -175,17 +211,57 @@ const wellleave = e => { tooltipShow.value = false; }; +const getSssSelectList = async () => { + console.log("getSssSelectList"); + const resStage = await getStageList(); + stageList.value = resStage.data.list; + stageSelect.value = stageList.value[0].stage_id; + stageSelectTxt.value = stageList.value[0].stage_name; + + const resSubject = await getSubjectList({ stage_id: stageList.value[0].stage_id, pageNum: 1, pageSize: 100 }); + subjectList.value = resSubject.data.list; + subjectSelect.value = subjectList.value[0].subject_id; + subjectSelectTxt.value = subjectList.value[0].subject_name; + + const resScheme = await getSchemeList({ + stage_id: stageList.value[0].stage_id, + subject_id: subjectList.value[0].subject_id, + pageNum: 1, + pageSize: 100 + }); + schemeList.value = resScheme.data.list; + schemeSelect.value = schemeList.value[0].scheme_id; + schemeSelectTxt.value = schemeList.value[0].scheme_name; + + sssTxt.value = stageSelectTxt.value + "-" + subjectSelectTxt.value + "-" + schemeSelectTxt.value; + + getSchemeTree(); +}; + +const changeTreeFilter = (val: string) => { + structureSelect.value = val; + initParam.structure_id = val; +}; + const dialogRef = ref | null>(null); -const openDrawer = (title: string, scheme_id: number = 0) => { +const openDrawer = (title: string) => { const params = { title, - row: {} + row: { + stage_id: stageSelect.value, + subject_id: subjectSelect.value, + scheme_id: schemeSelect.value, + structure_id: structureSelect.value + }, + getTableList: proTable.value?.getTableList }; dialogRef.value?.acceptParams(params); }; onMounted(() => { - getStageSelectList(); + getSssSelectList(); + + // getStageSelectList(); });