|
|
|
@ -1,106 +1,282 @@
|
|
|
|
|
<template>
|
|
|
|
|
<div class="main-box">
|
|
|
|
|
<div class="main-box" @click="visible = false">
|
|
|
|
|
<div class="card filter">
|
|
|
|
|
<div style="display: flex; justify-content: space-between; margin-bottom: 10px">
|
|
|
|
|
<div style="display: flex; align-items: center; font-size: 14px; color: #009688; font-weight: bolder">
|
|
|
|
|
{{ sssTxt }}
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<el-popover placement="right" :width="200" trigger="click" :visible="visible">
|
|
|
|
|
<template #reference>
|
|
|
|
|
<el-icon style="cursor: pointer" @click="openpopover"><Expand /></el-icon>
|
|
|
|
|
</template>
|
|
|
|
|
<el-select
|
|
|
|
|
v-model="stageSelect"
|
|
|
|
|
placeholder="请选择学段"
|
|
|
|
|
style="margin-bottom: 10px"
|
|
|
|
|
:teleported="false"
|
|
|
|
|
@change="stageChange"
|
|
|
|
|
>
|
|
|
|
|
<el-option v-for="(item, index) in stageList" :key="index" :label="item.stage_name" :value="item.stage_id" />
|
|
|
|
|
</el-select>
|
|
|
|
|
|
|
|
|
|
<el-select
|
|
|
|
|
v-model="subjectSelect"
|
|
|
|
|
placeholder="请选择学科"
|
|
|
|
|
style="margin-bottom: 10px"
|
|
|
|
|
:teleported="false"
|
|
|
|
|
@change="subjectChange"
|
|
|
|
|
>
|
|
|
|
|
<el-option v-for="(item, index) in subjectList" :key="index" :label="item.subject_name" :value="item.subject_id" />
|
|
|
|
|
</el-select>
|
|
|
|
|
|
|
|
|
|
<el-select
|
|
|
|
|
v-model="schemeSelect"
|
|
|
|
|
placeholder="请选择版本"
|
|
|
|
|
style="margin-bottom: 10px"
|
|
|
|
|
:teleported="false"
|
|
|
|
|
@change="schemeChange"
|
|
|
|
|
>
|
|
|
|
|
<el-option v-for="(item, index) in schemeList" :key="index" :label="item.scheme_name" :value="item.scheme_id" />
|
|
|
|
|
</el-select>
|
|
|
|
|
<div style="text-align: right">
|
|
|
|
|
<el-tooltip :visible="tooltipShow">
|
|
|
|
|
<template #content>
|
|
|
|
|
<span>请选择版本!</span>
|
|
|
|
|
</template>
|
|
|
|
|
<el-button
|
|
|
|
|
type="primary"
|
|
|
|
|
size="small"
|
|
|
|
|
:icon="Select"
|
|
|
|
|
round
|
|
|
|
|
@click="well"
|
|
|
|
|
@mouseenter="wellenter"
|
|
|
|
|
@mouseleave="wellleave"
|
|
|
|
|
>确定</el-button
|
|
|
|
|
>
|
|
|
|
|
</el-tooltip>
|
|
|
|
|
</div>
|
|
|
|
|
</el-popover>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<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"></div>
|
|
|
|
|
<div class="table-box">
|
|
|
|
|
<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.resource_id_int)">删除</el-button>
|
|
|
|
|
</template>
|
|
|
|
|
</ProTable>
|
|
|
|
|
<UploadDialog ref="dialogRef" />
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
|
|
import { ref, reactive, onMounted } from "vue";
|
|
|
|
|
import { Select } from "@element-plus/icons-vue";
|
|
|
|
|
import { ProTableInstance, ColumnProps } from "@/components/ProTable/interface";
|
|
|
|
|
import { Stage } from "@/api/interface";
|
|
|
|
|
import ProTable from "@/components/ProTable/index.vue";
|
|
|
|
|
import TreeFilter from "@/components/TreeFilter/index.vue";
|
|
|
|
|
import { CirclePlus, Delete } from "@element-plus/icons-vue";
|
|
|
|
|
import { ElMessage, ElMessageBox } from "element-plus";
|
|
|
|
|
|
|
|
|
|
import { getStructureList, getStageList, getSubjectList, getSchemeList } from "@/api/modules/base";
|
|
|
|
|
import { getResList } from "@/api/modules/res";
|
|
|
|
|
import { getResList, delResData } from "@/api/modules/res";
|
|
|
|
|
|
|
|
|
|
import UploadDialog from "@/views/res/test/components/uploadDialog.vue";
|
|
|
|
|
|
|
|
|
|
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: "财务部"
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
}
|
|
|
|
|
];
|
|
|
|
|
const stageList = ref<any>([]);
|
|
|
|
|
const stageSelect = ref("");
|
|
|
|
|
const stageSelectTxt = ref("");
|
|
|
|
|
|
|
|
|
|
const subjectList = ref<any>([]);
|
|
|
|
|
const subjectSelect = ref("");
|
|
|
|
|
const subjectSelectTxt = ref("");
|
|
|
|
|
|
|
|
|
|
const schemeList = ref<any>([]);
|
|
|
|
|
const schemeSelect = ref("");
|
|
|
|
|
const schemeSelectTxt = ref("");
|
|
|
|
|
|
|
|
|
|
const structureSelect = ref("");
|
|
|
|
|
|
|
|
|
|
const sssTxt = ref("");
|
|
|
|
|
|
|
|
|
|
const visible = ref(false);
|
|
|
|
|
|
|
|
|
|
const tooltipShow = ref(false);
|
|
|
|
|
|
|
|
|
|
// ProTable 实例
|
|
|
|
|
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.toString();
|
|
|
|
|
initParam.structure_id = data[0].structure_id;
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
onMounted(() => {
|
|
|
|
|
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: 100, label: "序号" },
|
|
|
|
|
{ prop: "resource_title", label: "资源名称" },
|
|
|
|
|
{ prop: "extension", label: "资源类型" },
|
|
|
|
|
{ prop: "create_time", label: "上传时间" },
|
|
|
|
|
{ prop: "operation", label: "操作", fixed: "right", width: 180 }
|
|
|
|
|
]);
|
|
|
|
|
|
|
|
|
|
const treeFilterRef = ref<InstanceType<typeof TreeFilter>>();
|
|
|
|
|
|
|
|
|
|
const getStageSelectList = async () => {
|
|
|
|
|
const res = await getStageList();
|
|
|
|
|
stageList.value = res.data.list;
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
const stageChange = async value => {
|
|
|
|
|
const res = await getSubjectList({ stage_id: value, pageNum: 1, pageSize: 100 });
|
|
|
|
|
subjectList.value = res.data.list;
|
|
|
|
|
|
|
|
|
|
stageSelectTxt.value = stageList.value.find(item => item.stage_id === value)?.stage_name;
|
|
|
|
|
|
|
|
|
|
subjectSelect.value = "";
|
|
|
|
|
schemeList.value = [];
|
|
|
|
|
schemeSelect.value = "";
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
const subjectChange = async value => {
|
|
|
|
|
const res = await getSchemeList({
|
|
|
|
|
stage_id: stageSelect.value,
|
|
|
|
|
subject_id: value,
|
|
|
|
|
pageNum: 1,
|
|
|
|
|
pageSize: 100
|
|
|
|
|
});
|
|
|
|
|
schemeList.value = res.data.list;
|
|
|
|
|
|
|
|
|
|
subjectSelectTxt.value = subjectList.value.find(item => item.subject_id === value)?.subject_name;
|
|
|
|
|
|
|
|
|
|
schemeSelect.value = "";
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
const schemeChange = value => {
|
|
|
|
|
schemeSelectTxt.value = schemeList.value.find(item => item.scheme_id === value)?.scheme_name;
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
const openpopover = e => {
|
|
|
|
|
e.stopPropagation();
|
|
|
|
|
visible.value = true;
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
const well = () => {
|
|
|
|
|
if (schemeSelect.value) {
|
|
|
|
|
sssTxt.value = stageSelectTxt.value + "-" + subjectSelectTxt.value + "-" + schemeSelectTxt.value;
|
|
|
|
|
treeFilterRef.value?.refresh(schemeSelect.value);
|
|
|
|
|
visible.value = false;
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
const wellenter = e => {
|
|
|
|
|
if (!schemeSelect.value) {
|
|
|
|
|
tooltipShow.value = true;
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
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) => {
|
|
|
|
|
const params = {
|
|
|
|
|
title,
|
|
|
|
|
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);
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
// 删除资源
|
|
|
|
|
const deleteSch = async (resource_id_int: number) => {
|
|
|
|
|
ElMessageBox.confirm(`是否删除该资源?`, "提示", {
|
|
|
|
|
confirmButtonText: "确定",
|
|
|
|
|
cancelButtonText: "取消",
|
|
|
|
|
type: "warning",
|
|
|
|
|
draggable: true
|
|
|
|
|
}).then(async () => {
|
|
|
|
|
await delResData({ resource_id_int });
|
|
|
|
|
ElMessage.success({ message: `成功!` });
|
|
|
|
|
|
|
|
|
|
proTable.value?.getTableList();
|
|
|
|
|
});
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
onMounted(() => {
|
|
|
|
|
getSssSelectList();
|
|
|
|
|
|
|
|
|
|
// getStageSelectList();
|
|
|
|
|
});
|
|
|
|
|
</script>
|
|
|
|
|
<style scoped lang="scss">
|
|
|
|
|