|
@@ -10,31 +10,32 @@
|
|
|
</span>
|
|
|
</div>
|
|
|
<div class="order-learn-main">
|
|
|
+ <!-- 基础信息表单 -->
|
|
|
<div class="base-info-wrap">
|
|
|
<p class="base-info-label">基础信息</p>
|
|
|
<div class="base-info-form">
|
|
|
- <!--<vuescroll>-->
|
|
|
- <Form :model="orderLearnInfo" label-position="top" class="evaluation-attr-form" label-colon>
|
|
|
- <FormItem label="活动名称">
|
|
|
+ <!--<vuescroll> -->
|
|
|
+ <Form ref="orderLearnInfo" :model="orderLearnInfo" label-position="top" class="evaluation-attr-form" :rules="ruleValidate" label-colon>
|
|
|
+ <FormItem label="活动名称" prop="name">
|
|
|
<Input v-model="orderLearnInfo.name"></Input>
|
|
|
</FormItem>
|
|
|
- <FormItem label="学段">
|
|
|
+ <FormItem label="学段" prop="periodCode">
|
|
|
<Select v-model="orderLearnInfo.periodCode">
|
|
|
<Option v-for="(item,index) in $store.state.schoolBaseInfo.schoolBaseInfo.period" :value="item.periodCode" :key="index">{{ item.periodName }}</Option>
|
|
|
</Select>
|
|
|
</FormItem>
|
|
|
- <FormItem label="科目">
|
|
|
- <Select v-model="orderLearnInfo.subjectCode">
|
|
|
+ <FormItem label="科目" prop="subjectCode">
|
|
|
+ <Select v-model="orderLearnInfo.subjectCode" not-found-text="请先选择学段">
|
|
|
<Option v-for="(item,index) in $jsFn.getPeriod($store.state.schoolBaseInfo.schoolBaseInfo,orderLearnInfo.periodCode).subjects" :value="item.subjectCode" :key="index">{{ item.subjectName }}</Option>
|
|
|
</Select>
|
|
|
</FormItem>
|
|
|
- <FormItem label="学习对象">
|
|
|
+ <FormItem label="学习对象" prop="target">
|
|
|
<Select v-model="orderLearnInfo.target">
|
|
|
<Option v-for="(item,index) in classroomList" :value="item" :key="index">{{ item }}</Option>
|
|
|
</Select>
|
|
|
</FormItem>
|
|
|
- <FormItem label="闯关模式">
|
|
|
- <div slot="label">
|
|
|
+ <FormItem label="闯关模式" prop="isOrder">
|
|
|
+ <div slot="label" style="display:inline-block;">
|
|
|
<span>闯关模式:</span>
|
|
|
<Tooltip trigger="hover" content="是否必须通过阶段测试才能进入下一阶段学习" theme="light" placement="right" max-width="200">
|
|
|
<Icon type="md-help" color="white" style="cursor:pointer;" />
|
|
@@ -45,7 +46,7 @@
|
|
|
<Radio label="0" style="margin-left:30px;">否</Radio>
|
|
|
</RadioGroup>
|
|
|
</FormItem>
|
|
|
- <FormItem label="活动说明">
|
|
|
+ <FormItem label="活动说明" prop="introduce">
|
|
|
<Input v-model="orderLearnInfo.introduce" type="textarea" :rows="6"></Input>
|
|
|
</FormItem>
|
|
|
</Form>
|
|
@@ -54,6 +55,7 @@
|
|
|
</div>
|
|
|
<div class="order-learn-main dark-iview-split">
|
|
|
<Split v-model="split1">
|
|
|
+ <!-- 学习阶段列表 -->
|
|
|
<div slot="left" class="learn-step-wrap">
|
|
|
<div class="base-info-label">
|
|
|
<span>
|
|
@@ -73,8 +75,12 @@
|
|
|
<Icon type="ios-pricetags" color="white" style="margin-right:8px;" />
|
|
|
<span class="learn-step-name">{{row.name}}</span>
|
|
|
</template>
|
|
|
+ <template slot-scope="{ row, index }" slot="action">
|
|
|
+ <Icon type="md-create" color="white" class="edit-step-name-icon" @click="editSName(index)" />
|
|
|
+ </template>
|
|
|
</Table>
|
|
|
</div>
|
|
|
+ <!-- 学习资源区域 -->
|
|
|
<div slot="right" class="learn-content-wrap">
|
|
|
<div class="base-info-label">
|
|
|
学习资源
|
|
@@ -91,12 +97,13 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</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 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>
|
|
|
+ <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>
|
|
|
<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)">
|
|
@@ -122,18 +129,20 @@
|
|
|
</Poptip>
|
|
|
</div>
|
|
|
<NoData v-if="orderLearnInfo.steps.length == 0" style="margin-top:100px;"></NoData>
|
|
|
+ <!-- 查看已选择资源 -->
|
|
|
<div v-if="orderLearnInfo.steps.length !== 0" :class="currentView == 0 ? 'animated faster fadeInLeft preview-learn-content-wrap':'animated fadeOutRight preview-learn-content-wrap'">
|
|
|
- <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">{{item.fileName}}</p>
|
|
|
- </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>
|
|
|
- </div>
|
|
|
-
|
|
|
+ <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>
|
|
|
+ <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>
|
|
|
+ </div>
|
|
|
+ </vuescroll>
|
|
|
</div>
|
|
|
</div>
|
|
|
</Split>
|
|
@@ -147,6 +156,13 @@
|
|
|
<span>名称:</span>
|
|
|
<Input v-model="newStepName" placeholder="请输入名称..." style="width: calc(100% - 50px);" />
|
|
|
</Modal>
|
|
|
+ <Modal v-model="editStepStatus"
|
|
|
+ title="修改名称"
|
|
|
+ class="dark-iview-modal dark-iview-input"
|
|
|
+ @on-ok="confirmEditStep">
|
|
|
+ <span>名称:</span>
|
|
|
+ <Input v-model="editStepName" placeholder="请输入名称..." style="width: calc(100% - 50px);" />
|
|
|
+ </Modal>
|
|
|
<Modal v-model="goToManageStatus"
|
|
|
title="管理编序式自主学习活动"
|
|
|
ok-text="是"
|
|
@@ -170,6 +186,7 @@
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
+
|
|
|
goToManageStatus: false,
|
|
|
demoLoginInfo: {
|
|
|
user: 'admin',
|
|
@@ -178,8 +195,10 @@
|
|
|
schoolCode: 'HBCN'
|
|
|
},
|
|
|
shoppingCarClass: 'question-shopping-car',
|
|
|
- newStepName:'',
|
|
|
+ newStepName: '',
|
|
|
+ editStepName: '',
|
|
|
addStepStatus: false,
|
|
|
+ editStepStatus: false,
|
|
|
currentView: 0,
|
|
|
split1: 0.2,
|
|
|
currentCreateType: 0,
|
|
@@ -190,6 +209,12 @@
|
|
|
title: '',
|
|
|
slot: 'name',
|
|
|
ellipsis: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '',
|
|
|
+ slot: 'action',
|
|
|
+ width: 50,
|
|
|
+ align:'right'
|
|
|
}
|
|
|
],
|
|
|
orderLearnInfo: {
|
|
@@ -202,7 +227,24 @@
|
|
|
introduce: '',
|
|
|
type:'',
|
|
|
steps: []
|
|
|
- }
|
|
|
+ },
|
|
|
+ ruleValidate: {
|
|
|
+ name: [
|
|
|
+ { required: true, message: '请完善活动名称', trigger: 'change' }
|
|
|
+ ],
|
|
|
+ periodCode: [
|
|
|
+ { required: true, message: '请选择学段', trigger: 'change' }
|
|
|
+ ],
|
|
|
+ subjectCode: [
|
|
|
+ { required: true, message: '请选择学科', trigger: 'change' }
|
|
|
+ ],
|
|
|
+ isOrder: [
|
|
|
+ { required: true, message: '请选择模式', trigger: 'change' }
|
|
|
+ ],
|
|
|
+ introduce: [
|
|
|
+ { required: true, message: '请完善说明信息', trigger: 'change' }
|
|
|
+ ]
|
|
|
+ },
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
@@ -232,6 +274,21 @@
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
+ /**
|
|
|
+ * 确认修改学习阶段名称
|
|
|
+ * @param index
|
|
|
+ */
|
|
|
+ confirmEditStep() {
|
|
|
+ this.orderLearnInfo.steps[this.stepIndex].name = this.editStepName
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 编辑学习阶段名称
|
|
|
+ * @param index
|
|
|
+ */
|
|
|
+ editSName(index) {
|
|
|
+ this.editStepName = this.orderLearnInfo.steps[index].name
|
|
|
+ this.editStepStatus = true
|
|
|
+ },
|
|
|
confirmToManage() {
|
|
|
this.$router.push({
|
|
|
name: 'manageOrderLearn'
|
|
@@ -262,25 +319,38 @@
|
|
|
)
|
|
|
this.newStepName = ''
|
|
|
},
|
|
|
+ checkData() {
|
|
|
+ let flag = true
|
|
|
+ this.$refs.orderLearnInfo.validate((valid) => {
|
|
|
+ if (!valid) {
|
|
|
+ flag = false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ return flag
|
|
|
+ },
|
|
|
saveData() {
|
|
|
- this.orderLearnInfo.creator = this.demoLoginInfo.TEAMModelId
|
|
|
- this.orderLearnInfo.scopeCode = this.demoLoginInfo.TEAMModelId
|
|
|
- this.orderLearnInfo.type = '1'//教学情境
|
|
|
- this.$api.learnActivity.SaveOrderLearn(this.orderLearnInfo).then(
|
|
|
- res => {
|
|
|
- if (res.error == null) {
|
|
|
- this.orderLearnInfo.id = res.result.data.id
|
|
|
- //this.$Message.success('数据保存成功!')
|
|
|
- this.goToManageStatus = true
|
|
|
- } else {
|
|
|
- this.$Message.error('API ERROR!')
|
|
|
- }
|
|
|
- },
|
|
|
- err => {
|
|
|
+ let check = this.checkData()
|
|
|
+ if (check) {
|
|
|
+ this.orderLearnInfo.creator = this.demoLoginInfo.TEAMModelId
|
|
|
+ this.orderLearnInfo.scopeCode = this.demoLoginInfo.TEAMModelId
|
|
|
+ this.orderLearnInfo.type = '1'//教学情境
|
|
|
+ this.$api.learnActivity.SaveOrderLearn(this.orderLearnInfo).then(
|
|
|
+ res => {
|
|
|
+ if (res.error == null) {
|
|
|
+ this.orderLearnInfo.id = res.result.data.id
|
|
|
+ //this.$Message.success('数据保存成功!')
|
|
|
+ this.goToManageStatus = true
|
|
|
+ } else {
|
|
|
+ this.$Message.error('API ERROR!')
|
|
|
+ }
|
|
|
+ },
|
|
|
+ err => {
|
|
|
|
|
|
- }
|
|
|
- )
|
|
|
- console.log(this.orderLearnInfo)
|
|
|
+ }
|
|
|
+ )
|
|
|
+ } else {
|
|
|
+ this.$Message.error('请先完善信息,再保存!')
|
|
|
+ }
|
|
|
},
|
|
|
getSelectedQuestion(data) {
|
|
|
this.orderLearnInfo.steps[this.stepIndex].item.push(data.question)
|
|
@@ -316,6 +386,9 @@
|
|
|
getCurrentItem(row, index) {
|
|
|
this.stepIndex = index
|
|
|
this.currentView = 0
|
|
|
+ console.log('-1-1-1-')
|
|
|
+ console.log(this.$refs.chooseContent)
|
|
|
+ this.$refs.chooseContent.refreshData()
|
|
|
},
|
|
|
dragOrder(index1, index2) {
|
|
|
if (index1 > index2) {
|
|
@@ -418,4 +491,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;
|
|
|
+ }
|
|
|
+
|
|
|
</style>
|