|
@@ -0,0 +1,712 @@
|
|
|
+<style lang="less" scoped>
|
|
|
+ @import './Index.less';
|
|
|
+</style>
|
|
|
+
|
|
|
+<template>
|
|
|
+ <div class="new-syllabus-container">
|
|
|
+ <!-- 课纲头部 切换来源以及选择学段 -->
|
|
|
+ <div class="new-syllabus-header">
|
|
|
+ <div>
|
|
|
+ <span :class="tabIndex == 0 ? 'tab-active' : ''" @click="handleTabClick(0)">校本知识点</span>
|
|
|
+ <span :class="tabIndex == 1 ? 'tab-active' : ''" @click="handleTabClick(1)">私有知识点</span>
|
|
|
+ </div>
|
|
|
+ <div class="new-syllabus-select">
|
|
|
+ <span>当前学段:</span>
|
|
|
+ <Select ref="periodSelect" v-model="currentPeriodIndex" style="width:200px" @on-change="onPeriodChange">
|
|
|
+ <Option v-for="(item,index) in periodList" :value="index" :key="index">{{ item.periodName }}</Option>
|
|
|
+ </Select>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 主体内容 -->
|
|
|
+ <div class="new-syllabus-content">
|
|
|
+ <!-- 选择学科 -->
|
|
|
+ <div class="ns-col ns-col">
|
|
|
+ <Loading :top="200" bgColor="rgba(103, 103, 103, 0.27)" type="1" v-show="isLoadSubject"></Loading>
|
|
|
+ <div class="ns-header">
|
|
|
+ <!-- 切换头部以及搜索框 -->
|
|
|
+ <div class="ns-header-content" v-if="!isSearchSubject">
|
|
|
+ <span>
|
|
|
+ <Icon type="md-bookmark" color="#fff" size="20" />
|
|
|
+ <span style="margin-left:5px">学科</span>
|
|
|
+ </span>
|
|
|
+ <Icon type="ios-search" color="#fff" size="18" style="cursor:pointer" @click="isSearchSubject = true" />
|
|
|
+ </div>
|
|
|
+ <div class="ns-header-search" v-else>
|
|
|
+ <Input icon="ios-close"
|
|
|
+ v-model="searchSubject"
|
|
|
+ placeholder="搜索学科..."
|
|
|
+ autofocus
|
|
|
+ style="width: 100%"
|
|
|
+ @on-click="onSearchSubjectClose"
|
|
|
+ @on-change="onSearchSubjectChange"
|
|
|
+ @on-enter="onSearchSubjectChange" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <vuescroll>
|
|
|
+ <div class="gl">
|
|
|
+ <div :class='["gl-item",index == activeSubjectIndex ? "item-active":""]'
|
|
|
+ v-for="(item,index) in subjectList"
|
|
|
+ :key="index"
|
|
|
+ @click="hasModify ? handleConfirmSave({index},'2') : handleSubjectTap(index)">
|
|
|
+ <p class="gl-item-name">{{item.subjectName}}</p>
|
|
|
+ <p class="gl-item-info"><span></span>知识块数:{{index}}</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </vuescroll>
|
|
|
+ </div>
|
|
|
+ <!-- 选择知识块 -->
|
|
|
+ <div class="ns-col ns-col2" ref="colRef2">
|
|
|
+ <Loading :top="200" bgColor="rgba(103, 103, 103, 0.27)" type="1" v-show="isLoadBlocks"></Loading>
|
|
|
+ <div class="ns-header">
|
|
|
+ <!-- 切换头部以及搜索框 -->
|
|
|
+ <div class="ns-header-content" v-if="!isSearchBlock">
|
|
|
+ <span>
|
|
|
+ <Icon type="ios-photos" color="#fff" size="20" />
|
|
|
+ <span style="margin-left:5px">知识块</span>
|
|
|
+ </span>
|
|
|
+ <div>
|
|
|
+ <Icon type="md-add" color="#fff" size="18" style="cursor:pointer;margin-right:10px" @click="onAddBlock" />
|
|
|
+ <Icon type="ios-search" color="#fff" size="18" style="cursor:pointer" @click="isSearchBlock = true" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="ns-header-search" v-else>
|
|
|
+ <!-- 搜索知识块部分 -->
|
|
|
+ <Input icon="ios-close"
|
|
|
+ v-model="searchBlock"
|
|
|
+ placeholder="搜索知识块..."
|
|
|
+ autofocus
|
|
|
+ style="width: 100%"
|
|
|
+ @on-click="onSearchBlockClose"
|
|
|
+ @on-change="onSearchBlockChange"
|
|
|
+ @on-enter="onSearchBlockChange" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <vuescroll>
|
|
|
+ <!-- 知识块列表 -->
|
|
|
+ <div class="vl gl">
|
|
|
+ <div v-if="blockList.length === 0">
|
|
|
+ <EmptyBox :top="50"></EmptyBox>
|
|
|
+ </div>
|
|
|
+ <div v-else>
|
|
|
+ <div :class='["gl-item",index == activeBlockIndex ? "item-active":""]'
|
|
|
+ v-for="(item,index) in blockList"
|
|
|
+ :key="index"
|
|
|
+ @click="handleBlockTap(index,item)">
|
|
|
+ <p class="gl-item-name" :title="item.name">{{item.name}}</p>
|
|
|
+ <p class="gl-item-info"><span></span>知识点数:{{item.points ? item.points.length : 0}}</p>
|
|
|
+ <span class="btn-edit" title="编辑" @click.stop="onEditBlock(item)"><Icon type="md-create" size="20" color="#d2d2d2" /></span>
|
|
|
+ <span class="btn-delete" title="删除" @click.stop="onDeleteBlock(item)"><Icon type="md-trash" size="22" color="#d2d2d2" /></span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </vuescroll>
|
|
|
+ </div>
|
|
|
+ <!-- 展示课纲树形结构部分 -->
|
|
|
+ <div class="ns-col ns-col3" ref="colRef3">
|
|
|
+ <Loading :top="200" bgColor="rgba(103, 103, 103, 0.27)" type="1" v-show="isLoadPoints"></Loading>
|
|
|
+ <div class="ns-header">
|
|
|
+ <!-- 切换头部以及搜索框 -->
|
|
|
+ <div class="ns-header-content" v-if="!isSearchPoint">
|
|
|
+ <span>
|
|
|
+ <Icon type="md-cube" color="#fff" size="20" />
|
|
|
+ <span style="margin-left:5px">知识点 ( {{ originPointList.length }} )</span>
|
|
|
+ </span>
|
|
|
+ <div>
|
|
|
+ <Icon type="md-apps" title="切换到知识点视图" v-if="blockList.length !== 0 && !isShowPoints" color="#fff" size="20" style="cursor:pointer;margin-right:10px" @click="onChangeShowType" />
|
|
|
+ <Icon type="ios-photos" title="切换到知识块视图" v-if="blockList.length !== 0 && isShowPoints" color="#fff" size="18" style="cursor:pointer;margin-right:10px" @click="onChangeShowType" />
|
|
|
+ <Icon type="md-add" v-if="blockList.length !== 0" color="#fff" size="18" style="cursor:pointer;margin-right:10px" @click="onAddPoint" />
|
|
|
+ <Icon type="ios-search" v-if="blockList.length !== 0" color="#fff" size="18" style="cursor:pointer" @click="isSearchPoint = true" />
|
|
|
+ <Button class="btn-compose-block" v-if="checkedPointList.length" @click="onComposeBlock">组成知识块</Button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="ns-header-search" v-else>
|
|
|
+ <!-- 搜索知识点部分 -->
|
|
|
+ <Input icon="ios-close"
|
|
|
+ v-model="searchPoint"
|
|
|
+ placeholder="搜索知识点..."
|
|
|
+ autofocus
|
|
|
+ style="width: 100%"
|
|
|
+ @on-click="isSearchPoint = false"
|
|
|
+ @on-blur="isSearchPoint = false"
|
|
|
+ @on-change="onSearchPointChange"
|
|
|
+ @on-enter="onSearchPointChange" />
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <div v-if="pointList.length === 0">
|
|
|
+ <EmptyBox :top="100"></EmptyBox>
|
|
|
+ </div>
|
|
|
+ <div class="points-wrap" v-else>
|
|
|
+ <div v-for="(item,index) in pointList" :key="index" :class="['point-item',checkedPointList.indexOf(item) > -1 ? 'point-item-active' : '']" @click="onPointCheck(item)">
|
|
|
+ <span>{{item.name}}</span>
|
|
|
+ <span class="point-item-tools">
|
|
|
+ <span class="btn-edit" title="编辑" @click.stop="onEditPoint(index,item)"><Icon type="md-create" size="18" color="#d2d2d2" /></span>
|
|
|
+ <span class="btn-delete" title="删除" @click.stop="onDeletePoint(item)"><Icon type="md-trash" size="20" color="#d2d2d2" /></span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ <Page :total="originPointList.length || 0"
|
|
|
+ show-elevator
|
|
|
+ show-sizer
|
|
|
+ show-total
|
|
|
+ :page-size-opts="pageSizeOpt"
|
|
|
+ :current="currentPage"
|
|
|
+ :page-size="pageSize"
|
|
|
+ @on-page-size-change="pageSizeChange"
|
|
|
+ @on-change="pageChange" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 新增知识块弹窗 -->
|
|
|
+ <Modal v-model="isAddBlock" width="560" footer-hide class="add-volume-modal">
|
|
|
+ <div class="modal-header" slot="header">{{ isEditBlock ? '编辑知识块' : '新增知识块'}}</div>
|
|
|
+ <div class="modal-content">
|
|
|
+ <AddBlock :originData="originSchoolData"
|
|
|
+ :periodIndex="currentPeriodIndex"
|
|
|
+ :subjectIndex="currentSubjectIndex"
|
|
|
+ :editBlock="editBlock"
|
|
|
+ :addType="pointOwn"
|
|
|
+ @addFinish="onFinishAddBlock">
|
|
|
+ </AddBlock>
|
|
|
+ </div>
|
|
|
+ </Modal>
|
|
|
+
|
|
|
+ <!-- 新增知识点弹窗 -->
|
|
|
+ <Modal v-model="isAddPoint" width="560" footer-hide class="add-volume-modal">
|
|
|
+ <div class="modal-header" slot="header">{{ isEditPoint ? '编辑知识点' : '新增知识点'}}</div>
|
|
|
+ <div class="modal-content">
|
|
|
+ <AddPoint :hideBlock="isShowPoints"
|
|
|
+ :schoolParams="schoolParams"
|
|
|
+ :blockData="parentBlock"
|
|
|
+ :pointData="currentPoint"
|
|
|
+ :addType="pointOwn"
|
|
|
+ @addFinish="onFinishAddPoint">
|
|
|
+ </AddPoint>
|
|
|
+ </div>
|
|
|
+ </Modal>
|
|
|
+
|
|
|
+ <!-- 关联内容弹窗 -->
|
|
|
+ <Modal v-model="isComposeBlock" width="680" footer-hide class="add-volume-modal compose-modal">
|
|
|
+ <div class="modal-header" slot="header">组成知识块</div>
|
|
|
+ <ComposeBlock></ComposeBlock>
|
|
|
+ </Modal>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import Tree from '@/components/syllabus/DragTree'
|
|
|
+ import EmptyBox from '@/common/EmptyData'
|
|
|
+ import Loading from '@/common/Loading'
|
|
|
+ import AddBlock from './operation/AddBlock'
|
|
|
+ import AddPoint from './operation/AddPoint'
|
|
|
+ import ComposeBlock from './operation/ComposeBlock'
|
|
|
+
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ schoolInfo: {
|
|
|
+ schoolCode: 'HBCN',
|
|
|
+ areaCode: '86'
|
|
|
+ },
|
|
|
+ currentParams: {
|
|
|
+ partitionKey: '',
|
|
|
+ subjectCode: '',
|
|
|
+ period: '',
|
|
|
+ type:1
|
|
|
+ },
|
|
|
+ isLoadSubject: false,
|
|
|
+ isLoadBlocks: false,
|
|
|
+ isLoadPoints: false,
|
|
|
+ schoolParams: null,
|
|
|
+ currentPeriodIndex: null,
|
|
|
+ currentSubjectIndex: null,
|
|
|
+ currentBlock: null,
|
|
|
+ currentPoint: null,
|
|
|
+ tabIndex: 0,
|
|
|
+ originData: {},
|
|
|
+ originSchoolData: {},
|
|
|
+ periodList: [],
|
|
|
+ subjectList: [],
|
|
|
+ originSubjectList: [],
|
|
|
+ blockList: [],
|
|
|
+ originBlockList: [],
|
|
|
+ pointList: [],
|
|
|
+ originPointList: [],
|
|
|
+ activePeriodIndex: 0,
|
|
|
+ activeSubjectIndex: 0,
|
|
|
+ activeBlockIndex: 0,
|
|
|
+ isSearchSubject: false,
|
|
|
+ isSearchBlock: false,
|
|
|
+ isSearchPoint: false,
|
|
|
+ isAddBlock: false,
|
|
|
+ isEditBlock: false,
|
|
|
+ isAddPoint: false,
|
|
|
+ isEditPoint: false,
|
|
|
+ isComposeBlock:false,
|
|
|
+ searchBlock: '',
|
|
|
+ searchPoint: '',
|
|
|
+ searchSubject: '',
|
|
|
+ editBlock: null,
|
|
|
+ editPointIndex: null,
|
|
|
+ hasModify: false,
|
|
|
+ preSelectVal: null,
|
|
|
+ pageSize: 20,
|
|
|
+ currentPage: 1,
|
|
|
+ pageSizeOpt: [5, 10, 15, 20],
|
|
|
+ pointOwn: 'school',
|
|
|
+ isShowPoints: false,
|
|
|
+ parentBlock: null,
|
|
|
+ checkedPointList:[]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ components: {
|
|
|
+ Tree, AddBlock, EmptyBox, Loading, AddPoint,ComposeBlock
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.initSchoolData()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 获取当前学校学段学科等基本信息
|
|
|
+ initSchoolData() {
|
|
|
+ this.$api.syllabus.GetSchoolInfo(this.schoolInfo).then(res => {
|
|
|
+ if (!res.error && res.result.data.length) {
|
|
|
+ this.originSchoolData = res.result.data[0] // 默认选择第一个
|
|
|
+ this.originData = res.result.data[0] // 默认选择第一个
|
|
|
+ this.periodList = this.originData.period
|
|
|
+ this.currentParams.partitionKey = this.originData.schoolCode
|
|
|
+ this.currentParams.period = this.originData.period[0].periodCode
|
|
|
+ this.currentPeriodIndex = 0 // 默认选择第一个学段
|
|
|
+ this.onPeriodChange(0)
|
|
|
+ } else {
|
|
|
+ this.$Message.warning('暂无学段数据')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ // 根据学科获取所有知识块信息
|
|
|
+ getBlocksData() {
|
|
|
+ let that = this
|
|
|
+ this.currentParams.type = 0
|
|
|
+ this.$api.knowledge.GetSchoolBlocks(this.currentParams).then(res => {
|
|
|
+ if (!res.error && res.result.data) {
|
|
|
+ let list = res.result.data
|
|
|
+ this.blockList = list
|
|
|
+ this.originBlockList = list
|
|
|
+ this.handleBlockTap(0, list.length ? list[0] : null)
|
|
|
+ setTimeout(function() {
|
|
|
+ that.isLoadBlocks = false
|
|
|
+ }, 400)
|
|
|
+ } else {
|
|
|
+ this.$Message.warning('获取数据失败')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ // 根据学科获取学科下所有知识点数据
|
|
|
+ getPointsData() {
|
|
|
+ let that = this
|
|
|
+ this.currentParams.type = 1
|
|
|
+ this.$api.knowledge.GetSchoolPoints(this.currentParams).then(res => {
|
|
|
+ if (!res.error && res.result.data) {
|
|
|
+ this.pointList = res.result.data
|
|
|
+ this.originPointList = res.result.data
|
|
|
+ setTimeout(function() {
|
|
|
+ that.isLoadPoints = false
|
|
|
+ }, 800)
|
|
|
+ } else {
|
|
|
+ this.$Message.warning('获取数据失败')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ // 校本知识块与知识点仓库切换
|
|
|
+ handleTabClick(index) {
|
|
|
+ this.tabIndex = index
|
|
|
+ switch (index) {
|
|
|
+ case 0:
|
|
|
+ this.currentParams.partitionKey = this.originData.schoolCode
|
|
|
+ this.isShowPoints ? this.getPointsData() : this.getBlocksData()
|
|
|
+ this.pointOwn = 'school'
|
|
|
+ break
|
|
|
+ case 1:
|
|
|
+ this.currentParams.partitionKey = 'personal'
|
|
|
+ this.isShowPoints ? this.getPointsData() : this.getBlocksData()
|
|
|
+ this.pointOwn = 'personal'
|
|
|
+ break
|
|
|
+ default:
|
|
|
+ break
|
|
|
+ }
|
|
|
+
|
|
|
+ this.handleSubjectTap(0)
|
|
|
+ },
|
|
|
+
|
|
|
+ // 切换知识块视图与知识点清单视图
|
|
|
+ onChangeShowType() {
|
|
|
+ this.isShowPoints ? this.getBlocksData() : this.getPointsData()
|
|
|
+ this.isShowPoints = !this.isShowPoints
|
|
|
+ this.$refs.colRef2.style.display = this.isShowPoints ? 'none' : 'unset'
|
|
|
+ this.$refs.colRef3.style.width = this.isShowPoints ? '85%' : '66%'
|
|
|
+ },
|
|
|
+
|
|
|
+ // 学段切换处理
|
|
|
+ onPeriodChange(index) {
|
|
|
+ this.preSelectVal = this.$refs.periodSelect.value
|
|
|
+ if (this.hasModify) {
|
|
|
+ this.handleConfirmSave({}, '3')
|
|
|
+ } else {
|
|
|
+ let that = this
|
|
|
+ this.isLoadSubject = true
|
|
|
+ this.activePeriodIndex = index
|
|
|
+ this.currentParams.period = this.originData.period[index].periodCode
|
|
|
+ this.subjectList = this.periodList[index].subjects // 切换学段后更新 学科 列表
|
|
|
+ this.originSubjectList = this.periodList[index].subjects // 筛选学科源数据
|
|
|
+ this.handleSubjectTap(0)
|
|
|
+ setTimeout(function() {
|
|
|
+ that.isLoadSubject = false
|
|
|
+ }, 400)
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ // 学科点击事件
|
|
|
+ handleSubjectTap(index) {
|
|
|
+ this.schoolParams = {
|
|
|
+ schoolCode: this.originData.schoolCode,
|
|
|
+ subjectCode: this.subjectList[index].subjectCode,
|
|
|
+ period: this.currentParams.period
|
|
|
+ }
|
|
|
+ this.currentSubjectIndex = index
|
|
|
+ this.currentParams.subjectCode = this.subjectList[index].subjectCode
|
|
|
+ this.currentParams.type = this.isShowPoints ? 1 : 0
|
|
|
+ this.activeSubjectIndex = index
|
|
|
+ if (!this.isShowPoints) {
|
|
|
+ this.isLoadBlocks = true
|
|
|
+ this.getBlocksData()
|
|
|
+ } else {
|
|
|
+ this.isLoadPoints = true
|
|
|
+ this.getPointsData()
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ // 知识块点击事件
|
|
|
+ handleBlockTap(index, item) {
|
|
|
+ let that = this
|
|
|
+ this.activeBlockIndex = index
|
|
|
+ this.currentBlock = item
|
|
|
+ this.isLoadPoints = true
|
|
|
+ if (item && item.points.length) {
|
|
|
+ this.getPointObject(item.points) // 如果知识块下有知识点 则根据ID集合去换取知识点数据
|
|
|
+ this.pageSizeChange(20)
|
|
|
+ } else { // 没有则置空
|
|
|
+ this.originPointList = []
|
|
|
+ this.pointList = []
|
|
|
+ }
|
|
|
+ setTimeout(function() {
|
|
|
+ that.isLoadPoints = false
|
|
|
+ }, 400)
|
|
|
+ },
|
|
|
+
|
|
|
+ // 添加知识块完成
|
|
|
+ onFinishAddBlock(val) {
|
|
|
+ this.$Message.success('操作成功!')
|
|
|
+ this.handleSubjectTap(this.currentSubjectIndex) // 获取最新知识块数据
|
|
|
+ this.isAddBlock = false // 关闭窗口
|
|
|
+ },
|
|
|
+
|
|
|
+ // 添加知识点完成
|
|
|
+ onFinishAddPoint(val) {
|
|
|
+ let that = this
|
|
|
+ this.isLoadPoints = true
|
|
|
+ if (this.isEditPoint) {
|
|
|
+ this.pointList[this.editPointIndex] = val
|
|
|
+ } else {
|
|
|
+ if (!this.isShowPoints) this.currentBlock.points.push(val.id)
|
|
|
+ this.originPointList.push(val)
|
|
|
+ this.pageChange(this.currentPage)
|
|
|
+ }
|
|
|
+ this.$Message.success('操作成功!')
|
|
|
+ this.isAddPoint = false // 关闭窗口
|
|
|
+ this.isEditPoint = false
|
|
|
+ setTimeout(function() {
|
|
|
+ that.isLoadPoints = false
|
|
|
+ }, 400)
|
|
|
+ },
|
|
|
+
|
|
|
+ // 删除知识块事件
|
|
|
+ onDeleteBlock(data) {
|
|
|
+ this.$Modal.confirm({
|
|
|
+ title: '提示',
|
|
|
+ content: '<p>确认删除该知识块?</p>',
|
|
|
+ okText: '确认',
|
|
|
+ cancelText: '取消',
|
|
|
+ onOk: () => {
|
|
|
+ this.$api.knowledge.DeleteSchoolBlock({ id: data.id }).then(res => {
|
|
|
+ if (res.result.data) {
|
|
|
+ this.blockList.splice(this.blockList.indexOf(data), 1)
|
|
|
+ this.$Message.success('删除成功')
|
|
|
+ this.handleBlockTap(0, this.blockList.length ? this.blockList[0] : null)
|
|
|
+ } else {
|
|
|
+ this.$Message.success('删除失败')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ // 删除知识点事件
|
|
|
+ onDeletePoint(data) {
|
|
|
+ this.$Modal.confirm({
|
|
|
+ title: '提示',
|
|
|
+ content: '<p>确认删除该知识点?</p>',
|
|
|
+ okText: '确认',
|
|
|
+ cancelText: '取消',
|
|
|
+ onOk: () => {
|
|
|
+ this.isLoadPoints = true
|
|
|
+ this.$api.knowledge.DeleteSchoolPoint({ id:data.id }).then(res => {
|
|
|
+ if (!res.error && res.result.data) {
|
|
|
+ this.$Message.success('删除成功')
|
|
|
+ this.originPointList.splice(this.originPointList.indexOf(data), 1)
|
|
|
+ this.currentBlock.points.splice(this.currentBlock.points.indexOf(data.id), 1)
|
|
|
+ this.pageChange(this.currentPage)
|
|
|
+ this.isLoadPoints = false
|
|
|
+ } else {
|
|
|
+ this.$Message.warning('删除失败,错误代码:' + res.error.code + ',错误信息:' + res.error.message)
|
|
|
+ }
|
|
|
+ }).catch(err => {
|
|
|
+ console.log(err)
|
|
|
+ this.$Message.warning('删除失败')
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ // 编辑知识块事件
|
|
|
+ onEditBlock(data) {
|
|
|
+ this.isAddBlock = true // 打开新增窗口
|
|
|
+ this.isEditBlock = true // 设置成编辑状态
|
|
|
+ this.editBlock = data
|
|
|
+ },
|
|
|
+
|
|
|
+ // 新增知识块事件
|
|
|
+ onAddBlock() {
|
|
|
+ this.isAddBlock = true
|
|
|
+ this.isEditBlock = false
|
|
|
+ this.editBlock = null
|
|
|
+ },
|
|
|
+
|
|
|
+ // 新增知识点事件
|
|
|
+ onAddPoint() {
|
|
|
+ this.isAddPoint = true
|
|
|
+ this.isEditPoint = false
|
|
|
+ this.currentPoint = null
|
|
|
+ this.parentBlock = this.isShowPoints ? null : this.currentBlock
|
|
|
+ },
|
|
|
+
|
|
|
+ // 编辑知识点事件
|
|
|
+ onEditPoint(index, data) {
|
|
|
+ this.isAddPoint = true // 打开新增窗口
|
|
|
+ this.isEditPoint = true // 设置成编辑状态
|
|
|
+ this.currentPoint = data
|
|
|
+ this.editPointIndex = index
|
|
|
+ this.parentBlock = this.isShowPoints ? null : this.currentBlock
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ // 知识点点击事件
|
|
|
+ onPointCheck(item) {
|
|
|
+ console.log(item)
|
|
|
+ let list = this.checkedPointList
|
|
|
+ let isExistIndex = list.indexOf(item)
|
|
|
+ if (isExistIndex > -1) {
|
|
|
+ this.checkedPointList.splice(isExistIndex, 1)
|
|
|
+ } else {
|
|
|
+ this.checkedPointList.push(item)
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ // 点击组成知识块
|
|
|
+ onComposeBlock() {
|
|
|
+ this.isComposeBlock = true
|
|
|
+ },
|
|
|
+
|
|
|
+ // 搜索知识块输入框onchange事件
|
|
|
+ onSearchBlockChange() {
|
|
|
+ this.blockList = this.originBlockList.filter(item => item.name.indexOf(this.searchBlock) > -1)
|
|
|
+ if (this.blockList.length) this.handleBlockTap(0, this.blockList[0])
|
|
|
+ },
|
|
|
+
|
|
|
+ // 搜索知识点输入框onchange事件
|
|
|
+ onSearchPointChange() {
|
|
|
+ this.pointList = this.originPointList.filter(item => item.name.indexOf(this.searchPoint) > -1)
|
|
|
+ },
|
|
|
+
|
|
|
+ // 清空科目搜索框
|
|
|
+ onSearchSubjectClose() {
|
|
|
+ this.searchSubject = ''
|
|
|
+ this.isSearchSubject = false
|
|
|
+ this.subjectList = this.originSubjectList
|
|
|
+ this.handleSubjectTap(0)
|
|
|
+ },
|
|
|
+
|
|
|
+ // 清空科目搜索框
|
|
|
+ onSearchBlockClose() {
|
|
|
+ this.searchBlock = ''
|
|
|
+ this.isSearchBlock = false
|
|
|
+ this.blockList = this.originBlockList
|
|
|
+ if (this.blockList.length) this.handleBlockTap(0, this.blockList[0])
|
|
|
+ },
|
|
|
+
|
|
|
+ // 搜索学科输入框onchange事件
|
|
|
+ onSearchSubjectChange() {
|
|
|
+ this.subjectList = this.originSubjectList.filter(item => item.subjectName.indexOf(this.searchSubject) > -1)
|
|
|
+ this.handleSubjectTap(0)
|
|
|
+ },
|
|
|
+
|
|
|
+ // 切换页码返回截取数据
|
|
|
+ pageChange(page) {
|
|
|
+ this.currentPage = page
|
|
|
+ let start = this.pageSize * (page - 1)
|
|
|
+ let end = this.pageSize * page
|
|
|
+ this.pointList = this.originPointList ? this.originPointList.slice(start, end) : []
|
|
|
+ // 如果删除的是仅剩的一个元素 则往前翻页
|
|
|
+ if (this.pointList.length === 0 && page > 1) {
|
|
|
+ this.pageChange(page - 1)
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ // 切换每页显示页数
|
|
|
+ pageSizeChange(val) {
|
|
|
+ this.pageSize = val
|
|
|
+ this.currentPage = 1
|
|
|
+ this.pageChange(1)
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ // 获取知识点完整对象数据 ID换对象
|
|
|
+ getPointObject(arr) {
|
|
|
+ let params = {
|
|
|
+ collectionName: 'Knowledge',
|
|
|
+ queryDict: {
|
|
|
+ id: arr
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.$api.FindCollection(params).then(res => {
|
|
|
+ if (!res.error && res.result.data) {
|
|
|
+ this.originPointList = res.result.data
|
|
|
+ this.pointList = res.result.data
|
|
|
+ } else {
|
|
|
+ this.$Message.warning('获取数据失败')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+ .new-syllabus-header .ivu-select-single .ivu-select-selection,
|
|
|
+ .funnel-box .ivu-select-single .ivu-select-selection {
|
|
|
+ background: #605f5f;
|
|
|
+ color: #fbfbfb;
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .new-syllabus-header .ivu-select-single .ivu-select-arrow,
|
|
|
+ .funnel-box .ivu-select-single .ivu-select-arrow {
|
|
|
+ color: #fbfbfb;
|
|
|
+ }
|
|
|
+
|
|
|
+ .ns-header .ivu-input {
|
|
|
+ background: #3c3c3c;
|
|
|
+ color: #fff;
|
|
|
+ border: none;
|
|
|
+ height: 36px;
|
|
|
+ margin-top: 7px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .ns-header .ivu-input-icon {
|
|
|
+ font-size: 24px;
|
|
|
+ color: #cfc7c7;
|
|
|
+ line-height: 50px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 修改iview Modal样式 */
|
|
|
+
|
|
|
+ .add-volume-modal .ivu-modal-content {
|
|
|
+ background: #3c3c3c;
|
|
|
+ color: #fff;
|
|
|
+ font-family: '微軟正黑體', 'Heiti TC';
|
|
|
+ }
|
|
|
+
|
|
|
+ .add-volume-modal .ivu-modal-header {
|
|
|
+ border-bottom: none;
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: bold;
|
|
|
+ padding: 25px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .add-volume-modal .modal-content {
|
|
|
+ padding: 10px 35px 30px 35px;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 修改iview popper样式 */
|
|
|
+
|
|
|
+ .ns-col .ivu-poptip-inner {
|
|
|
+ background: #3c3c3c;
|
|
|
+ }
|
|
|
+
|
|
|
+ .ns-col .ivu-poptip-title:after {
|
|
|
+ background: #656565;
|
|
|
+ left: 16px;
|
|
|
+ right: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .ns-col .ivu-poptip-title-inner {
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .ns-col .ivu-poptip-popper[x-placement^=bottom] .ivu-poptip-arrow:after {
|
|
|
+ border-bottom-color: #494949;
|
|
|
+ }
|
|
|
+
|
|
|
+ .ns-col .points-wrap .ivu-page {
|
|
|
+ position: absolute;
|
|
|
+ bottom: 40px;
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .ns-col .points-wrap .ivu-page .ivu-page-item,
|
|
|
+ .ns-col .points-wrap .ivu-page .ivu-page-next,
|
|
|
+ .ns-col .points-wrap .ivu-page .ivu-page-prev {
|
|
|
+ background: none;
|
|
|
+ border: none;
|
|
|
+ line-height: 32px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .ns-col .points-wrap .ivu-page .ivu-page-item a,
|
|
|
+ .ns-col .points-wrap .ivu-page .ivu-page-next a,
|
|
|
+ .ns-col .points-wrap .ivu-page .ivu-page-prev a {
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .ns-col .points-wrap .ivu-page-item-active {
|
|
|
+ border: none;
|
|
|
+ background: rgb(11, 151, 117) !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .ns-col .points-wrap .ivu-select-selection,
|
|
|
+ .ns-col .points-wrap .ivu-page-options-elevator input {
|
|
|
+ border: none;
|
|
|
+ background: #605f5f;
|
|
|
+ }
|
|
|
+
|
|
|
+ .ns-col .points-wrap .ivu-select,
|
|
|
+ .ns-col .points-wrap .ivu-page-options-elevator input {
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+</style>
|