Merge branch 'main' of http://27.128.240.72:3000/zhuhao/AIx_Smarttalk_WS into baigl
This commit is contained in:
commit
b081000f11
|
@ -13,12 +13,12 @@
|
||||||
importPPTXFile(files)
|
importPPTXFile(files)
|
||||||
mainMenuVisible = false
|
mainMenuVisible = false
|
||||||
}">
|
}">
|
||||||
<PopoverMenuItem>导入 pptx 文件(测试版)</PopoverMenuItem>
|
<PopoverMenuItem>导入 pptx 文件</PopoverMenuItem>
|
||||||
</FileInput>
|
</FileInput>
|
||||||
<PopoverMenuItem @click="setDialogForExport('pptx')">导出文件</PopoverMenuItem>
|
<PopoverMenuItem @click="setDialogForExport('pptx')">导出文件</PopoverMenuItem>
|
||||||
<PopoverMenuItem @click="resetSlides(); mainMenuVisible = false">重置幻灯片</PopoverMenuItem>
|
<PopoverMenuItem @click="resetSlides(); mainMenuVisible = false">重置幻灯片</PopoverMenuItem>
|
||||||
<PopoverMenuItem @click="goLink('https://github.com/pipipi-pikachu/PPTist/issues')">意见反馈</PopoverMenuItem>
|
<!-- <PopoverMenuItem @click="goLink('https://github.com/pipipi-pikachu/PPTist/issues')">意见反馈</PopoverMenuItem> -->
|
||||||
<PopoverMenuItem @click="goLink('https://github.com/pipipi-pikachu/PPTist/blob/master/doc/Q&A.md')">常见问题</PopoverMenuItem>
|
<!-- <PopoverMenuItem @click="goLink('https://github.com/pipipi-pikachu/PPTist/blob/master/doc/Q&A.md')">常见问题</PopoverMenuItem> -->
|
||||||
<PopoverMenuItem @click="mainMenuVisible = false; hotkeyDrawerVisible = true">快捷操作</PopoverMenuItem>
|
<PopoverMenuItem @click="mainMenuVisible = false; hotkeyDrawerVisible = true">快捷操作</PopoverMenuItem>
|
||||||
</template>
|
</template>
|
||||||
<div class="menu-item"><IconHamburgerButton class="icon" /></div>
|
<div class="menu-item"><IconHamburgerButton class="icon" /></div>
|
||||||
|
|
|
@ -0,0 +1,65 @@
|
||||||
|
<template>
|
||||||
|
<div id="aptContainer"></div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
modelValue:[Object,String], // json数据
|
||||||
|
width: { // 宽度
|
||||||
|
type: Number,
|
||||||
|
default: 0
|
||||||
|
},
|
||||||
|
height: { // 高度
|
||||||
|
type: Number,
|
||||||
|
default: 0
|
||||||
|
},
|
||||||
|
domId: { // 渲染元素ID
|
||||||
|
type: String,
|
||||||
|
default: 'aptContainer'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
description: 'apt预览组件-konva',
|
||||||
|
// konva相关对象 舞台 图层
|
||||||
|
konvaStage:null, konvaLayer:null
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() { // 页面渲染完
|
||||||
|
this.initKonva()
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
modelValue: {
|
||||||
|
immediate: true, // 初始是否触发
|
||||||
|
handler(v) { // 参数1新值,参数2 旧值
|
||||||
|
!!v && this.loadJson()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 初始化Konva
|
||||||
|
initKonva() {
|
||||||
|
if(!this.width || !this.height) return false // 没有默认宽度高度直接使用数据中的
|
||||||
|
this.konvaStage = new Konva.Stage({
|
||||||
|
container: "aptContainer", // id of container <div>
|
||||||
|
width: this.width,
|
||||||
|
height: this.height,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 加载数据
|
||||||
|
loadJson(data = this.modelValue) {
|
||||||
|
if (!data) return false
|
||||||
|
this.konvaStage = Konva.Node.create(data, this.domId)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.aptContainer{
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,27 @@
|
||||||
|
<template>
|
||||||
|
<el-link :href="href" target="_blank" type="primary">
|
||||||
|
<slot name="content">{{content}}</slot>
|
||||||
|
</el-link>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
href: { // 跳转地址
|
||||||
|
type: String,
|
||||||
|
default: 'https://beian.miit.gov.cn'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
description: '备案号-添加',
|
||||||
|
content: '备案号:苏ICP备2024097972号-1'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
|
||||||
|
</style>
|
|
@ -1,6 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<!-- 表单-组件(自定义) -->
|
<!-- 表单-组件(自定义) -->
|
||||||
<slot>
|
|
||||||
<el-row v-bind="rows||{}">
|
<el-row v-bind="rows||{}">
|
||||||
<!-- 其他内容-start -->
|
<!-- 其他内容-start -->
|
||||||
<slot name="start"></slot>
|
<slot name="start"></slot>
|
||||||
|
@ -80,7 +79,6 @@
|
||||||
<!-- 其他内容-end -->
|
<!-- 其他内容-end -->
|
||||||
<slot name="end"></slot>
|
<slot name="end"></slot>
|
||||||
</el-row>
|
</el-row>
|
||||||
</slot>
|
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
|
@ -161,7 +159,9 @@ export default {
|
||||||
// 确定--提交
|
// 确定--提交
|
||||||
confirm() {
|
confirm() {
|
||||||
const formRefs = this.$refs.form
|
const formRefs = this.$refs.form
|
||||||
|
const isBool = this.$attrs.confirm && typeof this.$attrs.confirm === 'function'
|
||||||
this.$emit('confirm', formRefs)
|
this.$emit('confirm', formRefs)
|
||||||
|
if (isBool) this.$attrs.confirm(formRefs)
|
||||||
},
|
},
|
||||||
// 重置
|
// 重置
|
||||||
resetFields() {
|
resetFields() {
|
||||||
|
|
|
@ -0,0 +1,44 @@
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<el-pagination v-bind="pageOpt"
|
||||||
|
@change="(...agrs) => $emit('pageChange',...agrs)"
|
||||||
|
v-model:current-page="curPage" v-model:page-size="limit" />
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
// 功能说明:自定义-分页器
|
||||||
|
export default {
|
||||||
|
name: 'cPage',
|
||||||
|
props: {
|
||||||
|
page: { type: Object, required: true },
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
def: {
|
||||||
|
// size: 'small',
|
||||||
|
background: false,
|
||||||
|
pageSizes: [10, 20, 30, 40, 50, 100],
|
||||||
|
layout: 'total, sizes, prev, pager, next',
|
||||||
|
// layout: 'total, sizes, prev, pager, next, jumper',
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
pageOpt() {
|
||||||
|
return Object.assign({},this.def, this.page)
|
||||||
|
},
|
||||||
|
curPage: {
|
||||||
|
get() { return this.page.curPage },
|
||||||
|
set(val) { this.page.curPage = val }
|
||||||
|
},
|
||||||
|
limit: {
|
||||||
|
get() { return this.page.limit },
|
||||||
|
set(val) { this.page.limit = val }
|
||||||
|
},
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
|
||||||
|
</style>
|
|
@ -0,0 +1,280 @@
|
||||||
|
<template>
|
||||||
|
<!-- 组件 -->
|
||||||
|
<div>
|
||||||
|
<slot name="top">
|
||||||
|
<div class="c-search" :hide="!isFold||isDef" v-if="fItems.length" :style="$attrs.style">
|
||||||
|
<transition name="el-zoom-in-top">
|
||||||
|
<c-form v-show="isFold" ref="search" v-if="!noSearch && search" :form="search"
|
||||||
|
:itemOption="fItems" :option="fOption" :onEnter="fOnEnter" :rows="fRows" :cols="fCols">
|
||||||
|
<template v-for="item in formSlots" #[item]="data">
|
||||||
|
<slot :name="`f${item}`" v-bind="data"></slot>
|
||||||
|
</template>
|
||||||
|
<template #append>
|
||||||
|
<slot name="topAdd" v-if="$slots.topAdd"></slot>
|
||||||
|
<slot name="search" v-if="!$attrs.searchBtnNe">
|
||||||
|
<el-col style="text-align: center;margin: 5px 0 15px;">
|
||||||
|
<el-button icon="Search" type="primary" @click="$emit('change','query')">查询</el-button>
|
||||||
|
<el-button type="warning" @click="$emit('change','reset')">重置</el-button>
|
||||||
|
</el-col>
|
||||||
|
</slot>
|
||||||
|
</template>
|
||||||
|
</c-form>
|
||||||
|
</transition>
|
||||||
|
<div v-if="!isDef" :class="['fold',{hide:!isFold}]" @click="isFold=!isFold">
|
||||||
|
<!-- <i :class="'el-icon-arrow-' + (isFold?'down':'up')"></i> -->
|
||||||
|
<el-icon><component :is="isFold?'ArrowUp':'ArrowDown'"></component></el-icon>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</slot>
|
||||||
|
<slot name="start"></slot>
|
||||||
|
<div :class="['m-list',{'ne':!isMain, hide:!isFold}]">
|
||||||
|
<slot name="tStart"></slot>
|
||||||
|
<el-table ref="table" v-bind="tAttrs" v-on="tOns">
|
||||||
|
<template #empty><slot name="empty">{{emptyText}}</slot></template>
|
||||||
|
<template #append><slot name="append"></slot></template>
|
||||||
|
<slot>
|
||||||
|
<template v-for="(item, index) in optionItems" :key="index">
|
||||||
|
<el-table-column v-bind="item">
|
||||||
|
<!-- 列-表头-自定义 -->
|
||||||
|
<template #header="{column, $index}">
|
||||||
|
<slot :name="item.prop+'_header'" :column="column" :$index="$index">
|
||||||
|
<slot name="header" :column="column" :$index="$index">{{ item.label }}</slot>
|
||||||
|
</slot>
|
||||||
|
</template>
|
||||||
|
<!-- 列内容-自定义 -->
|
||||||
|
<template #default="{row, column, $index}" v-if="item.type!='selection'">
|
||||||
|
<slot :name="item.prop" :row="row" :column="column" :$index="$index" :value="row[item.prop]">
|
||||||
|
<span v-if="item.attrs" v-bind="item.attrs">{{ defVal(row,item, $index, $attrs, column) }}</span>
|
||||||
|
<slot v-else :row="row" :column="column" :$index="$index" :value="row[item.prop]">{{ defVal(row,item, $index, $attrs, column) }}</slot>
|
||||||
|
</slot>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</template>
|
||||||
|
</slot>
|
||||||
|
</el-table>
|
||||||
|
<slot name="end"></slot>
|
||||||
|
<slot name="page">
|
||||||
|
<c-page v-if="!noPage" :page="page" v-on="$attrs" class="c-page" border="false"></c-page>
|
||||||
|
</slot>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import cForm from './cForm.vue'
|
||||||
|
export default {
|
||||||
|
// inheritAttrs: false,
|
||||||
|
components: { cForm },
|
||||||
|
name: 'cTable',
|
||||||
|
props: {
|
||||||
|
option: Array, // 列配置
|
||||||
|
search: Object, // 搜索
|
||||||
|
fItems: { // 搜索字段配置
|
||||||
|
type: Array,
|
||||||
|
default: () => []
|
||||||
|
},
|
||||||
|
fOption: { // 搜索-表单配置
|
||||||
|
type: Object,
|
||||||
|
default: () => ({ labelW: '80px' })
|
||||||
|
// default: () => ({ inline: true, labelW: '80px', size: 'small' })
|
||||||
|
},
|
||||||
|
fOnEnter: Function, // 搜索--回车事件-公共
|
||||||
|
fRows: { // 搜索-行
|
||||||
|
type: Object,
|
||||||
|
default: _ => ({ gutter: 20 })
|
||||||
|
},
|
||||||
|
fCols: { // 搜索-非内联 inline
|
||||||
|
type: Object,
|
||||||
|
default: _ => ({ span: 8, xs: 24, sm: 12, md: 8, lg: 6 })
|
||||||
|
},
|
||||||
|
emptyText: {
|
||||||
|
type: String,
|
||||||
|
default: '暂无数据'
|
||||||
|
},
|
||||||
|
isDef: { // 默认样式-无美化
|
||||||
|
type: Boolean,
|
||||||
|
default: true
|
||||||
|
},
|
||||||
|
isMain: { // 间距
|
||||||
|
type: Boolean,
|
||||||
|
default: true
|
||||||
|
},
|
||||||
|
fold: { // 是否打开搜索
|
||||||
|
type: Boolean,
|
||||||
|
default: true
|
||||||
|
},
|
||||||
|
data: Object, // 数据
|
||||||
|
page: Object, // 分页
|
||||||
|
noSearch: Boolean, // 关闭搜索
|
||||||
|
noPage: Boolean, // 关闭分页
|
||||||
|
noDef: Boolean, // 取消默认配置
|
||||||
|
isMaxHeight: Boolean, // 是否最大高度
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
// 搜索-插槽 打开搜索
|
||||||
|
formSlots: [], isFold: this.fold, height: null,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
optionItems() { // 默认列
|
||||||
|
const list = this.option || []
|
||||||
|
return list.map(o => {
|
||||||
|
const def = { align: 'center', showOverflowTooltip: true }
|
||||||
|
if (o.width && o.showOverflowTooltip == undefined){
|
||||||
|
o.showOverflowTooltip = true // 设置宽度时,内容超出默认隐藏
|
||||||
|
}
|
||||||
|
return this.noDef ? o : Object.assign(def, o)
|
||||||
|
})
|
||||||
|
.filter(o => o.show ?? true) // 过滤掉隐藏的-show
|
||||||
|
.filter(o => o.visible ?? true) // 过滤掉隐藏的-visible
|
||||||
|
},
|
||||||
|
tAttrs() { // $attrs 过滤掉其他属性
|
||||||
|
const attrs = {...this.$attrs}
|
||||||
|
Object.keys(attrs).forEach(key => {
|
||||||
|
// 空值过滤掉
|
||||||
|
if (!attrs[key]??null) delete attrs[key]
|
||||||
|
// 分页相关属性 过滤掉
|
||||||
|
else if (/^page.*/.test(key)) delete attrs[key]
|
||||||
|
})
|
||||||
|
// 其他属性处理 如 'style', 'class', 't-style', 't-class'
|
||||||
|
const tArr = Object.keys(attrs).filter(k => k.startsWith('t-'))
|
||||||
|
if (tArr.length) tArr.forEach(k => attrs[k.slice(2)] = attrs[k])
|
||||||
|
else ['style', 'class'].forEach(k => delete attrs[k])
|
||||||
|
// 高度处理
|
||||||
|
const hArrs = ['height', 'max-height', 'maxHeight']
|
||||||
|
const isH = Object.keys(attrs).some(k => hArrs.includes(k))
|
||||||
|
// 默认高度 默认设置最大高度
|
||||||
|
if (!isH) attrs[this.isMaxHeight?'max-height':'height'] = 500
|
||||||
|
// 设置数据
|
||||||
|
if (this.data) attrs.data = this.data
|
||||||
|
return attrs
|
||||||
|
},
|
||||||
|
tOns() { // $on 过滤掉其他属性
|
||||||
|
const attrs = {...this.$attrs}
|
||||||
|
return Object.keys(attrs).reduce((p, c, a ) => {
|
||||||
|
if(typeof attrs[c]=='function')p[c]=attrs[c]; return p
|
||||||
|
}, {})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
mounted() {
|
||||||
|
this.getFormSlots()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 获取插槽名-搜索-插槽
|
||||||
|
getFormSlots() {
|
||||||
|
const props = this.fItems.map(o => o.prop)
|
||||||
|
const keys = Object.keys(this.$slots)
|
||||||
|
this.formSlots = keys.filter(k => {
|
||||||
|
const isForm = /^f.*/.test(k) // 是否为搜索插槽
|
||||||
|
const isProp = props.some(p => k.endsWith(p)) // 该配置是否在配置中存在-不存在过滤掉
|
||||||
|
return isForm && isProp
|
||||||
|
}).map(k => k.replace(/^f/, '')) // 返回表单内部自定义插槽名
|
||||||
|
},
|
||||||
|
// 默认值处理
|
||||||
|
defVal(row, item, rowInd, attr, column) {
|
||||||
|
switch (item.type) {
|
||||||
|
case 'index': { // 默认-ind
|
||||||
|
const { curPage, limit, offset } = attr.page || attr
|
||||||
|
const start = offset || (curPage - 1) * limit || 0
|
||||||
|
return rowInd + 1 + start
|
||||||
|
}
|
||||||
|
default:
|
||||||
|
return item.format ? item.format(row[item.prop], row, column, rowInd) : row[item.prop]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
// @import '~@/assets/styles/cmixin';
|
||||||
|
// $w 宽| $h 高| $bg 背景| $tBr 块圆角度 $tBg 块背景
|
||||||
|
@mixin scrollBar($w:8px,$h:8px,$tBr:20px,
|
||||||
|
$bg:#d3dce6,$tBg:#99a9bf, $tHbg: #409eff) {
|
||||||
|
|
||||||
|
&::-webkit-scrollbar-track-piece {
|
||||||
|
background: $bg;
|
||||||
|
}
|
||||||
|
&::-webkit-scrollbar {
|
||||||
|
width: $w;
|
||||||
|
height: $h;
|
||||||
|
}
|
||||||
|
&::-webkit-scrollbar-thumb {
|
||||||
|
background: $tBg;
|
||||||
|
border-radius: $tBr;
|
||||||
|
@if $tHbg {
|
||||||
|
&:hover{
|
||||||
|
background: $tHbg;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-table){
|
||||||
|
|
||||||
|
.el-table__expand-column{
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.el-table__body-wrapper{
|
||||||
|
@include scrollBar;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// css调整
|
||||||
|
.c-search{
|
||||||
|
--bg: #fff;
|
||||||
|
padding-top: 10px;
|
||||||
|
// padding: 20px 20px 0;
|
||||||
|
background: var(--bg);
|
||||||
|
margin-bottom: 30px;
|
||||||
|
border-radius: 4px;
|
||||||
|
&[hide=true]{
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.fold{
|
||||||
|
--box-color: rgba(24,144,255,0.2);
|
||||||
|
--box-hover-color: rgba(24,144,255,0.6);
|
||||||
|
width: 100px;
|
||||||
|
height: 20px;
|
||||||
|
cursor: pointer;
|
||||||
|
display: inline-block;
|
||||||
|
text-align: center;
|
||||||
|
position: absolute;
|
||||||
|
background: var(--bg);
|
||||||
|
border-radius: 0 0 50px 50px;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%,5px);
|
||||||
|
box-shadow: 0px 3px 3px var(--box-color);
|
||||||
|
i{font-size: inherit;}
|
||||||
|
&:hover{
|
||||||
|
box-shadow: 0px 3px 3px var(--box-hover-color);
|
||||||
|
i{color: #1890ff;}
|
||||||
|
}
|
||||||
|
&.hide{
|
||||||
|
top: 12px;
|
||||||
|
border-radius: 50px 50px 0 0;
|
||||||
|
box-shadow: 0 -3px 3px var(--box-color);
|
||||||
|
&:hover{box-shadow: 0 -3px 3px var(--box-hover-color);}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
:deep(.el-form){
|
||||||
|
.el-form-item{
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 改样式
|
||||||
|
.m-list{
|
||||||
|
padding: 20px;
|
||||||
|
border-radius: 4px;
|
||||||
|
&.ne{padding: 0;}
|
||||||
|
&.hide{
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.c-page{
|
||||||
|
background: #fff;
|
||||||
|
margin-top: 10px;
|
||||||
|
justify-content: flex-end;
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -1,28 +1,48 @@
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div class="page-resource flex mb-4">
|
||||||
<div class="page-resource flex">
|
<!-- 左侧 教材 目录 -->
|
||||||
<!-- 左侧 教材 目录 -->
|
<!-- <ChooseTextbook @change-book="getData" @node-click="getData" /> -->
|
||||||
<ChooseTextbook @change-book="getData" @node-click="getData" />
|
|
||||||
|
|
||||||
<div class="page-right">
|
<div class="page-right">
|
||||||
<div class="button-container">
|
<div class="button-container">
|
||||||
<el-button style="margin-left: 12px;" type="primary" @click="onchange('/model/curriculum')">课标研读</el-button>
|
<el-button type="primary" @click="onchange('/model/curriculum')">课标研读</el-button>
|
||||||
<!-- <el-button type="primary" @click="onchange('/model/management')">作业管理1</el-button> -->
|
<!-- <el-button type="primary" @click="onchange('/model/management')">作业管理1</el-button> -->
|
||||||
<el-button type="primary" @click="onchange('/model/newClassTaskAssign')">作业管理</el-button>
|
<el-button type="primary" @click="onchange('/model/newClassTaskAssign')">作业管理</el-button>
|
||||||
<el-button type="success" @click="onchange('/model/teaching')">教材研读</el-button>
|
<el-button type="success" @click="onchange('/model/teaching')">教材研读</el-button>
|
||||||
<el-button type="info" @click="onchange('/model/design')">教学框架设计</el-button>
|
<el-button type="info" @click="onchange('/model/design')">教学框架设计</el-button>
|
||||||
<el-button type="success" @click="openPPTist">打开PPTist</el-button>
|
<el-button type="success" @click="openPPTist">打开PPTist</el-button>
|
||||||
<el-button type="info" @click="onchange('/model/examination')">考试分析</el-button>
|
<el-button type="info" @click="onchange('/model/examination')">考试分析</el-button>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<el-row class="container">
|
||||||
|
<!-- 左侧 选择教材 目录 -->
|
||||||
|
<ChooseTextbook @change-book="changeBook" @node-click="changeBook" />
|
||||||
|
<!-- 中间 展示内容 -->
|
||||||
|
<el-col :span="10">
|
||||||
|
<div class="c-item mb-4 mx-4">
|
||||||
|
<div class="flex justify-between pb-2">
|
||||||
|
<h3>教师资源</h3>
|
||||||
|
<span class="c-btns">
|
||||||
|
<el-button size="small" text :icon="Refresh" @click="handleAll('refresh')">刷新</el-button>
|
||||||
|
<el-button size="small" text :icon="Files" @click="handleAll('resource')">资源库</el-button>
|
||||||
|
<el-button size="small" text :icon="UploadFilled" @click="handleAll('upload')">上传</el-button>
|
||||||
|
<el-button size="small" text :icon="Plus" @click="handleAll('add')">添加</el-button>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<c-table ref="resourRef" v-bind="sourceOpt" t-class="rounded"></c-table>
|
||||||
|
</div>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { onMounted, ref, watch, reactive } from 'vue'
|
import { onMounted, ref, watch, reactive } from 'vue'
|
||||||
import { useRouter } from 'vue-router'
|
import { useRouter } from 'vue-router'
|
||||||
|
import { Plus, Refresh, Upload, Files, UploadFilled } from '@element-plus/icons-vue'
|
||||||
import { createWindow } from '@/utils/tool' // 相关工具
|
import { createWindow } from '@/utils/tool' // 相关工具
|
||||||
|
import * as entpcoursefile from '@/api/education/entpcoursefile' // 相关api
|
||||||
|
// 组件引入
|
||||||
import ChooseTextbook from '@/components/choose-textbook/index.vue'
|
import ChooseTextbook from '@/components/choose-textbook/index.vue'
|
||||||
|
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
|
@ -35,9 +55,38 @@ const courseObj = reactive({
|
||||||
coursetitle: '',
|
coursetitle: '',
|
||||||
node: null, // 选择的课程节点
|
node: null, // 选择的课程节点
|
||||||
})
|
})
|
||||||
|
const dt = reactive({
|
||||||
|
curRow: null, // 当前行数据
|
||||||
|
})
|
||||||
|
// ref定义
|
||||||
|
const resourRef = ref() // 资源ref
|
||||||
|
// 资源相关配置-cTable
|
||||||
|
const sourceOpt = reactive({
|
||||||
|
data: [], // 数据
|
||||||
|
option: [ // 列配置
|
||||||
|
{ label: '名称', prop: 'title', align: 'left' },
|
||||||
|
{ label: '类型', prop: 'type' },
|
||||||
|
{ label: '时间', prop: 'createTime', width: 160, sortable: true },
|
||||||
|
],
|
||||||
|
noPage: true, // 不显示分页
|
||||||
|
isMain: false, // 主界面
|
||||||
|
highlightCurrentRow: true, // 高亮当前行
|
||||||
|
rowClick: (r, c, e) => { // 行点击事件
|
||||||
|
if (dt.curRow == r) { // 重复点击-取消选中
|
||||||
|
resourRef.value.$refs.table.setCurrentRow()
|
||||||
|
dt.curRow = null
|
||||||
|
} else dt.curRow = r
|
||||||
|
}
|
||||||
|
})
|
||||||
|
sourceOpt.data = [
|
||||||
|
{ title: '测试学校' },
|
||||||
|
{ title: '测试学校2' },
|
||||||
|
{ title: '测试学校3' },
|
||||||
|
]
|
||||||
|
|
||||||
// 查询
|
// 相关方法-methods
|
||||||
const getData = (data) => {
|
// 教材选中
|
||||||
|
const changeBook = (data) => {
|
||||||
const { textBook, node } = data
|
const { textBook, node } = data
|
||||||
let textbookId = textBook.curBookId
|
let textbookId = textBook.curBookId
|
||||||
let levelSecondId = node.id
|
let levelSecondId = node.id
|
||||||
|
@ -71,19 +120,34 @@ const onchange = (path) => {
|
||||||
router.push(path)
|
router.push(path)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
// 事件回调
|
||||||
|
const handleAll = (type) =>{
|
||||||
|
console.log(type)
|
||||||
|
switch (type) {
|
||||||
|
case 'refresh': // 刷新
|
||||||
|
break;
|
||||||
|
case 'resource': // 资源库
|
||||||
|
break;
|
||||||
|
case 'upload': // 上传
|
||||||
|
break;
|
||||||
|
case 'add':{ // 添加
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.page-resource {
|
.page-resource {
|
||||||
height: 100%;
|
// height: 100%;
|
||||||
padding: 10px 15px 0;
|
// padding: 10px 15px 0;
|
||||||
|
|
||||||
.page-right {
|
.page-right {
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
margin-left: 20px;
|
// margin-left: 20px;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
background: #ffffff;
|
background: #ffffff;
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
|
@ -94,7 +158,7 @@ const onchange = (path) => {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
gap: 10px;
|
gap: 10px;
|
||||||
margin: 1rem 0;
|
margin: 1rem;
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
|
|
||||||
.el-button {
|
.el-button {
|
||||||
|
@ -105,4 +169,12 @@ const onchange = (path) => {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.container{
|
||||||
|
height: calc(100% - 32px - 3rem);
|
||||||
|
.c-item{
|
||||||
|
.c-btns{
|
||||||
|
.el-button{margin: 0;}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
|
@ -1,4 +1,11 @@
|
||||||
{
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"baseUrl": "./",
|
||||||
|
"paths": {
|
||||||
|
"@/*":["src/renderer/src/*"],
|
||||||
|
"@root/*":["./*"]
|
||||||
|
}
|
||||||
|
},
|
||||||
"files": [],
|
"files": [],
|
||||||
"references": [
|
"references": [
|
||||||
{
|
{
|
||||||
|
|
Loading…
Reference in New Issue