ww 5 months ago
commit 3fad5889db
  1. 5
      generated/core/OpenAPI.ts
  2. 2
      generated/services/CourseResourceControllerService.ts
  3. 212
      src/views/courseResources/componse/resourceAdd.vue
  4. 38
      src/views/courseResources/index.vue

@ -21,7 +21,8 @@ export type OpenAPIConfig = {
export const OpenAPI: OpenAPIConfig = { export const OpenAPI: OpenAPIConfig = {
BASE: 'http://39.106.16.162:8080', //BASE: 'http://39.106.16.162:8080',
BASE: 'http://127.0.0.1:8080',
VERSION: '1.0.0', VERSION: '1.0.0',
WITH_CREDENTIALS: false, WITH_CREDENTIALS: false,
CREDENTIALS: 'include', CREDENTIALS: 'include',
@ -33,7 +34,7 @@ export const OpenAPI: OpenAPIConfig = {
}; };
// BASE: 'http://39.106.16.162:8080', // BASE: 'http://39.106.16.162:8080',
// BASE: 'http://127.0.0.1:8080/api',
// VERSION: '1.0.0', // VERSION: '1.0.0',
// WITH_CREDENTIALS: false, // WITH_CREDENTIALS: false,
// CREDENTIALS: 'include', // CREDENTIALS: 'include',

@ -85,7 +85,7 @@ export class CourseResourceControllerService {
courseResources: CourseResources, courseResources: CourseResources,
): CancelablePromise<BaseResponse_string_> { ): CancelablePromise<BaseResponse_string_> {
return __request(OpenAPI, { return __request(OpenAPI, {
method: 'GET', method: 'POST',
url: '/api/courses/save', url: '/api/courses/save',
body: courseResources, body: courseResources,
errors: { errors: {

@ -1,69 +1,53 @@
<script setup> <script setup>
import { ref } from 'vue' import { ref } from 'vue'
const visibilerDrawer = ref(false)
import { CourseResourceControllerService } from '../../../../generated/services/CourseResourceControllerService'
const props = defineProps(['dafulIndex'])
import tool from '@/utils/oss.js'
import { ElMessage } from 'element-plus' import { ElMessage } from 'element-plus'
import { CourseResourceControllerService } from '../../../../generated/services/CourseResourceControllerService'
const emit = defineEmits(['getpptresourceList'])
const getresourceList = () => {
emit('getpptresourceList', 'type')
}
//
const visibleDramwer = ref(false)
// //
const defaultForm = { const defaultForm = {
description: '', description: '',
id: '', id: '',
img: '', img: '', //
name: '', name: '',
type: '', type: '', //
path: '', path: '',
} }
const imageUrl = ref('')
const onSelectFile = (uploadFile) => {
// console.log(uploadFile)
//
imageUrl.value = URL.createObjectURL(uploadFile.raw)
//
formModel.value.img = uploadFile.raw
}
// //
const formModel = ref({ const formModel = ref({
...defaultForm, ...defaultForm,
}) })
// const open = (row) => {
const rules = { visibilerDrawer.value = true
name: [ // console.log(row)
{ required: true, message: '请输入资源名称', trigger: 'blur' },
{ min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' },
],
description: [
{ required: true, message: '请输入资源简介', trigger: 'blur' },
{ min: 3, max: 10, message: '长度在 3 到 10 个字符', trigger: 'blur' },
],
}
//open
const open = async (row) => {
visibleDramwer.value = true
if (row.id) { if (row.id) {
//row.id //row.id
const res = await CourseResourceControllerService.getAllUsingGet1(row.id)
//
formModel.value = res.data.records
console.log(res)
//
console.log('编辑回显') console.log('编辑回显')
} else { } else {
//
formModel.value = { formModel.value = {
...defaultForm, ...defaultForm,
} } //form
//
imageUrl.value = ''
console.log('添加')
} }
} }
//
defineExpose({ const rules = {
open, name: [
}) { required: true, message: '请输入资源名称', trigger: 'blur' },
{ min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' },
const selectVal = ref(props.dafulIndex) ],
type: [{ required: true, trigger: 'blur' }],
}
const selectOp = ref([ const selectOp = ref([
{ label: 'ppt', value: '1' }, { label: 'ppt', value: '1' },
{ label: '图片', value: '2' }, { label: '图片', value: '2' },
@ -72,52 +56,18 @@ const selectOp = ref([
{ label: '文件', value: '5' }, { label: '文件', value: '5' },
{ label: '音频', value: '6' }, { label: '音频', value: '6' },
]) ])
const upload = async (option) => {
const res = await tool.oss.upload(option.file)
const url = 'https://wenyu132.oss-cn-beijing.aliyuncs.com/' + res.name
formModel.value.img = url
}
const fileList = ref([]) const fileList = ref([])
const clearFileList = () => { const clearFileList = () => {
console.log(fileList) console.log(fileList)
fileList.value.length = 0
fileList.value = [] fileList.value = []
} }
const handleSel = () => {
fileList.value.length = 0
}
const formRef = ref()
const isSubmit = async () => {
formRef.value.validate(async (valid, fields) => {
if (valid) {
const params = {
name: formModel.value.name,
type: selectVal.value,
img: formModel.value.img,
description: formModel.value.description,
path: formModel.value.img,
}
console.log(params)
await CourseResourceControllerService.saveCourseResourceUsingGet1(params)
visibleDramwer.value = false
clearFileList()
ElMessage.success('添加成功')
getresourceList()
} else {
console.log('error submit!', fields)
}
})
}
// upd
const beforeAvatarUpload = (rawFile) => { const beforeAvatarUpload = (rawFile) => {
console.log('执行了') console.log('执行了')
switch (+selectVal.value) { switch (+formModel.value.type.value) {
case 1: case 1:
if (rawFile.type !== 'application/vnd.ms-powerpoint') { if (rawFile.type !== 'applicationnd.ms-powerpoint') {
clearFileList() clearFileList()
ElMessage.error('必须是ppt文件!') ElMessage.error('必须是ppt文件!')
} else { } else {
@ -143,7 +93,7 @@ const beforeAvatarUpload = (rawFile) => {
} }
break break
case 4: case 4:
if (!rawFile.type.startsWith('application/pdf')) { if (!rawFile.type.startsWith('applicationf')) {
clearFileList() clearFileList()
ElMessage.error('必须是pdf文件!') ElMessage.error('必须是pdf文件!')
} else { } else {
@ -154,7 +104,7 @@ const beforeAvatarUpload = (rawFile) => {
case 5: case 5:
if ( if (
!rawFile.type.startsWith( !rawFile.type.startsWith(
'application/vnd.openxmlformats-officedocument.wordprocessingml.document', 'applicationnd.openxmlformats-officedocument.wordprocessingml.document',
) && ) &&
!rawFile.type.startsWith('application/msword') !rawFile.type.startsWith('application/msword')
) { ) {
@ -176,36 +126,45 @@ const beforeAvatarUpload = (rawFile) => {
break break
} }
} }
//
const emit = defineEmits('success')
const isSubmit = async () => {
//
if (formModel.value.id) {
console.log('编辑')
} else {
console.log(formModel.value)
await CourseResourceControllerService.saveCourseResourceUsingGet1(
formModel.value,
)
ElMessage.success('添加成功')
visibilerDrawer.value = false
//
emit('success', 'add')
}
}
const isabolish = () => { const isabolish = () => {
clearFileList() visibilerDrawer.value = false
visibleDramwer.value = false formModel.value = []
imageUrl.value = ''
// console.log(formModel.value)
} }
defineExpose({
open,
})
</script> </script>
<template> <template>
<el-drawer <el-drawer v-model="visibilerDrawer" title="标题" direction="rtl" size="50%">
v-model="visibleDramwer" <el-form :model="formModel" ref="fromRef" :rules="rules">
:title="formModel.id ? '编辑资源' : '添加资源'"
direction="rtl"
size="50%"
>
<!-- 添加资源表单 -->
<el-form
class="resourceformModel"
:model="formModel"
ref="formRef"
:rules="rules"
label-width="100px"
>
<el-form-item label="资源名称" prop="name"> <el-form-item label="资源名称" prop="name">
<el-input <el-input
v-model="formModel.name" v-model="formModel.name"
placeholder="请输入资源名称" placeholder="请输入资源名称"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="资源类型"> <el-form-item label="资源类型" prop="type">
<el-select <el-select
@change="handleSel" v-model="formModel.type"
v-model="selectVal"
placeholder="请选择资源类型" placeholder="请选择资源类型"
size="large" size="large"
style="width: 100%" style="width: 100%"
@ -218,18 +177,17 @@ const isabolish = () => {
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="上传资源" prop="fileList"> <el-form-item label="资源封面" prop="img">
<!-- 此处需要关闭自动上传 -->
<el-upload <el-upload
v-model:file-list="fileList" class="avatar-uploader"
:http-request="upload" :show-file-list="false"
:limit="1" :auto-upload="false"
class="upload-demo"
action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
list-type="picture"
:before-upload="beforeAvatarUpload" :before-upload="beforeAvatarUpload"
:on-change="onSelectFile"
> >
<el-button type="primary">点击上传资源</el-button> <img v-if="imageUrl" :src="imageUrl" class="avatar" />
<template #file></template> <el-icon v-else class="avatar-uploader-icon"><Plus /></el-icon>
</el-upload> </el-upload>
</el-form-item> </el-form-item>
<el-form-item label="资源简介" prop="description"> <el-form-item label="资源简介" prop="description">
@ -246,11 +204,31 @@ const isabolish = () => {
</el-drawer> </el-drawer>
</template> </template>
<style lang="scss" scoped> <style lang="scss" scoped>
.editor { .avatar-uploader {
width: 100%; :deep() {
.avatar {
:deep(.ql-editor) { width: 178px;
min-height: 200px; height: 178px;
display: block;
}
.el-upload {
border: 1px dashed var(--el-border-color);
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
transition: var(--el-transition-duration-fast);
}
.el-upload:hover {
border-color: var(--el-color-primary);
}
.el-icon.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 178px;
height: 178px;
text-align: center;
}
} }
} }
</style> </style>

@ -19,8 +19,8 @@ const total = ref(0)
const pptresourceList = ref([]) const pptresourceList = ref([])
const loading = ref(false) const loading = ref(false)
const params = ref({ const params = ref({
// pagesize: '10', pagesize: '10',
// pagenum: '1', pagenum: '1',
type: '1', //ppt type: '1', //ppt
}) })
@ -85,7 +85,7 @@ const param = ref({
download: '0', download: '0',
content: '', content: '',
address: '/portal', address: '/portal',
type: '4', type: '1',
}) })
// //
const generateRecords = async (rescource) => { const generateRecords = async (rescource) => {
@ -95,20 +95,32 @@ const generateRecords = async (rescource) => {
// console.log(param) // console.log(param)
} }
const resourceAddRef = ref() const rescourceRef = ref()
// //
const onAddResource = () => { const onAddResource = () => {
resourceAddRef.value.open({}) rescourceRef.value.open({})
} }
//
const onEditResource = (row) => { const onEditResource = (row) => {
resourceAddRef.value.open(row) rescourceRef.value.open(row)
}
//
const onsuccess = (state) => {
if (state == 'add') {
//
const lastPage = Math.ceil((total.value + 1) / params.value.pagesize)
//
params.value.pagenum = lastPage
getpptresourceList()
} else {
//
getpptresourceList()
}
} }
</script> </script>
<template> <template>
<div> <div>
<div class="top"> <div class="top">
<el-button @click="onAddResource">添加资源</el-button> <el-button @click="onAddResource()">添加资源</el-button>
</div> </div>
<div class="body"> <div class="body">
<div class="nav"> <div class="nav">
@ -184,7 +196,7 @@ const onEditResource = (row) => {
<el-icon @click="onDeleteResource(resource.id)"> <el-icon @click="onDeleteResource(resource.id)">
<Delete /> <Delete />
</el-icon> </el-icon>
<el-icon @click="onEditResource(row)"> <el-icon @click="onEditResource(resource)">
<Edit /> <Edit />
</el-icon> </el-icon>
</div> </div>
@ -219,11 +231,7 @@ const onEditResource = (row) => {
/> />
</div> </div>
<!-- 添加编辑的抽屉 --> <!-- 添加编辑的抽屉 -->
<resource-add <resource-add ref="rescourceRef" @success="onsuccess"></resource-add>
:dafulIndex="params.type"
ref="resourceAddRef"
@getpptresourceList="getpptresourceList"
></resource-add>
<!-- --> <!-- -->
</div> </div>
</div> </div>

Loading…
Cancel
Save