|
|
|
|
<template>
|
|
|
|
|
<div>
|
|
|
|
|
<el-row :gutter="20">
|
|
|
|
|
<el-col :span="24">
|
|
|
|
|
<el-card shadow="hover" class="mgb20">
|
|
|
|
|
<div>
|
|
|
|
|
<div class="flex-center mgb20">
|
|
|
|
|
<p class="hr_tag"></p>
|
|
|
|
|
<span>筛选</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<el-form label-width="80px">
|
|
|
|
|
<el-col :span="5">
|
|
|
|
|
<el-form-item label="学科类别">
|
|
|
|
|
<el-select v-model="form.subjectType" clearable placeholder="请选择学科类别" @change="getProfessionalClass()" @clear="clearClass()">
|
|
|
|
|
<el-option v-for="(item,index) in subjectList" :key="index" :label="item.disciplineName" :value="item.disciplineId"></el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="5">
|
|
|
|
|
<el-form-item label="专业类">
|
|
|
|
|
<el-select v-model="form.professionalClass" clearable placeholder="请选择专业类"
|
|
|
|
|
:disabled="form.subjectType ? false : true" @change="getProfessional()" @clear="clearProfess()">
|
|
|
|
|
<el-option v-for="(item,index) in ProfessionalClassList" :key="index" :label="item.professionalClassName" :value="item.professionalClassId"></el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="5">
|
|
|
|
|
<el-form-item label="专业">
|
|
|
|
|
<el-select v-model="form.professional" clearable placeholder="请选择专业"
|
|
|
|
|
:disabled="form.professionalClass ? false : true" @change="getData()">
|
|
|
|
|
<el-option v-for="(item,index) in ProfessionalList" :key="index" :label="item.professionalName" :value="item.professionalId"></el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="5">
|
|
|
|
|
<el-form-item label="课程类型">
|
|
|
|
|
<el-select v-model="form.courseType" clearable placeholder="请选择课程类型" @change="getData()">
|
|
|
|
|
<el-option v-for="(item,index) in CourseTypeList" :key="index" :label="item.name" :value="item.value"></el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="4">
|
|
|
|
|
<el-form-item>
|
|
|
|
|
<el-input placeholder="请输入课程名称" prefix-icon="el-icon-search" v-model="form.CustomerSearch" clearable @keyup.enter.native="onSearch"></el-input>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-col>
|
|
|
|
|
</el-form>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</el-card>
|
|
|
|
|
</el-col>
|
|
|
|
|
|
|
|
|
|
<el-col :span="24">
|
|
|
|
|
<el-card shadow="hover" class="mgb20">
|
|
|
|
|
<div class="flex-between mgb20">
|
|
|
|
|
<div class="flex-center">
|
|
|
|
|
<p class="hr_tag"></p>
|
|
|
|
|
<span>课程列表</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<el-button type="primary" size="small" round class="mag" @click="addcourse">新建课程</el-button>
|
|
|
|
|
<el-button type="primary" size="small" round @click="delAllSelection">批量删除</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<el-table v-loading="loading" :data="courseData" class="table" stripe header-align="center" @selection-change="handleSelectionChange" :row-key="getRowKeys">
|
|
|
|
|
<el-table-column type="selection" width="55" align="center" :reserve-selection="true"></el-table-column>
|
|
|
|
|
<el-table-column type="index" width="100" label="序号" align="center">
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column prop="courseName" label="课程名称" align="center">
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column prop="courseType" label="课程类型" align="center">
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="配置的实训应用" align="center">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<span class="ellipsis">{{scope.row.systemName}}</span>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column prop="courseHours" label="订单量量" align="center">
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column prop="courseHours" label="预计课时" align="center">
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="上架/下架" align="center">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-switch
|
|
|
|
|
v-model="scope.row.isShelves"
|
|
|
|
|
:active-value="0"
|
|
|
|
|
:inactive-value="1"
|
|
|
|
|
@change="changeSwitch(scope.row)">
|
|
|
|
|
</el-switch>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="操作" align="center">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-button type="text" @click="edit(scope.row)">编辑</el-button>
|
|
|
|
|
<el-button type="text" @click="handleDelete(scope.row)">删除</el-button>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
|
<div class="pagination">
|
|
|
|
|
<el-pagination background @current-change="handleCurrentChange" :current-page="pageNo" layout="total, prev, pager, next" :total="totals">
|
|
|
|
|
</el-pagination>
|
|
|
|
|
</div>
|
|
|
|
|
</el-card>
|
|
|
|
|
</el-col>
|
|
|
|
|
</el-row>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
export default {
|
|
|
|
|
name: 'customer',
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
name: localStorage.getItem('ms_username'),
|
|
|
|
|
courseData:[],
|
|
|
|
|
form: {
|
|
|
|
|
courseType: '',
|
|
|
|
|
subjectType: '',
|
|
|
|
|
professionalClass: '',
|
|
|
|
|
professional: '',
|
|
|
|
|
CustomerSearch: '',
|
|
|
|
|
},
|
|
|
|
|
pageNo: 1,
|
|
|
|
|
pageSize: 10,
|
|
|
|
|
totals: 1,
|
|
|
|
|
subjectList: [],
|
|
|
|
|
ProfessionalClassList: [],
|
|
|
|
|
ProfessionalList: [],
|
|
|
|
|
multipleSelection: [],
|
|
|
|
|
CourseTypeList: [{
|
|
|
|
|
name: '实训课程',
|
|
|
|
|
value: 1
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: '理论课程',
|
|
|
|
|
value: 2
|
|
|
|
|
}],
|
|
|
|
|
loading: true
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
mounted() {
|
|
|
|
|
this.getSubject()
|
|
|
|
|
this.getData()
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
getData() {
|
|
|
|
|
let data = {
|
|
|
|
|
courseType: this.form.courseType,
|
|
|
|
|
disciplineId: this.form.subjectType,
|
|
|
|
|
professionalClassId: this.form.professionalClass,
|
|
|
|
|
professionalId: this.form.professional,
|
|
|
|
|
searchContent: this.form.CustomerSearch,
|
|
|
|
|
pageNo: this.pageNo,
|
|
|
|
|
pageSize: this.pageSize,
|
|
|
|
|
}
|
|
|
|
|
this.$get(this.api.queryCourse,data).then(res => {
|
|
|
|
|
res.message.rows.forEach(e => {
|
|
|
|
|
e.courseType = this.courseTypeStatus(e.courseType)
|
|
|
|
|
e.courseHours = this.hoursStatus(e.courseHours)
|
|
|
|
|
})
|
|
|
|
|
this.courseData = res.message.rows
|
|
|
|
|
this.totals = res.message.total
|
|
|
|
|
this.loading = false
|
|
|
|
|
}).catch(res => {});
|
|
|
|
|
},
|
|
|
|
|
// 获取学科类别
|
|
|
|
|
getSubject(){
|
|
|
|
|
this.$get(this.api.queryCourseDiscipline).then(res => {
|
|
|
|
|
this.subjectList = res.message
|
|
|
|
|
}).catch(res => {});
|
|
|
|
|
},
|
|
|
|
|
// 清除学科类别
|
|
|
|
|
clearClass(){
|
|
|
|
|
this.form.professionalClass = '',
|
|
|
|
|
this.form.professional = ''
|
|
|
|
|
},
|
|
|
|
|
// 获取专业类
|
|
|
|
|
getProfessionalClass(){
|
|
|
|
|
this.clearClass()
|
|
|
|
|
this.getProfessionalClassData()
|
|
|
|
|
this.pageNo = 1
|
|
|
|
|
this.getData()
|
|
|
|
|
},
|
|
|
|
|
getProfessionalClassData(){
|
|
|
|
|
let data = {
|
|
|
|
|
disciplineId: this.form.subjectType
|
|
|
|
|
}
|
|
|
|
|
this.$get(this.api.queryCourseProfessionalClass,data).then(res => {
|
|
|
|
|
this.ProfessionalClassList = res.message
|
|
|
|
|
}).catch(res => {});
|
|
|
|
|
},
|
|
|
|
|
// 清除专业类
|
|
|
|
|
clearProfess(){
|
|
|
|
|
this.form.professional = ''
|
|
|
|
|
},
|
|
|
|
|
// 获取专业
|
|
|
|
|
getProfessional(){
|
|
|
|
|
this.clearProfess()
|
|
|
|
|
this.getProfessionalData()
|
|
|
|
|
this.pageNo = 1
|
|
|
|
|
this.getData()
|
|
|
|
|
},
|
|
|
|
|
getProfessionalData(){
|
|
|
|
|
let data = {
|
|
|
|
|
professionalClassId: this.form.professionalClass
|
|
|
|
|
}
|
|
|
|
|
this.$get(this.api.queryCourseProfessional,data).then(res => {
|
|
|
|
|
this.ProfessionalList = res.message
|
|
|
|
|
}).catch(res => {});
|
|
|
|
|
},
|
|
|
|
|
addcourse(){
|
|
|
|
|
this.$store.commit("courseData", { course_id : ''});
|
|
|
|
|
this.$router.push('/addcurriculum');
|
|
|
|
|
},
|
|
|
|
|
edit(row){
|
|
|
|
|
this.$store.commit("courseData", { course_id : row.courseId});
|
|
|
|
|
this.$router.push('/addcurriculum');
|
|
|
|
|
},
|
|
|
|
|
handleDelete(row) {
|
|
|
|
|
this.$confirm('确定要删除吗？', '提示', {
|
|
|
|
|
type: 'warning'
|
|
|
|
|
})
|
|
|
|
|
.then(() => {
|
|
|
|
|
let result = row.courseId
|
|
|
|
|
var arr = []
|
|
|
|
|
arr.push(result)
|
|
|
|
|
let data = arr
|
|
|
|
|
this.$post(this.api.deleteCourse,data).then(res => {
|
|
|
|
|
this.$message.success('删除成功');
|
|
|
|
|
this.getData()
|
|
|
|
|
}).catch(res => {});
|
|
|
|
|
})
|
|
|
|
|
.catch(() => {});
|
|
|
|
|
},
|
|
|
|
|
handleSelectionChange(val) {
|
|
|
|
|
this.multipleSelection = val;
|
|
|
|
|
},
|
|
|
|
|
getRowKeys(row) {
|
|
|
|
|
return row.courseId;
|
|
|
|
|
},
|
|
|
|
|
// 批量删除
|
|
|
|
|
delAllSelection() {
|
|
|
|
|
if(this.multipleSelection.length != ''){
|
|
|
|
|
let arr = this.multipleSelection
|
|
|
|
|
let result = arr.map(e => e.courseId)
|
|
|
|
|
this.$confirm('确定要删除吗？', '提示', {
|
|
|
|
|
type: 'warning'
|
|
|
|
|
})
|
|
|
|
|
.then(() => {
|
|
|
|
|
let data = result
|
|
|
|
|
this.$post(this.api.deleteCourse,data).then(res => {
|
|
|
|
|
this.$message.success('删除成功');
|
|
|
|
|
this.getData()
|
|
|
|
|
}).catch(res => {});
|
|
|
|
|
}).catch(() => {});
|
|
|
|
|
}else{
|
|
|
|
|
this.$message.error('请先选择课程 ！');
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
handleCurrentChange(val) {
|
|
|
|
|
this.pageNo = val;
|
|
|
|
|
this.getData();
|
|
|
|
|
},
|
|
|
|
|
onSearch(){
|
|
|
|
|
this.pageNo = 1
|
|
|
|
|
this.getData()
|
|
|
|
|
},
|
|
|
|
|
changeSwitch (row) {
|
|
|
|
|
let data = {
|
|
|
|
|
courseId: row.courseId,
|
|
|
|
|
isShelves: row.isShelves
|
|
|
|
|
}
|
|
|
|
|
this.$post(this.api.isShelves,data).then((res) => {
|
|
|
|
|
this.getData();
|
|
|
|
|
this.$message.success("修改成功！");
|
|
|
|
|
}).catch((res) => {
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style scoped>
|
|
|
|
|
.mag{
|
|
|
|
|
margin-right: 20px;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
|
