Commit c4a41410 authored by 刘岩's avatar 刘岩

我的资料增加文件图片

部分新建培训代码
parent f71dbb5b
...@@ -50,7 +50,8 @@ const api = { ...@@ -50,7 +50,8 @@ const api = {
deleteCourseDiscuss: '/bdiscuss/delete', // 删除评论 deleteCourseDiscuss: '/bdiscuss/delete', // 删除评论
getMyInfo: '/user/queryMyInfo', // 获取当前登陆人信息 我的智学 个人中心 getMyInfo: '/user/queryMyInfo', // 获取当前登陆人信息 我的智学 个人中心
learning: '/BLesson/learning', // 判断是正在学该课程 643 learning: '/BLesson/learning', // 判断是正在学该课程 643
queryCourse: '/BCourse/queryCourse' // 301 查询课程分类 queryCourse: '/BCourse/queryCourse', // 301 查询课程分类
imgUpload: process.env.VUE_APP_BASE_API2 + '/api/oss/v1/file/upload' // 美腾方面图片上传接口
} }
export default api export default api
...@@ -352,6 +353,14 @@ export const post = { ...@@ -352,6 +353,14 @@ export const post = {
method: 'post', method: 'post',
params: params params: params
}) })
},
// 新建培训 图片上传
postImgUpload: (params) => {
return axios({
url: api.imgUpload,
method: 'post',
params: params
})
} }
} }
......
...@@ -270,6 +270,9 @@ ...@@ -270,6 +270,9 @@
color: #cccccc; color: #cccccc;
} }
} }
.form-data-field:active{
background: #ffffff !important;
}
.describe-field{ .describe-field{
display: block; display: block;
.van-field__control{ .van-field__control{
......
...@@ -111,6 +111,18 @@ export default { ...@@ -111,6 +111,18 @@ export default {
case 'zip': case 'zip':
this.imgName = require('@assets/images/MyInformation/ZIP.png') this.imgName = require('@assets/images/MyInformation/ZIP.png')
break break
case 'docx':
this.imgName = require('@assets/images/MyInformation/DOCX.png')
break
case 'pptx':
this.imgName = require('@assets/images/MyInformation/PPTX.png')
break
case 'xlsx':
this.imgName = require('@assets/images/MyInformation/XLSX.png')
break
case 'rar':
this.imgName = require('@assets/images/MyInformation/RAR.png')
break
default: default:
this.imgName = require('@assets/images/MyInformation/未知.png') this.imgName = require('@assets/images/MyInformation/未知.png')
break break
......
...@@ -122,6 +122,7 @@ export default { ...@@ -122,6 +122,7 @@ export default {
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
display: none;
} }
.h-selector-container { .h-selector-container {
position: absolute; position: absolute;
...@@ -129,6 +130,7 @@ export default { ...@@ -129,6 +130,7 @@ export default {
left: 0; left: 0;
bottom: 0; bottom: 0;
width: 100%; width: 100%;
height: 100%;
background: #fff; background: #fff;
} }
.h-selector-layer { .h-selector-layer {
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
v-model="formData.lessonName" v-model="formData.lessonName"
placeholder="请输入标题" placeholder="请输入标题"
required required
label-width="80px" label-width="70px"
error-message="" error-message=""
:border="false" :border="false"
/> />
...@@ -28,7 +28,7 @@ ...@@ -28,7 +28,7 @@
label="分类" label="分类"
v-model="courseName" v-model="courseName"
placeholder="请选择分类" placeholder="请选择分类"
label-width="80px" label-width="70px"
error-message="" error-message=""
:is-link="true" :is-link="true"
:readonly="true" :readonly="true"
...@@ -40,7 +40,7 @@ ...@@ -40,7 +40,7 @@
label="标签" label="标签"
v-model="labelsName" v-model="labelsName"
placeholder="请选择标签" placeholder="请选择标签"
label-width="80px" label-width="70px"
error-message="" error-message=""
:is-link="true" :is-link="true"
:readonly="true" :readonly="true"
...@@ -53,7 +53,7 @@ ...@@ -53,7 +53,7 @@
v-model="formData.courseDescription" v-model="formData.courseDescription"
type="textarea" type="textarea"
placeholder="在这里输入内容" placeholder="在这里输入内容"
label-width="80px" label-width="70px"
error-message="" error-message=""
:border="false" :border="false"
/> />
...@@ -61,16 +61,18 @@ ...@@ -61,16 +61,18 @@
class="form-data-field last-field" class="form-data-field last-field"
label="封面" label="封面"
placeholder="建议尺寸205*116" placeholder="建议尺寸205*116"
label-width="80px" label-width="70px"
error-message="" error-message=""
:readonly="true" :readonly="true"
:border="false" :border="false"
/> />
<van-uploader <van-uploader
class="uploader" class="uploader"
v-model="formData.defaultUrl" v-model="defaultUrl"
:max-count="1" :max-count="1"
preview-size="102px" preview-size="102px"
:after-read="afterRead"
image-fit="contain"
/> />
</div> </div>
<p class="title"> <p class="title">
...@@ -80,57 +82,93 @@ ...@@ -80,57 +82,93 @@
<van-field <van-field
class="form-data-field" class="form-data-field"
label="报名时间" label="报名时间"
v-model="formData.applyStartDate"
placeholder="请选择时间" placeholder="请选择时间"
label-width="80px" required
label-width="70px"
error-message="" error-message=""
:is-link="true" :is-link="true"
:readonly="true" :readonly="true"
:border="false" :border="false"
/> >
<template slot="input">
<input
class="input-date"
v-model="formData.applyStartDate"
placeholder="开始时间"
@click="DateClick('applyStartDate')"
readonly
>
<input
class="input-date"
v-model="formData.applyOverDate"
placeholder="结束时间"
@click="DateClick('applyOverDate')"
readonly
>
</template>
</van-field>
<van-field <van-field
class="form-data-field" class="form-data-field"
label="培训时间" label="培训时间"
v-model="formData.trainStartDate"
placeholder="请选择时间" placeholder="请选择时间"
label-width="80px" required
label-width="70px"
error-message="" error-message=""
:is-link="true" :is-link="true"
:readonly="true" :readonly="true"
:border="false" :border="false"
/> >
<template slot="input">
<input
class="input-date"
v-model="formData.trainStartDate"
placeholder="开始时间"
@click="DateClick('trainStartDate')"
readonly
>
<input
class="input-date"
v-model="formData.trainOverDate"
placeholder="结束时间"
@click="DateClick('trainOverDate')"
readonly
>
</template>
</van-field>
<van-field <van-field
class="form-data-field" class="form-data-field"
label="培训地点" label="培训地点"
v-model="formData.trainAddress" v-model="formData.trainAddress"
placeholder="请选择地点" placeholder="请输入地点"
label-width="80px" required
label-width="70px"
error-message="" error-message=""
:is-link="true"
:readonly="true"
:border="false" :border="false"
/> />
<van-field <van-field
class="form-data-field" class="form-data-field"
label="人数上限" label="人数上限"
v-model="formData.maxApplyPerson" v-model="formData.maxApplyPerson"
type="number"
placeholder="0即不能限制人数" placeholder="0即不能限制人数"
label-width="80px" required
label-width="70px"
error-message="" error-message=""
:is-link="true"
:readonly="true"
:border="false" :border="false"
@input="numPerson"
/> />
<van-field <van-field
class="form-data-field last-field" class="form-data-field last-field"
label="签到时间" label="签到时间"
v-model="formData.trainSignTime" v-model="trainSignText"
placeholder="开始前30分钟可签到" placeholder="开始前30分钟可签到"
label-width="80px" required
label-width="70px"
error-message="" error-message=""
:is-link="true" :is-link="true"
:readonly="true" :readonly="true"
:border="false" :border="false"
@click="signinClick"
/> />
</div> </div>
<p class="title"> <p class="title">
...@@ -141,7 +179,7 @@ ...@@ -141,7 +179,7 @@
class="form-data-field last-field" class="form-data-field last-field"
label="培训附件" label="培训附件"
placeholder="已添加0个文件" placeholder="已添加0个文件"
label-width="80px" label-width="70px"
error-message="" error-message=""
:readonly="true" :readonly="true"
:border="false" :border="false"
...@@ -164,7 +202,7 @@ ...@@ -164,7 +202,7 @@
class="form-data-field last-field" class="form-data-field last-field"
label="可见范围" label="可见范围"
v-model="formData.trainAddress" v-model="formData.trainAddress"
label-width="80px" label-width="70px"
error-message="" error-message=""
:is-link="true" :is-link="true"
:readonly="true" :readonly="true"
...@@ -197,15 +235,48 @@ ...@@ -197,15 +235,48 @@
@arrowBack="arrowBack" @arrowBack="arrowBack"
@complete="complete" @complete="complete"
/> />
<!--弹出层 日期 时间-->
<popup
v-model="datePopupIsShow"
position="bottom"
:style="{ height: '40%' }"
>
<van-datetime-picker
v-if="datePopupIsShow"
v-model="currentDate"
type="datetime"
:min-date="minDate"
:max-date="maxDate"
:formatter="formatter"
@confirm="dateConfirmClick"
@cancel="datePopupIsShow = false"
/>
</popup>
<!--签到时间 弹出层-->
<popup
v-model="signinShow"
position="bottom"
class="popup-sign-box"
>
<p class="sign-in-time" @click="choiceClick('5分钟')">5分钟</p>
<p class="sign-in-time" @click="choiceClick('10分钟')">10分钟</p>
<p class="sign-in-time" @click="choiceClick('15分钟')">15分钟</p>
<p class="sign-in-time" @click="choiceClick('20分钟')">20分钟</p>
<p class="sign-in-time" @click="choiceClick('25分钟')">25分钟</p>
<p class="sign-in-time" @click="choiceClick('30分钟')">30分钟</p>
<p class="sign-in-time cancel" @click="signinShow = false">取消</p>
</popup>
</nav-bar-view> </nav-bar-view>
</template> </template>
<script> <script>
import NavBarView from '@layouts/NavBarView' import NavBarView from '@layouts/NavBarView'
import {Field, Uploader, Popup} from 'vant' import {Field, Uploader, Popup, DatetimePicker} from 'vant'
import {get, post} from '@/api/test' import {get, post} from '@/api/test'
import Linkage from '@/components/addTrain/linkage' import Linkage from '@/components/addTrain/linkage'
import LabelTrain from '@/components/addTrain/labelTrain' import LabelTrain from '@/components/addTrain/labelTrain'
import moment from 'moment'
import 'moment/locale/zh-cn'
export default { export default {
name: 'AddTrain', name: 'AddTrain',
...@@ -215,7 +286,8 @@ export default { ...@@ -215,7 +286,8 @@ export default {
vanUploader: Uploader, vanUploader: Uploader,
Popup, Popup,
Linkage, Linkage,
LabelTrain LabelTrain,
vanDatetimePicker: DatetimePicker
}, },
data() { data() {
return { return {
...@@ -227,18 +299,28 @@ export default { ...@@ -227,18 +299,28 @@ export default {
courseId: '', // 分类ID courseId: '', // 分类ID
labels: '', // 标签 标签集合,使用','分隔 labels: '', // 标签 标签集合,使用','分隔
courseDescription: '', // 课程描述 courseDescription: '', // 课程描述
defaultUrl: [], // 课程封面 defaultUrl: '', // 课程封面
applyStartDate: '', // 报名开始时间 applyStartDate: '', // 报名开始时间
applyOverDate: '', // 报名结束时间
trainStartDate: '', // 培训开始时间 trainStartDate: '', // 培训开始时间
trainOverDate: '', // 培训结束时间
trainAddress: '', // 培训地址 trainAddress: '', // 培训地址
maxApplyPerson: '', // 最大报名人数 maxApplyPerson: 0, // 最大报名人数
trainSignTime: '' // 培训签到时间(培训开始前 分钟数) trainSignTime: '' // 培训签到时间(培训开始前 分钟数)
}, },
courseName: '', // 分类名称 courseName: '', // 分类名称
labelsName: '', // 标签名称 labelsName: '', // 标签名称
defaultUrl: [], // 课程封面
trainSignText: '', // 签到时间
isShow: false, // 分类弹窗 isShow: false, // 分类弹窗
classification: [], // 分类数据 classification: [], // 分类数据
labelsShow: false // 标签页显示隐藏 labelsShow: false, // 标签页显示隐藏
datePopupIsShow: false, // 时间弹窗 显示隐藏
minDate: null, // 最小时间
maxDate: null, // 最大时间
currentDate: null, // 默认时间
type: '', // 当前所点击的时间 input
signinShow: false // 签到时间弹窗 显示隐藏
} }
}, },
methods: { methods: {
...@@ -284,6 +366,131 @@ export default { ...@@ -284,6 +366,131 @@ export default {
}) })
this.labelsName = labelsName.join(',') this.labelsName = labelsName.join(',')
this.formData.labels = labels.join(',') this.formData.labels = labels.join(',')
},
// 选择图片成功后 方法
afterRead(fileBase) {
// 此时可以自行将文件上传至服务器
var arr = fileBase.content.split(','),
mime = arr[0].match(/:(.*?);/)[1],
bstr = atob(arr[1]),
n = bstr.length,
u8arr = new Uint8Array(n)
while (n--) {
u8arr[n] = bstr.charCodeAt(n)
}
const file = new File([u8arr], 'fileName', {type: mime})
// this.imgUpload(file)
console.log(file)
// 图片上传 请求
post.postImgUpload({
file: file,
bucket: 2,
path: 2
}).then(res => {
console.log(res)
}).catch(err => {
console.log(err)
})
},
// 图片上传 请求
// async imgUpload(file) {
// console.log(file)
// const res = await post.postImgUpload({
// file: file,
// bucket: 2,
// path: 2
// })
// console.log(res)
// }
// 点击时间
// 点击 日期 时间 input
DateClick(type) {
this.type = type
this.minDate = new Date()
this.maxDate = new Date(2099, 1, 1)
this.currentDate = new Date()
// 判断是否有回显时间
if (this.formData[type] !== '') {
this.currentDate = new Date(this.formData[type])
}
switch (this.type) {
// 判断报名开始时间不得晚于报名结束时间
case 'applyStartDate':
if (this.formData.applyOverDate !== '') {
this.maxDate = new Date(this.formData.applyOverDate)
// this.currentDate = new Date(this.formData.applyStartDate)
}
break
// 判断报名结束时间不得早于报名开始时间
case 'applyOverDate':
if (this.formData.applyStartDate !== '') {
this.minDate = new Date(this.formData.applyStartDate)
}
break
// 判断培训开始时间不得晚于培训结束时间
case 'trainStartDate':
if (this.formData.trainOverDate !== '') {
this.maxDate = new Date(this.formData.trainOverDate)
}
break
// 判断培训结束时间不得早于培训开始时间
case 'trainOverDate':
if (this.formData.trainStartDate !== '') {
this.minDate = new Date(this.formData.trainStartDate)
}
break
}
this.datePopupIsShow = true
},
// 日期时间格式化
formatter(type, value) {
if (type === 'year') {
return `${value}年`
} else if (type === 'month') {
return `${value}月`
} else if (type === 'day') {
return `${value}日`
} else if (type === 'hour') {
return `${value}时`
} else if (type === 'minute') {
return `${value}分`
}
return value
},
// 点击 日期 时间 完成 按钮 事件
dateConfirmClick() {
this.datePopupIsShow = false
switch (this.type) {
case 'applyStartDate':
this.formData.applyStartDate = moment(this.currentDate.getTime()).format('YYYY/MM/DD HH:mm')
break
case 'applyOverDate':
this.formData.applyOverDate = moment(this.currentDate.getTime()).format('YYYY/MM/DD HH:mm')
break
case 'trainStartDate':
this.formData.trainStartDate = moment(this.currentDate.getTime()).format('YYYY/MM/DD HH:mm')
break
case 'trainOverDate':
this.formData.trainOverDate = moment(this.currentDate.getTime()).format('YYYY/MM/DD HH:mm')
break
}
},
// 验证人数不能小于0
numPerson(val) {
if (val < 0) {
this.formData.maxApplyPerson = 0
}
},
// 点击签到时间 事件
signinClick() {
this.signinShow = true
},
// 选择签到时间 事件
choiceClick(val) {
console.log(val)
this.trainSignText = val
this.formData.trainSignTime = val.split('分')[0]
this.signinShow = false
} }
}, },
mounted() { mounted() {
...@@ -307,6 +514,14 @@ export default { ...@@ -307,6 +514,14 @@ export default {
} }
.form-content{ .form-content{
background: #ffffff; background: #ffffff;
.form-data-field{
.input-date{
width: 120px;
display: inline-block;
font-size: 13px;
border: none;
}
}
} }
.submit-btn{ .submit-btn{
width: 300px; width: 300px;
...@@ -321,5 +536,21 @@ export default { ...@@ -321,5 +536,21 @@ export default {
border: none; border: none;
} }
} }
.popup-sign-box{
background: #f6f6f6;
.sign-in-time{
width: 100%;
height: 49px;
line-height: 49px;
margin: 0;
font-size: 14px;
color: #333333;
border-bottom: 1px solid #e7e7e7;
background: #ffffff;
}
.cancel{
margin-top: 8px;
}
}
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment