develoop
parent
d2712808e3
commit
2bec33e17b
5 changed files with 205 additions and 103 deletions
@ -1,10 +0,0 @@ |
||||
import request from '@/utils/request' |
||||
//获取浏览记录列表
|
||||
export const getRecordListService = (params) => |
||||
request.get('http://39.106.16.162:8080/learningrecords/getall', { params }) |
||||
//删除浏览记录
|
||||
export function DelRecordService(ids) { |
||||
return request.delete( |
||||
`http://39.106.16.162:8080/learningrecords/delete?ids=${ids}`, |
||||
) |
||||
} |
||||
@ -1,9 +0,0 @@ |
||||
import request from '@/utils/request' |
||||
//获取ppt资源列表
|
||||
export const getpptResourceListService = (params) => |
||||
request.get('http://localhost:8080/courses/getall', { params }) |
||||
export function DelpptResourceListService(ids) { |
||||
return request.delete( |
||||
`http://localhost:8080/learningrecords/delete?ids=${ids}`, |
||||
) |
||||
} |
||||
@ -1,5 +1,141 @@ |
||||
<script setup></script> |
||||
<script setup> |
||||
import { ref } from 'vue' |
||||
const props = defineProps(['dafulIndex']) |
||||
|
||||
//默认抽屉隐藏 |
||||
const visibleDramwer = ref(false) |
||||
//默认数据 |
||||
const defaultForm = { |
||||
description: '', |
||||
id: '', |
||||
img: '', |
||||
name: '', |
||||
type: '', |
||||
path: '', |
||||
} |
||||
//准备数据 |
||||
const formModel = ref({ |
||||
...defaultForm, |
||||
}) |
||||
//图片上传逻辑 |
||||
const imgUrl = ref('') |
||||
const onSelectFile = (uploadFile) => { |
||||
imgUrl.value = URL.createObjectURL(uploadFile.raw) |
||||
} |
||||
//定义一个selectedOption属性，用于存储当前选中的值 |
||||
// const selectedOption = ref('') |
||||
//上传文件 |
||||
// import tool from '@/utils/oss.js' |
||||
// const FileList = ref([]) |
||||
// const upload = async (option) => { |
||||
// const res = await tool.oss.upload(option.file) |
||||
// console.log(22, res) |
||||
// console.log(res.name) |
||||
// const url = 'https://wenyu132.oss-cn-beijing.aliyuncs.com/' + res.name |
||||
// console.log(url) |
||||
// } |
||||
//组件对外暴露一个open 方法 根据传来的参数区分添加还是编辑 |
||||
const open = (row) => { |
||||
visibleDramwer.value = true |
||||
if (row.id) { |
||||
//需要基于row.id 发送请求，获取编辑的详情数据，进行回显 |
||||
console.log('编辑回显') |
||||
} else { |
||||
//重置表单数据 |
||||
formModel.value = { |
||||
...defaultForm, |
||||
} |
||||
} |
||||
} |
||||
|
||||
defineExpose({ |
||||
open, |
||||
}) |
||||
|
||||
const selectVal = ref(props.dafulIndex) |
||||
const selectOp = ref([ |
||||
{ label: 'ppt', value: '1' }, |
||||
{ label: '图片', value: '2' }, |
||||
{ label: '视频', value: '3' }, |
||||
{ label: 'PDF', value: '4' }, |
||||
{ label: '文件', value: '5' }, |
||||
{ label: '音频', value: '6' }, |
||||
]) |
||||
function handleSel() {} |
||||
</script> |
||||
<template> |
||||
<div></div> |
||||
<el-drawer |
||||
v-model="visibleDramwer" |
||||
:title="formModel.id ? '编辑资源' : '添加资源'" |
||||
direction="rtl" |
||||
size="50%" |
||||
> |
||||
<!-- 添加资源表单 --> |
||||
<el-form :model="formModel" ref="formRef" label-width="100px"> |
||||
<el-form-item label="资源名称" prop="name"> |
||||
<el-input |
||||
v-model="formModel.name" |
||||
placeholder="请输入资源名称" |
||||
></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="资源类型"> |
||||
<div class="flex flex-wrap gap-4 items-center"> |
||||
<el-select |
||||
@change="handleSel" |
||||
v-model="selectVal" |
||||
placeholder="Select" |
||||
size="large" |
||||
style="width: 240px" |
||||
> |
||||
<el-option |
||||
v-for="item in selectOp" |
||||
:key="item.value" |
||||
:label="item.label" |
||||
:value="item.value" |
||||
/> |
||||
</el-select> |
||||
</div> |
||||
</el-form-item> |
||||
<el-form-item label="资源简介" prop="description"> |
||||
资源简介 |
||||
<!-- <el-input |
||||
v-model="formModel.description" |
||||
placeholder="请输入资源简介" |
||||
></el-input> --> |
||||
</el-form-item> |
||||
<el-form-item label="上传资源" prop="img"> |
||||
<!-- 此处需要关闭element-plus的自动上传，不需要配置action等参数 |
||||
只需要前端的本地预览图片，无需在提交前上传图标 |
||||
--> |
||||
<el-upload |
||||
class="avatar-uploader" |
||||
:show-file-list="false" |
||||
:auto-upload="false" |
||||
:onchange="onSelectFile" |
||||
> |
||||
<img v-if="imgUrl" :src="imgUrl" class="avatar" /> |
||||
<el-icon v-else class="avatar-uploader-icon"> |
||||
<Plus /> |
||||
</el-icon> |
||||
</el-upload> |
||||
<!-- <el-upload |
||||
v-model:file-list="FileList" |
||||
:http-request="upload" |
||||
class="upload-demo" |
||||
multiple |
||||
> |
||||
<el-button type="primary">点击上传</el-button> |
||||
<template #tip> |
||||
<div class="el-upload__tip">只能上传jpg/png文件,且不超过500kb</div> |
||||
</template> |
||||
</el-upload> --> |
||||
</el-form-item> |
||||
|
||||
<el-form-item class="bottom-box"> |
||||
<el-button type="info" @click="onRemoval">取消</el-button> |
||||
<el-button type="primary">确定</el-button> |
||||
</el-form-item> |
||||
</el-form> |
||||
</el-drawer> |
||||
</template> |
||||
<style scoped></style> |
||||
|
||||
Loading…
Reference in new issue