mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-22 17:26:46 +08:00
1363 lines
35 KiB
Vue
1363 lines
35 KiB
Vue
<template>
|
|
<!-- 概览! -->
|
|
<div class="overvoew">
|
|
<!-- 以下为顶部搜索框 -->
|
|
<div class="filter">
|
|
<div class="select">
|
|
<a-select
|
|
style="width: 100%"
|
|
placeholder="请选择组织"
|
|
v-model:value="orgId"
|
|
:options="option"
|
|
allowClear
|
|
></a-select>
|
|
</div>
|
|
<div class="select">
|
|
<a-input
|
|
style="width: 100%; height: 40px; border-radius: 8px"
|
|
placeholder="请输入名称"
|
|
allowClear
|
|
showSearch
|
|
v-model:value="name"
|
|
>
|
|
</a-input>
|
|
</div>
|
|
<div class="select">
|
|
<a-input
|
|
style="width: 100%; height: 40px; border-radius: 8px"
|
|
placeholder="请输入创建者"
|
|
v-model:value="creator"
|
|
allowClear
|
|
showSearch
|
|
>
|
|
</a-input>
|
|
</div>
|
|
<div style="display: flex; margin-bottom: 20px">
|
|
<div class="btnn btn1" @click="searchClick">
|
|
<div class="search"></div>
|
|
<div class="btnText">搜索</div>
|
|
</div>
|
|
<div class="btn btn2" @click="reset">
|
|
<div class="search"></div>
|
|
<div class="btnText">重置</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- 以下为导出按钮 -->
|
|
<div class="tabBtn">
|
|
<div class="tab">
|
|
<div
|
|
v-for="(item, index) in tabData"
|
|
:key="index"
|
|
:class="currentTab === index ? 'tabActive' : 'tabItem'"
|
|
@click="tabClick(index)"
|
|
>
|
|
{{ item.text }} ({{ item.num }})
|
|
</div>
|
|
</div>
|
|
<div class="btns">
|
|
<div class="btn btn3" @click="exportClick">
|
|
<div>
|
|
<img src="../../assets/svg/export.png" alt="" />
|
|
</div>
|
|
<div class="btnText">导出</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- 以下为table表格 -->
|
|
<div class="tableBox">
|
|
<a-table
|
|
:columns="columns"
|
|
:data-source="tableData"
|
|
:loading="tableLoading"
|
|
:scroll="{ x: 700 }"
|
|
:pagination="false"
|
|
@expand="expandTable"
|
|
childrenColumnName="children"
|
|
:row-selection="{
|
|
selectedRowKeys: selectedRowKeys,
|
|
onChange: onSelectChange,
|
|
}"
|
|
>
|
|
<template #bodyCell="{ column, record }">
|
|
<template v-if="column.key === 'courseType'">
|
|
<span>{{
|
|
record.courseType == "0"
|
|
? "在线"
|
|
: record.courseType == "1"
|
|
? "面授"
|
|
: record.courseType
|
|
}}</span>
|
|
</template>
|
|
<!-- 项目状态 -->
|
|
<template v-if="column.key === 'projectStatus'">
|
|
<span>{{
|
|
record.status == "0"
|
|
? "草稿"
|
|
: record.status == "1"
|
|
? "提交待审核"
|
|
: record.status == "2"
|
|
? "审核通过"
|
|
: record.status == "3"
|
|
? '已经发布'
|
|
: record.status == "4"
|
|
? '发布'
|
|
: record.status == "-1"
|
|
? '已结束'
|
|
: record.status == "-2"
|
|
? '删除'
|
|
: record.status == "-3"
|
|
? '撤回审核'
|
|
: record.status == "-4"
|
|
? '撤回发布'
|
|
: record.status == "-5"
|
|
? '拒绝'
|
|
: record.status == "-6"
|
|
? '撤回已结束':''
|
|
}}</span>
|
|
</template>
|
|
<!-- 学习路径图状态 -->
|
|
<template v-if="column.key === 'boeRouterStatus'">
|
|
<span>{{
|
|
record.status == "0"
|
|
? "草稿"
|
|
: record.status == "1"
|
|
? "已发布"
|
|
: record.status == "-1"
|
|
? "已停用"
|
|
: ""
|
|
}}</span>
|
|
</template>
|
|
<!-- 授课状态 -->
|
|
<template v-if="column.key === 'teachingStatus'">
|
|
<span>{{
|
|
record.status == "0"
|
|
? "未开始"
|
|
: record.status == "1"
|
|
? "进行中"
|
|
: record.status == "2"
|
|
? "已完成"
|
|
: ""
|
|
}}</span>
|
|
</template>
|
|
<!-- 课程状态 -->
|
|
<template v-if="column.key === 'classStatus'">
|
|
<span>{{
|
|
record.publishStatus == "0"
|
|
? "未发布"
|
|
: record.publishStatus == "1"
|
|
? "已发布"
|
|
: ""
|
|
}}</span>
|
|
</template>
|
|
<!-- 考试状态 -->
|
|
<template v-if="column.key === 'examStatus'">
|
|
<span>{{
|
|
record.published == "0"
|
|
? "未发布"
|
|
: record.published == "1"
|
|
? "已发布"
|
|
: ""
|
|
}}</span>
|
|
</template>
|
|
|
|
<template v-if="column.key === 'publishTime'">
|
|
<a-tooltip placement="topRight">
|
|
<template #title>
|
|
<span>{{
|
|
record.publishTime&&dayjs(record.publishTime).format("YYYY-MM-DD HH:mm:ss")
|
|
}}</span>
|
|
</template>
|
|
<span>{{
|
|
record.publishTime&&dayjs(record.publishTime).format("YYYY-MM-DD HH:mm:ss")
|
|
}}</span>
|
|
</a-tooltip>
|
|
</template>
|
|
<template v-if="column.key === 'proTime'">
|
|
<a-tooltip placement="topRight">
|
|
<template #title>
|
|
<span
|
|
>{{
|
|
record.beginTime&& dayjs(record.beginTime).format("YYYY-MM-DD HH:mm:ss")
|
|
}}~{{
|
|
record.endTime&& dayjs(record.endTime).format("YYYY-MM-DD HH:mm:ss")
|
|
}}</span
|
|
>
|
|
</template>
|
|
<span
|
|
>{{ record.beginTime&& dayjs(record.beginTime).format("YYYY-MM-DD HH:mm:ss") }}~{{
|
|
record.endTime&& dayjs(record.endTime).format("YYYY-MM-DD HH:mm:ss")
|
|
}}</span
|
|
>
|
|
</a-tooltip>
|
|
</template>
|
|
<template v-if="column.key === 'createTime'">
|
|
<a-tooltip placement="topRight">
|
|
<template #title>
|
|
<span>{{
|
|
record.createTime&& dayjs(record.createTime).format("YYYY-MM-DD HH:mm:ss")
|
|
}}</span>
|
|
</template>
|
|
<span>{{
|
|
record.createTime&& dayjs(record.createTime).format("YYYY-MM-DD HH:mm:ss")
|
|
}}</span>
|
|
</a-tooltip>
|
|
</template>
|
|
<template v-if="column.key === 'sysCreateTime'">
|
|
<a-tooltip placement="topRight">
|
|
<template #title>
|
|
<span>{{
|
|
record.sysCreateTime&& dayjs(record.sysCreateTime).format("YYYY-MM-DD HH:mm:ss")
|
|
}}</span>
|
|
</template>
|
|
<span>{{
|
|
record.sysCreateTime&& dayjs(record.sysCreateTime).format("YYYY-MM-DD HH:mm:ss")
|
|
}}</span>
|
|
</a-tooltip>
|
|
</template>
|
|
|
|
</template>
|
|
</a-table>
|
|
<div class="tableBox">
|
|
<div class="pa">
|
|
<a-pagination
|
|
v-if="tableDataTotal > 10"
|
|
:showSizeChanger="false"
|
|
showQuickJumper="true"
|
|
hideOnSinglePage="true"
|
|
:pageSize="pageSize"
|
|
v-model:current="pageNo"
|
|
:total="tableDataTotal"
|
|
class="pagination"
|
|
@change="changePagination"
|
|
rowKey="id"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import { ref, toRefs, reactive, onMounted } from "vue";
|
|
import * as api from "../../api/indexOvervoew";
|
|
import downLoad from "../../utils/downLoad";
|
|
import axios from "axios";
|
|
import dayjs from "dayjs";
|
|
import { message } from "ant-design-vue";
|
|
import Cookies from "vue-cookies";
|
|
export default {
|
|
name: "OvervoeW",
|
|
setup() {
|
|
const state = reactive({
|
|
tableLoading: false, // table加载图标
|
|
tableDataTotal: 0, // 数据总条数
|
|
pageSize: 10, // 每页条数
|
|
pageNo: 1, //当前页码
|
|
currentTab: 0,
|
|
creator: "", //创建者
|
|
orgId: null, // 组织Id
|
|
name: "", //名称
|
|
selectedRowKeys: [], // 选中的列
|
|
option: [],
|
|
});
|
|
// 获取tab数据
|
|
const getTabData = async () => {
|
|
const res = await api.boeuAllTotal({});
|
|
if (res) {
|
|
const list = [
|
|
{ text: "项目", num: res.data?.projectTotal },
|
|
{ text: "学习路径图", num: res.data?.routerTotal },
|
|
{ text: "授课", num: res.data?.teachingTotal },
|
|
{ text: "课程", num: res.data?.courseTotal },
|
|
{ text: "考试", num: res.data?.examTotal },
|
|
{ text: "案例", num: res.data?.caseTotal },
|
|
];
|
|
tabData.value = list;
|
|
}
|
|
};
|
|
// 重置按钮
|
|
const reset = async () => {
|
|
state.creator = "";
|
|
state.name = "";
|
|
state.orgId = null;
|
|
getTableData();
|
|
};
|
|
//请求组织接口
|
|
const getOrgList = async () => {
|
|
const res = await api.userGetUserOrg({});
|
|
if (res) {
|
|
const list = res.data?.result?.map((item) => {
|
|
return {
|
|
label: item.orgName,
|
|
value: item.orgId,
|
|
};
|
|
});
|
|
state.option = list;
|
|
getOrgId()
|
|
}
|
|
};
|
|
// 导出按钮
|
|
const exportClick = async () => {
|
|
if (!state.selectedRowKeys?.length) {
|
|
return message.warning("请至少选择一条数据进行导出");
|
|
} else {
|
|
if (state.currentTab === 5) {
|
|
axios({
|
|
method: "get",
|
|
url: "/report/boeu/case/export",
|
|
params: { ids: `${state.selectedRowKeys}` },
|
|
responseType: "blob",
|
|
headers: {
|
|
token: Cookies.get("token"),
|
|
},
|
|
}).then((res) => {
|
|
downLoad(res.data, "案例.xlsx");
|
|
});
|
|
} else if (state.currentTab === 4) {
|
|
axios({
|
|
method: "get",
|
|
url: "/report/boeu/exam/export",
|
|
params: { ids: `${state.selectedRowKeys}` },
|
|
responseType: "blob",
|
|
headers: {
|
|
token: Cookies.get("token"),
|
|
},
|
|
}).then((res) => {
|
|
downLoad(res.data, "考试.xlsx");
|
|
});
|
|
} else if (state.currentTab === 3) {
|
|
axios({
|
|
method: "get",
|
|
url: "/report/boeu/course/export",
|
|
params: { ids: `${state.selectedRowKeys}` },
|
|
responseType: "blob",
|
|
headers: {
|
|
token: Cookies.get("token"),
|
|
},
|
|
}).then((res) => {
|
|
downLoad(res.data, "课程.xlsx");
|
|
});
|
|
} else if (state.currentTab === 2) {
|
|
axios({
|
|
method: "get",
|
|
url: "/report/boeu/teaching/export",
|
|
params: { ids: `${state.selectedRowKeys}` },
|
|
responseType: "blob",
|
|
headers: {
|
|
token: Cookies.get("token"),
|
|
},
|
|
}).then((res) => {
|
|
downLoad(res.data, "授课.xlsx");
|
|
});
|
|
} else if (state.currentTab === 1) {
|
|
axios({
|
|
method: "get",
|
|
url: "/report/boeu/router/export",
|
|
params: { ids: `${state.selectedRowKeys}` },
|
|
responseType: "blob",
|
|
headers: {
|
|
token: Cookies.get("token"),
|
|
},
|
|
}).then((res) => {
|
|
downLoad(res.data, "学习路径图.xlsx");
|
|
});
|
|
} else if (state.currentTab === 0) {
|
|
axios({
|
|
method: "get",
|
|
url: "/report/boeu/project/export",
|
|
params: { ids: `${state.selectedRowKeys}` },
|
|
responseType: "blob",
|
|
headers: {
|
|
token: Cookies.get("token"),
|
|
},
|
|
}).then((res) => {
|
|
downLoad(res.data, "项目.xlsx");
|
|
});
|
|
}
|
|
}
|
|
};
|
|
// table选中
|
|
const onSelectChange = (selectedRowKeys) => {
|
|
state.selectedRowKeys = selectedRowKeys;
|
|
};
|
|
// 表格数据
|
|
let tableData = ref([]);
|
|
const getTableData = async () => {
|
|
state.tableLoading = true;
|
|
if (state.currentTab === 4) {
|
|
//考试列表
|
|
const res = await api.boeuExamPageList({
|
|
creator: state.creator,
|
|
orgId: state.orgId,
|
|
testName: state.name,
|
|
page: state.pageNo,
|
|
size: state.pageSize,
|
|
});
|
|
if (res) {
|
|
state.tableDataTotal = res.data.total;
|
|
const list = res.data.rows?.map((item) => {
|
|
return {
|
|
key: item.id,
|
|
...item,
|
|
};
|
|
});
|
|
tableData.value = list;
|
|
state.tableLoading = false;
|
|
}
|
|
} else if (state.currentTab === 5) {
|
|
//案例列表
|
|
const res = await api.boeuCasePageList({
|
|
author: state.creator,
|
|
orgId: state.orgId,
|
|
title: state.name,
|
|
page: state.pageNo,
|
|
size: state.pageSize,
|
|
});
|
|
if (res) {
|
|
state.tableDataTotal = res.data.total;
|
|
const list = res.data.rows?.map((item) => {
|
|
return {
|
|
key: item.id,
|
|
...item,
|
|
};
|
|
});
|
|
tableData.value = list;
|
|
state.tableLoading = false;
|
|
}
|
|
} else if (state.currentTab === 3) {
|
|
const res = await api.boeuCoursePageList({
|
|
page: state.pageNo,
|
|
size: state.pageSize,
|
|
name: state.name,
|
|
organizationId: state.orgId,
|
|
createName: state.creator,
|
|
});
|
|
const list = res.data.rows.map((item) => {
|
|
return {
|
|
key: item.boeCourseId,
|
|
...item,
|
|
};
|
|
});
|
|
tableData.value = list;
|
|
state.tableDataTotal = res.data.total;
|
|
state.tableLoading = false;
|
|
} else if (state.currentTab === 2) {
|
|
const res = await api.boeuTeachingPageList({
|
|
page: state.pageNo,
|
|
size: state.pageSize,
|
|
teachingName: state.name,
|
|
orgId: state.orgId,
|
|
createName: state.creator,
|
|
});
|
|
const list = res.data.rows?.map((item) => {
|
|
return {
|
|
key: item.boeOffcoursePlanId,
|
|
...item,
|
|
};
|
|
});
|
|
tableData.value = list;
|
|
state.tableDataTotal = res.data.total;
|
|
state.tableLoading = false;
|
|
} else if (state.currentTab === 1) {
|
|
const res = await api.boeuRoterPageList({
|
|
page: state.pageNo,
|
|
size: state.pageSize,
|
|
routerName: state.name,
|
|
orgId: state.orgId,
|
|
createName: state.creator,
|
|
});
|
|
const list = res.data.rows?.map((item) => {
|
|
return {
|
|
key: item.boeRouterInfoId,
|
|
...item,
|
|
};
|
|
});
|
|
tableData.value = list;
|
|
state.tableLoading = false;
|
|
state.tableDataTotal = res.data.total;
|
|
} else if (state.currentTab === 0) {
|
|
const res = await api.boeuProjectPageList({
|
|
page: state.pageNo,
|
|
size: state.pageSize,
|
|
orgId: state.orgId,
|
|
createName: state.creator,
|
|
projectName: state.name,
|
|
});
|
|
|
|
const fun = (arr) => {
|
|
const list = arr.map((item) => {
|
|
let children;
|
|
if (item?.reportProjectOverview?.length) {
|
|
children = fun(item.reportProjectOverview);
|
|
}
|
|
return {
|
|
key: item.boeProjectInfoId,
|
|
children: children,
|
|
...item,
|
|
};
|
|
});
|
|
return list;
|
|
};
|
|
tableData.value = fun(res.data.rows);
|
|
state.tableDataTotal = res.data.total;
|
|
state.tableLoading = false;
|
|
}
|
|
};
|
|
const searchClick = () => {
|
|
state.pageNo = 1;
|
|
state.pageSize = 10;
|
|
state.tableDataTotal = 0;
|
|
getTableData();
|
|
};
|
|
// cloumns 表头
|
|
const columns = ref([
|
|
{
|
|
title: "名称",
|
|
dataIndex: "projectName",
|
|
key: "projectName",
|
|
width: 120,
|
|
ellipsis: true,
|
|
align: "left",
|
|
fixed: "left",
|
|
},
|
|
{
|
|
title: "归属组织",
|
|
dataIndex: "sourceBelongName",
|
|
ellipsis: true,
|
|
key: "sourceBelongName",
|
|
width: 120,
|
|
align: "center",
|
|
fixed: "left",
|
|
},
|
|
{
|
|
title: "分类",
|
|
dataIndex: "trainingType",
|
|
ellipsis: true,
|
|
key: "trainingType",
|
|
width: 120,
|
|
align: "center",
|
|
fixed: "left",
|
|
},
|
|
{
|
|
title: "阶段总数",
|
|
dataIndex: "stageTotal",
|
|
ellipsis: true,
|
|
key: "stageTotal",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "任务总数",
|
|
dataIndex: "taskTotal",
|
|
ellipsis: true,
|
|
key: "taskTotal",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "学习人数",
|
|
dataIndex: "startLearnerTotal",
|
|
ellipsis: true,
|
|
key: "startLearnerTotal",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "完成人数",
|
|
dataIndex: "peopleCompletedTotal",
|
|
ellipsis: true,
|
|
key: "peopleCompletedTotal",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "项目时间",
|
|
dataIndex: "proTime",
|
|
ellipsis: true,
|
|
key: "proTime",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "发布时间",
|
|
dataIndex: "publishTime",
|
|
ellipsis: true,
|
|
key: "publishTime",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "状态",
|
|
dataIndex: "status",
|
|
ellipsis: true,
|
|
key: "projectStatus",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "创建人",
|
|
dataIndex: "createName",
|
|
ellipsis: true,
|
|
key: "manager",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
]);
|
|
const tabData = ref([
|
|
{ text: "项目", num: "2" },
|
|
{ text: "学习路径图", num: "6" },
|
|
{ text: "授课", num: "8" },
|
|
{ text: "课程", num: "11" },
|
|
{ text: "考试", num: "10" },
|
|
{ text: "案例", num: "10" },
|
|
]);
|
|
const tabClick = (index) => {
|
|
state.selectedRowKeys = [];
|
|
state.currentTab = index;
|
|
state.pageNo = 1;
|
|
state.pageSize = 10;
|
|
state.tableDataTotal = 0;
|
|
tableData.value = [];
|
|
if (index === 0) {
|
|
columns.value = [
|
|
{
|
|
title: "名称",
|
|
dataIndex: "projectName",
|
|
key: "projectName",
|
|
width: 120,
|
|
ellipsis: true,
|
|
align: "left",
|
|
fixed: "left",
|
|
},
|
|
{
|
|
title: "归属组织",
|
|
dataIndex: "sourceBelongName",
|
|
ellipsis: true,
|
|
key: "sourceBelongName",
|
|
width: 120,
|
|
align: "center",
|
|
fixed: "left",
|
|
},
|
|
{
|
|
title: "分类",
|
|
dataIndex: "trainingType",
|
|
ellipsis: true,
|
|
key: "trainingType",
|
|
width: 120,
|
|
align: "center",
|
|
fixed: "left",
|
|
},
|
|
{
|
|
title: "阶段总数",
|
|
dataIndex: "stageTotal",
|
|
ellipsis: true,
|
|
key: "stageTotal",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "任务总数",
|
|
dataIndex: "taskTotal",
|
|
ellipsis: true,
|
|
key: "taskTotal",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "学习人数",
|
|
dataIndex: "startLearnerTotal",
|
|
ellipsis: true,
|
|
key: "startLearnerTotal",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "完成人数",
|
|
dataIndex: "peopleCompletedTotal",
|
|
ellipsis: true,
|
|
key: "peopleCompletedTotal",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "项目时间",
|
|
dataIndex: "proTime",
|
|
ellipsis: true,
|
|
key: "proTime",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "发布时间",
|
|
dataIndex: "publishTime",
|
|
ellipsis: true,
|
|
key: "publishTime",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "状态",
|
|
dataIndex: "status",
|
|
ellipsis: true,
|
|
key: "projectStatus",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "创建人",
|
|
dataIndex: "createName",
|
|
ellipsis: true,
|
|
key: "manager",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
];
|
|
} else if (index === 4) {
|
|
columns.value = [
|
|
{
|
|
title: "名称",
|
|
dataIndex: "testName",
|
|
key: "id",
|
|
width: 120,
|
|
ellipsis: true,
|
|
align: "left",
|
|
fixed: "left",
|
|
},
|
|
{
|
|
title: "归属组织",
|
|
dataIndex: "resOwner",
|
|
ellipsis: true,
|
|
|
|
width: 120,
|
|
align: "center",
|
|
fixed: "left",
|
|
},
|
|
{
|
|
title: "参加人数",
|
|
dataIndex: "totalNumber",
|
|
ellipsis: true,
|
|
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "考试人数",
|
|
dataIndex: "numOfAnswer",
|
|
ellipsis: true,
|
|
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "题量",
|
|
dataIndex: "numOfQuest",
|
|
ellipsis: true,
|
|
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "通过人数",
|
|
dataIndex: "numOfPass",
|
|
ellipsis: true,
|
|
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "通过率",
|
|
dataIndex: "passRate",
|
|
ellipsis: true,
|
|
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "发布时间",
|
|
dataIndex: "publishTime",
|
|
ellipsis: true,
|
|
key: "publishTime",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "状态",
|
|
dataIndex: "examStatus",
|
|
ellipsis: true,
|
|
key: "examStatus",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "创建人",
|
|
dataIndex: "creator",
|
|
ellipsis: true,
|
|
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
];
|
|
} else if (index === 5) {
|
|
columns.value = [
|
|
{
|
|
title: "名称",
|
|
dataIndex: "title",
|
|
ellipsis: true,
|
|
},
|
|
{
|
|
title: "归属组织",
|
|
dataIndex: "orgDomain",
|
|
ellipsis: true,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "专业分类",
|
|
dataIndex: "majorType",
|
|
ellipsis: true,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "浏览量",
|
|
dataIndex: "views",
|
|
ellipsis: true,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "点赞量",
|
|
dataIndex: "praises",
|
|
ellipsis: true,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "收藏量",
|
|
dataIndex: "favorites",
|
|
ellipsis: true,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "评论量",
|
|
dataIndex: "comments",
|
|
ellipsis: true,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "发布时间",
|
|
dataIndex: "sysCreateTime",
|
|
key:'sysCreateTime',
|
|
ellipsis: true,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "创建人/作者",
|
|
dataIndex: "authorName",
|
|
ellipsis: true,
|
|
align: "center",
|
|
},
|
|
];
|
|
} else if (index === 3) {
|
|
columns.value = [
|
|
{
|
|
title: "名称",
|
|
dataIndex: "name",
|
|
key: "name",
|
|
width: 120,
|
|
ellipsis: true,
|
|
align: "left",
|
|
fixed: "left",
|
|
},
|
|
{
|
|
title: "归属组织",
|
|
dataIndex: "organizationName",
|
|
ellipsis: true,
|
|
key: "organizationName",
|
|
width: 120,
|
|
align: "center",
|
|
fixed: "left",
|
|
},
|
|
{
|
|
title: "类型",
|
|
dataIndex: "courseType",
|
|
ellipsis: true,
|
|
key: "courseType",
|
|
width: 120,
|
|
align: "center",
|
|
fixed: "left",
|
|
},
|
|
{
|
|
title: "授课教师",
|
|
dataIndex: "teacher",
|
|
ellipsis: true,
|
|
key: "teacher",
|
|
width: 120,
|
|
align: "center",
|
|
fixed: "left",
|
|
},
|
|
{
|
|
title: "评论数",
|
|
dataIndex: "commentTotal",
|
|
ellipsis: true,
|
|
key: "commentTotal",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "浏览量",
|
|
dataIndex: "viewTotal",
|
|
ellipsis: true,
|
|
key: "viewTotal",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "开课次数",
|
|
dataIndex: "classTotal",
|
|
ellipsis: true,
|
|
key: "classTotal",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "学习人数",
|
|
dataIndex: "learnerNumber",
|
|
ellipsis: true,
|
|
key: "learnerNumber",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "学习时长(分钟)",
|
|
dataIndex: "studyTime",
|
|
ellipsis: true,
|
|
key: "studyTime",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "完成人数",
|
|
dataIndex: "completionNumber",
|
|
ellipsis: true,
|
|
key: "completionNumber",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "发布时间",
|
|
dataIndex: "publishTime",
|
|
ellipsis: true,
|
|
key: "publishTime",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "状态",
|
|
dataIndex: "publishStatus",
|
|
ellipsis: true,
|
|
key: "classStatus",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "创建人",
|
|
dataIndex: "createName",
|
|
ellipsis: true,
|
|
key: "createName",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
];
|
|
} else if (index === 2) {
|
|
columns.value = [
|
|
{
|
|
title: "开课名称",
|
|
dataIndex: "name",
|
|
key: "name",
|
|
width: 120,
|
|
ellipsis: true,
|
|
align: "left",
|
|
fixed: "left",
|
|
},
|
|
{
|
|
title: "归属组织",
|
|
dataIndex: "organizationName",
|
|
ellipsis: true,
|
|
key: "age",
|
|
width: 120,
|
|
align: "center",
|
|
fixed: "left",
|
|
},
|
|
{
|
|
title: "分类",
|
|
dataIndex: "typeName",
|
|
ellipsis: true,
|
|
key: "typeName",
|
|
width: 120,
|
|
align: "center",
|
|
fixed: "left",
|
|
},
|
|
{
|
|
title: "授课时长(分钟)",
|
|
dataIndex: "teachingLength",
|
|
ellipsis: true,
|
|
key: "teachingLength",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "创建时间",
|
|
dataIndex: "createTime",
|
|
ellipsis: true,
|
|
key: "createTime",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "状态",
|
|
dataIndex: "status",
|
|
ellipsis: true,
|
|
key: "teachingStatus",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "创建人",
|
|
dataIndex: "createName",
|
|
ellipsis: true,
|
|
key: "createName",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
];
|
|
} else if (index === 1) {
|
|
columns.value = [
|
|
{
|
|
title: "名称",
|
|
dataIndex: "boeRouterInfoName",
|
|
key: "boeRouterInfoName",
|
|
width: 120,
|
|
ellipsis: true,
|
|
align: "left",
|
|
fixed: "left",
|
|
},
|
|
{
|
|
title: "归属组织",
|
|
dataIndex: "organizationName",
|
|
ellipsis: true,
|
|
key: "organizationName",
|
|
width: 120,
|
|
align: "center",
|
|
fixed: "left",
|
|
},
|
|
{
|
|
title: "关卡总数",
|
|
dataIndex: "levelTotal",
|
|
ellipsis: true,
|
|
key: "levelTotal",
|
|
width: 120,
|
|
align: "center",
|
|
fixed: "left",
|
|
},
|
|
{
|
|
title: "任务总数",
|
|
dataIndex: "taskTotal",
|
|
ellipsis: true,
|
|
key: "taskTotal",
|
|
width: 120,
|
|
align: "center",
|
|
fixed: "left",
|
|
},
|
|
{
|
|
title: "学习人数",
|
|
dataIndex: "learnerNumber",
|
|
ellipsis: true,
|
|
key: "learnerNumber",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "完成人数",
|
|
dataIndex: "completionNumber",
|
|
ellipsis: true,
|
|
key: "completionNumber",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "发布时间",
|
|
dataIndex: "createTime",
|
|
ellipsis: true,
|
|
key: "createTime",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "状态",
|
|
dataIndex: "status",
|
|
ellipsis: true,
|
|
key: "boeRouterStatus",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
{
|
|
title: "创建人",
|
|
dataIndex: "createName",
|
|
ellipsis: true,
|
|
key: "createName",
|
|
width: 120,
|
|
align: "center",
|
|
},
|
|
];
|
|
}
|
|
getTableData();
|
|
};
|
|
// 获取登录人员组织
|
|
const getOrgId=async()=>{
|
|
const res =await api.userInfo({})
|
|
if(res){
|
|
state.orgId=res.data.result.departId
|
|
getTableData();
|
|
}
|
|
}
|
|
//table 分页事件
|
|
const changePagination = (page) => {
|
|
state.selectedRowKeys = [];
|
|
state.pageNo = page;
|
|
getTableData();
|
|
};
|
|
// columns展开事件
|
|
const expandTable = (e, a) => {
|
|
console.log("e", e, a);
|
|
};
|
|
onMounted(() => {
|
|
state.tableLoading=true
|
|
getTabData();
|
|
getOrgList();
|
|
});
|
|
return {
|
|
getTabData,
|
|
reset,
|
|
getOrgList,
|
|
onSelectChange,
|
|
dayjs,
|
|
searchClick,
|
|
...toRefs(state),
|
|
tableData,
|
|
columns,
|
|
tabData,
|
|
tabClick,
|
|
changePagination,
|
|
expandTable,
|
|
exportClick,
|
|
};
|
|
},
|
|
};
|
|
</script>
|
|
<style lang="scss">
|
|
.overvoew {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
.filter {
|
|
margin-left: 38px;
|
|
margin-right: 20px;
|
|
margin-top: 30px;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
.select {
|
|
margin-right: 20px;
|
|
margin-bottom: 20px;
|
|
width: calc((100% - 76px - 220px) / 3);
|
|
}
|
|
|
|
.btn {
|
|
padding: 0px 26px 0px 26px;
|
|
height: 38px;
|
|
background: rgba(64, 158, 255, 0);
|
|
border-radius: 8px;
|
|
border: 1px solid rgba(64, 158, 255, 1);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-right: 14px;
|
|
flex-shrink: 0;
|
|
cursor: pointer;
|
|
|
|
.search {
|
|
background-size: 100%;
|
|
}
|
|
|
|
.btnText {
|
|
font-size: 14px;
|
|
font-weight: 400;
|
|
color: rgba(64, 158, 255, 1);
|
|
line-height: 36px;
|
|
margin-left: 5px;
|
|
}
|
|
}
|
|
|
|
.btnn {
|
|
padding: 0px 26px 0px 26px;
|
|
height: 38px;
|
|
background: #4ea6ff;
|
|
border-radius: 8px;
|
|
border: 1px solid rgba(64, 158, 255, 1);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-right: 14px;
|
|
flex-shrink: 0;
|
|
cursor: pointer;
|
|
|
|
.search {
|
|
background-size: 100%;
|
|
}
|
|
|
|
.btnText {
|
|
font-size: 14px;
|
|
font-weight: 400;
|
|
color: #ffffff;
|
|
line-height: 36px;
|
|
margin-left: 5px;
|
|
}
|
|
}
|
|
|
|
.btn1 {
|
|
.search {
|
|
width: 15px;
|
|
height: 17px;
|
|
background-image: url("../../assets/images/courseManage/search0.png");
|
|
}
|
|
}
|
|
|
|
.btn2 {
|
|
margin-right: 0px !important;
|
|
.search {
|
|
width: 16px;
|
|
height: 18px;
|
|
background-image: url("../../assets/images/courseManage/reset1.png");
|
|
}
|
|
}
|
|
|
|
.btn1:hover {
|
|
background: rgba(64, 158, 255, 0.76);
|
|
|
|
.search {
|
|
background-image: url("../../assets/images/courseManage/search0.png");
|
|
}
|
|
|
|
.btnText {
|
|
color: #ffffff;
|
|
}
|
|
}
|
|
|
|
.btn1:active {
|
|
background: #0982ff;
|
|
}
|
|
|
|
.btn2:hover {
|
|
background: rgba(64, 158, 255, 0.1);
|
|
}
|
|
|
|
.btn2:active {
|
|
background: rgba(64, 158, 255, 0.2);
|
|
}
|
|
}
|
|
.tabBtn {
|
|
width: 100%;
|
|
height: 40px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
.tab {
|
|
margin-left: 38px;
|
|
display: flex;
|
|
background: #ecf5ff;
|
|
height: 40px;
|
|
line-height: 40px;
|
|
border-radius: 8px;
|
|
.tabItem {
|
|
box-sizing: border-box;
|
|
padding: 0 18px;
|
|
cursor: pointer;
|
|
}
|
|
.tabActive {
|
|
box-sizing: border-box;
|
|
padding: 0 18px;
|
|
background: #387df7;
|
|
color: white;
|
|
border-radius: 8px;
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
.btns {
|
|
display: flex;
|
|
margin-right: 38px;
|
|
// flex-wrap: wrap;
|
|
.btn {
|
|
padding: 0px 26px 0px 26px;
|
|
height: 38px;
|
|
background: white;
|
|
border-radius: 8px;
|
|
border: 1px solid rgba(64, 158, 255, 1);
|
|
display: flex;
|
|
align-items: center;
|
|
cursor: pointer;
|
|
justify-content: center;
|
|
margin-right: 14px;
|
|
flex-shrink: 0;
|
|
|
|
.search {
|
|
background-size: 100%;
|
|
}
|
|
|
|
.btnText {
|
|
font-size: 14px;
|
|
font-weight: 400;
|
|
color: #4ea6ff;
|
|
line-height: 36px;
|
|
margin-left: 5px;
|
|
}
|
|
}
|
|
|
|
.btn3 {
|
|
margin-right: 0px;
|
|
.search {
|
|
width: 17px;
|
|
height: 18px;
|
|
background-image: url("../../assets/images/courseManage/add0.png");
|
|
}
|
|
}
|
|
|
|
.btn3:hover {
|
|
// background: rgba(64, 158, 255, 0.76);
|
|
background: rgba(64, 158, 255, 0.2);
|
|
}
|
|
}
|
|
}
|
|
|
|
.tableBox {
|
|
margin: 20px 38px 30px;
|
|
|
|
.ant-table-thead > tr > th {
|
|
background-color: #eff4fc;
|
|
}
|
|
}
|
|
.tableBox {
|
|
padding-bottom: 20px;
|
|
|
|
.pa {
|
|
// position: absolute;
|
|
// bottom: 20px;
|
|
// left: 0;
|
|
width: 100%;
|
|
// height: 20px;
|
|
// background-color: red;
|
|
display: flex;
|
|
justify-content: center;
|
|
// margin-bottom: 10px;
|
|
// position: absolute;
|
|
// bottom: -40px;
|
|
}
|
|
}
|
|
}
|
|
</style>
|