|
|
@@ -29,45 +29,48 @@
|
|
|
<el-divider></el-divider>
|
|
|
</el-header>
|
|
|
<el-main>
|
|
|
- <el-form v-if="active==1" style="margin-top: 60px" ref="form" :model="form" label-width="80px">
|
|
|
+ <el-form v-if="active==1" style="margin-top: 60px" ref="form" label-width="80px">
|
|
|
<el-form-item label="课程名称">
|
|
|
- <el-input v-model="form.name"></el-input>
|
|
|
+ <el-input v-model="saleInfo.title"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="概述">
|
|
|
- <el-input type="textarea" v-model="form.desc"></el-input>
|
|
|
+ <el-input type="textarea" v-model="saleInfo.desc"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="封面">
|
|
|
<el-upload
|
|
|
class="avatar-uploader"
|
|
|
- action="https://jsonplaceholder.typicode.com/posts/"
|
|
|
+ action="/"
|
|
|
:show-file-list="false"
|
|
|
- :on-success="handleAvatarSuccess">
|
|
|
- <img v-if="imageUrl" :src="imageUrl" class="avatar">
|
|
|
+ :on-success="(response, file, fileList)=> upload_img_success(response, file, fileList,1)">
|
|
|
+ <img v-if="saleInfo.img_icon" :src="saleInfo.img_icon" class="avatar">
|
|
|
<i v-else class="el-icon-plus avatar-uploader-icon" style="border-radius: 6px;border: 1px dashed #d9d9d9;height: 178px;line-height: 178px;width: 178px"></i>
|
|
|
</el-upload>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="计费模式">
|
|
|
- <el-radio v-model="form.radio" label="1">免费</el-radio>
|
|
|
- <el-radio v-model="form.radio" label="2">付费</el-radio>
|
|
|
+ <el-radio v-model="saleInfo.pricetype" label="1">免费</el-radio>
|
|
|
+ <el-radio v-model="saleInfo.pricetype" label="2">付费</el-radio>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="课程价格">
|
|
|
- <el-input v-model="form.name"></el-input>
|
|
|
+ <el-form-item v-if="saleInfo.pricetype==2" label="课程价格">
|
|
|
+ <el-input v-model="saleInfo.price"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="课程状态">
|
|
|
- <el-radio v-model="form.radio" label="1">更新</el-radio>
|
|
|
- <el-radio v-model="form.radio" label="2">完结</el-radio>
|
|
|
+ <el-radio v-model="saleInfo.point" label="1">更新</el-radio>
|
|
|
+ <el-radio v-model="saleInfo.point" label="2">完结</el-radio>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="分类">
|
|
|
- <el-radio v-model="form.radio" label="1">更新</el-radio>
|
|
|
- <el-radio v-model="form.radio" label="2">完结</el-radio>
|
|
|
+ <el-cascader
|
|
|
+ class="cate-cascader"
|
|
|
+ v-model="selectedConsultCate"
|
|
|
+ :options="consultCate"
|
|
|
+ placeholder="请选择类别"></el-cascader>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="话题描述">
|
|
|
<div class="content-field">
|
|
|
<div class="content-editor">
|
|
|
<editor
|
|
|
:hideImage="false"
|
|
|
- :content="content"
|
|
|
- @change="handleChange"
|
|
|
+ :content="saleInfo.content"
|
|
|
+ @change="(val)=> editor_change(val,1)"
|
|
|
placeholder="请输入话题描述"></editor>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -77,12 +80,12 @@
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
|
|
|
- <el-form v-if="active==2" style="margin-top: 60px" ref="form" :model="form" label-width="80px">
|
|
|
+ <el-form v-if="active==2" style="margin-top: 60px" ref="form" label-width="80px">
|
|
|
<el-form-item label="讲师名称">
|
|
|
- <el-input v-model="form.name"></el-input>
|
|
|
+ <el-input v-model="saleInfo.name"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="职称">
|
|
|
- <el-input type="textarea" v-model="form.desc"></el-input>
|
|
|
+ <el-input type="textarea" v-model="saleInfo.desc"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="封面">
|
|
|
<el-upload
|
|
|
@@ -111,7 +114,7 @@
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
|
|
|
- <el-form v-if="active==3" style="margin-top: 60px" ref="form" :model="form" label-width="80px">
|
|
|
+ <el-form v-if="active==3" style="margin-top: 60px" ref="form" label-width="80px">
|
|
|
<el-form-item label="视频封面">
|
|
|
<el-upload
|
|
|
class="avatar-uploader"
|
|
|
@@ -124,39 +127,44 @@
|
|
|
</el-form-item>
|
|
|
<el-form-item label="章节管理">
|
|
|
<div v-for="(item,index) in video_list">
|
|
|
- <el-input style="margin-top: 10px" placeholder="请输入内容" v-model="form.name">
|
|
|
+ <el-input style="margin-top: 10px" placeholder="请输入内容" v-model="saleInfo.name">
|
|
|
<template slot="prepend">第{{index+1}}章</template>
|
|
|
<el-button slot="append" @click="del_zj(index)" icon="el-icon-delete"></el-button>
|
|
|
</el-input>
|
|
|
|
|
|
<div v-for="(item2,index2) in item.list" style="background: #f6f6f6;padding: 10px;margin-top: 10px">
|
|
|
- <el-input style="margin-top: 10px" placeholder="请输入课程名称" v-model="input3" class="input-with-select">
|
|
|
+ <el-input style="margin-top: 10px" placeholder="请输入课程名称" v-model="item2.filename" class="input-with-select">
|
|
|
<div slot="prepend" style="width: 120px;text-align: center">{{index+1}}-{{index2+1}}</div>
|
|
|
- <el-checkbox slot="append" style="margin-right: 15px" v-model="form.ddd">试看</el-checkbox>
|
|
|
+ <el-checkbox slot="append" style="margin-right: 15px" v-model="item2.checked">试看</el-checkbox>
|
|
|
<el-button slot="append" @click="del_kc(index,index2)" icon="el-icon-delete"></el-button>
|
|
|
</el-input>
|
|
|
<div style="padding-top: 10px;padding-bottom: 10px">
|
|
|
<el-upload
|
|
|
class="upload-demo"
|
|
|
style="display: inline-block"
|
|
|
- action="https://jsonplaceholder.typicode.com/posts/"
|
|
|
- :on-change="handleChange">
|
|
|
+ action=""
|
|
|
+ :on-progress="test"
|
|
|
+ :show-file-list="false"
|
|
|
+ :http-request="(e)=> fileChange(e,index,index2)">
|
|
|
<el-button size="small" type="primary">点击上传</el-button>
|
|
|
</el-upload>
|
|
|
- <el-button style="display: inline-block" size="small" type="primary">定时发布</el-button>
|
|
|
+ <el-button v-if="item2.time_type==1" @click="time_type(index,index2,0)" style="display: inline-block" size="small" type="primary">立即发布</el-button>
|
|
|
+ <el-button v-if="item2.time_type==0" @click="time_type(index,index2,1)" style="display: inline-block" size="small" type="primary">预约发布</el-button>
|
|
|
<el-time-picker
|
|
|
style="display: inline-block;float: right;margin-left: 10px"
|
|
|
- v-model="form.dd"
|
|
|
+ v-model="item2.ymd"
|
|
|
+ :disabled="item2.time_type==0?true:false"
|
|
|
placeholder="任意时间点">
|
|
|
</el-time-picker>
|
|
|
<el-date-picker
|
|
|
- v-model="form.daa"
|
|
|
+ v-model="item2.his"
|
|
|
style="display: inline-block;float: right"
|
|
|
type="date"
|
|
|
+ :disabled="item2.time_type==0?true:false"
|
|
|
placeholder="选择日期">
|
|
|
</el-date-picker>
|
|
|
<div class="file-upload" style="margin-top: 10px">
|
|
|
- <el-progress :text-inside="true" :stroke-width="20" :percentage="authProgress"></el-progress>
|
|
|
+ <el-progress :text-inside="true" :stroke-width="20" :percentage="item2.progress"></el-progress>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -174,7 +182,7 @@
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
|
|
|
- <el-form v-if="active==4" style="margin-top: 60px" ref="form" :model="form" label-width="80px">
|
|
|
+ <el-form v-if="active==4" style="margin-top: 60px" ref="form" label-width="80px">
|
|
|
<el-form-item label="群二维码">
|
|
|
<el-upload
|
|
|
class="avatar-uploader"
|
|
|
@@ -213,38 +221,50 @@
|
|
|
import editor from "@/components/editor";
|
|
|
import multiUploader from '@/components/multi-uploader';
|
|
|
|
|
|
+ if(process.client)
|
|
|
+ {
|
|
|
+ import('@/assets/js/aliyun-upload-sdk/aliyun-upload-sdk-1.5.2.min.js');
|
|
|
+ }
|
|
|
+
|
|
|
export default {
|
|
|
head: {
|
|
|
title: '新建咨询服务',
|
|
|
},
|
|
|
+ head() {
|
|
|
+ return {
|
|
|
+ script: [
|
|
|
+ {src: 'https://gosspublic.alicdn.com/aliyun-oss-sdk-6.13.0.min.js'},
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ },
|
|
|
components: {
|
|
|
editor,
|
|
|
- multiUploader
|
|
|
+ multiUploader,
|
|
|
},
|
|
|
data () {
|
|
|
return {
|
|
|
- sale_id: '', // 编辑时的 id
|
|
|
- title: '', // 标题
|
|
|
- selectedConsultCate: [], // 选中的技能分类
|
|
|
- consultCate: [], // 技能分类数据源
|
|
|
- content: '', // 话题描述
|
|
|
- defaultContent: '', // 默认的话题描述
|
|
|
- price: '', // 价格
|
|
|
- week: [], // 接受咨询的星期几
|
|
|
- time: [], // 接受咨询的时间范围
|
|
|
- imageList: [], // 用户上传的图片
|
|
|
- publishIsLoading: false,
|
|
|
- pcreateIsLoading: false,
|
|
|
+ sale_id: '', // 编辑时
|
|
|
active:1,
|
|
|
- form:{},
|
|
|
- imageUrl: '',
|
|
|
- authProgress: 0,
|
|
|
- content: '', // 话题描述
|
|
|
- video_list:[{"name":"","list":[{"kc_id":"1"}]}],
|
|
|
+ selectedConsultCate: [],//选中的技能分类
|
|
|
+ consultCate: [], // 技能分类数据源
|
|
|
+ saleInfo:{
|
|
|
+ point:"1",
|
|
|
+ pricetype:"1",
|
|
|
+ img_icon:""
|
|
|
+ },
|
|
|
+ video_list:[{"name":"","list":[{"kc_id":"1","progress":0,"filename":"","checked":false,"time_type":0,"ymd":"","his":""}]}],
|
|
|
}
|
|
|
},
|
|
|
mounted () {
|
|
|
this.needLogin()
|
|
|
+ if (this.saleInfo.price > 0)
|
|
|
+ {
|
|
|
+ this.saleInfo.pricetype="2";
|
|
|
+ }
|
|
|
+ else
|
|
|
+ {
|
|
|
+ this.saleInfo.pricetype="1";
|
|
|
+ }
|
|
|
this._getConsultCate()
|
|
|
this.sale_id = this.$route.query.sale_id || ''
|
|
|
if (this.sale_id) {
|
|
|
@@ -252,12 +272,15 @@
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
+ time_type(zj_id,kc_id,type){
|
|
|
+ this.video_list[zj_id].list[kc_id].time_type=type;
|
|
|
+ },
|
|
|
add_new_zj(){
|
|
|
- var new_object={"name":"","list":[{"kc_id":""}]};
|
|
|
+ var new_object={"name":"","list":[{"kc_id":"","progress":0,"filename":"","checked":false,"time_type":0,"ymd":"","his":""}]};
|
|
|
this.video_list.push(new_object);
|
|
|
},
|
|
|
add_new_kc(zj_id){
|
|
|
- var new_object={"kc_id":""};
|
|
|
+ var new_object={"kc_id":"","progress":0,"filename":"","checked":false,"time_type":0,"ymd":"","his":""};
|
|
|
this.video_list[zj_id].list.push(new_object);
|
|
|
},
|
|
|
del_kc(zj_id,kc_id){
|
|
|
@@ -286,6 +309,9 @@
|
|
|
}
|
|
|
},
|
|
|
active_set(val){
|
|
|
+ this.saleInfo.cate_id_one=this.selectedConsultCate[0];
|
|
|
+ this.saleInfo.cate_id_two=this.selectedConsultCate[1];
|
|
|
+ console.log("active_set",this.saleInfo);
|
|
|
this.active=val;
|
|
|
},
|
|
|
/** 获取咨询分类 */
|
|
|
@@ -311,90 +337,63 @@
|
|
|
console.log('get consult cate error: ', err)
|
|
|
})
|
|
|
},
|
|
|
- /** 获取咨询服务详情 */
|
|
|
- _getConsultDetail () {
|
|
|
- const self = this
|
|
|
-
|
|
|
- // this.$axios.$post('/api/sale/saleInfo', { sale_id: this.sale_id }).then(res => {
|
|
|
- // if (res.status === 1) {
|
|
|
- // console.log('获取技能详情成功', res.data)
|
|
|
- // self.title = res.data.title || ""
|
|
|
- // self.price = res.data.price || ""
|
|
|
- // self.content = res.data.content || self.defaultContent
|
|
|
- // if (res.data.cate_id_one && res.data.cate_id_two) {
|
|
|
- // self.selectedSkillCate = [res.data.cate_id_one, res.data.cate_id_two]
|
|
|
- // }
|
|
|
- // self._setSkillImages(res.data)
|
|
|
- // }
|
|
|
- // })
|
|
|
- },
|
|
|
- /** 创建、编辑咨询服务 */
|
|
|
- _publishConsultData (actionType) {
|
|
|
-
|
|
|
- },
|
|
|
- /** 验证提交的数据 */
|
|
|
- _validateConsultData () {
|
|
|
- if (this.title === '') {
|
|
|
- this.$message.error('请输入话题标题')
|
|
|
- return false
|
|
|
- }
|
|
|
- if (this.title.length < 5) {
|
|
|
- this.$message.error('话题标题不可少于5字符')
|
|
|
- return false
|
|
|
- }
|
|
|
- if (this.title.length > 50) {
|
|
|
- this.$message.error('话题标题不可超过50字符，请删减')
|
|
|
- return false
|
|
|
- }
|
|
|
- if (this.content.length < 50) {
|
|
|
- this.$message.error('话题描述不可少于50字符')
|
|
|
- return false
|
|
|
- }
|
|
|
- if (this.content.length > 5000) {
|
|
|
- this.$message.error('话题描述不可超过5000字符，请删减')
|
|
|
- return false
|
|
|
- }
|
|
|
- if (this.price < 1 || this.price > 100000) {
|
|
|
- this.$message.error('请输入1-100000元的整数价格')
|
|
|
- return false
|
|
|
- }
|
|
|
- if (String(this.price).indexOf('.') > -1) {
|
|
|
- if (parseInt(this.price) != Number(this.price)) {
|
|
|
- this.$message.error('价格只能为整数')
|
|
|
- return false
|
|
|
- }
|
|
|
- }
|
|
|
- if (this.selectedConsultCate.length !== 2 ||
|
|
|
- (!this.selectedConsultCate[0] || !this.selectedConsultCate[1])) {
|
|
|
- this.$message.error('请选择话题类别')
|
|
|
- return false
|
|
|
- }
|
|
|
- if (this.week.length === 0) {
|
|
|
- this.$message.error('请选择咨询时间')
|
|
|
- return false
|
|
|
- }
|
|
|
- if (this.time.length === 0) {
|
|
|
- this.$message.error('请选择开放时间')
|
|
|
- return false
|
|
|
+ upload_img_success(response, file, fileList,type){
|
|
|
+ if(type==1)
|
|
|
+ {
|
|
|
+ this.saleInfo.img_icon="https://stacdn.proginn.com/image/usericon/8.png";
|
|
|
}
|
|
|
-
|
|
|
- return true
|
|
|
},
|
|
|
- /** 技能描述内容改变时 */
|
|
|
- handleChange (val) {
|
|
|
- this.content = val
|
|
|
- },
|
|
|
- /** 点击提交审核时 */
|
|
|
- handleCreate () {
|
|
|
- if (this._validateConsultData()) {
|
|
|
- this._publishConsultData(this.sale_id ? 'update' : 'create')
|
|
|
+ editor_change(val,type)//编辑器内容发生改变的时候
|
|
|
+ {
|
|
|
+ if(type==1) {
|
|
|
+ this.saleInfo.content = val;
|
|
|
}
|
|
|
},
|
|
|
- /** 点击存草稿时 */
|
|
|
- handlePcreate () {
|
|
|
- if (this._validateConsultData()) {
|
|
|
- this._publishConsultData('pcreate')
|
|
|
- }
|
|
|
+ fileChange (e,zj_id,kc_id) {
|
|
|
+ let videoFile = e.file
|
|
|
+ let filename=e.file.name;
|
|
|
+ this.createUploader(videoFile,zj_id,kc_id,filename)
|
|
|
+ },
|
|
|
+ createUploader (videoFile,zj_id,kc_id,filename) {
|
|
|
+ let self = this
|
|
|
+ let uploader = new AliyunUpload.Vod({
|
|
|
+ timeout: 60000,
|
|
|
+ partSize: 1048576,
|
|
|
+ parallel: 5,
|
|
|
+ retryCount: 3,
|
|
|
+ retryDuration: 2,
|
|
|
+ region: 'cn-shanghai',
|
|
|
+ userId: '1024',
|
|
|
+ // 添加文件成功
|
|
|
+ addFileSuccess: function (uploadInfo) {
|
|
|
+ self.statusText = '添加文件成功, 等待上传...'
|
|
|
+ console.log("addFileSuccess: " + uploadInfo.file.name)
|
|
|
+ },
|
|
|
+ // 开始上传
|
|
|
+ onUploadstarted: function (uploadInfo) {
|
|
|
+ self.$axios.$post("/api/admin/upload/video", {filename: uploadInfo.file.name}).then(({data}) => {
|
|
|
+ let uploadAuth = data.UploadAuth;
|
|
|
+ let uploadAddress = data.UploadAddress;
|
|
|
+ let videoId = data.VideoId;
|
|
|
+ self.videoId = data.VideoId;
|
|
|
+ uploader.setUploadAuthAndAddress(uploadInfo, uploadAuth, uploadAddress, videoId)
|
|
|
+ })
|
|
|
+ self.statusText = '文件开始上传...'
|
|
|
+ console.log("onUploadStarted:" + uploadInfo.file.name + ", endpoint:" + uploadInfo.endpoint + ", bucket:" + uploadInfo.bucket + ", object:" + uploadInfo.object)
|
|
|
+ },
|
|
|
+ // 文件上传成功
|
|
|
+ onUploadSucceed: function (uploadInfo) {
|
|
|
+ console.log("filename"+filename);
|
|
|
+ self.video_list[zj_id].list[kc_id].filename=filename;
|
|
|
+ },
|
|
|
+ // 文件上传进度，单位：字节, 可以在这个函数中拿到上传进度并显示在页面上
|
|
|
+ onUploadProgress: function (uploadInfo, totalSize, progress) {
|
|
|
+ let progressPercent = Math.ceil(progress * 100)
|
|
|
+ self.video_list[zj_id].list[kc_id].progress=progressPercent;
|
|
|
+ },
|
|
|
+ })
|
|
|
+ uploader.addFile(videoFile);
|
|
|
+ uploader.startUpload();//上传文件
|
|
|
},
|
|
|
}
|
|
|
}
|
ccf