门户改版代码提交

This commit is contained in:
jiangzhe 2024-07-22 10:34:23 +08:00
parent 2c9e873408
commit 9a96d2517f
9 changed files with 384 additions and 282 deletions

View File

@ -22,9 +22,6 @@
<style scoped lang='scss'>
.app_footer {
overflow: hidden;
background-color: #fff;
padding-top: 20px;
.extra {
background-color: #1F6682;

View File

@ -196,7 +196,7 @@ const handleSubjectClick = (item) => {
grid-template-columns: repeat(4, 1fr);
gap: 10px;
width: 1240px;
height: 300px;
height: 220px;
background-color: #D7F3EE;
border-radius: 10px;
padding: 10px;
@ -220,7 +220,7 @@ const handleSubjectClick = (item) => {
.stat-item-img {
border-radius: 10px;
background-color: #D4F3ED;
height: 180px;
height: 100px;
margin-top: 20px;
display: flex;
justify-content: center;
@ -236,8 +236,8 @@ const handleSubjectClick = (item) => {
}
.column {
height: 290px;
margin-top: 20px;
height: 280px;
margin-top: 10px;
::v-deep() {
.el-card {
@ -277,7 +277,7 @@ const handleSubjectClick = (item) => {
padding: 0;
.class-book {
height: 95px;
height: 70px;
display: grid;
grid-template-columns: repeat(12, 1fr);
gap: 8px;

View File

@ -4,9 +4,24 @@ import LayoutFooter from './components/LayoutFooter.vue'
</script>
<template>
<LayoutHeader />
<!-- 添加key 破坏复用机制 强制销毁重建 -->
<!-- <RouterView :key="$route.fullPath" /> -->
<RouterView />
<LayoutFooter />
</template>
<div class="box">
<LayoutHeader />
<!-- 添加key 破坏复用机制 强制销毁重建 -->
<!-- <RouterView :key="$route.fullPath" /> -->
<RouterView class="content" />
<LayoutFooter class="footer" />
</div>
</template>
<style scoped lang="scss">
.box {
height: 100vh;
display: flex;
flex-direction: column;
justify-content: space-between;
.content {
flex: 1;
}
}
</style>

View File

@ -1,38 +1,47 @@
<template>
<MyHeader></MyHeader>
<div class="container">
<el-card v-loading="loading" element-loading-text="数据加载中...">
<div class="book-grid" v-if="resourceList.length > 0">
<el-card v-for="item in resourceList">
<div class="book-content" @click="goto(item)">
<img class="file-type" src="@/assets/images/word.png" alt="">
<img src="@/assets/images/book.png" alt="">
</div>
<template #footer>
<div class="book-title">{{ item.fileName }}</div>
<div class="book-des">
<div class="book-teacher">
<el-space spacer="|">
<span>{{ item.createBy }}</span>
<span>{{ item.createDept }}</span>
</el-space>
</div>
<div class="book-view">
<el-icon @click="handleCollect(item)">
<Pointer :color="item.isCollect ? '#FE4A4B' : ''" />
</el-icon>
</div>
</div>
</template>
</el-card>
<div class="my-container">
<MyHeader></MyHeader>
<div class="container">
<div class="bread-container">
<el-breadcrumb separator=">">
<el-breadcrumb-item :to="{ path: '/myUpload' }">个人中心</el-breadcrumb-item>
<el-breadcrumb-item>我的收藏</el-breadcrumb-item>
</el-breadcrumb>
</div>
<el-empty v-else description="暂无数据" />
<el-pagination class="book-page" background layout="prev, pager, next, sizes,jumper" :total="total"
@current-change="handleCurrentChange" @size-change="handleSizeChange" />
</el-card>
<el-card v-loading="loading" element-loading-text="数据加载中...">
<div class="book-grid" v-if="resourceList.length > 0">
<el-card v-for="item in resourceList">
<div class="book-content" @click="goto(item)">
<img class="file-type" src="@/assets/images/word.png" alt="">
<img src="@/assets/images/book.png" alt="">
</div>
<template #footer>
<div class="book-title">{{ item.fileName }}</div>
<div class="book-des">
<div class="book-teacher">
<el-space spacer="|">
<span>{{ item.createBy }}</span>
<span>{{ item.createDept }}</span>
</el-space>
</div>
<div class="book-view">
<el-icon @click="handleCollect(item)">
<Pointer :color="item.isCollect ? '#FE4A4B' : ''" />
</el-icon>
</div>
</div>
</template>
</el-card>
</div>
<el-empty v-else description="暂无数据" />
<el-pagination class="book-page" background layout="prev, pager, next, sizes,jumper" :total="total"
@current-change="handleCurrentChange" @size-change="handleSizeChange" />
</el-card>
</div>
<MyFooter></MyFooter>
</div>
<MyFooter></MyFooter>
</template>
<script setup>
@ -75,7 +84,7 @@ const handleSizeChange = (val) => {
}
const goto = (item) => {
router.push({ path: 'subjectDetail', query: { id: item.id } })
// router.push({ path: 'subjectDetail', query: { id: item.id } })
}
const handleCollect = async (item) => {
@ -94,42 +103,62 @@ const handleCollect = async (item) => {
</script>
<style lang="scss" scoped>
.container {
.book-grid {
margin-top: 10px;
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-template-rows: repeat(2, 1fr);
gap: 7px;
.my-container {
height: 100vh;
display: flex;
flex-direction: column;
justify-content: space-between;
.book-content {
position: relative;
.container {
.bread-container {
padding: 25px 0;
.file-type {
position: absolute;
top: 0;
left: 0;
width: 25px;
:deep(.el-breadcrumb__inner) {
color: #fff;
font-size: 16px;
}
:deep(.el-breadcrumb__separator) {
color: #fff;
}
}
.book-title {
font-size: 16px;
font-weight: bold;
.book-grid {
margin-top: 10px;
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-template-rows: repeat(2, 1fr);
gap: 7px;
.book-content {
position: relative;
.file-type {
position: absolute;
top: 0;
left: 0;
width: 25px;
}
}
.book-title {
font-size: 16px;
font-weight: bold;
}
.book-des {
display: flex;
justify-content: space-between;
color: #919DA3;
padding: 5px 0;
}
}
.book-des {
.book-page {
margin-top: 20px;
display: flex;
justify-content: space-between;
color: #919DA3;
padding: 5px 0;
justify-content: end
}
}
.book-page {
margin-top: 20px;
display: flex;
justify-content: end
}
}
</style>

View File

@ -1,38 +1,47 @@
<template>
<MyHeader></MyHeader>
<div class="container">
<el-card v-loading="loading" element-loading-text="数据加载中...">
<div class="book-grid" v-if="resourceList.length > 0">
<el-card v-for="item in resourceList">
<div class="book-content" @click="goto(item)">
<img class="file-type" src="@/assets/images/word.png" alt="">
<img src="@/assets/images/book.png" alt="">
</div>
<template #footer>
<div class="book-title">{{ item.fileName }}</div>
<div class="book-des">
<div class="book-teacher">
<el-space spacer="|">
<span>{{ item.createBy }}</span>
<span>{{ item.createDept }}</span>
</el-space>
</div>
<div class="book-view">
<el-icon @click="handleLike(item)">
<Star :color="item.isLike ? '#FE4A4B' : ''" />
</el-icon>
</div>
</div>
</template>
</el-card>
<div class="my-container">
<MyHeader></MyHeader>
<div class="container">
<div class="bread-container">
<el-breadcrumb separator=">">
<el-breadcrumb-item :to="{ path: '/myUpload' }">个人中心</el-breadcrumb-item>
<el-breadcrumb-item>我的点赞</el-breadcrumb-item>
</el-breadcrumb>
</div>
<el-empty v-else description="暂无数据" />
<el-pagination class="book-page" background layout="prev, pager, next, sizes,jumper" :total="total"
@current-change="handleCurrentChange" @size-change="handleSizeChange" />
</el-card>
<el-card v-loading="loading" element-loading-text="数据加载中...">
<div class="book-grid" v-if="resourceList.length > 0">
<el-card v-for="item in resourceList">
<div class="book-content" @click="goto(item)">
<img class="file-type" src="@/assets/images/word.png" alt="">
<img src="@/assets/images/book.png" alt="">
</div>
<template #footer>
<div class="book-title">{{ item.fileName }}</div>
<div class="book-des">
<div class="book-teacher">
<el-space spacer="|">
<span>{{ item.createBy }}</span>
<span>{{ item.createDept }}</span>
</el-space>
</div>
<div class="book-view">
<el-icon @click="handleLike(item)">
<Star :color="item.isLike ? '#FE4A4B' : ''" />
</el-icon>
</div>
</div>
</template>
</el-card>
</div>
<el-empty v-else description="暂无数据" />
<el-pagination class="book-page" background layout="prev, pager, next, sizes,jumper" :total="total"
@current-change="handleCurrentChange" @size-change="handleSizeChange" />
</el-card>
</div>
<MyFooter></MyFooter>
</div>
<MyFooter></MyFooter>
</template>
<script setup>
@ -75,7 +84,7 @@ const handleSizeChange = (val) => {
}
const goto = (item) => {
router.push({ path: 'subjectDetail', query: { id: item.id } })
// router.push({ path: 'subjectDetail', query: { id: item.id } })
}
const handleLike = async (item) => {
@ -94,42 +103,62 @@ const handleLike = async (item) => {
</script>
<style lang="scss" scoped>
.container {
.book-grid {
margin-top: 10px;
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-template-rows: repeat(2, 1fr);
gap: 7px;
.my-container {
height: 100vh;
display: flex;
flex-direction: column;
justify-content: space-between;
.book-content {
position: relative;
.container {
.bread-container {
padding: 25px 0;
.file-type {
position: absolute;
top: 0;
left: 0;
width: 25px;
:deep(.el-breadcrumb__inner) {
color: #fff;
font-size: 16px;
}
:deep(.el-breadcrumb__separator) {
color: #fff;
}
}
.book-title {
font-size: 16px;
font-weight: bold;
.book-grid {
margin-top: 10px;
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-template-rows: repeat(2, 1fr);
gap: 7px;
.book-content {
position: relative;
.file-type {
position: absolute;
top: 0;
left: 0;
width: 25px;
}
}
.book-title {
font-size: 16px;
font-weight: bold;
}
.book-des {
display: flex;
justify-content: space-between;
color: #919DA3;
padding: 5px 0;
}
}
.book-des {
.book-page {
margin-top: 20px;
display: flex;
justify-content: space-between;
color: #919DA3;
padding: 5px 0;
justify-content: end
}
}
.book-page {
margin-top: 20px;
display: flex;
justify-content: end
}
}
</style>

View File

@ -1,33 +1,41 @@
<template>
<MyHeader></MyHeader>
<div class="container">
<el-card v-loading="loading" element-loading-text="数据加载中...">
<div class="book-grid" v-if="resourceList.length > 0">
<el-card v-for="item in resourceList">
<div class="book-content" @click="goto(item)">
<img class="file-type" src="@/assets/images/word.png" alt="">
<img src="@/assets/images/book.png" alt="">
</div>
<template #footer>
<div class="book-title">{{ item.fileName }}</div>
<div class="book-des">
<div class="book-teacher">
<el-space spacer="|">
<span>{{ item.createBy }}</span>
<span>{{ item.createDept }}</span>
</el-space>
</div>
</div>
</template>
</el-card>
<div class="my-container">
<MyHeader></MyHeader>
<div class="container">
<div class="bread-container">
<el-breadcrumb separator=">">
<el-breadcrumb-item :to="{ path: '/myUpload' }">个人中心</el-breadcrumb-item>
<el-breadcrumb-item>我的收藏</el-breadcrumb-item>
</el-breadcrumb>
</div>
<el-empty v-else description="暂无数据" />
<el-pagination class="book-page" background layout="prev, pager, next, sizes,jumper" :total="total"
@current-change="handleCurrentChange" @size-change="handleSizeChange" />
</el-card>
<el-card v-loading="loading" element-loading-text="数据加载中...">
<div class="book-grid" v-if="resourceList.length > 0">
<el-card v-for="item in resourceList">
<div class="book-content" @click="goto(item)">
<img class="file-type" src="@/assets/images/word.png" alt="">
<img src="@/assets/images/book.png" alt="">
</div>
<template #footer>
<div class="book-title">{{ item.fileName }}</div>
<div class="book-des">
<div class="book-teacher">
<el-space spacer="|">
<span>{{ item.createBy }}</span>
<span>{{ item.createDept }}</span>
</el-space>
</div>
</div>
</template>
</el-card>
</div>
<el-empty v-else description="暂无数据" />
<el-pagination class="book-page" background layout="prev, pager, next, sizes,jumper" :total="total"
@current-change="handleCurrentChange" @size-change="handleSizeChange" />
</el-card>
</div>
<MyFooter></MyFooter>
</div>
<MyFooter></MyFooter>
</template>
<script setup>
@ -70,47 +78,67 @@ const handleSizeChange = (val) => {
}
const goto = (item) => {
router.push({ path: 'subjectDetail', query: { id: item.id } })
// router.push({ path: 'subjectDetail', query: { id: item.id } })
}
</script>
<style lang="scss" scoped>
.container {
.book-grid {
margin-top: 10px;
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-template-rows: repeat(2, 1fr);
gap: 7px;
.my-container {
height: 100vh;
display: flex;
flex-direction: column;
justify-content: space-between;
.book-content {
position: relative;
.container {
.bread-container {
padding: 25px 0;
.file-type {
position: absolute;
top: 0;
left: 0;
width: 25px;
:deep(.el-breadcrumb__inner) {
color: #fff;
font-size: 16px;
}
:deep(.el-breadcrumb__separator) {
color: #fff;
}
}
.book-title {
font-size: 16px;
font-weight: bold;
.book-grid {
margin-top: 10px;
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-template-rows: repeat(2, 1fr);
gap: 7px;
.book-content {
position: relative;
.file-type {
position: absolute;
top: 0;
left: 0;
width: 25px;
}
}
.book-title {
font-size: 16px;
font-weight: bold;
}
.book-des {
display: flex;
justify-content: space-between;
color: #919DA3;
padding: 5px 0;
}
}
.book-des {
.book-page {
margin-top: 20px;
display: flex;
justify-content: space-between;
color: #919DA3;
padding: 5px 0;
justify-content: end
}
}
.book-page {
margin-top: 20px;
display: flex;
justify-content: end
}
}
</style>

View File

@ -1,65 +1,65 @@
<template>
<MyHeader></MyHeader>
<div class="container">
<div class="bread-container">
<el-breadcrumb separator=">">
<el-breadcrumb-item :to="{ path: '/myUpload' }">个人中心</el-breadcrumb-item>
<el-breadcrumb-item>我的上传</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="my-container">
<MyHeader></MyHeader>
<div class="container">
<div class="bread-container">
<el-breadcrumb separator=">">
<el-breadcrumb-item :to="{ path: '/myUpload' }">个人中心</el-breadcrumb-item>
<el-breadcrumb-item>我的上传</el-breadcrumb-item>
</el-breadcrumb>
</div>
<el-card class="news-card" v-loading="loading" element-loading-text="数据加载中...">
<template #header>
<div class="card-header">
<div class="header-search">
<el-space wrap>
<span>名称</span>
<el-input v-model="queryParams.title" style="width: 300px" placeholder="请输入关键词" clearable
@clear="handleClear" />
<el-card class="news-card" v-loading="loading" element-loading-text="数据加载中...">
<template #header>
<div class="card-header">
<div class="header-search">
<el-space wrap>
<span>名称</span>
<el-input v-model="queryParams.title" style="width: 300px" placeholder="请输入关键词" clearable
@clear="handleClear" />
<span>格式</span>
<el-select v-model="queryParams.fileSuffix" placeholder="请选择格式" style="width: 300px"
@keyup.enter="handleQuery">
<el-option v-for="item in formatOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<el-button type="primary" :icon="Search" @click="handleQuery">搜索</el-button>
</el-space>
<span>格式</span>
<el-select v-model="queryParams.fileSuffix" placeholder="请选择格式" style="width: 300px"
@keyup.enter="handleQuery">
<el-option v-for="item in formatOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<el-button type="primary" :icon="Search" @click="handleQuery">搜索</el-button>
</el-space>
</div>
</div>
</div>
</template>
</template>
<el-table v-if="tableData.length > 0" @row-click="handleRowClick" :data="tableData" class="table" stripe>
<el-table-column prop="fileName" label="课件名称" align="center" />
<el-table-column prop="fileSuffix" label="课件格式" align="center" />
<el-table-column prop="volume" label="课件大小" align="center" />
<el-table-column prop="filePath" label="目录" align="center" width="320" />
<el-table-column prop="createTime" label="创建时间" align="center" />
<el-table-column label="操作" align="center">
<template #default="scope">
<el-button link type="primary" @click="preview(scope.row)">预览</el-button>
<el-button link type="primary" @click="downloadFile(scope.row)">下载</el-button>
<el-table v-if="tableData.length > 0" @row-click="handleRowClick" :data="tableData" class="table" stripe>
<el-table-column prop="fileName" label="课件名称" align="center" />
<el-table-column prop="fileSuffix" label="课件格式" align="center" />
<el-table-column prop="volume" label="课件大小" align="center" />
<el-table-column prop="filePath" label="目录" align="center" width="320" />
<el-table-column prop="createTime" label="创建时间" align="center" />
<el-table-column label="操作" align="center">
<template #default="scope">
<el-button link type="primary" @click="preview(scope.row)">预览</el-button>
<el-button link type="primary" @click="downloadFile(scope.row)">下载</el-button>
<el-popconfirm confirm-button-text="确认" cancel-button-text="取消" :icon="InfoFilled" icon-color="#626AEF"
title="确认删除吗?" @confirm="handleDelete(scope.row)">
<template #reference>
<el-button link type="danger">删除</el-button>
</template>
</el-popconfirm>
<el-popconfirm confirm-button-text="确认" cancel-button-text="取消" :icon="InfoFilled" icon-color="#626AEF"
title="确认删除吗?" @confirm="handleDelete(scope.row)">
<template #reference>
<el-button link type="danger">删除</el-button>
</template>
</el-popconfirm>
</template>
</el-table-column>
</el-table>
<el-empty v-else description="暂无数据" />
</template>
</el-table-column>
</el-table>
<el-empty v-else description="暂无数据" />
<template #footer>
<el-pagination class="footer" background layout="prev, pager, next, sizes,jumper" :total="total"
@current-change="handleCurrentChange" @size-change="handleSizeChange" />
</template>
</el-card>
<template #footer>
<el-pagination class="footer" background layout="prev, pager, next, sizes,jumper" :total="total"
@current-change="handleCurrentChange" @size-change="handleSizeChange" />
</template>
</el-card>
</div>
<MyFooter></MyFooter>
</div>
<MyFooter></MyFooter>
</template>
<script setup>
@ -150,16 +150,8 @@ const handleClear = () => {
myUploadListData()
}
const goTarget = (url) => {
window.open(url, '__blank');
}
const handleRowClick = (row) => {
if (row.type == 1) {
goTarget(row.url)
} else {
router.push(`news/${row.trendId}`)
}
}
const preview = (item) => {
@ -181,39 +173,48 @@ const handleDelete = async (row) => {
</script>
<style lang="scss" scoped>
.container {
.bread-container {
padding: 25px 0;
.my-container {
height: 100vh;
display: flex;
flex-direction: column;
justify-content: space-between;
:deep(.el-breadcrumb__inner) {
color: #fff;
font-size: 16px;
}
.container {
flex: 1;
:deep(.el-breadcrumb__separator) {
color: #fff;
}
}
.bread-container {
padding: 25px 0;
.news-card {
margin-top: 20px;
:deep(.el-breadcrumb__inner) {
color: #fff;
font-size: 16px;
}
.card-header {
display: flex;
justify-content: space-between;
.title {
font-size: 20px;
font-weight: bold;
margin-bottom: 5px;
:deep(.el-breadcrumb__separator) {
color: #fff;
}
}
.footer {
display: flex;
justify-content: end;
}
}
.news-card {
margin-top: 20px;
.card-header {
display: flex;
justify-content: space-between;
.title {
font-size: 20px;
font-weight: bold;
margin-bottom: 5px;
}
}
.footer {
display: flex;
justify-content: end;
}
}
}
}
</style>

View File

@ -8,7 +8,10 @@
</div>
<el-collapse v-model="activeNames">
<el-collapse-item title="" name="1">
<el-collapse-item title="" name="1" style="position: relative;">
<template #title>
<div style="position: absolute;right: 30px;font-size: 16px;">{{ activeNames == '1' ? '收起' : '展开' }}</div>
</template>
<el-form label-width="auto" style="padding-left: 20px;">
<el-form-item v-if="textbook2List && textbook2List.length" label="学段">
<el-radio-group v-model="radio2" @change="handle2Change">

View File

@ -19,12 +19,12 @@
<span>上传时间{{ info.createTime }}</span>
<el-icon @click="handleLike">
<Star :color="isLike ? '#FE4A4B' : ''" />
<el-icon @click="handleCollect">
<Star :color="isCollect ? '#FE4A4B' : ''" />
</el-icon>
<el-icon @click="handleCollect">
<Pointer :color="isCollect ? '#FE4A4B' : ''" />
<el-icon @click="handleLike">
<Pointer :color="isLike ? '#FE4A4B' : ''" />
</el-icon>
<span>