Compare commits
No commits in common. 'fc5f33924f577053f0de24b74695fc543644e6f7' and 'd7a2821d197dffab0556326146cf9f6326d1d077' have entirely different histories.
fc5f33924f
...
d7a2821d19
@ -1,396 +1,325 @@ |
||||
import request from "@/utils/request"; |
||||
import request from '@/utils/request' |
||||
|
||||
export function getSchoolList(query) { |
||||
return request({ |
||||
url: "/train/schoolList", |
||||
method: "get", |
||||
url: '/train/schoolList', |
||||
method: 'get', |
||||
params: query, |
||||
// headers: {
|
||||
// isToken: false
|
||||
// },
|
||||
}); |
||||
}) |
||||
} |
||||
|
||||
export function addSchool(data) { |
||||
return request({ |
||||
url: "/train/school/add", |
||||
method: "post", |
||||
url: '/train/school/add', |
||||
method: 'post', |
||||
data, |
||||
}); |
||||
}) |
||||
} |
||||
export function updateSchool(data) { |
||||
return request({ |
||||
url: "/train/school/update", |
||||
method: "post", |
||||
url: '/train/school/update', |
||||
method: 'post', |
||||
data, |
||||
}); |
||||
}) |
||||
} |
||||
|
||||
export function delSchool(id) { |
||||
return request({ |
||||
url: `/train/school/del/?schoolId=${id}`, |
||||
method: "delete", |
||||
}); |
||||
method: 'delete', |
||||
}) |
||||
} |
||||
|
||||
|
||||
export function getSignUpList(query) { |
||||
return request({ |
||||
url: `/train/trainClassList`, |
||||
method: "get", |
||||
method: 'get', |
||||
params: query, |
||||
}); |
||||
|
||||
}) |
||||
} |
||||
export function addSignUp(data) { |
||||
return request({ |
||||
url: "/train/trainClass/add", |
||||
method: "post", |
||||
url: '/train/trainClass/add', |
||||
method: 'post', |
||||
data, |
||||
}); |
||||
|
||||
}) |
||||
} |
||||
export function updateSignUp(data) { |
||||
return request({ |
||||
url: "/train/trainClass/update", |
||||
method: "post", |
||||
url: '/train/trainClass/update', |
||||
method: 'post', |
||||
data, |
||||
}); |
||||
|
||||
|
||||
}) |
||||
} |
||||
|
||||
export function delSignUp(id) { |
||||
return request({ |
||||
url: `/train/trainClass/del?trainClassId=${id}`, |
||||
method: "delete", |
||||
}); |
||||
method: 'delete', |
||||
|
||||
}) |
||||
} |
||||
|
||||
// 查询已报名列表
|
||||
export function searchNum(params) { |
||||
return request({ |
||||
url: `/train/trainStudentList`, |
||||
method: "get", |
||||
method: 'get', |
||||
params, |
||||
}); |
||||
}) |
||||
} |
||||
|
||||
|
||||
|
||||
// 人才库+教师
|
||||
// 新增人才
|
||||
export function listTalent(params) { |
||||
return request({ |
||||
url: "/talent/admin/list", |
||||
method: "get", |
||||
params, |
||||
}); |
||||
url: '/talent/admin/list', |
||||
method: 'get', |
||||
params |
||||
}) |
||||
} |
||||
export function addTalent(data) { |
||||
return request({ |
||||
url: "/talent/admin/add", |
||||
method: "post", |
||||
url: '/talent/admin/add', |
||||
method: 'post', |
||||
data, |
||||
}); |
||||
|
||||
}) |
||||
} |
||||
// 修改人才
|
||||
export function updateTalent(data) { |
||||
return request({ |
||||
url: "/talent/admin/update", |
||||
method: "post", |
||||
url: '/talent/admin/update', |
||||
method: 'post', |
||||
data, |
||||
}); |
||||
|
||||
}) |
||||
} |
||||
|
||||
// 删除人才-删除教师
|
||||
export function deleteTalent(id) { |
||||
return request({ |
||||
url: "/talent/admin/" + id, |
||||
method: "delete", |
||||
}); |
||||
url: '/talent/admin/' + id, |
||||
method: 'delete', |
||||
|
||||
}) |
||||
} |
||||
|
||||
// 查看人才-教师详情
|
||||
export function detailTalent(id) { |
||||
return request({ |
||||
url: "/talent/admin/" + id, |
||||
method: "get", |
||||
}); |
||||
url: '/talent/admin/' + id, |
||||
method: 'get', |
||||
|
||||
}) |
||||
} |
||||
|
||||
export function listTeacher() { |
||||
return request({ |
||||
url: "/talent/admin/teacherList", |
||||
method: "get", |
||||
}); |
||||
url: '/talent/admin/teacherList', |
||||
method: 'get', |
||||
|
||||
}) |
||||
} |
||||
// 新增教师
|
||||
export function addTeacher(data) { |
||||
return request({ |
||||
url: "/talent/admin/teacher/add", |
||||
method: "post", |
||||
url: '/talent/admin/teacher/add', |
||||
method: 'post', |
||||
data, |
||||
}); |
||||
|
||||
}) |
||||
} |
||||
// 修改教师
|
||||
export function updateTeacher(data) { |
||||
return request({ |
||||
url: "/talent/admin/teacher/update", |
||||
method: "post", |
||||
url: '/talent/admin/teacher/update', |
||||
method: 'post', |
||||
data, |
||||
}); |
||||
|
||||
}) |
||||
} |
||||
|
||||
// 下载模板
|
||||
export function importTemplate() { |
||||
return request({ |
||||
url: "/talent/admin/download", |
||||
method: "get", |
||||
responseType: "blob", |
||||
}); |
||||
url: '/talent/admin/download', |
||||
method: 'get', |
||||
responseType: 'blob', |
||||
|
||||
}) |
||||
} |
||||
|
||||
// 查询所有教师
|
||||
export function listTeacherAll() { |
||||
return request({ |
||||
url: "/talent/findAllTeacher", |
||||
method: "get", |
||||
}); |
||||
url: '/talent/findAllTeacher', |
||||
method: 'get', |
||||
}) |
||||
} |
||||
|
||||
// 添加备注
|
||||
export function addRemarkI(data) { |
||||
return request({ |
||||
url: "/train/addRemark", |
||||
method: "post", |
||||
url: '/train/addRemark', |
||||
method: 'post', |
||||
data, |
||||
}); |
||||
}) |
||||
} |
||||
// 删除报名人
|
||||
export function delSign(id) { |
||||
return request({ |
||||
url: "/train/trainStuden/del?studentId=" + id, |
||||
method: "delete", |
||||
}); |
||||
url: '/train/trainStuden/del?studentId=' + id, |
||||
method: 'delete', |
||||
}) |
||||
} |
||||
|
||||
// 师资班配置json
|
||||
export function setJson(data) { |
||||
return request({ |
||||
url: "/train/trainClass/editData", |
||||
method: "post", |
||||
url: '/train/trainClass/editData', |
||||
method: 'post', |
||||
data, |
||||
}); |
||||
}) |
||||
} |
||||
// 导出excel
|
||||
export function exportExcelF(id, params) { |
||||
export function exportExcelF(id) { |
||||
return request({ |
||||
url: "/train/importStudent/" + id, |
||||
method: "get", |
||||
params, |
||||
responseType: "blob", |
||||
}); |
||||
url: '/train/importStudent/' + id, |
||||
method: 'get', |
||||
responseType: 'blob', |
||||
}) |
||||
} |
||||
|
||||
|
||||
// 获取所有轮播图
|
||||
export function getSwiperInfo() { |
||||
return request({ |
||||
url: "/train/admin/banner/list", |
||||
method: "get", |
||||
}); |
||||
url: '/train/admin/banner/list', |
||||
method: 'get', |
||||
}) |
||||
} |
||||
|
||||
// 提交轮播图
|
||||
export function addSwiperInfo(data) { |
||||
return request({ |
||||
url: "train/admin/banner/add", |
||||
method: "post", |
||||
data, |
||||
}); |
||||
url: 'train/admin/banner/add', |
||||
method: 'post', |
||||
data |
||||
}) |
||||
} |
||||
|
||||
// 获取轮播图班级类型
|
||||
export function getSwiperClass() { |
||||
return request({ |
||||
url: "/train/admin/bannerTrainClasses", |
||||
method: "get", |
||||
}); |
||||
url: '/train/admin/bannerTrainClasses', |
||||
method: 'get', |
||||
}) |
||||
} |
||||
|
||||
// 删除轮播图
|
||||
export function delteSwiper(id) { |
||||
console.log(id); |
||||
return request({ |
||||
url: "/train/admin/banner/" + id, |
||||
method: "delete", |
||||
}); |
||||
url: '/train/admin/banner/' + id, |
||||
method: 'delete', |
||||
}) |
||||
} |
||||
|
||||
// 获取所有班级
|
||||
export function getClassList(params) { |
||||
export function getClassList() { |
||||
return request({ |
||||
url: "/train/admin/trainClasses", |
||||
method: "get", |
||||
params, |
||||
}); |
||||
url: '/train/admin/trainClasses', |
||||
method: 'get', |
||||
}) |
||||
} |
||||
// 获取所有课程
|
||||
export function getCourseList(params) { |
||||
return request({ |
||||
url: "/course/admin/findAll", |
||||
method: "get", |
||||
params, |
||||
}); |
||||
url: '/course/admin/findAll', |
||||
method: 'get', |
||||
params |
||||
}) |
||||
} |
||||
|
||||
// 增加课程
|
||||
export function addCourseItem(data) { |
||||
return request({ |
||||
url: "/course/admin/add", |
||||
method: "post", |
||||
data: JSON.stringify(data), |
||||
}); |
||||
url: '/course/admin/add', |
||||
method: 'post', |
||||
data:JSON.stringify(data) |
||||
}) |
||||
} |
||||
|
||||
// 修改课程
|
||||
export function putCourseItem(data) { |
||||
return request({ |
||||
url: "/course/admin/update", |
||||
method: "post", |
||||
data, |
||||
}); |
||||
url: '/course/admin/update', |
||||
method: 'post', |
||||
data |
||||
}) |
||||
} |
||||
|
||||
// 删除课程
|
||||
export function delCourse(id) { |
||||
return request({ |
||||
url: "/course/admin/" + id, |
||||
method: "delete", |
||||
}); |
||||
url: '/course/admin/' + id, |
||||
method: 'delete', |
||||
}) |
||||
} |
||||
|
||||
// 根据课程ID获取改课程下所有签到用户信息
|
||||
export function getSigninInfo(id, params) { |
||||
export function getSigninInfo(id) { |
||||
return request({ |
||||
url: "/course/admin/singin/" + id, |
||||
method: "get", |
||||
params, |
||||
}); |
||||
url: '/course/admin/singin/' + id, |
||||
method: 'get', |
||||
}) |
||||
} |
||||
// 删除签到信息
|
||||
export function delSigninItem(id) { |
||||
return request({ |
||||
url: "/course/admin/singin/" + id, |
||||
method: "delete", |
||||
}); |
||||
url: '/course/admin/singin/' + id, |
||||
method: 'delete', |
||||
}) |
||||
} |
||||
// 考勤删除
|
||||
export function delAttendance(id) { |
||||
return request({ |
||||
url: "/course/admin/singin/class/" + id, |
||||
method: "delete", |
||||
}); |
||||
url: '/course/admin/singin/class/' + id, |
||||
method: 'delete', |
||||
}) |
||||
} |
||||
// 获取考勤信息表
|
||||
export function getAttendanceList(id) { |
||||
return request({ |
||||
url: "/course/admin/singin/class/" + id, |
||||
method: "get", |
||||
}); |
||||
url: '/course/admin/singin/class/' + id, |
||||
method: 'get', |
||||
}) |
||||
} |
||||
|
||||
// 导出考勤表
|
||||
export function exportAttendance(id) { |
||||
return request({ |
||||
url: "/course/admin/importSignIn/class/" + id, |
||||
method: "get", |
||||
responseType: "blob", |
||||
}); |
||||
url: '/course/admin/importSignIn/class/' + id, |
||||
method: 'get', |
||||
responseType: 'blob' |
||||
}) |
||||
} |
||||
// 导出所有签到信息
|
||||
export function exportSignIn(id, params) { |
||||
return request({ |
||||
url: "/course/admin/importSignIn/course/" + id, |
||||
method: "get", |
||||
params, |
||||
responseType: "blob", |
||||
}); |
||||
} |
||||
|
||||
// 获取收入管理信息
|
||||
export function getInComeInfo(data) { |
||||
export function exportSignIn(id) { |
||||
return request({ |
||||
url: "/mpay/admin/record/course/payList", |
||||
method: "post", |
||||
data, |
||||
}); |
||||
} |
||||
// 获取学习人次
|
||||
export function getStudyRows(id, params) { |
||||
console.log(id); |
||||
return request({ |
||||
url: "train/online/course/studyList/" + id, |
||||
method: "get", |
||||
params, |
||||
}); |
||||
} |
||||
|
||||
// 添加学生评价
|
||||
export function addStuentEva(data) { |
||||
return request({ |
||||
url: "train/admin/assessmen/add", |
||||
method: "post", |
||||
data, |
||||
}); |
||||
} |
||||
// 删除学生评价
|
||||
export function delStudentEva(id) { |
||||
return request({ |
||||
url: "train/admin/assessmen/" + id, |
||||
method: "delete", |
||||
}); |
||||
} |
||||
// 获取学生评价列表
|
||||
export function getStudentEva(id, params) { |
||||
console.log(id); |
||||
return request({ |
||||
url: "train/admin/assessmen/list/" + id, |
||||
method: "get", |
||||
params, |
||||
}); |
||||
} |
||||
|
||||
// 导出评价信息
|
||||
export function exportEva(data) { |
||||
return request({ |
||||
url: "/train/admin/import/assement", |
||||
method: "post", |
||||
data, |
||||
responseType: "blob", |
||||
}); |
||||
} |
||||
// 复制班级
|
||||
export function copyClassInfo(id, nid) { |
||||
return request({ |
||||
url: "/course/admin/class/copy/" + id + "/" + nid, |
||||
method: "get", |
||||
}); |
||||
} |
||||
|
||||
// 导出学习人次
|
||||
export function expLearnNum(courseId) { |
||||
return request({ |
||||
url: "/train/admin/import/studyList/" + courseId, |
||||
method: "get", |
||||
responseType: "blob", |
||||
}); |
||||
} |
||||
|
||||
export function assignHomeWork(data) { |
||||
return request({ |
||||
url: "course/admin/setting/homework", |
||||
method: "post", |
||||
data, |
||||
}); |
||||
} |
||||
// export function updateHomeWork(data) {
|
||||
// return request({
|
||||
// url: "/course/admin/course/updateHomework",
|
||||
// method: "post",
|
||||
// data
|
||||
// });
|
||||
// }
|
||||
url: '/course/admin/importSignIn/course/' + id, |
||||
method: 'get', |
||||
responseType: 'blob' |
||||
}) |
||||
} |
||||
@ -1,81 +0,0 @@ |
||||
<template> |
||||
<el-upload class="upload-demo myupload" :action="action" :headers="headers" :on-preview="handlePreview" |
||||
:on-remove="handleRemove" :before-remove="beforeRemove" :on-success="successUpload" :limit="3" |
||||
:on-exceed="handleExceed" :before-upload="beforeAvatarUpload"> |
||||
<slot></slot> |
||||
</el-upload> |
||||
</template> |
||||
|
||||
<script> |
||||
import { mapGetters } from "vuex"; |
||||
export default { |
||||
data() { |
||||
return { |
||||
action: '/', |
||||
name: '' |
||||
}; |
||||
}, |
||||
computed: { |
||||
...mapGetters(['token']), |
||||
headers() { |
||||
return { Authorization: "Bearer " + this.token }; |
||||
}, |
||||
}, |
||||
methods: { |
||||
handleRemove(file, fileList) { |
||||
console.log(file, fileList); |
||||
}, |
||||
handlePreview(file) { |
||||
console.log(file); |
||||
}, |
||||
handleExceed(files, fileList) { |
||||
|
||||
}, |
||||
beforeRemove(file, fileList) { |
||||
// return this.$confirm(`确定移除 ${file.name}？`); |
||||
}, |
||||
successUpload(response) { |
||||
console.log(response); |
||||
this.$emit('upload', response, this.name) |
||||
}, |
||||
beforeAvatarUpload(file, fileList) { |
||||
this.name = file.name |
||||
const filetype = file.name.slice(file.name.lastIndexOf('.', file.name.length)) |
||||
console.log(filetype); |
||||
|
||||
const isType = ['.excel', '.xlsx'].some(item => { return item == filetype }) |
||||
if (!isType) { |
||||
this.$message.error('只能上传excel文件!'); |
||||
return false |
||||
} |
||||
this.parseExcel(file) |
||||
}, |
||||
parseExcel(file) { |
||||
let reader = new FileReader() |
||||
let _this = this |
||||
reader.readAsArrayBuffer(file) |
||||
reader.onload = function () { |
||||
let buffer = reader.result |
||||
let bytes = new Uint8Array(buffer) |
||||
let length = bytes.byteLength |
||||
let binary = '' |
||||
for (let i = 0; i < length; i++) { |
||||
binary += String.fromCharCode(bytes[i]) |
||||
} |
||||
let XLSX = require('xlsx') |
||||
let wb = XLSX.read(binary, { |
||||
type: 'binary' |
||||
}) |
||||
let outdata = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]) |
||||
console.log(outdata) |
||||
} |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss"> |
||||
.myupload .el-upload-list { |
||||
display: none; |
||||
} |
||||
</style> |
||||
@ -1,47 +0,0 @@ |
||||
/** |
||||
* 自定义拖拽指令 |
||||
* 生命周期指令包括： |
||||
* bind 第一次绑定在元素上时调用、只调用一次 |
||||
* inserted 元素被插入父节点时调用、 |
||||
* update
|
||||
* componentUpdate 指令所在组件的 VNode 及其子 VNode 全部更新后调用。 |
||||
* unbind 解绑时调用 |
||||
* |
||||
* mouseEvent类型的事件有： |
||||
* client 提供事件发生时的应用客户端区域的水平坐标，也就是无论是否滚动都会，最上方都是0 |
||||
* ctrlKey 当 ctrl 键被按下，返回 true，否则返回 false。 |
||||
* layer 往上找有定位属性的父元素的左上角（自身有定位属性的话就是相对于自身），都没有的话，就是相对于body的左上角 |
||||
* metaKey mac为Mata，windows为windows键 |
||||
* movement 相当于上一次mouseMove的偏移量 |
||||
* offset 事件对象与目标节点的内填充边（padding edge）的偏移量。 |
||||
* page 相对于文档的坐标，如果向上滚动了200px，点击最上方的值为200 |
||||
* screen 提供鼠标在全局（屏幕）中的坐标（偏移量）。 |
||||
*/ |
||||
|
||||
export default { |
||||
install(Vue) { |
||||
Vue.directive("dragme", { |
||||
// 指令全局命名为v-dragme
|
||||
inserted(el) { |
||||
el.onmousedowm = function (ev) { |
||||
// 获取鼠标按下去时候变量
|
||||
const disX = ev.clientX - el.offsetLeft; |
||||
const disY = ev.clientY - el.offsetTop; |
||||
el.onmousemove = function (ev) { |
||||
const l = ev.clientX - disX; |
||||
const t = ev.clientY - disY; |
||||
// 实时设置元素位置
|
||||
el.style.left = l + "px"; |
||||
el.style.top = t + "px"; |
||||
// 获取鼠标移动时的变量
|
||||
}; |
||||
el.onmouseup = function () { |
||||
// 获取鼠标松开时,销毁所有变量
|
||||
document.onmousemove = null; |
||||
document.onmouseup = null; |
||||
}; |
||||
}; |
||||
}, |
||||
}); |
||||
}, |
||||
}; |
||||
@ -1,38 +0,0 @@ |
||||
<template> |
||||
<div class="formOptionsWrap"> |
||||
<div v-for="(form, fIndex) in optionsData" :key="fIndex"> |
||||
<optionsItem :form="form"></optionsItem> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import Vue from 'vue'; |
||||
|
||||
|
||||
Vue.component( |
||||
'optionsItem', |
||||
{ |
||||
render: (createElement) => { |
||||
return createElement( |
||||
'div', |
||||
{}, |
||||
'option123' |
||||
) |
||||
} |
||||
} |
||||
) |
||||
const optionsData = [ |
||||
{}, |
||||
{} |
||||
] |
||||
export default { |
||||
data() { |
||||
return { |
||||
optionsData |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style></style> |
||||
@ -1,15 +0,0 @@ |
||||
<template> |
||||
<div class="formResultWrap"></div> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
|
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.formResultWrap{ |
||||
border-left: 1px solid gray; |
||||
} |
||||
</style> |
||||
@ -1,119 +0,0 @@ |
||||
<template> |
||||
<div class="sourceWrap"> |
||||
<h3 class="sourceTitle">选择组件</h3> |
||||
<div v-for="(form, fIndex) in fomrmSourceList" :key="fIndex"> |
||||
<div class="diyInpWrap" v-drageme> |
||||
<label>{{ form.label }}：</label> |
||||
<diyInput :form="form"></diyInput> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import Vue from 'vue'; |
||||
import { fomrmSourceList } from './template' |
||||
Vue.component("diyInput", { |
||||
props: { |
||||
form: Object |
||||
}, |
||||
render: function (createElement) { |
||||
if (this.form.tag == 'select') { |
||||
return createElement( |
||||
this.form.tag, |
||||
{ |
||||
domProps: { |
||||
type: this.form.type |
||||
} |
||||
}, |
||||
this.form.data.defalut.map(form => { |
||||
return createElement( |
||||
'option', |
||||
{}, |
||||
form |
||||
) |
||||
}) |
||||
) |
||||
} |
||||
else if ((this.form.type == 'radio') || (this.form.type == 'checkBox')) { |
||||
console.log(this.form); |
||||
return createElement( |
||||
'span', {}, this.form.data.defalut.map(form => { |
||||
console.log(form); |
||||
return createElement( |
||||
this.form.tag, |
||||
{ |
||||
domProps: { |
||||
type: this.form.type, |
||||
} |
||||
}, |
||||
form |
||||
) |
||||
}) |
||||
) |
||||
} else if (this.form.tag == 'textarea') { |
||||
return createElement( |
||||
this.form.tag, |
||||
{ |
||||
domProps: { |
||||
name: this.form.type, |
||||
cols: "20", |
||||
rows: "2", |
||||
placeholder: this.form.data.defalut |
||||
} |
||||
}, |
||||
) |
||||
} |
||||
return createElement( |
||||
this.form.tag, |
||||
{ |
||||
domProps: { |
||||
name: this.form.type, |
||||
cols: "50", |
||||
rows: "10", |
||||
placeholder: this.form.data.defalut |
||||
} |
||||
}, |
||||
'test' |
||||
) |
||||
} |
||||
}) |
||||
export default { |
||||
// components: { 'diy-input': diyInput }, |
||||
data() { |
||||
return { |
||||
fomrmSourceList |
||||
} |
||||
}, |
||||
renderInput() { |
||||
|
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.sourceWrap { |
||||
height: calc(100vh - 40px); |
||||
border-right: 1px solid gray; |
||||
text-align: center; |
||||
select,input,textarea{ |
||||
width: 170px; |
||||
height: 25px; |
||||
} |
||||
.sourceTitle { |
||||
line-height: 40px; |
||||
margin: 0; |
||||
} |
||||
|
||||
.diyInpWrap { |
||||
text-align: left; |
||||
margin: 0px 10px 20px 10px; |
||||
background-color: antiquewhite; |
||||
padding: 15px 10px; |
||||
cursor: move; |
||||
border-radius: 5px; |
||||
display: flex; |
||||
align-items: center; |
||||
} |
||||
} |
||||
</style> |
||||
@ -1,78 +0,0 @@ |
||||
<script> |
||||
import { itemTemp, formItemTemp, formTemplate, propertyMap, formatForm } from './template.js' |
||||
import { testData } from './testData' |
||||
export default { |
||||
name: 'formatForm', |
||||
render: (h, params) => { |
||||
|
||||
const formArray = testData |
||||
// 生产form-Item 和 form ， 也就是表单中是所有item,和与这个表单对应的data |
||||
const Factory = (property) => { |
||||
|
||||
// 表单内容 |
||||
const item = JSON.parse(JSON.stringify(itemTemp)) |
||||
// console.log(item); |
||||
// formItem内容 |
||||
const resultFormItem = JSON.parse(JSON.stringify(formItemTemp)) |
||||
// data对应数据的每一项 |
||||
const dataItem = {} |
||||
// 1 |
||||
Object.keys(property).forEach(proKey => { |
||||
// 如果对应表中存在对应关系，给表单属性赋值 |
||||
const targetKey = propertyMap[proKey] |
||||
const targetValue = property[proKey] |
||||
|
||||
if (targetKey) { |
||||
if (proKey == 'type') { |
||||
item[proKey] = targetValue |
||||
item[targetKey] = 'input' |
||||
} |
||||
resultFormItem.children = [item] |
||||
} |
||||
// 不存在对应关系，说明是data中的属性，放在data中组成{key:value} |
||||
else { |
||||
dataItem[proKey] = targetValue |
||||
formatForm.push(dataItem) |
||||
} |
||||
}); |
||||
return { 'formItem': resultFormItem, itemForm: 'formatForm' } |
||||
} |
||||
|
||||
// 获取form的子元素数组，所有元素都添加在此数组 |
||||
// 遍历源数据，生成目标数据 |
||||
const itemResult = formArray.map((li) => { |
||||
const { formItem, itemForm } = Factory(li) |
||||
// data |
||||
formatForm.push(itemForm) |
||||
// 返回form - Item |
||||
return formItem |
||||
}) |
||||
formTemplate.children = itemResult |
||||
const resu = renderFactory(formTemplate) |
||||
|
||||
// 生成dom |
||||
function renderFactory(current) { |
||||
const tag = current.tag |
||||
const property = current.property |
||||
let childrend = current.children |
||||
|
||||
if (current.children.length != 0) { |
||||
childrend = current.children.map(it => { |
||||
return renderFactory(it) |
||||
}) |
||||
} else { |
||||
childrend = '' |
||||
} |
||||
|
||||
return h(tag, property, childrend) |
||||
} |
||||
|
||||
|
||||
return resu |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
@import url(./style.scss); |
||||
</style> |
||||
@ -1,27 +0,0 @@ |
||||
<template> |
||||
<div class="diyWrap"> |
||||
<formSource></formSource> |
||||
<formOptions></formOptions> |
||||
<formResult></formResult> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import formSource from '@/components/formatForm/formSource.vue' |
||||
import formResult from '@/components/formatForm/formResult.vue' |
||||
import formOptions from '@/components/formatForm/formOptions.vue' |
||||
export default { |
||||
components: { |
||||
formSource, |
||||
formResult, |
||||
formOptions |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.diyWrap{ |
||||
display: grid; |
||||
grid-template-columns: 300px calc(100vw - 600px) 300px; |
||||
} |
||||
</style> |
||||
@ -1,6 +0,0 @@ |
||||
.form-wrap{ |
||||
background-color: antiquewhite; |
||||
.form-item{ |
||||
background-color: aqua; |
||||
} |
||||
} |
||||
@ -1,80 +0,0 @@ |
||||
export const lableWidth = "80px"; |
||||
|
||||
const propertyMap = { |
||||
// title: "label",
|
||||
type: "tag", |
||||
key: "formKey", |
||||
value: "defaultValue", |
||||
}; |
||||
|
||||
const fomrmSourceList = [ |
||||
{ |
||||
type:'input', |
||||
tag:'input', |
||||
label:'输入框', |
||||
data:{defalut:'请输入文本'} |
||||
}, |
||||
{ |
||||
type:'radio', |
||||
label:'单选框', |
||||
tag:'input', |
||||
data:{defalut:['test1','test2']} |
||||
}, |
||||
{ |
||||
type:'checkBox', |
||||
tag:'input', |
||||
label:'多选框', |
||||
data:{defalut:['boxTest1','boxTest2','boxTest3']} |
||||
}, |
||||
{ |
||||
type:'select', |
||||
tag:'select', |
||||
label:'下拉框', |
||||
data:{defalut:['seTest1','seTest2','seTest3']} |
||||
}, |
||||
{ |
||||
tag:'textarea', |
||||
type:'textarea', |
||||
label:'文本框', |
||||
data:{defalut:'请输入文本'} |
||||
}, |
||||
]; |
||||
|
||||
const optionsTemplate = fomrmSourceList |
||||
|
||||
const formatForm = []; |
||||
|
||||
const itemTemp = { |
||||
tag: "", |
||||
property: {}, |
||||
text: "", |
||||
children: [], |
||||
}; |
||||
const formItemTemp = { |
||||
tag: "div", |
||||
property: { |
||||
class: "el-form-item", |
||||
}, |
||||
text: "", |
||||
children: [], |
||||
}; |
||||
const formTemplate = { |
||||
tag: "div", |
||||
property: { |
||||
ref: "forMatform", |
||||
class: "form-wrap", |
||||
":model": `${formatForm}`, |
||||
"label-width": `${lableWidth}`, |
||||
}, |
||||
text: "", |
||||
children: [], |
||||
}; |
||||
export { |
||||
itemTemp, |
||||
formItemTemp, |
||||
formTemplate, |
||||
propertyMap, |
||||
formatForm, |
||||
fomrmSourceList, |
||||
optionsTemplate |
||||
}; |
||||
@ -1,42 +0,0 @@ |
||||
export const testData = [ |
||||
{ name: "姓名", type: "input", key: "name", value: "" }, |
||||
{ title: "在校职务", type: "input", key: "title", value: "" }, |
||||
{ mobile: "手机号", type: "input", key: "mobile", value: "" }, |
||||
{ college: "院校全称", type: "input", key: "college", value: "" }, |
||||
{ address: "院校所在地址", type: "input", key: "address", value: "" }, |
||||
{ |
||||
payType: "培训付款方式", |
||||
type: "radio", |
||||
key: "payType", |
||||
value: [ |
||||
"公对公转账，请于报到前提供截图", |
||||
"现场支付（公务卡、微信、支付宝、现金）", |
||||
], |
||||
}, |
||||
{ sex: "性别", type: "radio", key: "sex", value: ["男", "女"] }, |
||||
{ |
||||
hotel: "是否需要统一安排住宿", |
||||
type: "radio", |
||||
key: "hotel", |
||||
value: [ |
||||
"大床房(付房费全额)", |
||||
"标间(独立居住、付全额房费)", |
||||
"标间(拼房、付房费一半)，无指定合住人员", |
||||
"标间(拼房、付房费一半)，指定合住人员", |
||||
"其他，请说明，包括非指定日期的订房", |
||||
"无须订房，自行安排", |
||||
], |
||||
}, |
||||
{ |
||||
addWeixin: "是否添加业务负责人微信", |
||||
type: "radio", |
||||
key: "addWeixin", |
||||
value: ["是", "否"], |
||||
}, |
||||
{ |
||||
suggestion: "针对此次培训，您还有什么建议", |
||||
type: "textarea", |
||||
key: "suggestion", |
||||
value: "", |
||||
}, |
||||
]; |
||||
@ -1,24 +0,0 @@ |
||||
<template> |
||||
<div> |
||||
<div class="importArea"> |
||||
<el-select v-model="model" placeholder="请选择班级"> |
||||
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> |
||||
</el-option> |
||||
</el-select> |
||||
<el-upload action=""> |
||||
<el-button size="small" type="primary">点击上传</el-button> |
||||
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div> |
||||
</el-upload> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
|
||||
} |
||||
</script> |
||||
|
||||
<style> |
||||
|
||||
</style> |
||||
@ -1,28 +0,0 @@ |
||||
<template> |
||||
<div class="testModule"> |
||||
<h2 class="testModuleTitle">表单模块测试</h2> |
||||
<diyForm></diyForm> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import diyForm from '@/components/formatForm/indexX.vue' |
||||
// import formSource from '@/components/formatForm/formSource.vue' |
||||
export default { |
||||
components: { |
||||
diyForm |
||||
} |
||||
|
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.testModule { |
||||
.testModuleTitle{ |
||||
text-align: center; |
||||
height: 40px; |
||||
border-bottom: 1px solid gray; |
||||
margin: 0; |
||||
} |
||||
} |
||||
</style> |
||||
@ -1,324 +0,0 @@ |
||||
<template> |
||||
<el-dialog title="布置作业" :visible.sync="dialogVisible" width="width" @close="beforeClose" |
||||
:close-on-click-modal="false"> |
||||
<div class="homeWork"> |
||||
<ImageUpload v-show="false" id="imgUploadQuill" :igonreMin="true" v-model="quillImg" @input="getImg"> |
||||
</ImageUpload> |
||||
<quill-editor v-model="editContent" ref="myQuillEditor" :options="editorOption" @blur="onEditorBlur($event)" |
||||
@focus="onEditorFocus($event)" @change="onEditorChange($event)"> |
||||
</quill-editor> |
||||
</div> |
||||
<div slot="footer"> |
||||
<el-button @click="dialogVisible = false">取 消</el-button> |
||||
<el-button type="primary" @click="submit">确 定</el-button> |
||||
</div> |
||||
</el-dialog> |
||||
</template> |
||||
|
||||
<script> |
||||
import ImageUpload from '@/components/ImageUpload/index.vue' |
||||
import { Quill, quillEditor } from "vue-quill-editor"; //调用编辑器 |
||||
// import Quill from "quill"; |
||||
import "quill/dist/quill.core.css"; |
||||
import "quill/dist/quill.snow.css"; |
||||
import "quill/dist/quill.bubble.css"; |
||||
// import { ImageExtend, QuillWatch } from 'quill-image-extend-module' |
||||
import ImageResize from 'quill-image-resize-module'; |
||||
// 设置字体大小 |
||||
const fontSizeStyle = Quill.import("attributors/style/size"); // 引入这个后会把样式写在style上 |
||||
fontSizeStyle.whitelist = ["12px", "14px", "16px", "18px", "20px", "24px", "28px", "32px", "36px",]; |
||||
Quill.register(fontSizeStyle, true); |
||||
// // 设置字体样式 |
||||
const Font = Quill.import("attributors/style/font"); // 引入这个后会把样式写在style上 |
||||
const fonts = ["SimSun", "SimHei", "Microsoft-YaHei", "KaiTi", "FangSong"]; |
||||
Font.whitelist = fonts; // 将字体加入到白名单 |
||||
Quill.register(Font, true); |
||||
Quill.register('modules/imageResize', ImageResize); |
||||
import { ImageDrop } from 'quill-image-drop-module' |
||||
Quill.register('modules/imageDrop', ImageDrop) |
||||
const AlignStyle = Quill.import("attributors/style/align"); |
||||
AlignStyle.whitelist = ["right", "center", "justify"]; |
||||
Quill.register(AlignStyle, true); |
||||
const toolbarOptions = [ |
||||
["bold", "italic", "underline", "strike"], // 加粗 斜体 下划线 删除线 -----['bold', 'italic', 'underline', 'strike'] |
||||
[{ color: [] }, { background: [] }], // 字体颜色、字体背景颜色-----[{ color: [] }, { background: [] }] |
||||
[{ align: [] }], // 对齐方式-----[{ align: [] }] |
||||
// [{ size: ["12px","14px","16px","18px","20px","24px","28px","32px","36px",true] }], // 字体大小-----[{ size: ['small', false, 'large', 'huge'] }] |
||||
// [{ font: ["SimSun", "SimHei", "Microsoft-YaHei", "KaiTi", "FangSong",true] }], // 字体种类-----[{ font: [] }] |
||||
[{ size: fontSizeStyle.whitelist }], // 字体大小-----[{ size: ['small', false, 'large', 'huge'] }] |
||||
[{ font: fonts }], // 字体种类-----[{ font: [] }] |
||||
[{ header: [1, 2, 3, 4, 5, 6, true] }], // 标题 |
||||
[{ direction: "ltl" }], // 文本方向-----[{'direction': 'rtl'}] |
||||
[{ direction: "rtl" }], // 文本方向-----[{'direction': 'rtl'}] |
||||
[{ indent: "-1" }, { indent: "+1" }], // 缩进-----[{ indent: '-1' }, { indent: '+1' }] |
||||
[{ list: "ordered" }, { list: "bullet" }], // 有序、无序列表-----[{ list: 'ordered' }, { list: 'bullet' }] |
||||
[{ script: "sub" }, { script: "super" }], // 上标/下标-----[{ script: 'sub' }, { script: 'super' }] |
||||
["blockquote", "code-block"], // 引用 代码块-----['blockquote', 'code-block'] |
||||
["clean"], // 清除文本格式-----['clean'] |
||||
["link", "image"], // 链接、图片、视频-----['link', 'image', 'video'] |
||||
]; |
||||
export default { |
||||
components: { quillEditor, ImageUpload }, |
||||
data() { |
||||
return { |
||||
dialogVisible: false, |
||||
editContent: '', |
||||
quillImg: '', |
||||
editorOption: { |
||||
placeholder: "请输入作业内容", |
||||
modules: { |
||||
toolbar: { |
||||
container: toolbarOptions, |
||||
// handlers: { |
||||
// image: this.handleImgUpload, |
||||
// }, |
||||
handlers: { //此处是图片上传时候需要使用到的 |
||||
'image': function (value) { |
||||
console.log(value) |
||||
if (value) { // 点击图片 |
||||
document.querySelector('#imgUploadQuill .el-upload').click() |
||||
} |
||||
} |
||||
} |
||||
}, |
||||
// 图片拖拽 |
||||
// imageDrop: true, |
||||
imageResize: { |
||||
displayStyles: { |
||||
backgroundColor: 'black', |
||||
border: 'none', |
||||
color: 'white' |
||||
}, |
||||
modules: ['Resize', 'DisplaySize', 'Toolbar'] |
||||
}, |
||||
}, |
||||
}, |
||||
} |
||||
}, |
||||
mounted() { |
||||
}, |
||||
methods: { |
||||
submit() { |
||||
this.$emit('subWork', this.editContent) |
||||
console.log(this.editContent); |
||||
}, |
||||
beforeClose() { |
||||
this.editContent = '' |
||||
}, |
||||
onEditorReady(editor) { |
||||
// 准备编辑器 |
||||
}, |
||||
getImg(url) { |
||||
console.log(process.env.VUE_APP_BASE_API + url); |
||||
if (url) { |
||||
const quill = this.$refs.myQuillEditor.quill |
||||
// 获取光标位置 |
||||
const pos = quill.getSelection().index |
||||
// 插入图片到光标位置 |
||||
quill.insertEmbed(pos, 'image', process.env.VUE_APP_BASE_API + url) |
||||
} else { |
||||
this.$essage.error('图片插入失败') |
||||
} |
||||
|
||||
}, |
||||
onEditorBlur() { }, // 失去焦点事件 |
||||
onEditorFocus() { }, // 获得焦点事件 |
||||
// 内容改变事件 |
||||
onEditorChange({ quill, html, text }) { |
||||
if (text.length - 1 > 2000) { |
||||
let event = this.$refs.myQuillEditor |
||||
event.quill.deleteText(2000, 1); |
||||
this.$message({ |
||||
type: 'warning', |
||||
message: '长度超出，无法输入!' |
||||
}); |
||||
// this.content = html |
||||
return |
||||
} |
||||
// this.newsobj.content = this.escapeStringHTML(this.editContent); |
||||
// console.log('输出结果', this.editContent) |
||||
}, |
||||
// 转码 |
||||
escapeStringHTML(content) { |
||||
content = content.replace(/</g, "<"); |
||||
content = content.replace(/>/g, ">"); |
||||
return content; |
||||
}, |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style> |
||||
.ql-editor { |
||||
min-height: 250px; |
||||
max-height: 400px; |
||||
} |
||||
.homeWork .ql-editor{ |
||||
margin-left: 0; |
||||
} |
||||
|
||||
|
||||
.ql-snow .ql-tooltip[data-mode="link"]::before { |
||||
content: "请输入链接地址:"; |
||||
} |
||||
|
||||
.ql-snow .ql-tooltip.ql-editing a.ql-action::after { |
||||
border-right: 0px; |
||||
content: "保存"; |
||||
padding-right: 0px; |
||||
} |
||||
|
||||
.ql-snow .ql-tooltip[data-mode="video"]::before { |
||||
content: "请输入视频地址:"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-size .ql-picker-label::before, |
||||
.ql-snow .ql-picker.ql-size .ql-picker-item::before { |
||||
content: "14px"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="small"]::before, |
||||
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="small"]::before { |
||||
content: "10px"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="large"]::before, |
||||
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="large"]::before { |
||||
content: "18px"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="huge"]::before, |
||||
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="huge"]::before { |
||||
content: "32px"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-header .ql-picker-label::before, |
||||
.ql-snow .ql-picker.ql-header .ql-picker-item::before { |
||||
content: "文本"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before, |
||||
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before { |
||||
content: "标题1"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before, |
||||
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before { |
||||
content: "标题2"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before, |
||||
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before { |
||||
content: "标题3"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before, |
||||
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before { |
||||
content: "标题4"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before, |
||||
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before { |
||||
content: "标题5"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before, |
||||
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before { |
||||
content: "标题6"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-font .ql-picker-label::before, |
||||
.ql-snow .ql-picker.ql-font .ql-picker-item::before { |
||||
content: "默认"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="SimSun"]::before, |
||||
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="SimSun"]::before { |
||||
content: "宋体"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="Microsoft-YaHei"]::before, |
||||
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="Microsoft-YaHei"]::before { |
||||
content: "微软雅黑"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="KaiTi"]::before, |
||||
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="KaiTi"]::before { |
||||
content: "楷体"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="FangSong"]::before, |
||||
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="FangSong"]::before { |
||||
content: "仿宋"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="SimHei"]::before, |
||||
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="SimHei"]::before { |
||||
content: "黑体"; |
||||
} |
||||
|
||||
.ql-toolbar.ql-snow+.ql-container.ql-snow { |
||||
border-bottom-left-radius: 5px; |
||||
border-bottom-right-radius: 5px; |
||||
} |
||||
|
||||
.ql-toolbar.ql-snow { |
||||
border-top-left-radius: 5px; |
||||
border-top-right-radius: 5px; |
||||
} |
||||
|
||||
.ql-snow .ql-stroke, |
||||
.ql-snow .ql-picker { |
||||
/* color: #999; |
||||
stroke: #999; */ |
||||
} |
||||
|
||||
.ql-snow .ql-fill, |
||||
.ql-snow .ql-stroke.ql-fill { |
||||
/* fill: #999; */ |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="12px"]::before, |
||||
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="12px"]::before { |
||||
content: "12px"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="14px"]::before, |
||||
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="14px"]::before { |
||||
content: "14px"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="16px"]::before, |
||||
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="16px"]::before { |
||||
content: "16px"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="20px"]::before, |
||||
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="20px"]::before { |
||||
content: "20px"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="24px"]::before, |
||||
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="24px"]::before { |
||||
content: "24px"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="28px"]::before, |
||||
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="28px"]::before { |
||||
content: "28px"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="32px"]::before, |
||||
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="32px"]::before { |
||||
content: "32px"; |
||||
} |
||||
|
||||
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="36px"]::before, |
||||
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="36px"]::before { |
||||
content: "36px"; |
||||
} |
||||
|
||||
.ql-container { |
||||
font-size: 14px; |
||||
} |
||||
</style> |
||||
@ -1,222 +0,0 @@ |
||||
<template> |
||||
<div class="importCourseWrap"> |
||||
<div class="importArea" v-if="tableList.length == 0"> |
||||
<el-form ref="form" :model="excelForm" :rules="excleRules" label-width="150px"> |
||||
<el-form-item label="请选择班级" prop="className"> |
||||
<el-select v-model="excelForm.className" filterable placeholder="请选择"> |
||||
<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="请上传excel" prop="excelFile"> |
||||
<el-upload class="upload-demo" drag action="#" :file-list="fileList" :before-upload="beforeUpload" |
||||
:show-file-list="false" :on-remove="handleRemove"> |
||||
<i class="el-icon-upload"></i> |
||||
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div> |
||||
<div class="el-upload__tip" slot="tip">只能上传excel、xlsx文件，且不超过500kb</div> |
||||
</el-upload> |
||||
<div>{{ excelForm.excelFile }}</div> |
||||
|
||||
</el-form-item> |
||||
</el-form> |
||||
<div style="text-align: center;"> |
||||
<el-button @click="parseExcel(file)" type="primary" |
||||
:disabled="(excelForm.className == '' || excelForm.excelFile == '')">确认上传{{ excelForm.className && |
||||
excelForm.excelFile }}</el-button> |
||||
</div> |
||||
</div> |
||||
<div v-else> |
||||
<el-table height="800px" :data="tableList" style="width: 100%"> |
||||
<el-table-column prop="courseName" label="课堂名称" width="width"></el-table-column> |
||||
<el-table-column prop="courseTime" label="上课时间" width="width"></el-table-column> |
||||
<el-table-column prop="dateTime" label="下课时间" width="width"></el-table-column> |
||||
<el-table-column prop="instructor" label="老师" width="width"></el-table-column> |
||||
<el-table-column prop="isPay" label="是否付款" width="width"></el-table-column> |
||||
<el-table-column prop="remark" label="备注" width="width"></el-table-column> |
||||
<el-table-column prop="title" label="职称" width="width"></el-table-column> |
||||
<el-table-column prop="url" label="链接" width="width"></el-table-column> |
||||
<el-table-column> |
||||
<template slot-scope="scope"> |
||||
<el-button type="text" @click="dialogVisible = true" size="mini">编辑</el-button> |
||||
<el-button type="text" size="mini" @click="delRow(scope.row)">删除</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
<div style="text-align: center;margin: 10px 0;"> |
||||
<el-button type="primary" @click="tableList = []">重新上传</el-button> |
||||
<el-button type="primary" @click="submit">确定提交</el-button> |
||||
</div> |
||||
</div> |
||||
<el-dialog title="编辑" :visible.sync="dialogVisible" width="width"> |
||||
<div> |
||||
<el-form ref="form" :model="form" label-width="80px"> |
||||
<el-form-item label="1"> |
||||
<el-input placeholder=""></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="2"> |
||||
<el-input placeholder=""></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="3"> |
||||
<el-input placeholder=""></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="4"> |
||||
<el-input placeholder=""></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="5"> |
||||
<el-input placeholder=""></el-input> |
||||
</el-form-item> |
||||
</el-form> |
||||
</div> |
||||
<div slot="footer"> |
||||
<el-button @click="dialogVisible = false">取 消</el-button> |
||||
<el-button type="primary" @click="dialogVisible = false">确 定</el-button> |
||||
</div> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import { |
||||
getClassList, |
||||
} from '@/api/trainService/index' |
||||
const keyMap = { |
||||
'上课时间': 'courseTime', |
||||
'下课时间': 'dateTime', |
||||
'备注': 'remark', |
||||
'授课内容': 'contend', |
||||
'授课老师': 'instructor', |
||||
'是否付费': 'isPay', |
||||
'职称': 'title', |
||||
'课堂名称': 'courseName', |
||||
'课程链接': 'url', |
||||
} |
||||
export default { |
||||
created() { |
||||
this.init() |
||||
}, |
||||
data() { |
||||
return { |
||||
excelForm: { |
||||
className: '', |
||||
excelFile: '' |
||||
}, |
||||
classList: [], |
||||
excleRules: { |
||||
className: [{ required: true, message: '请选择班级', trigger: 'blur' }], |
||||
excelFile: [{ required: true, message: '请上传excel文件', trigger: 'change' }], |
||||
}, |
||||
fileList: [], |
||||
tableList: [], |
||||
file: '', |
||||
newFile: new FormData(), |
||||
dialogVisible: false |
||||
} |
||||
}, |
||||
methods: { |
||||
async init() { |
||||
const res = await getClassList() |
||||
this.classList = res.data |
||||
}, |
||||
beforeUpload(file, fileList) { |
||||
this.name = file.name |
||||
const filetype = file.name.slice(file.name.lastIndexOf('.', file.name.length)) |
||||
console.log(filetype); |
||||
|
||||
const isType = ['.excel', '.xlsx'].some(item => { return item == filetype }) |
||||
if (!isType) { |
||||
this.$message.error('只能上传excel文件!'); |
||||
return false |
||||
} |
||||
this.newFile.append('file', file); // 2. 上传之前，拿到file对象，并将它添加到刚刚定义的FormData对象中。 |
||||
this.file = file |
||||
this.excelForm.excelFile = file.name |
||||
}, |
||||
handleRemove(file, fileList) { |
||||
console.log(file, fileList); |
||||
}, |
||||
product(outdata, loading) { |
||||
const result = outdata.reduce((pre, cur, index) => { |
||||
const obj = {} |
||||
Object.keys(cur).forEach(key => { |
||||
console.log(key); |
||||
if (keyMap[key]) { |
||||
obj[keyMap[key]] = cur[key] |
||||
} else { |
||||
|
||||
} |
||||
}) |
||||
pre.push(obj) |
||||
return pre |
||||
}, []) |
||||
this.tableList = result |
||||
console.log(result); |
||||
|
||||
console.log(outdata); |
||||
loading.close() |
||||
}, |
||||
parseExcel(file) { |
||||
const loading = this.$loading({ |
||||
lock: true, |
||||
text: '解析中', |
||||
spinner: 'el-icon-loading', |
||||
background: 'rgba(0, 0, 0, 0.7)' |
||||
}); |
||||
let reader = new FileReader() |
||||
let _this = this |
||||
reader.readAsArrayBuffer(file) |
||||
reader.onload = function () { |
||||
let buffer = reader.result |
||||
let bytes = new Uint8Array(buffer) |
||||
let length = bytes.byteLength |
||||
let binary = '' |
||||
for (let i = 0; i < length; i++) { |
||||
binary += String.fromCharCode(bytes[i]) |
||||
} |
||||
let XLSX = require('xlsx') |
||||
let wb = XLSX.read(binary, { |
||||
type: 'binary' |
||||
}) |
||||
let outdata = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]) |
||||
_this.product(outdata, loading) |
||||
} |
||||
}, |
||||
delRow(row) { |
||||
this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', { |
||||
confirmButtonText: '确定', |
||||
cancelButtonText: '取消', |
||||
type: 'warning' |
||||
}).then(() => { |
||||
this.$message({ |
||||
type: 'success', |
||||
message: '删除成功' |
||||
}); |
||||
}) |
||||
}, |
||||
submit() { |
||||
this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', { |
||||
confirmButtonText: '确定', |
||||
cancelButtonText: '取消', |
||||
type: 'warning' |
||||
}).then(() => { |
||||
this.$message.success('修改成功') |
||||
this.$router.push('/courseManage') |
||||
}).catch(() => { |
||||
this.$message({ |
||||
type: 'info', |
||||
message: '已取消删除' |
||||
}); |
||||
}); |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.importCourseWrap { |
||||
.importArea { |
||||
width: 500px; |
||||
margin: 200px auto; |
||||
} |
||||
} |
||||
</style> |
||||
@ -1,68 +0,0 @@ |
||||
<template> |
||||
<div style="padding: 20px;"> |
||||
<el-button icon="el-icon-download" type="warning" size="small" style="margin-bottom: 20px" |
||||
@click="excelExport">导出为excel</el-button> |
||||
|
||||
<el-table v-loading="false" :data="listenCourseNum"> |
||||
<el-table-column label="序号" type="index" align="center" /> |
||||
<el-table-column label="姓名" align="center" prop="studentName" /> |
||||
<el-table-column label="手机号" align="center" prop="mobile" /> |
||||
<el-table-column label="开始听课时间" align="center" prop="startTime"></el-table-column> |
||||
</el-table> |
||||
<pagination :total="studentTotal" :page.sync="studentParams.pageNum" :limit.sync="studentParams.pageSize" |
||||
@pagination="init('')" /> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import { |
||||
getStudyRows, |
||||
expLearnNum |
||||
} from '@/api/trainService/index' |
||||
import { saveAs } from 'file-saver'; |
||||
export default { |
||||
data() { |
||||
return { |
||||
listenCourseNum: [], |
||||
studentTotal: 1, |
||||
studentParams: { |
||||
pageNum: 1, |
||||
pageSize: 10, |
||||
}, |
||||
courseId:'', |
||||
rourseName:'' |
||||
} |
||||
}, |
||||
created() { |
||||
this.courseId = this.$route.query.courseId |
||||
this.rourseName = this.$route.query.rourseName |
||||
this.init() |
||||
}, |
||||
methods: { |
||||
init() { |
||||
getStudyRows(this.courseId, this.studentParams).then(res => { |
||||
this.studentTotal = res.total |
||||
this.listenCourseNum = res.rows.map(item => { |
||||
if (!item.data) { |
||||
item.startTime = '未开始' |
||||
return item |
||||
} |
||||
const tempData = JSON.parse(item.data) |
||||
const courseKey = 'courseId_' + this.courseId |
||||
item.startTime = tempData.find(ph => { |
||||
return ph[courseKey] |
||||
})[courseKey] |
||||
return item |
||||
}) |
||||
}) |
||||
}, |
||||
async excelExport() { |
||||
const res = await expLearnNum(this.courseId) |
||||
const blob = new Blob([res]) |
||||
saveAs(blob, this.rourseName + '学习人数表.xlsx') |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style></style> |
||||
@ -1,501 +0,0 @@ |
||||
<template> |
||||
<div class="container" style="padding: 30px"> |
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" |
||||
style="display: flex; justify-content: space-between"> |
||||
<div style="display: flex"> |
||||
<el-form-item label="学校名称" prop="schoolName"> |
||||
<!-- <el-input v-model="queryParams.schoolName" placeholder="请输入学校名称" clearable size="small" /> --> |
||||
<el-select v-model="queryParams.schoolName"> |
||||
<el-option v-for="it in schoolList" :key="it.schoolId" :label="it.schoolName" |
||||
:value="it.schoolName"></el-option> |
||||
</el-select> |
||||
</el-form-item> |
||||
<el-form-item label="班级名称" prop="trainClassName"> |
||||
<el-input v-model="queryParams.trainClassName" placeholder="请输入班级名称" clearable size="small" /> |
||||
</el-form-item> |
||||
<el-form-item label="班级类型" prop="classType"> |
||||
<!-- <el-input v-model="queryParams.schoolName" placeholder="请输入学校名称" clearable size="small" /> --> |
||||
|
||||
<el-select v-model="queryParams.classType"> |
||||
<el-option label="校企合作班" :value="0"></el-option> |
||||
<el-option label="线下培训进阶班" :value="1"></el-option> |
||||
<el-option label="可靠性人才培训班" :value="2"></el-option> |
||||
<el-option label="师资培训班" :value="3"></el-option> |
||||
<el-option label="线上培训班" :value="4"></el-option> |
||||
</el-select> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> |
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> |
||||
</el-form-item> |
||||
</div> |
||||
</el-form> |
||||
<div style="margin-top: 5px; margin-bottom: 20px"> |
||||
<el-button type="primary" icon="el-icon-plus" size="mini" @click="addsign">新增</el-button> |
||||
</div> |
||||
<el-table v-loading="loading" :data="classList"> |
||||
<el-table-column label="序号" align="center" type="index" /> |
||||
<el-table-column label="学校" align="center" prop="schoolName" /> |
||||
<el-table-column label="班级名称" align="center" prop="trainClassName" /> |
||||
<el-table-column label="班级代号" align="center" prop="trainClassCode" /> |
||||
<!-- <el-table-column label="班级人数" align="center" prop="classSize" /> --> |
||||
<el-table-column label="班级类型" align="center" prop="registrationStartTime"> |
||||
<template slot-scope="scope"> |
||||
<span style="color:#F56C6C;" v-if="scope.row.classType == 0">校企合作班</span> |
||||
<span style="color: #E6A23C;" v-if="scope.row.classType == 1">线下培训进阶班</span> |
||||
<span style="color:brown;" v-if="scope.row.classType == 2">可靠性人才培训班</span> |
||||
<span style="color:black;" v-if="scope.row.classType == 3">师资培训班</span> |
||||
<span style="color:cornflowerblue;" v-if="scope.row.classType == 4">线上培训班</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="培训教师" align="center" prop="teacherName" /> |
||||
<el-table-column label="报名开始时间" align="center" prop="registrationStartTime"> |
||||
<template slot-scope="scope"> |
||||
{{ (scope.row.registrationStartTime && scope.row.registrationStartTime.slice(0, 10)) || '未录入' }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="报名结束时间" align="center" prop="registrationEndTime"> |
||||
<template slot-scope="scope"> |
||||
{{ (scope.row.registrationEndTime && scope.row.registrationEndTime.slice(0, 10)) || '未录入' }} |
||||
</template> |
||||
</el-table-column> |
||||
|
||||
<el-table-column label="培训开始时间" align="center" prop="trainStartTime"> |
||||
<template slot-scope="scope"> |
||||
{{ (scope.row.trainStartTime && scope.row.trainStartTime.slice(0, 10)) || '未录入' }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="培训结束时间" align="center" prop="trainEndTime"> |
||||
<template slot-scope="scope"> |
||||
{{ (scope.row.trainEndTime && scope.row.trainEndTime.slice(0, 10)) || '未录入' }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="是否限制人数" align="center" prop="limitApply"> |
||||
<template slot-scope="scope"> |
||||
{{ scope.row.limitApply == 1 ? '是' : '否' }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="已报名/总人数" align="center" prop="classSize"> |
||||
<template slot-scope="scope"> |
||||
<el-button size="mini" type="text" |
||||
:style="(scope.row.classType == 4) ? 'color:#000;cursor: default;' : ''" |
||||
@click="searchUp(scope.row)">{{ |
||||
scope.row.ratio || '暂无信息' |
||||
}}</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="状态" align="center" prop="status"> |
||||
<template slot-scope="scope"> |
||||
<!-- 1 报名未开始、2 报名中、 3 报名结束未开课、4 开课中、5 已结束 status字段 --> |
||||
<span v-if="scope.row.status == 1">报名未开始</span> |
||||
<span style="color:#E6A23C;" v-if="scope.row.status == 2">报名中</span> |
||||
<span v-if="scope.row.status == 3">报名结束未开课</span> |
||||
<span style="color:#67C23A" v-if="scope.row.status == 4">开课中</span> |
||||
<span style="color:#F56C6C;" v-if="scope.row.status == 5">已结束</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="操作" align="center" width="200"> |
||||
<template slot-scope="scope"> |
||||
<el-button size="mini" type="text" v-if="scope.row.classType == 3" |
||||
@click="setSignTab(scope.row)">配置报名表</el-button> |
||||
<el-button size="mini" type="text" @click="modify(scope.row)">修改</el-button> |
||||
<el-button size="mini" type="text" @click="delrow(scope.row)">删除</el-button> |
||||
<el-button v-show="scope.row.classType != 4" size="mini" type="text" |
||||
@click="option(scope.row)">考勤</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
<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" |
||||
width="800px" append-to-body @close="colsedia"> |
||||
<el-form :model="form" :rules="rules" ref="form" label-width="120px" inline> |
||||
<!-- 类型 --> |
||||
<el-form-item label="培训班类型" prop="classType"> |
||||
<el-select v-model="form.classType" @change="classTypeChange"> |
||||
<el-option label="校企合作班" :value="0"></el-option> |
||||
<el-option label="线下培训进阶班" :value="1"></el-option> |
||||
<el-option label="可靠性人才培训班" :value="2"></el-option> |
||||
<el-option label="师资培训班" :value="3"></el-option> |
||||
<el-option label="线上培训班" :value="4"></el-option> |
||||
</el-select> |
||||
</el-form-item> |
||||
<el-form-item label="培训教师" prop="teacherName" v-if="form.classType != 4"> |
||||
<el-select allow-create filterable v-model="form.teacherName"> |
||||
<el-option v-for="it in teacherList" :key="it.talent_id" :label="it.name" |
||||
:value="it.name"></el-option> |
||||
</el-select> |
||||
</el-form-item> |
||||
<el-form-item label="学校名称" prop="schoolId" v-if="form.classType == 0"> |
||||
<el-select v-model="form.schoolId"> |
||||
<el-option v-for="it in schoolList" :key="it.schoolId" :label="it.schoolName" |
||||
:value="it.schoolId"></el-option> |
||||
</el-select> |
||||
</el-form-item> |
||||
<el-form-item label="班级代号" prop="trainClassCode" v-if="form.classType == 0"> |
||||
<el-input v-model="form.trainClassCode" placeholder="请输入班级代号" clearable size="small" /> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="班级名称" prop="trainClassName"> |
||||
<el-input v-model="form.trainClassName" placeholder="请输入班级名称" clearable size="small" /> |
||||
</el-form-item> |
||||
<el-form-item label="班级等级" prop="classLevel" v-if="(form.classType != 0) && (form.classType != 4)"> |
||||
<el-select v-model="form.classLevel"> |
||||
<el-option label="初级" :value="0"></el-option> |
||||
<el-option label="中级" :value="1"></el-option> |
||||
<el-option label="高级" :value="2"></el-option> |
||||
</el-select> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="班级人数" prop="classSize" v-if="form.classType != 4"> |
||||
<el-input v-model="form.classSize" placeholder="请输入班级人数" clearable size="small" /> |
||||
</el-form-item> |
||||
<!-- 是否限制人数 --> |
||||
<el-form-item label="是否限制人数" prop="limitApply" class="limitApply" v-if="form.classType != 4"> |
||||
<el-radio-group v-model="form.limitApply"> |
||||
<el-radio label="1">是</el-radio> |
||||
<el-radio label="0">否</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="报名开始时间" prop="registrationStartTime" v-if="form.classType != 4"> |
||||
<el-date-picker clearable size="small" v-model="form.registrationStartTime" type="date" |
||||
value-format="yyyy-MM-dd HH:mm:ss" placeholder="报名开始时间"> |
||||
</el-date-picker> |
||||
</el-form-item> |
||||
<el-form-item label="报名结束时间" prop="registrationEndTime" v-if="form.classType != 4"> |
||||
<el-date-picker clearable size="small" v-model="form.registrationEndTime" type="date" |
||||
value-format="yyyy-MM-dd HH:mm:ss" placeholder="报名结束时间"> |
||||
</el-date-picker> |
||||
</el-form-item> |
||||
<el-form-item label="培训开始时间" prop="trainStartTime"> |
||||
<el-date-picker clearable size="small" v-model="form.trainStartTime" type="date" |
||||
value-format="yyyy-MM-dd HH:mm:ss" placeholder="培训开始时间"> |
||||
</el-date-picker> |
||||
</el-form-item> |
||||
<el-form-item label="培训结束时间" prop="trainEndTime"> |
||||
<el-date-picker clearable size="small" v-model="form.trainEndTime" type="date" |
||||
value-format="yyyy-MM-dd HH:mm:ss" placeholder="培训结束时间"> |
||||
</el-date-picker> |
||||
</el-form-item> |
||||
<br /> |
||||
<el-form-item label="资料" prop="attachment" v-if="form.classType == 0"> |
||||
<el-input v-model="form.attachment" v-show="false" :limit="1"></el-input> |
||||
<nonimage-upload ref="packageUpload" :limitRemark="'，文件请选用压缩包格式'" :limit="1" |
||||
@setImgPath="setPackagePath" imageType="zip|rar" /> |
||||
</el-form-item> |
||||
<!-- 编辑json --> |
||||
|
||||
<el-form-item style="padding-left: 170px"> |
||||
<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="colsedia">取消</el-button> |
||||
</el-form-item> |
||||
</el-form> |
||||
</el-dialog> |
||||
|
||||
<!-- 详细学生信息弹层 --> |
||||
<el-dialog class="diaform" title="报名学生信息" :visible.sync="studentOpen" :close-on-click-modal="false" |
||||
width="1200px" append-to-body> |
||||
<el-table :data="studentList"> |
||||
<el-table-column label="序号" align="center" type="index" /> |
||||
<el-table-column label="学号" align="center" prop="studentCode" v-if="activeR.classType == 0" /> |
||||
<el-table-column label="姓名" align="center" prop="studentName" /> |
||||
<el-table-column label="所属学院" align="center" prop="homeCollege" v-if="activeR.classType == 0" /> |
||||
<el-table-column label="专业名称" align="center" prop="majorName" v-if="activeR.classType == 0" /> |
||||
<el-table-column label="手机号" align="center" prop="mobile" /> |
||||
<el-table-column label="报名时间" align="center" prop="registrationTime" /> |
||||
</el-table> |
||||
<pagination v-show="totals > 0" :total="totals" :page.sync="queryParamss.pageNum" |
||||
:limit.sync="queryParamss.pageSize" @pagination="getStudentList" /> |
||||
</el-dialog> |
||||
<!-- json弹层 --> |
||||
<el-dialog title="报名表配置" :visible.sync="signTable" :close-on-click-modal="false" width="800px" append-to-body> |
||||
<JsonTool ref="jsontool" /> |
||||
<div> |
||||
例：name为标题；type为类型(input输入框;radio单选框;textarea文本域)；key为标题标识须一致；value为单选框选项 |
||||
</div> |
||||
<span slot="footer" class="dialog-footer"> |
||||
<el-button @click="jsoncancle">取 消</el-button> |
||||
<el-button type="primary" @click="jsonsubmit">确 定</el-button> |
||||
</span> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
<script> |
||||
import { |
||||
getSchoolList, |
||||
getSignUpList, |
||||
addSignUp, |
||||
updateSignUp, |
||||
delSignUp, |
||||
searchNum, |
||||
listTeacherAll, |
||||
setJson, |
||||
} from '@/api/trainService/index.js' |
||||
import ImageUpload from '@/components/ImgUpload/index.vue' |
||||
import NonimageUpload from '@/views/components/NonimageUpload' |
||||
// 1 报名未开始、2 报名中、 3 报名结束未开课、4 开课中、5 已结束 status字段 |
||||
import JsonTool from '@/components/jsonTool' |
||||
export default { |
||||
name: 'peixunbaoming', |
||||
components: { ImageUpload, NonimageUpload, JsonTool }, |
||||
data() { |
||||
return { |
||||
teacherList: [], |
||||
imgAction: process.env.VUE_APP_BASE_API + '/upload', |
||||
loading: false, |
||||
classList: [], |
||||
schoolList: [], |
||||
// 总条数 |
||||
total: 0, |
||||
// 查询参数 |
||||
queryParams: { |
||||
pageNum: 1, |
||||
pageSize: 20, |
||||
classType: null, |
||||
}, |
||||
queryParamss: { |
||||
pageNum: 1, |
||||
pageSize: 10, |
||||
}, |
||||
totals: 0, |
||||
title: '新增班级', |
||||
visibleopen: false, |
||||
form: { |
||||
classType: 0, |
||||
limitApply: '0', |
||||
}, |
||||
rules: { |
||||
classType: [{ required: true, message: '请输入培训班类型', trigger: 'change' }], |
||||
schoolId: [{ required: true, message: '请选择学校', trigger: 'change' }], |
||||
teacherName: [{ required: true, message: '请选择教师', trigger: 'change' }], |
||||
trainClassCode: [{ required: true, message: '请输入班级代号', trigger: 'blur' }], |
||||
trainClassName: [{ required: true, message: '请输入班级名称', trigger: 'blur' }], |
||||
limitApply: [{ required: true, message: '请选择是否限制人数', trigger: 'change' }], |
||||
classSize: [ |
||||
{ |
||||
required: true, |
||||
message: '请输入班级人数', |
||||
trigger: blur, |
||||
}, |
||||
], |
||||
classLevel: [{ required: true, message: '请输入班级等级', trigger: 'change' }], |
||||
registrationStartTime: [{ required: true, message: '报名开始时间', trigger: 'blur' }], |
||||
registrationEndTime: [{ required: true, message: '报名结束时间', trigger: 'blur' }], |
||||
trainStartTime: [{ required: true, message: '培训开始时间', trigger: 'blur' }], |
||||
trainEndTime: [{ required: true, message: '培训结束时间', trigger: 'blur' }], |
||||
}, |
||||
studentList: [], |
||||
studentOpen: false, |
||||
activeR: {}, |
||||
// Json |
||||
signTable: false, |
||||
activeRowId: '', |
||||
} |
||||
}, |
||||
|
||||
mounted() { }, |
||||
methods: { |
||||
// json |
||||
setSignTab(row) { |
||||
this.signTable = true |
||||
this.activeRowId = row.trainClassId |
||||
this.$nextTick(() => { |
||||
if (row.data) { |
||||
this.$refs.jsontool.jsonData = row.data |
||||
this.$refs.jsontool.formatCode() |
||||
} else { |
||||
this.$refs.jsontool.jsonData = |
||||
'[{"name":"姓名","type":"input","key":"name","value":""},{"title":"在校职务","type":"input","key":"title","value":""},{"mobile":"手机号","type":"input","key":"mobile","value":""},{"college":"院校全称","type":"input","key":"college","value":""},{"address":"院校所在地址","type":"input","key":"address","value":""},{"payType":"培训付款方式","type":"radio","key":"payType","value":["公对公转账，请于报到前提供截图","现场支付（公务卡、微信、支付宝、现金）"]},{"sex":"性别","type":"radio","key":"sex","value":["男","女"]},{"hotel":"是否需要统一安排住宿","type":"radio","key":"hotel","value":["大床房(付房费全额)","标间(独立居住、付全额房费)","标间(拼房、付房费一半)，无指定合住人员","标间(拼房、付房费一半)，指定合住人员","其他，请说明，包括非指定日期的订房","无须订房，自行安排"]},{"addWeixin":"是否添加业务负责人微信","type":"radio","key":"addWeixin","value":["是","否"]},{"suggestion":"针对此次培训，您还有什么建议","type":"textarea","key":"suggestion","value":""}]' |
||||
this.$refs.jsontool.formatCode() |
||||
} |
||||
this.$refs.jsontool.formatCode() |
||||
}) |
||||
}, |
||||
jsoncancle() { |
||||
this.signTable = false |
||||
}, |
||||
jsonsubmit() { |
||||
const flag = this.$refs.jsontool.onSubumit() |
||||
if (flag) { |
||||
const jsonstr = this.$refs.jsontool.jsonData |
||||
setJson({ data: jsonstr, trainClassId: this.activeRowId }) |
||||
.then((res) => { |
||||
this.$message.success('配置成功') |
||||
this.getList() |
||||
this.signTable = false |
||||
}) |
||||
.catch((error) => { }) |
||||
} else { |
||||
this.$message.warning('请检查JSON数据格式') |
||||
} |
||||
}, |
||||
// json |
||||
// 获取教师列表 |
||||
async getTeacherList() { |
||||
const res = await listTeacherAll() |
||||
this.teacherList = res |
||||
}, |
||||
// 资料 |
||||
setPackagePath(value) { |
||||
this.form.attachment = value |
||||
}, |
||||
// 获取学校 |
||||
async getSchoolListFn() { |
||||
const res = await getSchoolList({ |
||||
pageNum: 1, |
||||
pageSize: 999, |
||||
}) |
||||
this.schoolList = res.rows |
||||
}, |
||||
async getList() { |
||||
const res = await getSignUpList(this.queryParams) |
||||
this.total = res.total |
||||
// res.rows.form(item=>{ |
||||
// if(!item.teacherName && item.instructor){ |
||||
// item.teacherName = item.instructor |
||||
// } |
||||
// }) |
||||
this.classList = res.rows |
||||
}, |
||||
//新增资讯的弹窗 |
||||
addsign() { |
||||
this.title = '新增班级' |
||||
this.visibleopen = true |
||||
}, |
||||
//修改资讯的弹窗 |
||||
async modify(row) { |
||||
this.title = '修改班级' |
||||
this.form =JSON.parse(JSON.stringify(row)) |
||||
// 线上培训班的时间为选填 |
||||
if (row.classType == 4) { |
||||
this.rules.trainStartTime = [] |
||||
this.rules.trainEndTime = [] |
||||
} else { |
||||
this.rules.trainStartTime = [{ required: true, message: '培训开始时间', trigger: 'blur' }] |
||||
this.rules.trainEndTime = [{ required: true, message: '培训结束时间', trigger: 'blur' }] |
||||
} |
||||
// 如果有资料 |
||||
if (row.attachment) { |
||||
let packageFile = [ |
||||
{ |
||||
name: '资料', |
||||
url: row.attachment, |
||||
filePath: row.attachment, |
||||
}, |
||||
] |
||||
this.$nextTick(() => { |
||||
this.$refs.packageUpload.setToolFileList(packageFile) |
||||
}) |
||||
} |
||||
this.visibleopen = true |
||||
}, |
||||
option(row) { |
||||
console.log(row); |
||||
this.$router.push({ |
||||
path: '/attendanceList', |
||||
query: { |
||||
name: row.trainClassName, |
||||
id: row.trainClassId, |
||||
}, |
||||
}) |
||||
}, |
||||
async delrow(row) { |
||||
this.$confirm('是否确认删除培训班?', '提示', { |
||||
confirmButtonText: '确定', |
||||
cancelButtonText: '取消', |
||||
type: 'warning', |
||||
}) |
||||
.then(() => { |
||||
delSignUp(row.trainClassId).then((res) => { |
||||
this.getList() |
||||
this.$message.success('删除成功') |
||||
}) |
||||
}) |
||||
.catch(() => { }) |
||||
}, |
||||
// 提交 |
||||
async submitto() { |
||||
if (this.form.schoolId) { |
||||
const schoolinfo = this.schoolList.find((it) => it.schoolId == this.form.schoolId) |
||||
this.form.schoolName = schoolinfo.schoolName |
||||
} |
||||
this.$refs['form'].validate((valid) => { |
||||
if (valid) { |
||||
if (this.form.trainClassId) { |
||||
// 修改 |
||||
updateSignUp(this.form).then((res) => { |
||||
this.$message.success('修改成功') |
||||
this.colsedia() |
||||
this.getList() |
||||
}) |
||||
} else { |
||||
addSignUp(this.form).then((res) => { |
||||
this.$message.success('新增成功') |
||||
this.colsedia() |
||||
this.getList() |
||||
}) |
||||
} |
||||
} |
||||
}) |
||||
}, |
||||
// 关闭 |
||||
colsedia() { |
||||
this.$refs['form'].resetFields() |
||||
console.log(this.form); |
||||
this.form = { |
||||
classType: 0, |
||||
limitApply: '0', |
||||
} |
||||
this.$nextTick(() => { |
||||
this.visibleopen = false |
||||
}) |
||||
}, |
||||
handleQuery() { |
||||
this.getList() |
||||
}, |
||||
resetQuery() { |
||||
this.resetForm('queryForm') |
||||
this.getList() |
||||
}, |
||||
// 查询已报名 |
||||
searchUp(rwo) { |
||||
// this.activeR = rwo |
||||
// this.getStudentList() |
||||
if (rwo.classType == 4) { return } |
||||
this.$router.push(`/signupStudent?id=${rwo.trainClassId}&type=${rwo.classType}&name=${rwo.trainClassName}`) |
||||
|
||||
rwo.data && localStorage.setItem('jsondata', rwo.data) |
||||
}, |
||||
async getStudentList() { |
||||
const res = await searchNum(this.activeR.trainClassId) |
||||
this.studentOpen = true |
||||
this.studentList = res.rows |
||||
this.totals = res.total |
||||
}, |
||||
classTypeChange(e) { |
||||
console.log(e); |
||||
if (e == 4) { |
||||
this.rules.trainStartTime = [] |
||||
this.rules.trainEndTime = [] |
||||
} else { |
||||
this.rules.trainStartTime = [{ required: true, message: '培训开始时间', trigger: 'blur' }] |
||||
this.rules.trainEndTime = [{ required: true, message: '培训结束时间', trigger: 'blur' }] |
||||
} |
||||
} |
||||
}, |
||||
created() { |
||||
this.getList() |
||||
this.getSchoolListFn() |
||||
this.getTeacherList() |
||||
}, |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
::v-deep .el-radio-group { |
||||
width: 220px; |
||||
|
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue