|
|
|
|
@ -1,16 +1,9 @@ |
|
|
|
|
<template> |
|
|
|
|
<div class="container" style="padding: 30px"> |
|
|
|
|
<el-form |
|
|
|
|
:model="queryParams" |
|
|
|
|
ref="queryForm" |
|
|
|
|
:inline="true" |
|
|
|
|
label-width="68px" |
|
|
|
|
style="display: flex; margin-left: 5px" |
|
|
|
|
> |
|
|
|
|
<el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" |
|
|
|
|
style="display: flex; margin-left: 5px"> |
|
|
|
|
<div style="margin-top: 5px; margin-bottom: 20px; margin-right: 5px"> |
|
|
|
|
<el-button type="primary" icon="el-icon-plus" size="mini" @click="option({}, 'add')" |
|
|
|
|
>新增课程</el-button |
|
|
|
|
> |
|
|
|
|
<el-button type="primary" icon="el-icon-plus" size="mini" @click="option({}, 'add')">新增课程</el-button> |
|
|
|
|
</div> |
|
|
|
|
<el-form-item label="课程" prop="courseId"> |
|
|
|
|
<el-input v-model="queryParams.courseName"></el-input> |
|
|
|
|
@ -32,12 +25,8 @@ |
|
|
|
|
<el-table-column label="上课时间" align="center" prop="courseTime" /> |
|
|
|
|
<el-table-column label="课程资料" align="center"> |
|
|
|
|
<template slot-scope="scope"> |
|
|
|
|
<div |
|
|
|
|
v-for="name in scope.row.attachments" |
|
|
|
|
:key="name.fileId" |
|
|
|
|
@click="downLoadSource(name)" |
|
|
|
|
class="sourceItem" |
|
|
|
|
> |
|
|
|
|
<div v-for="name in scope.row.attachments" :key="name.fileId" @click="downLoadSource(name)" |
|
|
|
|
class="sourceItem"> |
|
|
|
|
{{ name.fileName }} |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
@ -57,91 +46,103 @@ |
|
|
|
|
</template> |
|
|
|
|
</el-table-column> |
|
|
|
|
</el-table> |
|
|
|
|
<pagination |
|
|
|
|
v-show="total > 0" |
|
|
|
|
:total="total" |
|
|
|
|
:page.sync="queryParams.pageNum" |
|
|
|
|
:limit.sync="queryParams.pageSize" |
|
|
|
|
@pagination="getList" |
|
|
|
|
/> |
|
|
|
|
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" |
|
|
|
|
:limit.sync="queryParams.pageSize" @pagination="getList" /> |
|
|
|
|
|
|
|
|
|
<el-dialog |
|
|
|
|
class="diaform" |
|
|
|
|
:title="title" |
|
|
|
|
:visible.sync="visibleopen" |
|
|
|
|
:close-on-click-modal="false" |
|
|
|
|
append-to-body |
|
|
|
|
width="700px" |
|
|
|
|
@open="openDia" |
|
|
|
|
@close="closeDia" |
|
|
|
|
> |
|
|
|
|
<el-dialog class="diaform" :title="title" :visible.sync="visibleopen" :close-on-click-modal="false" |
|
|
|
|
append-to-body width="700px" @open="openDia" @close="closeDia"> |
|
|
|
|
<div v-if="optionType == 'signIn'"> |
|
|
|
|
<vueQr :signInInfo="JSON.stringify(signInInfo)"></vueQr> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<el-form v-else :model="courseForm" :rules="rules" ref="form" label-width="150px" text-align:center> |
|
|
|
|
<el-form v-else :model="courseForm" :rules="rules" ref="courseForm" label-width="150px" text-align:center> |
|
|
|
|
<el-form-item label="所属班级" prop="classId"> |
|
|
|
|
<el-select v-model="courseForm.classId" placeholder="请选择班级" clearable> |
|
|
|
|
<el-option |
|
|
|
|
v-for="item in classList" |
|
|
|
|
:key="item.trainClassId" |
|
|
|
|
:label="item.trainClassName" |
|
|
|
|
:value="item.trainClassId" |
|
|
|
|
></el-option> |
|
|
|
|
<el-select v-model="courseForm.classId" filterable placeholder="请选择" @change="classChange"> |
|
|
|
|
<el-option v-for="item in classList" :key="item.trainClassId" :label="item.trainClassName" |
|
|
|
|
:value="item.trainClassId"> |
|
|
|
|
</el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
|
|
<el-form-item label="课程名称" prop="courseName"> |
|
|
|
|
<el-input class="courseName" v-model="courseForm.courseName"></el-input> |
|
|
|
|
<el-input class="courseName" placeholder="请输入课堂名称" v-model="courseForm.courseName"></el-input> |
|
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
|
|
<el-form-item label="课堂老师" prop="instructor"> |
|
|
|
|
<el-form-item label="课堂老师" prop="instructor" v-if="classType != 4"> |
|
|
|
|
<el-select v-model="courseForm.instructor" placeholder="请选择老师" clearable> |
|
|
|
|
<el-option |
|
|
|
|
v-for="item in teacherList" |
|
|
|
|
:key="item.talent_id" |
|
|
|
|
:label="item.name" |
|
|
|
|
:value="item.name" |
|
|
|
|
></el-option> |
|
|
|
|
<el-option v-for="item in teacherList" :key="item.talent_id" :label="item.name" |
|
|
|
|
:value="item.name"></el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
|
|
<el-form-item label="职称" prop="title" v-if="classType == 4"> |
|
|
|
|
<el-input class="courseName" v-model="courseForm.title" placeholder="请输入职称"></el-input> |
|
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
|
|
<el-form-item label="授课老师" prop="instructor" v-if="classType == 4"> |
|
|
|
|
<el-autocomplete class="inline-input" v-model="courseForm.instructor" |
|
|
|
|
:fetch-suggestions="querySearch" placeholder="请输入授课老师" @select="handleSelect"> |
|
|
|
|
<template slot-scope="{ item }"> |
|
|
|
|
<span class="addr">{{ item.name }}</span> |
|
|
|
|
</template></el-autocomplete> |
|
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
|
|
<el-form-item label="上课时间" prop="courseTime"> |
|
|
|
|
<el-date-picker |
|
|
|
|
v-model="courseForm.courseTime" |
|
|
|
|
type="datetime" |
|
|
|
|
format="yyyy-MM-dd HH:mm:ss" |
|
|
|
|
value-format="yyyy-MM-dd HH:mm:ss" |
|
|
|
|
placeholder="选择日期时间" |
|
|
|
|
> |
|
|
|
|
<el-date-picker v-model="courseForm.courseTime" type="datetime" format="yyyy-MM-dd HH:mm:ss" |
|
|
|
|
value-format="yyyy-MM-dd HH:mm:ss" placeholder="选择日期时间"> |
|
|
|
|
</el-date-picker> |
|
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
|
|
<el-form-item label="课程资料" prop="attachments"> |
|
|
|
|
<el-form-item label="授课内容" prop="courseContent" v-if="classType == 4"> |
|
|
|
|
<el-input v-model="courseForm.courseContent" placeholder="请输入授课内容" type="textarea" |
|
|
|
|
:rows="2"></el-input> |
|
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
|
|
<el-form-item label="授课链接" prop="url" v-if="classType == 4"> |
|
|
|
|
<el-input class="courseName" v-model="courseForm.url" placeholder="请输入授课链接"></el-input> |
|
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
|
|
<el-form-item label="是否付费" prop="isPay" v-if="classType == 4"> |
|
|
|
|
<!-- <el-cascader v-model="courseForm.isPay" :options="payOptions" |
|
|
|
|
@change="payHandleChange"></el-cascader> --> |
|
|
|
|
<el-select v-model="courseForm.isPay" placeholder="请选择是否付费"> |
|
|
|
|
<el-option label="付费" value="1"></el-option> |
|
|
|
|
<el-option label="免费" value="0"></el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="支付方式" prop="payMethods" v-if="classType == 4 && courseForm.isPay == 1"> |
|
|
|
|
<!-- <el-cascader v-model="courseForm.isPay" :options="payOptions" |
|
|
|
|
@change="payHandleChange"></el-cascader> --> |
|
|
|
|
<el-select v-model="courseForm.payMethods" placeholder="请选择是否付费"> |
|
|
|
|
<el-option label="费用" value="1"></el-option> |
|
|
|
|
<el-option label="口令" value="2"></el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="费用" prop="amount" |
|
|
|
|
v-if="classType == 4 && courseForm.isPay == 1 && courseForm.payMethods == '1'"> |
|
|
|
|
<el-input v-model="courseForm.amount" type="number" placeholder="请输入费用"></el-input> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="口令" prop="password" |
|
|
|
|
v-if="classType == 4 && courseForm.isPay == 1 && courseForm.payMethods == '2'"> |
|
|
|
|
<el-input v-model="courseForm.password" placeholder="请输入口令"></el-input> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="备注" prop="remark" v-if="classType == 4"> |
|
|
|
|
<el-input v-model="courseForm.remark" placeholder="请输入备注"></el-input> |
|
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<el-form-item label="课程资料" prop="attachments" v-if="classType != 4"> |
|
|
|
|
<div> |
|
|
|
|
<fileUpload |
|
|
|
|
ref="fileUpload" |
|
|
|
|
v-model="courseForm.attachments" |
|
|
|
|
listtype="picture-card" |
|
|
|
|
:fileType="['rar']" |
|
|
|
|
class="widthFix" |
|
|
|
|
fileName="publicize" |
|
|
|
|
:limit="3" |
|
|
|
|
/> |
|
|
|
|
<fileUpload ref="fileUpload" v-model="courseForm.attachments" listtype="picture-card" |
|
|
|
|
:fileType="['rar']" class="widthFix" fileName="publicize" :limit="3" /> |
|
|
|
|
</div> |
|
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
|
|
<el-form-item style="margin-top: 80px; text-align: center; margin-left: -150px"> |
|
|
|
|
<el-button |
|
|
|
|
type="primary" |
|
|
|
|
style="width: 135px; font-size: 16px; height: 39px; line-height: 11px" |
|
|
|
|
@click="submitto('confirm')" |
|
|
|
|
>确认</el-button |
|
|
|
|
> |
|
|
|
|
<el-button |
|
|
|
|
style="width: 135px; font-size: 16px; height: 39px; line-height: 11px; margin-left: 30px" |
|
|
|
|
@click="closeDia" |
|
|
|
|
>取消</el-button |
|
|
|
|
> |
|
|
|
|
<el-button type="primary" style="width: 135px; font-size: 16px; height: 39px; line-height: 11px" |
|
|
|
|
@click="submitto('confirm')">确认</el-button> |
|
|
|
|
<el-button style="width: 135px; font-size: 16px; height: 39px; line-height: 11px; margin-left: 30px" |
|
|
|
|
@click="closeDia">取消</el-button> |
|
|
|
|
</el-form-item> |
|
|
|
|
</el-form> |
|
|
|
|
</el-dialog> |
|
|
|
|
@ -173,6 +174,13 @@ const courseRule = { |
|
|
|
|
classId: [{ required: true, message: '请选择班级', trigger: 'change' }], |
|
|
|
|
instructor: [{ required: true, message: '请选择任课老师', trigger: 'change' }], |
|
|
|
|
courseTime: [{ required: true, trigger: 'change', message: '请输入上课时间' }], |
|
|
|
|
courseContent: [{ required: true, message: '请输入课程内容', trigger: 'blur' }], |
|
|
|
|
password: [{ required: true, message: '请输入口令', trigger: 'blur' }], |
|
|
|
|
amount: [{ required: true, message: '请输入付款金额', trigger: 'blue' }], |
|
|
|
|
isPay: [{ required: true, message: '请输入选择授课方法', trigger: 'change' }], |
|
|
|
|
url: [{ required: true, message: '请输入课程链接', trigger: 'blur' }], |
|
|
|
|
title: [{ required: true, message: '请输入职称', trigger: 'blur' }], |
|
|
|
|
payMethods: [{ required: true, message: '请输入支付方式', trigger: 'change' }] |
|
|
|
|
} |
|
|
|
|
export default { |
|
|
|
|
components: { fileUpload, vueQr }, |
|
|
|
|
@ -219,9 +227,46 @@ export default { |
|
|
|
|
title: '', |
|
|
|
|
visibleopen: false, |
|
|
|
|
rules: courseRule, |
|
|
|
|
classType: 0, |
|
|
|
|
// payOptions: [ |
|
|
|
|
// { |
|
|
|
|
// value: '1', |
|
|
|
|
// label: '付费', |
|
|
|
|
// children: [{ |
|
|
|
|
// key: '0', |
|
|
|
|
// value: '1-1', |
|
|
|
|
// label: '金额' |
|
|
|
|
// }, { |
|
|
|
|
// key: '0', |
|
|
|
|
// value: '1-2', |
|
|
|
|
// label: '口令' |
|
|
|
|
// }] |
|
|
|
|
// }, |
|
|
|
|
// { |
|
|
|
|
// value: '0', |
|
|
|
|
// label: '免费', |
|
|
|
|
|
|
|
|
|
// }], |
|
|
|
|
payMethods: '0' |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
querySearch(queryString, cb) { |
|
|
|
|
var restaurants = this.teacherList; |
|
|
|
|
console.log(restaurants); |
|
|
|
|
var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants; |
|
|
|
|
// 调用 callback 返回建议列表的数据 |
|
|
|
|
cb(results); |
|
|
|
|
}, |
|
|
|
|
createFilter(queryString) { |
|
|
|
|
return (restaurant) => { |
|
|
|
|
return (restaurant.name.toLowerCase().indexOf(queryString.toLowerCase()) === 0); |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
handleSelect(item) { |
|
|
|
|
this.courseForm.instructor = item.name |
|
|
|
|
console.log(item); |
|
|
|
|
}, |
|
|
|
|
async getList() { |
|
|
|
|
const res = await getCourseList(this.queryParams) |
|
|
|
|
this.total = res.total |
|
|
|
|
@ -236,6 +281,23 @@ export default { |
|
|
|
|
} |
|
|
|
|
this.getList() |
|
|
|
|
}, |
|
|
|
|
// payHandleChange(e) { |
|
|
|
|
// this.courseForm.isPay = e[0] |
|
|
|
|
// if (e[1]) { |
|
|
|
|
// this.payMethods = e[1] |
|
|
|
|
// } |
|
|
|
|
// console.log(e); |
|
|
|
|
// }, |
|
|
|
|
classChange(e) { |
|
|
|
|
const result = this.classList.find(item => { |
|
|
|
|
console.log(item); |
|
|
|
|
return item.trainClassId == e |
|
|
|
|
}) |
|
|
|
|
if (result) { |
|
|
|
|
this.classType = result.classType |
|
|
|
|
} |
|
|
|
|
console.log(this.courseForm); |
|
|
|
|
}, |
|
|
|
|
downLoadSource(params) { |
|
|
|
|
const url = params.filePath |
|
|
|
|
if (!url) { |
|
|
|
|
@ -250,7 +312,15 @@ export default { |
|
|
|
|
switch (type) { |
|
|
|
|
case 'motify': |
|
|
|
|
this.courseForm = deepClone(row) |
|
|
|
|
this.initDialog() |
|
|
|
|
this.initDialog(this.courseForm.classId) |
|
|
|
|
// 为提供线上培训班的类型 |
|
|
|
|
// console.log(this.classList); |
|
|
|
|
// const result = this.classList.find(item => { |
|
|
|
|
// console.log(item); |
|
|
|
|
// return item.trainClassId == this.courseForm.classId |
|
|
|
|
// }) |
|
|
|
|
// console.log(result); |
|
|
|
|
// this.classType = result.classType |
|
|
|
|
break |
|
|
|
|
case 'delete': |
|
|
|
|
this.deleteRow(row) |
|
|
|
|
@ -263,10 +333,11 @@ export default { |
|
|
|
|
break |
|
|
|
|
case 'siginList': |
|
|
|
|
// this.id = row.courseId |
|
|
|
|
console.log(row); |
|
|
|
|
this.$router.push({ |
|
|
|
|
path: '/signInInfoList', |
|
|
|
|
query: { |
|
|
|
|
name: row.className, |
|
|
|
|
name: row.courseName, |
|
|
|
|
id: row.courseId, |
|
|
|
|
}, |
|
|
|
|
}) |
|
|
|
|
@ -278,7 +349,7 @@ export default { |
|
|
|
|
}, |
|
|
|
|
// 提交 |
|
|
|
|
submitto() { |
|
|
|
|
this.$refs['form'].validate((valid) => { |
|
|
|
|
this.$refs['courseForm'].validate((valid) => { |
|
|
|
|
if (valid) { |
|
|
|
|
this.submit() |
|
|
|
|
} else { |
|
|
|
|
@ -289,6 +360,15 @@ export default { |
|
|
|
|
}, |
|
|
|
|
async submit() { |
|
|
|
|
const data = deepClone(this.courseForm) |
|
|
|
|
if (data.amount) { |
|
|
|
|
data.amount = data.amount * 1 |
|
|
|
|
} |
|
|
|
|
if (this.classType == 4) { |
|
|
|
|
data.classType = '4' |
|
|
|
|
delete data.payMethods |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (this.courseForm.courseId) { |
|
|
|
|
const res = await putCourseItem(data) |
|
|
|
|
res.code == 200 && this.$message.success('修改成功') |
|
|
|
|
@ -300,11 +380,16 @@ export default { |
|
|
|
|
this.getList() |
|
|
|
|
}, |
|
|
|
|
// dialog init |
|
|
|
|
async initDialog() { |
|
|
|
|
async initDialog(val) { |
|
|
|
|
console.log(val); |
|
|
|
|
const classRes = await getClassList() |
|
|
|
|
this.classList = classRes.data |
|
|
|
|
if (val) { |
|
|
|
|
this.classChange(val) |
|
|
|
|
} |
|
|
|
|
const teacherRes = await listTeacherAll() |
|
|
|
|
this.teacherList = teacherRes |
|
|
|
|
this.classList = classRes.data |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
openDia() { |
|
|
|
|
if (this.optionType === 'motify') { |
|
|
|
|
@ -313,14 +398,19 @@ export default { |
|
|
|
|
}, |
|
|
|
|
// 关闭 |
|
|
|
|
closeDia() { |
|
|
|
|
this.$refs['form']?.resetFields() |
|
|
|
|
this.$refs['courseForm']?.resetFields() |
|
|
|
|
Object.keys(this.courseForm).forEach((item) => { |
|
|
|
|
if (Array.isArray(this.courseForm[item])) { |
|
|
|
|
if (item == 'remark') { |
|
|
|
|
this.courseForm[item] = '' |
|
|
|
|
} else { |
|
|
|
|
this.courseForm[item] = [] |
|
|
|
|
} |
|
|
|
|
} else { |
|
|
|
|
this.courseForm[item] = '' |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
this.classType = 0 |
|
|
|
|
this.$refs.fileUpload?.reset() |
|
|
|
|
this.visibleopen = false |
|
|
|
|
}, |
|
|
|
|
@ -361,11 +451,13 @@ export default { |
|
|
|
|
.courseName { |
|
|
|
|
width: 220px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.sourceItem { |
|
|
|
|
color: #1890ff; |
|
|
|
|
cursor: pointer; |
|
|
|
|
text-decoration: underline; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.sourceItem:hover { |
|
|
|
|
color: #0e4272; |
|
|
|
|
cursor: pointer; |
|
|
|
|
|
hcj
4 months ago