<template>
|
<div class="app-container">
|
<el-form :model="queryParam" ref="queryForm" :inline="true">
|
<el-form-item label="查询条件：">
|
<el-input v-model="queryParam.name" size="small"></el-input>
|
<!-- <el-select v-model="queryParam.level" placeholder="部门" clearable="">-->
|
<!-- <el-option v-for="item in levelEnum" :key="item.key" :value="item.key" :label="item.value"></el-option>-->
|
<!-- </el-select>-->
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary" @click="submitForm" size="small">查询</el-button>
|
<!-- <router-link :to="{path:'/education/subject/edit'}" class="link-left">
|
<el-button type="primary">添加</el-button>
|
</router-link> -->
|
</el-form-item>
|
</el-form>
|
|
<el-table
|
v-loading="listLoading"
|
:data="tableData"
|
default-expand-all
|
border fit highlight-current-row style="width: 100%"
|
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
|
row-key="id"
|
>
|
<el-table-column prop="name" label="部门" />
|
<el-table-column prop="subjectNames" label="课目"/>
|
<el-table-column width="240px" label="操作" align="center">
|
<template slot-scope="{row}">
|
<el-button type="success" @click="addSubject(row.id, row.name)" size="mini">添加课目</el-button>
|
<el-button type="primary" @click="editSubject(row.id, row.name, row.subjectIds)" size="mini">编辑</el-button>
|
<!-- <el-button size="mini" type="danger" @click="delSubject(row)" class="link-left">删除</el-button>-->
|
</template>
|
</el-table-column>
|
</el-table>
|
|
<el-dialog
|
:title="addTitle"
|
:visible.sync="addShow"
|
width="450px"
|
>
|
<el-input v-model="addForm.subjectName" placeholder="课目名称" required/>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="cancelAdd">取 消</el-button>
|
<el-button type="primary" @click="add">保 存</el-button>
|
</span>
|
</el-dialog>
|
|
<el-dialog
|
:title="editTitle"
|
:visible.sync="editShow"
|
width="450px"
|
>
|
<el-form label-position="top">
|
<el-form-item label="部门">
|
<el-input v-model="editForm.deptName" disabled required/>
|
</el-form-item>
|
<el-form-item label="课目">
|
<el-select v-model="editForm.subjectIds" multiple placeholder="请选择该部门对应的课目">
|
<el-option v-for="subject in subjectList" :key="subject.id" :value="subject.id" :label="subject.name"/>
|
</el-select>
|
</el-form-item>
|
</el-form>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="cancelEdit">取 消</el-button>
|
<el-button type="primary" @click="edit">保 存</el-button>
|
</span>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import { mapGetters, mapState } from 'vuex'
|
import Pagination from '@/components/Pagination'
|
import subjectApi from '@/api/subject'
|
|
export default {
|
components: { Pagination },
|
data () {
|
return {
|
subjectList: [],
|
addForm: {
|
deptId: null,
|
subjectName: ''
|
},
|
editForm: {
|
deptId: null,
|
deptName: null,
|
subjectIds: []
|
},
|
addTitle: '',
|
editTitle: '',
|
addShow: false,
|
editShow: false,
|
queryParam: {
|
level: null,
|
pageIndex: 1,
|
pageSize: 10
|
},
|
listLoading: true,
|
tableData: [],
|
total: 0
|
}
|
},
|
created () {
|
this.search()
|
this.getAllSubject()
|
},
|
methods: {
|
getAllSubject() {
|
subjectApi.list().then(res => {
|
this.subjectList = res.response
|
})
|
},
|
editSubject(deptId, deptName, subjectIds) {
|
this.editTitle = "修改【" + deptName + "】的课目"
|
this.editForm.deptId = deptId
|
this.editForm.deptName = deptName
|
this.editForm.subjectIds = subjectIds;
|
this.editShow = true
|
},
|
addSubject(deptId, deptName) {
|
this.addTitle = "为【" + deptName + "】添加课目";
|
this.addShow = true;
|
this.addForm.deptId = deptId
|
},
|
add() {
|
subjectApi.add(this.addForm).then(res => {
|
this.$message.success("添加成功")
|
this.addShow = false
|
this.search()
|
})
|
},
|
edit() {
|
subjectApi.edit(this.editForm).then(res => {
|
this.$message.success("修改成功")
|
this.editShow = false
|
this.search()
|
})
|
},
|
cancelEdit() {
|
this.editShow = false
|
this.editTitle = ""
|
this.editForm.deptId = null
|
this.editForm.deptName = ""
|
this.editForm.subjectIds = []
|
},
|
cancelAdd() {
|
this.addShow = false
|
this.addTitle = ""
|
this.addForm.subjectName = ""
|
},
|
search () {
|
this.listLoading = true
|
subjectApi.pageList(this.queryParam).then(data => {
|
this.tableData = data.response
|
this.listLoading = false
|
})
|
},
|
submitForm () {
|
this.queryParam.pageIndex = 1
|
this.search()
|
},
|
delSubject (row) {
|
let _this = this
|
subjectApi.deleteSubject(row.id).then(re => {
|
if (re.code === 1) {
|
_this.search()
|
_this.$message.success(re.message)
|
} else {
|
_this.$message.error(re.message)
|
}
|
})
|
}
|
},
|
computed: {
|
...mapGetters('enumItem', [
|
'enumFormat'
|
]),
|
...mapState('enumItem', {
|
levelEnum: state => state.user.levelEnum
|
})
|
}
|
}
|
</script>
|
