|
|
@@ -1,172 +0,0 @@
|
|
|
-<template>
|
|
|
- <div class="mainContainer">
|
|
|
-
|
|
|
- <div class="pform-head">
|
|
|
- <h3>发布课程</h3>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="pform-body">
|
|
|
- <el-form :model="vodForm" label-width="100px">
|
|
|
- <el-form-item label="课程所属UID">
|
|
|
- <el-input v-model="vodForm.uid" placeholder="用户UID" style="width:200px"></el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="课程标题">
|
|
|
- <el-input v-model="vodForm.title"></el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="课程大纲">
|
|
|
- <el-input type="textarea" v-model="vodForm.content" placeholder="请输入内容"
|
|
|
- minlength="5"
|
|
|
- maxlength="5000" rows="6"
|
|
|
- show-word-limit></el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="课程价格">
|
|
|
- <el-input v-model="vodForm.price" placeholder="单位：元" style="width:200px"></el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="课程首页图" prop="img">
|
|
|
- <el-upload
|
|
|
- class="img-uploader"
|
|
|
- action="/api/admin/cert/uploadImg"
|
|
|
- :show-file-list="false"
|
|
|
- :on-success="handleAvatarSuccess"
|
|
|
- :before-upload="beforeAvatarUpload"
|
|
|
- >
|
|
|
- <img v-if="vodForm.img_icon" :src="vodForm.img_icon" class="img" />
|
|
|
- <i v-else class="el-icon-plus img-uploader-icon"></i>
|
|
|
- </el-upload>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- <div class="uploader">
|
|
|
- <UploadAuth :getUserData="getUserData" />
|
|
|
- </div>
|
|
|
- <div slot="footer">
|
|
|
- <el-button type="primary" style="margin-left: 100px;">确认发布</el-button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-
|
|
|
- import UploadAuth from "@/components/videoUpload/src/UploadAuth";
|
|
|
-
|
|
|
- export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- vodForm:{
|
|
|
- title:'',
|
|
|
- content:'',
|
|
|
- uid:'',
|
|
|
- price:'',
|
|
|
- img_icon:''
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- components: {
|
|
|
- UploadAuth
|
|
|
- },
|
|
|
- computed: {
|
|
|
-
|
|
|
- },
|
|
|
- mounted() {
|
|
|
-
|
|
|
- },
|
|
|
- methods: {
|
|
|
- handleAvatarSuccess(res, file) {
|
|
|
- this.vodForm.img_icon = res.data.img_icon
|
|
|
- },
|
|
|
- beforeAvatarUpload(file) {
|
|
|
- return true
|
|
|
- },
|
|
|
- async getUserData(filename, callback) {
|
|
|
- let res = await this.$post("/api/admin/upload/video", {filename: filename});
|
|
|
- if (res && res.status === 1) {
|
|
|
- let data = res.data;
|
|
|
- callback(JSON.stringify({Vod:data}));
|
|
|
- }
|
|
|
- },
|
|
|
- }
|
|
|
- };
|
|
|
-</script>
|
|
|
-
|
|
|
-<style>
|
|
|
- .pform-head{
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- .pform-body{
|
|
|
- margin: 20px 200px;
|
|
|
- }
|
|
|
- .img-uploader .el-upload {
|
|
|
- border: 1px dashed #d9d9d9;
|
|
|
- border-radius: 6px;
|
|
|
- cursor: pointer;
|
|
|
- position: relative;
|
|
|
- overflow: hidden;
|
|
|
- }
|
|
|
- .img-uploader .el-upload:hover {
|
|
|
- border-color: #409eff;
|
|
|
- }
|
|
|
- .img-uploader-icon {
|
|
|
- font-size: 28px;
|
|
|
- color: #8c939d;
|
|
|
- width: 178px;
|
|
|
- height: 178px;
|
|
|
- line-height: 178px;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- .img {
|
|
|
- width: 270px;
|
|
|
- height: 190px;
|
|
|
- display: block;
|
|
|
- }
|
|
|
-
|
|
|
- .upload-type-switch {
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- .container {
|
|
|
- width: 1200px;
|
|
|
- margin: 0 auto;
|
|
|
- }
|
|
|
- .input-control {
|
|
|
- margin: 5px 0;
|
|
|
- }
|
|
|
- .input-control label {
|
|
|
- font-size: 14px;
|
|
|
- color: #333;
|
|
|
- width: 30%;
|
|
|
- text-align: right;
|
|
|
- display: inline-block;
|
|
|
- vertical-align: middle;
|
|
|
- margin-right: 10px;
|
|
|
- }
|
|
|
- .input-control input {
|
|
|
- width: 30%;
|
|
|
- height: 30px;
|
|
|
- padding: 0 5px;
|
|
|
- }
|
|
|
- .upload {
|
|
|
- padding: 30px 50px;
|
|
|
- }
|
|
|
- .progress {
|
|
|
- font-size: 14px;
|
|
|
- }
|
|
|
- .progress i {
|
|
|
- font-style: normal;
|
|
|
- }
|
|
|
- .upload-type {
|
|
|
- color: #666;
|
|
|
- font-size: 12px;
|
|
|
- padding: 10px 0;
|
|
|
- }
|
|
|
- .upload-type button {
|
|
|
- margin: 0 10px 0 20px;
|
|
|
- }
|
|
|
- .status {
|
|
|
- font-size: 14px;
|
|
|
- margin-left: 30px;
|
|
|
- }
|
|
|
- .info {
|
|
|
- font-size: 14px;
|
|
|
- padding-left: 30px;
|
|
|
- }
|
|
|
-</style>
|
