mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-15 22:06:45 +08:00
style:修改左侧导航及头部导航栏,创建左侧导航相关页面
This commit is contained in:
@@ -1,16 +1,316 @@
|
||||
<!-- 课程管理页面 -->
|
||||
<template>
|
||||
<div class="coursewareManage"></div>
|
||||
<div class="coursewareManage">
|
||||
<div
|
||||
style="width: calc(100% - 76px); margin: 19px 0px 30px 38px"
|
||||
class="tableBox"
|
||||
>
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:data-source="tableData"
|
||||
:row-selection="rowSelection"
|
||||
:loading="tableDataTotal === -1 ? true : false"
|
||||
:scroll="{ x: 700, y: 800 }"
|
||||
:pagination="{
|
||||
showSizeChanger: true,
|
||||
showQuickJumper: true,
|
||||
hideOnSinglePage: true,
|
||||
pageSizeOptions: [],
|
||||
pageSize: pageSize,
|
||||
current: currentPage,
|
||||
total: tableDataTotal,
|
||||
onChange: (page, pageSize) => {
|
||||
currentPage = page;
|
||||
// console.log('page', page)
|
||||
// 加翻页查找代码
|
||||
// this.setState({
|
||||
// currentPage: page,
|
||||
// }, () => {
|
||||
// this.getMilitaryDeployment()
|
||||
// })
|
||||
},
|
||||
}"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { reactive, toRefs } from "vue";
|
||||
import { reactive, toRefs, ref } from "vue";
|
||||
const columns = [
|
||||
{
|
||||
title: "项目名称",
|
||||
dataIndex: "projectName",
|
||||
key: "projectName",
|
||||
width: 280,
|
||||
},
|
||||
{
|
||||
title: "项目经理",
|
||||
dataIndex: "manager",
|
||||
key: "manager",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: "状态",
|
||||
dataIndex: "state",
|
||||
// width: "30%",
|
||||
key: "state",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: "创建人",
|
||||
dataIndex: "creater",
|
||||
// width: "30%",
|
||||
key: "creater",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: "创建时间",
|
||||
dataIndex: "time",
|
||||
key: "time",
|
||||
width: 180,
|
||||
},
|
||||
{
|
||||
title: "操作",
|
||||
dataIndex: "opacation",
|
||||
key: "opacation",
|
||||
width: 300,
|
||||
},
|
||||
];
|
||||
const rowSelection = ref({
|
||||
checkStrictly: false,
|
||||
onChange: (selectedRowKeys, selectedRows) => {
|
||||
console.log(
|
||||
`selectedRowKeys: ${selectedRowKeys}`,
|
||||
"selectedRows: ",
|
||||
selectedRows
|
||||
);
|
||||
},
|
||||
onSelect: (record, selected, selectedRows) => {
|
||||
console.log(record, selected, selectedRows);
|
||||
},
|
||||
onSelectAll: (selected, selectedRows, changeRows) => {
|
||||
console.log(selected, selectedRows, changeRows);
|
||||
},
|
||||
});
|
||||
|
||||
export default {
|
||||
name: "CoursewareManage",
|
||||
name: "coursewareManage",
|
||||
setup() {
|
||||
const state = reactive({});
|
||||
const state = reactive({
|
||||
tableData: [
|
||||
{
|
||||
id: 1,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
children: [
|
||||
{
|
||||
id: 5,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
children: [
|
||||
{
|
||||
id: 7,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
hasChildren: true,
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
state: "草稿",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
currentPage: 1,
|
||||
tableDataTotal: 20,
|
||||
pageSize: 10,
|
||||
});
|
||||
return {
|
||||
...toRefs(state),
|
||||
columns,
|
||||
rowSelection,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss"></style>
|
||||
<style lang="scss">
|
||||
.coursewareManage {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user