备课-增加头部布局

This commit is contained in:
lyc 2024-07-23 10:23:18 +08:00
parent 3dc478e724
commit 125962b859
9 changed files with 108 additions and 42 deletions

View File

@ -1,9 +1,9 @@
@font-face {
font-family: "iconfont"; /* Project id 2794390 */
src: url('iconfont.woff2?t=1721179711733') format('woff2'),
url('iconfont.woff?t=1721179711733') format('woff'),
url('iconfont.ttf?t=1721179711733') format('truetype'),
url('iconfont.svg?t=1721179711733#iconfont') format('svg');
src: url('iconfont.woff2?t=1721698955462') format('woff2'),
url('iconfont.woff?t=1721698955462') format('woff'),
url('iconfont.ttf?t=1721698955462') format('truetype'),
url('iconfont.svg?t=1721698955462#iconfont') format('svg');
}
.iconfont {
@ -14,6 +14,10 @@
-moz-osx-font-smoothing: grayscale;
}
.icon-lingdang:before {
content: "\e613";
}
.icon-yidongdaozu:before {
content: "\e67d";
}

File diff suppressed because one or more lines are too long

View File

@ -5,6 +5,13 @@
"css_prefix_text": "icon-",
"description": "",
"glyphs": [
{
"icon_id": "17990800",
"name": "铃铛",
"font_class": "lingdang",
"unicode": "e613",
"unicode_decimal": 58899
},
{
"icon_id": "1207918",
"name": "移动到组",

View File

@ -14,6 +14,8 @@
/>
<missing-glyph />
<glyph glyph-name="lingdang" unicode="&#58899;" d="M257.7 243.70000000000005h510.6c17.9 0 32.5 14.5 32.5 32.5V480.9c0 143.2-104.6 261.9-241.5 284 2.1 5.5 3.3 11.6 3.3 17.8 0 27.4-22.2 49.6-49.6 49.6s-49.6-22.2-49.6-49.6c0-6.3 1.2-12.3 3.3-17.8-136.9-22.1-241.5-140.9-241.5-284v-204.7c0-17.9 14.6-32.5 32.5-32.5zM513-63.60000000000002c44.4 0 80.3 36 80.3 80.3H432.7c0-44.4 35.9-80.3 80.3-80.3zM911.7 115L895 148.29999999999995c-14.8 29.7-47.7 52.1-74.5 52.1h-615c-26.8 0-59.7-22.4-74.5-52.1L114.3 115c-17.5-35.1-6.6-65.9 25.9-65.9h745.6c32.5 0 43.5 30.8 25.9 65.9z" horiz-adv-x="1024" />
<glyph glyph-name="yidongdaozu" unicode="&#59005;" d="M904.448 270.272 119.616 270.272c-23.68 0-44.736-14.656-52.48-36.48C65.024 227.968 64 221.952 64 216c0-16.32 7.616-32.192 21.184-42.688l293.248-225.728c24.128-18.56 59.008-14.464 78.016 9.088 18.944 23.552 14.848 57.664-9.28 76.224L288 156.544l616 0c30.72 0 56 29.44 56 59.456C960 246.016 935.168 270.272 904.448 270.272zM119.552 497.728l784.832 0c23.68 0 44.736 14.656 52.48 36.48C958.976 540.032 960 546.048 960 552c0 16.32-7.616 32.192-21.184 42.688l-293.248 225.728c-24.128 18.56-59.008 14.464-78.016-9.088C548.608 787.776 552.64 753.6 576.832 735.04L736 611.456 120 611.456C89.28 611.456 64 582.016 64 552 64 521.984 88.832 497.728 119.552 497.728z" horiz-adv-x="1024" />
<glyph glyph-name="shanchu" unicode="&#59474;" d="M736.653061-33.959184H287.346939c-45.97551 0-83.591837 37.616327-83.591837 83.591837V540.734694h616.489796v-491.102041c0-45.97551-37.616327-83.591837-83.591837-83.591837zM245.55102 498.938776v-449.306123c0-22.987755 18.808163-41.795918 41.795919-41.795918h449.306122c22.987755 0 41.795918 18.808163 41.795919 41.795918V498.938776H245.55102zM407.510204 101.877551c-11.493878 0-20.897959 9.404082-20.897959 20.897959V384c0 11.493878 9.404082 20.897959 20.897959 20.897959s20.897959-9.404082 20.897959-20.897959v-261.22449c0-11.493878-9.404082-20.897959-20.897959-20.897959zM616.489796 101.877551c-11.493878 0-20.897959 9.404082-20.897959 20.897959V384c0 11.493878 9.404082 20.897959 20.897959 20.897959s20.897959-9.404082 20.897959-20.897959v-261.22449c0-11.493878-9.404082-20.897959-20.897959-20.897959zM846.367347 498.938776H177.632653c-45.97551 0-83.591837 37.616327-83.591837 83.591836v31.346939c0 45.97551 37.616327 83.591837 83.591837 83.591837h668.734694c45.97551 0 83.591837-37.616327 83.591837-83.591837v-31.346939c0-45.97551-37.616327-83.591837-83.591837-83.591836zM177.632653 655.673469c-22.987755 0-41.795918-18.808163-41.795918-41.795918v-31.346939c0-22.987755 18.808163-41.795918 41.795918-41.795918h668.734694c22.987755 0 41.795918 18.808163 41.795918 41.795918v31.346939c0 22.987755-18.808163 41.795918-41.795918 41.795918H177.632653zM650.44898 655.673469h-276.89796c-28.734694 0-52.244898 23.510204-52.244898 52.244898v41.795919c0 28.734694 23.510204 52.244898 52.244898 52.244898h276.89796c28.734694 0 52.244898-23.510204 52.244898-52.244898v-41.795919c0-28.734694-23.510204-52.244898-52.244898-52.244898z m-276.89796 104.489796c-5.746939 0-10.44898-4.702041-10.448979-10.448979v-41.795919c0-5.746939 4.702041-10.44898 10.448979-10.448979h276.89796c5.746939 0 10.44898 4.702041 10.448979 10.448979v41.795919c0 5.746939-4.702041 10.44898-10.448979 10.448979h-276.89796z" horiz-adv-x="1024" />

Before

Width:  |  Height:  |  Size: 49 KiB

After

Width:  |  Height:  |  Size: 50 KiB

View File

@ -64,6 +64,8 @@ const defaultProps = {
const curBookId = ref(-1)
//
const curBookName = ref('')
//
const curBookImg = ref('')
//
const volumeOne = ref([])
//
@ -110,9 +112,10 @@ const getSubjectContent = async () => {
}
//
const changeBook = ({ id, itemtitle }) => {
const changeBook = ({ id, itemtitle, avartar }) => {
curBookId.value = id
curBookName.value = itemtitle
curBookImg.value = BaseUrl + avartar
getTreeData()
setTimeout(() => {
dialogVisible.value = false
@ -144,7 +147,8 @@ const emitChangeBook = () => {
const data = {
textBook: {
curBookId: curBookId.value,
curBookName: curBookName.value
curBookName: curBookName.value,
curBookImg: curBookImg.value
},
node: curNode
}
@ -236,6 +240,7 @@ const getSubject = async () => {
//
curBookName.value = subjectList.value[0].itemtitle
curBookId.value = subjectList.value[0].id
curBookImg.value = BaseUrl + subjectList.value[0].avartar
}
@ -264,7 +269,8 @@ const handleNodeClick = (data, node) => {
let curData = {
textBook: {
curBookId: curBookId.value,
curBookName: curBookName.value
curBookName: curBookName.value,
curBookImg: curBookImg.value
},
node: toRaw(currentNode)
}

View File

@ -2,19 +2,27 @@
<div v-loading="isLoading" class="page-resource flex">
<ChooseTextbook @change-book="nodeClick" @node-click="nodeClick" />
<div class="page-right">
<div class="header-top flex">
<div class="textbook-img">
<el-image style="width: 80px; height: 110px" :src="curBookImg" />
</div>
<div class="top-item">
<el-button class="btn">教材研读</el-button>
<el-button class="btn">电子课本</el-button>
<el-button class="btn">高考研读</el-button>
<el-button class="btn">教学大模型</el-button>
</div>
<el-button type="primary" class="to-class-btn">
<i class="iconfont icon-lingdang"></i>上课</el-button>
</div>
<div class="prepare-body-header">
<div>
<label style="font-size: 15px">{{ currentFileList.length }}个文件</label>&nbsp;
<el-popover placement="top-start" :width="250" trigger="hover">
<template #default>
<div>
<el-button
v-if="lastAsyncAllTime"
type="success"
size="small"
:icon="Check"
circle
/>
<el-button v-if="lastAsyncAllTime" type="success" size="small" :icon="Check" circle />
{{ lastAsyncAllTime ? toTimeText(lastAsyncAllTime) + '同步成功' : '' }}
</div>
</template>
@ -29,38 +37,22 @@
</el-popover>
</div>
<div style="display: flex">
<el-button>布置作业</el-button>
<el-button @click="isDialogOpen = true">上传资料</el-button>
<el-button type="primary" style="margin-left: 10px" @click="createFile"
>新建课件</el-button
>
<el-button type="primary" style="margin-left: 10px" @click="createFile">新建课件</el-button>
</div>
</div>
<el-checkbox-group
v-model="checkFileList"
class="prepare-body-main"
:style="{ 'margin-bottom': checkFileList.length > 0 ? '40px' : '0' }"
>
<file-list-item
v-for="(item, index) in currentFileList"
:key="index"
:item="item"
:index="index"
@on-move="onMoveSingleFile"
@on-delete="deleteTalk"
>
<el-checkbox-group v-model="checkFileList" class="prepare-body-main"
:style="{ 'margin-bottom': checkFileList.length > 0 ? '40px' : '0' }">
<file-list-item v-for="(item, index) in currentFileList" :key="index" :item="item" :index="index"
@on-move="onMoveSingleFile" @on-delete="deleteTalk">
<el-checkbox label="" :value="item" />
</file-list-item>
</el-checkbox-group>
<file-oper-batch
v-show="checkFileList.length > 0"
<file-oper-batch v-show="checkFileList.length > 0"
:indeterminate="checkFileList.length > 0 && checkFileList.length < currentFileList.length"
:choose="checkFileList"
:check-all="isCheckAll"
@click-delete="clickDelete"
@click-move="clickMove"
@cancel="checkFileList = []"
@click-choose="clickChoose"
></file-oper-batch>
:choose="checkFileList" :check-all="isCheckAll" @click-delete="clickDelete" @click-move="clickMove"
@cancel="checkFileList = []" @click-choose="clickChoose"></file-oper-batch>
</div>
<MoveFile v-model="isMoveDialogOpen" @on-submit="chooseMoveCata" />
<uploadDialog v-model="isDialogOpen" @submit-file="submitFile" />
@ -104,7 +96,9 @@ export default {
levelSecondId: null,
fileSource: '个人',
fileRoot: '备课'
}
},
//
curBookImg: ''
}
},
computed: {
@ -134,7 +128,7 @@ export default {
},
methods: {
createFile() {
creatPPT('新建ppt文档.pptx',this.uploadData).then((res) => {
creatPPT('新建ppt文档.pptx', this.uploadData).then((res) => {
this.currentFileList.unshift(res.resData)
})
},
@ -256,6 +250,8 @@ export default {
},
nodeClick(data) {
if (this.currentNode.id === data.node.id) return
this.curBookImg = data.textBook.curBookImg
console.log(data.textBook)
this.checkFileList = []
let cata = parseCataByNode(data.node)
this.currentNode = data.node
@ -321,6 +317,7 @@ export default {
height: 100%;
.page-right {
overflow: hidden;
position: relative;
min-width: 0;
flex: 1;
@ -332,6 +329,55 @@ export default {
display: flex;
flex-direction: column;
.header-top {
height: 150px;
align-items: center;
justify-content: center;
background: linear-gradient(#97c4ed, #7aa8e5);
padding-right: 20px;
.textbook-img{
height: 120px;
background-color: #ffffff;
padding: 5px;
border-radius: 6px;
overflow: hidden;
margin-right: 20px;
}
.top-item{
width: 230px;
flex-wrap: wrap;
.btn{
width: 102px;
background: none;
color: #ffffff;
border-width: 2px;
border-color: #ffffff;
&:hover{
background: rgba(255, 255, 255, 0.3)
}
&:first-child{
margin-left: 12px;
margin-bottom: 15px;
}
&:nth-child(2){
margin-bottom: 15px;
}
}
}
.to-class-btn{
width: 130px;
height: 80px;
margin-left: 25px;
font-size: 18px;
.icon-lingdang{
margin-right: 5px;
color: #ffffff;
font-size: 20px;
}
}
}
.prepare-body-header {
height: 60px;
width: 100%;
@ -340,6 +386,7 @@ export default {
flex-wrap: wrap;
justify-content: space-between;
padding: 0 20px;
}
.prepare-body-main {