update

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 {

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<ResPage<Stage.ResStageList>>(`/dsRes/base/getStageList`);
+  return http.get<ResPage<Stage.ResStageList>>(`/dsRes/base/getStageList`, { loading: false });
 };
 
 export const getSubjectList = (params: Subject.ReqSubjectParams) => {
-  return http.get<ResPage<Subject.ResSubjectList>>(`/dsRes/base/listSubject`, params);
+  return http.get<ResPage<Subject.ResSubjectList>>(`/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<ResPage<Scheme.ResSchemeList>>(`/dsRes/base/listScheme`, params);
+  return http.get<ResPage<Scheme.ResSchemeList>>(`/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<ResPage<Structure.ResStructureList>>(`/dsRes/base/fetchStructure`, params);
+  return http.get<ResPage<Structure.ResStructureList>>(`/dsRes/base/fetchStructure`, params, { loading: false });
 };
 
 export const getStructureInfoById = params => {

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<any>(`/dsRes/res/getSignature`, params);
+};
+
+export const getResList = (params: Resource.ReqResourceParams) => {
+  return http.get<ResPage<Resource.ResResourceList>>(`/dsRes/res/getResourceBaseList`, params, { loading: false });
+};
+
+export const addResData = params => {
+  return http.post(`/dsRes/res/addResourceBase`, params, { loading: false });
+};

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<any>; // 刷新数据的 api ==> 非必传
 }
 const props = withDefaults(defineProps<TreeFilterProps>(), {
   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];
+  if (props.multiple) {
-  else selected.value = typeof props.defaultValue === "string" ? props.defaultValue : "";
+    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) {
+  if (props.refreshApi) {
-    const { data } = await props.requestApi!(scheme_id);
+    const { data } = await props.refreshApi!(scheme_id);
     treeData.value = data;
     treeAllData.value = [...data];
+    if (data[0]) {
+      selected.value = data[0].structure_id;
+    }
   }
 };
 

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);
 };
 

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;
+        }
+      }
+    }
+  }
+}

src/views/res/resource/index.vue

@@ -0,0 +1,108 @@
+<template>
+  <div class="main-box">
+    <div class="card filter">
+      <TreeFilter
+        label="structure_name"
+        id="structure_id"
+        title=""
+        :data="treeFilterData"
+        ref="treeFilterRef"
+        :default-value="initParam.structure_id"
+      />
+    </div>
+    <div class="table-box"></div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive, onMounted } from "vue";
+import TreeFilter from "@/components/TreeFilter/index.vue";
+
+import { getStructureList, getStageList, getSubjectList, getSchemeList } from "@/api/modules/base";
+import { getResList } from "@/api/modules/res";
+
+const treeFilterData = ref<any>([]);
+
+const initParam = reactive({ structure_id: "367554" });
+
+const getSchemeTree = async (scheme_id: number = 500124397) => {
+  //   const { data } = await getStructureList({ scheme_id });
+  const data = [
+    {
+      structure_id: "1",
+      structure_name: "华东分部",
+      children: [
+        {
+          structure_id: "11",
+          structure_name: "研发部"
+        },
+        {
+          structure_id: "12",
+          structure_name: "市场部"
+        },
+        {
+          structure_id: "13",
+          structure_name: "商务部"
+        },
+        {
+          structure_id: "14",
+          structure_name: "财务部"
+        }
+      ]
+    },
+    {
+      structure_id: "2",
+      structure_name: "华南分部",
+      children: [
+        {
+          structure_id: "21",
+          structure_name: "研发部"
+        },
+        {
+          structure_id: "22",
+          structure_name: "市场部"
+        },
+        {
+          structure_id: "23",
+          structure_name: "商务部"
+        },
+        {
+          structure_id: "24",
+          structure_name: "财务部"
+        }
+      ]
+    },
+    {
+      structure_id: "3",
+      structure_name: "西北分部",
+      children: [
+        {
+          structure_id: "31",
+          structure_name: "研发部"
+        },
+        {
+          structure_id: "32",
+          structure_name: "市场部"
+        },
+        {
+          structure_id: "33",
+          structure_name: "商务部"
+        },
+        {
+          structure_id: "34",
+          structure_name: "财务部"
+        }
+      ]
+    }
+  ];
+  treeFilterData.value = data;
+  initParam.structure_id = data[0].structure_id.toString();
+};
+
+onMounted(() => {
+  getSchemeTree();
+});
+</script>
+<style scoped lang="scss">
+@import "./index.scss";
+</style>

src/views/res/test/components/uploadDialog.vue

@@ -6,13 +6,15 @@
     append-to-body
     :destroy-on-close="true"
     width="500"
+    @close="closeDialog"
   >
     <el-upload
       class="upload-demo"
       drag
       method="PUT"
-      action="http://10.10.14.210:9000/dsideal/resources/77d45a2c-af46-4c47-bc4e-056a9335e131.doc?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AOxWewe7pywwEc1NQeP6%2F20241030%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20241030T071930Z&X-Amz-Expires=604800&X-Amz-SignedHeaders=host&X-Amz-Signature=bb1c75d0acbeb287a28d4810dd8d4c518ef3cb98a3dc2001abbcf0a31dd7173e"
+      :action="signature"
       :multiple="true"
+      :before-upload="uploadBefore"
       :on-success="uploadSuccess"
       :on-exceed="uploadExceed"
       :on-change="uploadChange"
@@ -30,7 +32,7 @@
 <script setup lang="ts" name="uploadDialog">
 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<UploadUserFile[]>([]);
 
 const iconList = ref<any>([]);
 
+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<View.DefaultParams>({
   title: "",
   row: {},
@@ -46,11 +52,21 @@ const paramsProps = ref<View.DefaultParams>({
 });
 
 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();
 });

src/views/res/test/index.vue

@@ -60,14 +60,27 @@
         </div>
       </div>
 
-      <TreeFilter label="structure_name" id="structure_id" title="" :request-api="getSchemeTree" ref="treeRef" />
+      <TreeFilter
+        label="structure_name"
+        id="structure_id"
+        title=""
+        :refresh-api="getSchemeTreeRefresh"
+        :data="treeFilterData"
+        ref="treeFilterRef"
+        :default-value="initParam.structure_id"
+        @change="changeTreeFilter"
+      />
     </div>
     <div class="table-box">
-      <ProTable ref="proTable" :columns="columns">
+      <ProTable ref="proTable" :columns="columns" :request-api="getTableList" :initParam="initParam" :requestAuto="false">
         <!-- 表格 header 按钮 -->
         <template #tableHeader="">
           <el-button type="primary" :icon="CirclePlus" @click="openDrawer('上传资源')">上传资源</el-button>
         </template>
+        <!-- 表格操作 -->
+        <template #operation="scope">
+          <!-- <el-button type="primary" link :icon="Delete" @click="deleteSch(scope.row.scheme_id)">删除</el-button> -->
+        </template>
       </ProTable>
       <UploadDialog ref="dialogRef" />
     </div>
@@ -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<any>([]);
+
 const stageList = ref<any>([]);
 const stageSelect = ref("");
 const stageSelectTxt = ref("");
@@ -99,24 +116,43 @@ const schemeList = ref<any>([]);
 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) => {
+// ProTable 实例
-  return getStructureList({ scheme_id });
+const proTable = ref<ProTableInstance>();
+
+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<ColumnProps<Stage.ResStageList>[]>([
   { type: "index", width: 70, label: "序号" },
-  { prop: "stage_id", label: "学段ID" },
+  { prop: "resource_title", label: "资源名称" },
-  { prop: "stage_name", label: "学段名称" }
+  { prop: "extension", label: "资源类型" },
+  { prop: "create_time", label: "上传时间" }
   // { prop: "operation", label: "操作", fixed: "right", width: 330 }
 ]);
 
-const treeRef = ref<InstanceType<typeof TreeFilter>>();
+const treeFilterRef = ref<InstanceType<typeof TreeFilter>>();
 
 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<InstanceType<typeof UploadDialog> | 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();
 });
 </script>
 <style scoped lang="scss">