|
@@ -62,7 +62,7 @@
|
|
|
<Icon class="add-learn-step-icon" type="md-add" size="20" />
|
|
|
<div slot="content">
|
|
|
<p class="add-step-type-label" @click="addStepStatus = true"><Icon type="ios-hand-outline" size="18" style="margin-right:5px;" />手动选择内容</p>
|
|
|
- <p class="add-step-type-label"><Icon type="md-list" size="18" style="margin-right:5px;" @click="selectUnit" />选择最小单元</p>
|
|
|
+ <p class="add-step-type-label" @click="selectUnit"><Icon type="md-list" size="18" style="margin-right:5px;" />选择最小单元</p>
|
|
|
</div>
|
|
|
</Tooltip>
|
|
|
|
|
@@ -83,12 +83,12 @@
|
|
|
学习资源
|
|
|
<div class="radio-box-wrap">
|
|
|
<div :class="currentView == 0 ? 'radio-box-item active-radio-box-item':'radio-box-item'" @click="setCurrentView(0)">
|
|
|
- <Tooltip content="查看学习资源" placement="bottom" theme="light">
|
|
|
+ <Tooltip content="查看学习资源" placement="bottom">
|
|
|
<Icon type="md-list" size="15" />
|
|
|
</Tooltip>
|
|
|
</div>
|
|
|
<div :class="currentView == 1 ? 'radio-box-item active-radio-box-item':'radio-box-item'" @click="setCurrentView(1)">
|
|
|
- <Tooltip content="挑选学习资源" placement="bottom" theme="light">
|
|
|
+ <Tooltip content="挑选学习资源" placement="bottom">
|
|
|
<Icon type="md-card" size="15" />
|
|
|
</Tooltip>
|
|
|
</div>
|
|
@@ -96,12 +96,7 @@
|
|
|
</div>
|
|
|
<!-- 选择学习资源 -->
|
|
|
<div v-if="orderLearnInfo.steps.length !== 0" :class="currentView == 1 ? 'animated faster fadeInLeft choose-learn-content-wrap':'animated fadeOutRight choose-learn-content-wrap'">
|
|
|
- <div class="create-learn-content">
|
|
|
- <span :class="currentCreateType == 0 ? 'active-span':''" @click="selectCreateType(0)">选择已建自学内容</span>
|
|
|
- <span :class="currentCreateType == 1 ? 'active-span':''" @click="selectCreateType(1)">临时创建自学内容</span>
|
|
|
- </div>
|
|
|
- <ChooseContent ref="chooseContent" v-show="currentCreateType == 1" :class="currentCreateType == 1 ? 'animated fadeIn':''" style="margin-top:10px;height:calc(100% - 50px);" @on-select-question="getSelectedQuestion" @on-cancel-file="cancelFile" @on-select-file="getSelectFile"></ChooseContent>
|
|
|
- <ManageUnit :type="0" v-show="currentCreateType == 0" :class="currentCreateType == 0 ? 'animated fadeIn':''" @chooseUnit="chooseUnit"></ManageUnit>
|
|
|
+ <ChooseContent ref="chooseContent" style="margin-top:10px;height:calc(100% - 10px);" @on-select-question="getSelectedQuestion" @on-cancel-file="cancelFile" @on-select-file="getSelectFile"></ChooseContent>
|
|
|
<Poptip padding="0px 0px" offset="10" placement="top-end" width="300" trigger="hover" :class="shoppingCarClass">
|
|
|
<Badge type="success" :count="getContentLength.total" show-zero :offset="[-3,-3]" style="margin-top:10px;cursor:pointer;" @mouseenter.native="changeActive($event)" @mouseleave.native="removeActive($event)">
|
|
|
<img src="../../assets/shopping_car.svg" width="40" height="40" />
|
|
@@ -130,14 +125,15 @@
|
|
|
<div v-if="orderLearnInfo.steps.length !== 0" :class="currentView == 0 ? 'animated faster fadeInLeft preview-learn-content-wrap':'animated fadeOutRight preview-learn-content-wrap'">
|
|
|
<vuescroll>
|
|
|
<p class="content-type-label">内容:{{orderLearnInfo.steps[stepIndex].resource.length}}个</p>
|
|
|
- <div class="content-file-wrap">
|
|
|
- <NoData style="margin-top:30px;" v-if="orderLearnInfo.steps[stepIndex].resource.length == 0"></NoData>
|
|
|
- <p v-for="(item,index) in orderLearnInfo.steps[stepIndex].resource" class="content-file-item">{{item.fileName}}</p>
|
|
|
+ <div class="content-file-wrap" style="min-height:240px;">
|
|
|
+ <Loading v-show="listLoading"></Loading>
|
|
|
+ <ContentFileList v-show="!listLoading" :resources="orderLearnInfo.steps[stepIndex].resource"></ContentFileList>
|
|
|
</div>
|
|
|
<p class="content-type-label">题目:{{orderLearnInfo.steps[stepIndex].item.length}}道</p>
|
|
|
<div class="content-question-wrap">
|
|
|
<NoData v-if="orderLearnInfo.steps[stepIndex].item.length == 0" style="margin-top:30px;"></NoData>
|
|
|
- <QuestionList v-else :questions="orderLearnInfo.steps[stepIndex].item"></QuestionList>
|
|
|
+ <Loading v-show="listLoading"></Loading>
|
|
|
+ <QuestionList v-show="!listLoading" :questions="orderLearnInfo.steps[stepIndex].item"></QuestionList>
|
|
|
</div>
|
|
|
</vuescroll>
|
|
|
</div>
|
|
@@ -149,10 +145,18 @@
|
|
|
<Modal v-model="addStepStatus"
|
|
|
title="添加学习阶段"
|
|
|
class="dark-iview-modal dark-iview-input"
|
|
|
+ width="660"
|
|
|
@on-ok="confirmAddStep">
|
|
|
<span>名称:</span>
|
|
|
<Input v-model="newStepName" placeholder="请输入名称..." style="width: calc(100% - 50px);" />
|
|
|
</Modal>
|
|
|
+ <Modal v-model="selectUnitStatus"
|
|
|
+ title="选择最小单元"
|
|
|
+ class="dark-iview-modal"
|
|
|
+ width="960"
|
|
|
+ @on-ok="confirmSelectUnit">
|
|
|
+ <SelectLearnUnit @selectUnit="getSelectedUnit"></SelectLearnUnit>
|
|
|
+ </Modal>
|
|
|
<Modal v-model="editStepStatus"
|
|
|
title="修改名称"
|
|
|
class="dark-iview-modal dark-iview-input"
|
|
@@ -167,23 +171,32 @@
|
|
|
@on-ok="confirmToManage">
|
|
|
<p>编序式自主学习活动保存成功,是否跳转到管理页面查看?</p>
|
|
|
</Modal>
|
|
|
+
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
import NoData from '@/common/NoData.vue'
|
|
|
import QuestionList from '@/components/learnactivity/QuestionList.vue'
|
|
|
import ChooseContent from '@/components/learnactivity/ChooseContent.vue'
|
|
|
- import ManageUnit from "./ManageUnit.vue"
|
|
|
+ import SelectLearnUnit from '@/components/learnactivity/SelectLearnUnit.vue'
|
|
|
+ import ContentFileList from '@/components/learnactivity/ContentFileList.vue'
|
|
|
+ import Loading from '@/common/Loading.vue'
|
|
|
+ import { setTimeout } from 'core-js'
|
|
|
export default {
|
|
|
components: {
|
|
|
NoData,
|
|
|
QuestionList,
|
|
|
ChooseContent,
|
|
|
- ManageUnit
|
|
|
+ SelectLearnUnit,
|
|
|
+ ContentFileList,
|
|
|
+ Loading
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
+ selectedUnit: [],
|
|
|
+ selectUnitStatus: false,
|
|
|
isLoading: false,
|
|
|
+ listLoading: false,
|
|
|
goToManageStatus: false,
|
|
|
demoLoginInfo: {
|
|
|
user: 'admin',
|
|
@@ -211,19 +224,19 @@
|
|
|
title: '',
|
|
|
slot: 'action',
|
|
|
width: 50,
|
|
|
- align:'right'
|
|
|
+ align: 'right'
|
|
|
}
|
|
|
],
|
|
|
orderLearnInfo: {
|
|
|
name: '',
|
|
|
periodCode: '',
|
|
|
- subjectCode:'',
|
|
|
- target: [],
|
|
|
- isOrder: '',
|
|
|
- creator:'',
|
|
|
+ subjectCode: '',
|
|
|
+ creator: '',
|
|
|
introduce: '',
|
|
|
- type:'',
|
|
|
steps: []
|
|
|
+ //target: [],
|
|
|
+ //type: '',
|
|
|
+ //isOrder: '',
|
|
|
},
|
|
|
ruleValidate: {
|
|
|
name: [
|
|
@@ -266,17 +279,87 @@
|
|
|
resourceL,
|
|
|
total: itemL + resourceL
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
+ /**
|
|
|
+ * 通过id查询题目信息
|
|
|
+ * */
|
|
|
+ findQuestionById() {
|
|
|
+ if (this.orderLearnInfo.steps.length > 0) {
|
|
|
+ this.listLoading = true
|
|
|
+ if (!this.orderLearnInfo.steps[this.stepIndex].requestedI) {
|
|
|
+ this.$api.learnActivity.FindQuestionById(this.orderLearnInfo.steps[this.stepIndex].item).then(
|
|
|
+ res => {
|
|
|
+ if (res.error == null) {
|
|
|
+ this.orderLearnInfo.steps[this.stepIndex].item.length = 0
|
|
|
+ this.$set(this.orderLearnInfo.steps[this.stepIndex], 'item', res.result.data)
|
|
|
+ this.orderLearnInfo.steps[this.stepIndex].requestedI = true
|
|
|
+ console.log(this.orderLearnInfo)
|
|
|
+ } else {
|
|
|
+ this.$Message.error("API ERROR!")
|
|
|
+ }
|
|
|
+ setTimeout(() => {
|
|
|
+ this.listLoading = false
|
|
|
+ }, 500)
|
|
|
+ },
|
|
|
+ err => {
|
|
|
+ this.$Message.error("API ERROR!")
|
|
|
+ setTimeout(() => {
|
|
|
+ this.listLoading = false
|
|
|
+ }, 1000)
|
|
|
+ }
|
|
|
+ )
|
|
|
+ } else {
|
|
|
+ setTimeout(() => {
|
|
|
+ this.listLoading = false
|
|
|
+ }, 300)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 通过id查询内容信息
|
|
|
+ * */
|
|
|
+ findResourceById() {
|
|
|
+ if (this.orderLearnInfo.steps.length > 0) {
|
|
|
+ this.listLoading = true
|
|
|
+ if (!this.orderLearnInfo.steps[this.stepIndex].requestedR) {
|
|
|
+ this.$api.learnActivity.FindSyllabusResourceById(this.orderLearnInfo.steps[this.stepIndex].resource).then(
|
|
|
+ res => {
|
|
|
+ if (res.error == null) {
|
|
|
+ this.orderLearnInfo.steps[this.stepIndex].resource.length = 0
|
|
|
+ this.orderLearnInfo.steps[this.stepIndex].resource = res.result.data
|
|
|
+ this.orderLearnInfo.steps[this.stepIndex].requestedR = true
|
|
|
+ } else {
|
|
|
+ this.$Message.error("API ERROR!")
|
|
|
+ }
|
|
|
+ setTimeout(() => {
|
|
|
+ this.listLoading = false
|
|
|
+ }, 500)
|
|
|
+ },
|
|
|
+ err => {
|
|
|
+ this.$Message.error("API ERROR!")
|
|
|
+ setTimeout(() => {
|
|
|
+ this.listLoading = false
|
|
|
+ }, 500)
|
|
|
+ }
|
|
|
+ )
|
|
|
+ } else {
|
|
|
+ setTimeout(() => {
|
|
|
+ this.listLoading = false
|
|
|
+ }, 300)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
/**
|
|
|
* 确认修改学习阶段名称
|
|
|
* @param index
|
|
|
*/
|
|
|
confirmEditStep() {
|
|
|
this.orderLearnInfo.steps[this.stepIndex].name = this.editStepName
|
|
|
+ console.log(this.orderLearnInfo)
|
|
|
},
|
|
|
/**
|
|
|
* 编辑学习阶段名称
|
|
@@ -295,7 +378,20 @@
|
|
|
this.currentView = 0
|
|
|
},
|
|
|
selectUnit() {
|
|
|
-
|
|
|
+ this.selectUnitStatus = true
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 处理SelectLearnUnit组件选择事件
|
|
|
+ * @param data
|
|
|
+ */
|
|
|
+ getSelectedUnit(data) {
|
|
|
+ console.log(data)
|
|
|
+ this.selectedUnit = data
|
|
|
+ },
|
|
|
+ confirmSelectUnit() {
|
|
|
+ this.orderLearnInfo.steps.push(...this.selectedUnit)
|
|
|
+ this.selectedUnit.length = 0
|
|
|
+ console.log(this.orderLearnInfo)
|
|
|
},
|
|
|
changeActive(e) {
|
|
|
this.shoppingCarClass = 'question-shopping-car animated pulse'
|
|
@@ -311,7 +407,7 @@
|
|
|
{
|
|
|
name: this.newStepName,
|
|
|
resource: [],
|
|
|
- item:[]
|
|
|
+ item: []
|
|
|
}
|
|
|
)
|
|
|
this.newStepName = ''
|
|
@@ -331,9 +427,18 @@
|
|
|
this.isLoading = true
|
|
|
this.orderLearnInfo.creator = this.demoLoginInfo.TEAMModelId
|
|
|
this.orderLearnInfo.scopeCode = this.demoLoginInfo.TEAMModelId
|
|
|
- this.orderLearnInfo.type = '1'//教学情境
|
|
|
- this.orderLearnInfo.target = ['三年级五班']//学习对象
|
|
|
- this.$api.learnActivity.SaveOrderLearn(this.orderLearnInfo).then(
|
|
|
+ let str = JSON.stringify(this.orderLearnInfo)
|
|
|
+ let requestData = JSON.parse(str)
|
|
|
+ for (let i = 0; i < requestData.steps.length; i++) {
|
|
|
+ if (requestData.steps[i].requestedI) {
|
|
|
+ requestData.steps[i].item = requestData.steps[i].item.map(item => { return item.id })
|
|
|
+ }
|
|
|
+ if (requestData.steps[i].requestedR) {
|
|
|
+ requestData.steps[i].resource = requestData.steps[i].resource.map(item => { return item.id })
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ this.$api.learnActivity.SaveOrderLearn(requestData).then(
|
|
|
res => {
|
|
|
if (res.error == null) {
|
|
|
this.orderLearnInfo.id = res.result.data.id
|
|
@@ -385,6 +490,8 @@
|
|
|
getCurrentItem(row, index) {
|
|
|
this.stepIndex = index
|
|
|
this.currentView = 0
|
|
|
+ this.findResourceById()
|
|
|
+ this.findQuestionById()
|
|
|
this.$refs.chooseContent.refreshData()
|
|
|
},
|
|
|
dragOrder(index1, index2) {
|
|
@@ -405,6 +512,13 @@
|
|
|
@import "./CreateOrderLearn.less";
|
|
|
</style>
|
|
|
<style lang="less">
|
|
|
+ .content-file-wrap #loadingBox {
|
|
|
+ margin-top: 88px !important;
|
|
|
+ }
|
|
|
+ .base-info-label .ivu-tooltip-inner {
|
|
|
+ background-color: rgba(70,76,91,1);
|
|
|
+ }
|
|
|
+
|
|
|
.base-info-form .ivu-input, .base-info-form .ivu-select-selection {
|
|
|
background: none;
|
|
|
color: white;
|
|
@@ -488,8 +602,8 @@
|
|
|
.learn-step-wrap .ivu-table-row-highlight {
|
|
|
background-image: linear-gradient(90deg, rgba(30, 30, 30, 0) 0%, rgba(110, 110, 110, 0.2) 50%, rgba(110, 110, 110, 0.4) 100%);
|
|
|
}
|
|
|
- .learn-step-wrap .ivu-table-row-hover .edit-step-name-icon{
|
|
|
- display:inline-block;
|
|
|
+
|
|
|
+ .learn-step-wrap .ivu-table-row-hover .edit-step-name-icon {
|
|
|
+ display: inline-block;
|
|
|
}
|
|
|
-
|
|
|
</style>
|