| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <el-form :model="queryParam" ref="queryForm" :inline="true"> |
| | | <el-form-item label="查询条件:"> |
| | | <el-input v-model="queryParam.name"></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">查询</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> |
| | | <div style="width: 100%;position: relative;display: flex"> |
| | | <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> |
| | | <div style="position: absolute; right: 0"> |
| | | <el-button @click="jumpToSubject" type="primary">课目管理</el-button> |
| | | </div> |
| | | </div> |
| | | |
| | | <el-table v-loading="listLoading" :data="tableData" border fit highlight-current-row style="width: 100%"> |
| | | <el-table-column prop="id" label="Id" /> |
| | | <el-table-column prop="name" label="课目"/> |
| | | <!-- <el-table-column prop="levelName" label="部门" />--> |
| | | <el-table-column width="220px" label="操作" align="center"> |
| | | |
| | | <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}"> |
| | | <router-link :to="{path:'/education/subject/edit', query:{id:row.id}}" class="link-left"> |
| | | <el-button size="mini">编辑</el-button> |
| | | </router-link> |
| | | <el-button size="mini" type="danger" @click="delSubject(row)" class="link-left">删除</el-button> |
| | | <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> |
| | | <pagination v-show="total>0" :total="total" :page.sync="queryParam.pageIndex" :limit.sync="queryParam.pageSize" |
| | | @pagination="search"/> |
| | | |
| | | <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> |
| | | |
| | |
| | | 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, |
| | |
| | | }, |
| | | created () { |
| | | this.search() |
| | | this.getAllSubject() |
| | | }, |
| | | methods: { |
| | | |
| | | jumpToSubject() { |
| | | this.$router.push({path: '/education/subject/manager'}) |
| | | }, |
| | | 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 => { |
| | | const re = data.response |
| | | this.tableData = re.list |
| | | this.total = re.total |
| | | this.queryParam.pageIndex = re.pageNum |
| | | this.tableData = data.response |
| | | this.listLoading = false |
| | | }) |
| | | }, |