提交 def33f99 编写于 作者: guangjun.yang's avatar guangjun.yang

自定义课程开发

上级 37d506fd
<template>
<div class="custom-select-wrapper">
<div class="department-label">
<span
v-for="(item, index) in dataList"
:key="index"
class="item"
:class="{checked: item.checked}"
@click="selectLabel(index)"
>
{{item.name}}
<span class="split"></span>
</span>
</div>
<!-- 课程分类 -->
<div class="course-class">
<div class="title">课程分类</div>
<div class="item">
<span class="name active">全部</span>
</div>
<div class="check-list">
<el-checkbox-group v-model="checkList" @change="handleClassChange">
<el-checkbox v-for="(item, index) in courseLevel" :label="item.name" :key="index">{{item.name}}</el-checkbox>
</el-checkbox-group>
<!-- <el-checkbox-group v-model="checkList">
<el-checkbox label="复选框 A"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 A"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
<el-checkbox label="复选框 B"></el-checkbox>
<el-checkbox label="复选框 C"></el-checkbox>
<el-checkbox label="禁用"></el-checkbox>
<el-checkbox label="选中且禁用"></el-checkbox>
</el-checkbox-group> -->
</div>
<div class="right"></div>
</div>
<!-- 课程等级 -->
<div class="course-level">
<span class="title">课程等级</span>
<span
class="item"
v-for="(item, index) in courseLevel"
:key="index"
@click="selectLevel(index)"
>
<span class="name" :class="{active: item.checked}">{{item.name}}</span>
</span>
</div>
<div class="button-wrapper">
<el-button class="add-button" size="small" type="primary">查 询</el-button>
<el-button class="add-button" size="small">重 置</el-button>
</div>
</div>
</template>
<script>
export default {
data() {
return {
courseLevel: [
{ name: "全部", value: 0, checked: true },
{ name: "初级", value: 1, checked: false },
{ name: "中级", value: 2, checked: false },
{ name: "高级", value: 3, checked: false }
],
checkList: []
};
},
props: {
dataList: {
type: Array,
default: () => {
return [
{
name: "全部",
checked: true
},
{
name: "内科",
checked: false
},
{
name: "神经科",
checked: false
},
{
name: "肿瘤科",
checked: false
},
{
name: "妇产科",
checked: false
},
{
name: "内科",
checked: false
},
{
name: "神经科",
checked: false
},
{
name: "肿瘤科",
checked: false
},
{
name: "妇产科",
checked: false
},
{
name: "内科",
checked: false
},
{
name: "神经科",
checked: false
},
{
name: "肿瘤科",
checked: false
},
{
name: "妇产科",
checked: false
}
];
}
}
},
methods: {
selectLabel(index) {
this.dataList.forEach(element => {
element.checked = false;
});
this.dataList[index].checked = true;
},
selectLevel(index) {
this.courseLevel.forEach(element => {
element.checked = false;
});
this.courseLevel[index].checked = true;
},
handleClassChange() {
// let checkedCount = value.length;
// this.checkAll = checkedCount === this.cities.length;
// this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;
}
}
};
</script>
<style lang="less" scoped>
.custom-select-wrapper {
.department-label {
display: flex;
flex-direction: row;
height: 48px;
line-height: 48px;
border-bottom: 2px solid #449284;
border-radius: 6px 6px 0px 0px;
.item {
position: relative;
z-index: 1;
display: inline-block;
padding: 0 22px;
font-size: 16px;
color: #666666;
&.checked {
color: #fff;
z-index: 3;
background: #449284;
}
&:first-child {
border-radius: 6px 0px 0px 0px;
}
}
// .split {
// position: absolute;
// top: 4px;
// right: 0px;
// z-index: 2;
// display: inline-block;
// height: 20px;
// width: 1px;
// background: #C7C8C9;
// }
}
}
.course-level {
display: flex;
flex-direction: row;
box-sizing: content-box;
height: 56px;
line-height: 56px;
padding-left: 20px;
// margin: 16px 0 16px 20px;
border-bottom: 1px dotted #E4E7ED;
.title {
display: inline-block;
padding: 0 10px;
color: #999999;
}
.item {
display: inline-block;
margin: 0 5px;
color: #333333;
.name {
height: 26px;
line-height: 26px;
display: inline-block;
padding: 0px 10px;
border-radius:2px;
&.active {
color: #fff;
background: #449284;
}
}
}
}
.course-class {
display: flex;
flex-direction: row;
box-sizing: content-box;
padding: 10px 0;
padding-left: 20px;
// margin: 16px 0 16px 20px;
border-bottom: 1px dashed #E4E7ED;
.title {
height: 56px;
line-height: 56px;
display: inline-block;
padding: 0 10px;
color: #999999;
}
.item {
height: 56px;
line-height: 56px;
display: inline-block;
margin: 0 5px;
color: #333333;
.name {
height: 26px;
line-height: 26px;
display: inline-block;
padding: 0px 10px;
border-radius:2px;
margin-right: 16px;
&.active {
color: #fff;
background: #449284;
}
}
}
.check-list {
margin-top: 14px;;
margin-right: 80px;
flex: 1;
}
.el-checkbox {
height: 30px;
line-height: 30px;
}
}
.button-wrapper {
margin-top: 20px;
margin-right: 50px;
// height: 60px;
// line-height: 60px;
.add-button {
float: right;
margin: 0 10px;
}
}
</style>
\ No newline at end of file
<template>
<div class="select-course-wrapper">
<div class="top-line"></div>
<CustomSelect></CustomSelect>
<div class="top-line" style="margin-top: 70px;"></div>
</div>
</template>
<script>
import CustomSelect from '@/components/education/custom/custom-select'
export default {
data() {
return {
}
},
components: {
CustomSelect
}
}
</script>
<style lang="less" scoped>
.select-course-wrapper {
.top-line {
height: 10px;
background: rgb(240, 242, 245);
}
}
</style>
\ No newline at end of file
......@@ -44,6 +44,7 @@ const templateManager = r => require.ensure([], () => r(require('../views/educat
const templateEditor = r => require.ensure([], () => r(require('../views/education/template-editor.vue')), 'template-editor')
const templateOpen = r => require.ensure([], () => r(require('../views/education/template-open.vue')), 'templateOpen')
const eduRole = r => require.ensure([], () => r(require('../views/education/edu-role.vue')), 'edu-role')
const editCustom = r => require.ensure([], () => r(require('../views/education/edit-custom.vue')), 'templateOpen')
const noticeEditor = r => require.ensure([], () => r(require('../views/education/notice-editor.vue')), 'notice-editor')
......@@ -179,6 +180,10 @@ export default [{
path: '/template-open',
component: templateOpen
},
{
path: '/edit-custom',
component: editCustom
},
{
path: '/edu-role',
component: eduRole
......
......@@ -120,3 +120,21 @@
border-color: #ecedf1;
border-radius: 2px;
}
.custom-select-wrapper {
.el-checkbox__label {
padding-left: 5px !important;
font-size: 14px !important;
color: #333;
}
.el-checkbox__input.is-checked+.el-checkbox__label {
color: #449284;
}
.el-checkbox__input.is-checked .el-checkbox__inner,
.el-checkbox__input.is-indeterminate .el-checkbox__inner {
color: #449284;
}
.el-checkbox__input.is-checked .el-checkbox__inner, .el-checkbox__input.is-indeterminate .el-checkbox__inner {
background-color: #449284;
border-color: #449284;
}
}
......@@ -54,8 +54,7 @@ service.interceptors.request.use(config => {
}
if( process.env.BUILD_ENV == "development" ){ // 本地开发环境
// console.log('环境变量>>>> ', process.env.BUILD_ENV);
// config.headers['token'] = '29D71EAAB92E4580AFB16A8011BE7206';
config.headers['token'] = '4606AE29F7E547388A9339ACC2EC2B0D';
config.headers['token'] = '073861ABE10245C78D705B90A76939DC';
// config.headers['token'] = localStorage.getItem('storageToken')
}else{
config.headers['token'] = localStorage.getItem('storageToken')
......
<template>
<div class="template-open-wrap">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond" :curmbThird="curmbThird" :jumPathThird="jumPathThird"></bread-crumb>
<div class="add-content screenSet" id="screenSet">
<div class="top-lin"></div>
<el-row class="step-content">
<el-col :span="14">
<el-steps :active="active" simple class>
<span class="step-num" v-bind:class="{ 'on-step': active==0 }">1</span>
<el-step title="选择项目模板">1</el-step>
<span class="step-num" v-bind:class="{ 'on-step': active==1 }">2</span>
<el-step title="填写项目信息">2</el-step>
<span class="step-num" v-bind:class="{ 'on-step': active==2 }">3</span>
<el-step title="选择学员范围">3</el-step>
</el-steps>
</el-col>
<el-col :span="5" :offset="5">
<div v-if="!canNext" class="dis-btn">下一步</div>
<el-button v-if="active!=0 && projectStatus==1" size="small" @click="save">暂存</el-button>
<el-button v-if="active!==2 && canNext" size="small" type="primary" @click="nextStep">下一步</el-button>
<el-button v-if="active==2" size="small" type="primary" @click="complete">完成</el-button>
</el-col>
</el-row>
<!-- 模板列表 -->
<div v-if="active == 0" class="tpl-main">
<template-list @checkFn="checkFn"></template-list>
</div>
<!-- 填写项目信息-->
<template-message
ref="templateMessage"
v-if="active == 1"
:openTemplateId="openTemplateId"
:projectId="projectId"
:editor="editor"
@next="next"
@backSelectVue="backSelectVue"
@hideSave="hideSave"
@setStatus4Flag="setStatus4Flag"
/>
<!-- 选择学员 -->
<div class="three-step" v-if="active === 2">
<el-tabs v-model="activeName" @tab-click="handleClickTabs">
<el-tab-pane label="设定行政范围" name="first">
<select-region ref="selectRegion" :projectId="projectId" :status4Flag="status4Flag"></select-region>
</el-tab-pane>
<el-tab-pane label="设定机构" name="second">
<set-organization ref="setOrganization" :projectId="projectId" :status4Flag="status4Flag"></set-organization>
</el-tab-pane>
</el-tabs>
</div>
</div>
<dialog-componet :dialogObj="dialogObj" @hide="hide"></dialog-componet>
<dialog-componet :dialogObj="sendObj" @hide="hidefn" @confirm="confirmFn"></dialog-componet>
</div>
</template>
<script>
import BreadCrumb from "../../components/breadcrumb.vue";
import templateMessage from "../../components/education/template/templateMessage";
import selectTemplate from "../../components/education/template/selectTemplate";
import selectRegion from "../../components/education/template/selectRegion";
import setOrganization from "../../components/education/template/setOrganization";
import templateList from "../../components/education/template/templateList";
import dialog from "../../components/education/template/dialog";
import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils";
let vm = null;
export default {
data() {
return {
curmbFirst: "教培项目",
curmbSecond: "项目管理",
jumPathThird: 'item-manager',
curmbThird: '发起项目',
active: 0,
formTemplate: {
component: [],
configure: 2,
certificate: ""
},
activeName: "first",
canNext: false,
openTemplateId: 0, // 开放模板ID
projectId: '', // 项目id
status: 10, // 0正常10没有加入机构11审核中12审核失败20存在进行中项目21数量已达上限
editor: false, // 是否为编辑状态
dialogObj: {
visible: false,
title: '',
message: '',
tip: '',
hideMsg: ''
},
statusObj: {
status_10: {
title: '您暂未加入机构',
message: '请前往云鹊医APP-个人中心-我的资料-填写工作所属机构。加入机构后,可创建项目',
tip: '(如为新创建机构,请等待机构审核通过)',
hideMsg: '我知道了'
},
status_11: {
title: '您暂未加入机构',
message: '请前往云鹊医APP-个人中心-我的资料-填写工作所属机构。加入机构后,可创建项目',
tip: '(如为新创建机构,请等待机构审核通过)',
hideMsg: '我知道了'
},
status_12: {
title: '您暂未加入机构',
message: '请前往云鹊医APP-个人中心-我的资料-填写工作所属机构。加入机构后,可创建项目',
tip: '(如为新创建机构,请等待机构审核通过)',
hideMsg: '我知道了'
},
status_20: {
title: '该项目正在进行中',
message: '不能重复创建,请选择其他模版或者下架正在进行中的项目',
hideMsg: '确定'
},
status_21: {
title: '该项目创建数量已上限',
message: '本年度免费创建数已达4次,不能继续创建该项目',
hideMsg: '确定'
}
},
sendObj: { // 发布
visible: false,
title: '确定发布吗?',
message: '发布后,项目将进入审核中,待审核完成后学员可在云鹊医App上参加培训学习',
tip: '',
confirmMsg: '取消',
hideMsg: '确定发布'
},
projectStatus: 1, //1.草稿 2.未上架 3.审核中/待审核 4.已上架 5.已下架 6.已拒绝/未上架
status4Flag: 0,//0表示没有上过架,1表示上过架
isPreview: 0 // 1表示是查看信息
}
},
components: {
BreadCrumb,
templateMessage,
selectTemplate,
selectRegion,
setOrganization,
templateList,
dialogComponet:dialog
},
created() {
vm = this;
vm.isEditorFn();
vm.isPreviewFn();
},
mounted() {
commonUtil.resizeHeight();
},
methods: {
// 判断是否为编辑状态
isEditorFn(){
if(vm.$route.query.projectId) {
vm.projectId = vm.$route.query.projectId;
vm.editor = true;
vm.active = 1;
vm.canNext = true;
}
},
isPreviewFn() {
if(vm.$route.query.isPreview == 1 && vm.$route.query.projectId) {
vm.projectId = vm.$route.query.projectId;
vm.isPreview = vm.$route.query.isPreview;
vm.active = 1;
vm.canNext = true;
}
},
// 按钮点击下一步
nextStep() {
if (vm.active == 0) {
vm.checkSelectTemplate()
return;
}
if (vm.active == 1) {
// 查看时,点击下一步直接跳
if (vm.isPreview == 1) {
vm.active = 2;
return;
}
// 调用项目信息中的下一步操作
vm.$refs.templateMessage.nextStep();
return;
}
},
// 填写项目信息组件的下一步回调(获取项目id)
next(id) {
vm.projectId = id;
vm.active = 2;
},
// 暂存
save() {
if (vm.active == 1) {
vm.$refs.templateMessage.save();
} else if (vm.active == 2) {
vm.regionComplete();
}
},
confirmFn() {
vm.sendObj.visible = false;
},
// 完成
complete() {
// 4不弹框
if (vm.projectStatus !=4 && vm.isPreview != 1) {
vm.sendObj.visible = true;
} else {
// 查看时,点击完成直接跳到列表页
if (vm.isPreview == 1) {
let query = {};
if (vm.$route.query.pageNum) {
query = { pageNum: vm.$route.query.pageNum };
}
vm.$router.push({ path: "item-manager", query: query });
return;
}
vm.hidefn();
}
},
// 完成触发的接口
hidefn() {
vm.regionComplete(vm.changeStatus);
},
// 选择学元范围暂存
regionComplete(fishFn) {
let req = {
projectId: vm.projectId,
scopeOfAdministrative: vm.$refs.selectRegion.setScope(),
scopeOfDepartment: 99999999,
flag: fishFn ? 3 : 1, //0:下一步 1:暂存
};
openLoading(vm);
vm.POST("portal/new/scope", req)
.then(res => {
closeLoading(vm);
if(res.code == '000000' && fishFn) {
fishFn();
}
if (!fishFn) {
vm.$message({
type: "info",
message: res.message
});
}
})
.catch(() => {
vm.$message({
type: "warning",
message: res.message
});
})
},
// 完成后更改状态
changeStatus() {
let req = {
projectId: vm.projectId,
changeStatus: 3 //待审核
};
vm.POST("portal/portalInfo/changeStatus", req)
.then(res => {
vm.sendObj.visible = false;
if(res.code == '000000') {
let query = {};
if (vm.$route.query.pageNum) {
query = { pageNum: vm.$route.query.pageNum };
}
vm.$router.push({ path: "item-manager", query: query });
} else {
vm.$message({
type: "warning",
message: res.message
});
}
})
.catch(() => {
vm.$message({
type: "warning",
message: res.message
});
})
},
//切换tabs
handleClickTabs(tab, event) {
if (tab.name == 'second') {
vm.setRegion();
}
},
// 模板列表选中
checkFn(id) {
vm.canNext = true;
vm.openTemplateId = id;
},
//选中模板后点击下一步时检测(机构和进行中的项目)
checkSelectTemplate() {
openLoading(vm);
vm.GET(`portal/openTemplateProject/checkAfterSelectOneOpenTemplate/${vm.openTemplateId}`)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
if (res.data.status == 0) {
vm.active = 1;
return;
} else {
vm.dialogObj = Object.assign(vm.dialogObj, vm.statusObj[`status_${res.data.status}`]);
vm.dialogObj.visible = true;
return;
}
} else {
vm.$message.info(res.message);
}
})
.catch((err) => {
closeLoading(vm);
vm.$message.warning('请稍后重试');
});
},
// 隐藏弹框
hide() {
vm.dialogObj.visible = false;
},
// 获取行政范围
setRegion() {
vm.getOrganizationList(vm.$refs.selectRegion.getScope());
},
// 查询行政范围的设定机构列表
getOrganizationList(r) {
vm.$refs.setOrganization.init();
vm.$refs.setOrganization.getOrganization(r);
},
// 返回选择模板页
backSelectVue() {
vm.active = 0;
},
// 是否隐藏暂存按钮
hideSave(num) {
this.projectStatus = num;
},
// 从子组件(项目信息)获取项目状态是否为上架
setStatus4Flag(s) {
vm.status4Flag = s;
}
}
}
</script>
<style lang="scss">
.template-open-wrap {
.el-step.is-simple:not(:last-of-type) .el-step__title {
max-width: 100%;
}
.top-lin {
position: fixed;
height: 30px;
background: #F0F2F5;
right: 30px;
left: 285px;
z-index: 1001;
top: 125px;
}
.step-content {
background: #fff;
z-index: 1001;
background: #fff;
position: fixed;
right: 30px;
left: 285px;
overflow: hidden;
height: 60px;
// margin-top: 66px;
padding: 15px 0 50px 0;
border-bottom: 1px solid #efefef;
background: #fff;
.is-text {
display: none;
}
.el-steps--simple {
background: #fff;
}
.button-green {
color: #ffffff;
background: #449284;
border-color: #bfdad5;
border-radius: 2px;
}
.button-white {
color: #606266;
background: #ffffff;
border-color: #ecedf1;
border-radius: 2px;
}
.step-num {
display: block;
// margin-top: 1.5px;
font-size: 12px;
border: 1px solid #999 !important;
border-radius: 50%;
width: 25px;
height: 18px;
line-height: 16px;
text-align: center;
color: #999;
}
.el-step__title.is-wait {
color: #999;
}
.el-step__title.is-process {
color: #449284;
}
.is-finish {
color: #999 !important;
}
.on-step {
color: #449284;
border: 1px solid #449284 !important;
}
.dis-btn {
width:78px;
height:34px;
background:rgba(240,242,245,1);
border-radius:3px;
font-size:14px;
font-family:PingFangSC-Regular,PingFang SC;
font-weight:400;
color:rgba(144,147,153,1);
line-height:34px;
text-align: center;
cursor: pointer;
}
}
.add-content {
background: #fff;
}
.three-step {
padding-top: 64px;
margin: 10px 0 0 20px;
.area-p {
margin-bottom: 15px;
font-size: 14px;
}
.span_ecology {
line-height: 45px;
margin-left: 8px;
}
.dialog-p {
text-align: center;
span {
color: #449284;
}
}
//隐藏树展开
.table-empty {
img {
width: 100px;
}
p {
margin-top: -50px;
}
}
.el-tree-node__expand-icon {
display: none;
}
.department {
margin-top: 20px;
border: 1px solid #dddddd;
}
.el-tabs__nav-wrap::after {
display: none;
}
.el-tabs__active-bar {
display: none;
}
#tab-first,
#tab-second,
#tab-third {
padding-right: 0px;
}
#tab-first::after {
color: #c7cbd2;
margin-left: 20px;
content: "•";
}
.el-tabs__item.is-active {
color: #fff;
}
.el-tag {
margin: 0 10px 10px 0;
border: 1.3px solid #48a8fe;
color: #1e92fe;
background-color: #e7f6fe;
.el-icon-close {
width: 13px;
height: 13px;
line-height: 13px;
font-size: 12px;
background-color: #0486fe;
border-radius: 50%;
color: #d4edfe;
}
}
.down-button {
margin-left: 10px;
}
.down-button-close {
margin-left: 100px;
float: left;
}
.dialog-success {
p {
text-align: center;
.upload-text{
color: #449284;
}
}
}
.dialog-fail {
.fail-type {
p {
margin-top: 10px;
}
.fail-num {
color: #db3f52;
}
.fail-notice {
color: #e3e3e3;
font-size: 13px;
}
.fail-link {
text-align: center;
color: #449284;
cursor: pointer;
}
}
}
}
.tpl-main {
padding-top: 60px;
}
}
</style>
<template>
<div class="edit-custom-wrap">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond" :curmbThird="curmbThird" :jumPathThird="jumPathThird"></bread-crumb>
<div class="add-content screenSet" id="screenSet">
<el-row class="step-content">
<el-col :span="14">
<el-steps :active="active" simple class>
<span class="step-num" v-bind:class="{ 'on-step': active==0 }">1</span>
<el-step title="选择项目课程">1</el-step>
<span class="step-num" v-bind:class="{ 'on-step': active==1 }">2</span>
<el-step title="填写项目信息">2</el-step>
<span class="step-num" v-bind:class="{ 'on-step': active==2 }">3</span>
<el-step title="选择学员范围">3</el-step>
</el-steps>
</el-col>
<el-col :span="5" :offset="5">
<div v-if="!canNext" class="dis-btn">下一步</div>
<el-button v-if="active!=0 && projectStatus==1" size="small" @click="save">暂存</el-button>
<el-button v-if="active!==2 && canNext" size="small" type="primary" @click="nextStep">下一步</el-button>
<el-button v-if="active==2" size="small" type="primary" @click="complete">完成</el-button>
</el-col>
</el-row>
<!-- 模板列表
<div v-if="active == 0" class="tpl-main">
<template-list @checkFn="checkFn"></template-list>
</div> -->
<!-- 模板列表 -->
<div v-if="active == 0" class="tpl-main">
<!-- <template-list @checkFn="checkFn"></template-list> -->
<selectCourse ></selectCourse>
</div>
<!-- 填写项目信息-->
<template-message
ref="templateMessage"
v-if="active == 1"
:openTemplateId="openTemplateId"
:projectId="projectId"
:editor="editor"
@next="next"
@backSelectVue="backSelectVue"
@hideSave="hideSave"
@setStatus4Flag="setStatus4Flag"
/>
<!-- 设定行政范围与设定机构 -->
<div class="three-step" v-if="active === 2">
<el-tabs v-model="activeName" @tab-click="handleClickTabs">
<el-tab-pane label="设定行政范围" name="first">
<select-region ref="selectRegion" :projectId="projectId" :status4Flag="status4Flag"></select-region>
</el-tab-pane>
<el-tab-pane label="设定机构" name="second">
<set-organization ref="setOrganization" :projectId="projectId" :status4Flag="status4Flag"></set-organization>
</el-tab-pane>
</el-tabs>
</div>
</div>
<dialog-componet :dialogObj="dialogObj" @hide="hide"></dialog-componet>
<dialog-componet :dialogObj="sendObj" @hide="hidefn" @confirm="confirmFn"></dialog-componet>
</div>
</template>
<script>
import BreadCrumb from "../../components/breadcrumb.vue";
import templateMessage from "../../components/education/template/templateMessage";
import selectTemplate from "../../components/education/template/selectTemplate";
import selectRegion from "../../components/education/template/selectRegion";
import setOrganization from "../../components/education/template/setOrganization";
// import templateList from "../../components/education/template/templateList";
import selectCourse from "../../components/education/custom/select-course";
import dialog from "../../components/education/template/dialog";
import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils";
let vm = null;
export default {
data() {
return {
curmbFirst: "教培项目",
curmbSecond: "项目管理",
jumPathThird: 'edit-custom',
curmbThird: '发起项目',
active: 0,
formTemplate: {
component: [],
configure: 2,
certificate: ""
},
activeName: "first",
canNext: false,
openTemplateId: 0, // 开放模板ID
projectId: '', // 项目id
status: 10, // 0正常10没有加入机构11审核中12审核失败20存在进行中项目21数量已达上限
editor: false, // 是否为编辑状态
dialogObj: {
visible: false,
title: '',
message: '',
tip: '',
hideMsg: ''
},
statusObj: {
status_10: {
title: '您暂未加入机构',
message: '请前往云鹊医APP-个人中心-我的资料-填写工作所属机构。加入机构后,可创建项目',
tip: '(如为新创建机构,请等待机构审核通过)',
hideMsg: '我知道了'
},
status_11: {
title: '您暂未加入机构',
message: '请前往云鹊医APP-个人中心-我的资料-填写工作所属机构。加入机构后,可创建项目',
tip: '(如为新创建机构,请等待机构审核通过)',
hideMsg: '我知道了'
},
status_12: {
title: '您暂未加入机构',
message: '请前往云鹊医APP-个人中心-我的资料-填写工作所属机构。加入机构后,可创建项目',
tip: '(如为新创建机构,请等待机构审核通过)',
hideMsg: '我知道了'
},
status_20: {
title: '该项目正在进行中',
message: '不能重复创建,请选择其他模版或者下架正在进行中的项目',
hideMsg: '确定'
},
status_21: {
title: '该项目创建数量已上限',
message: '本年度免费创建数已达4次,不能继续创建该项目',
hideMsg: '确定'
}
},
sendObj: { // 发布
visible: false,
title: '确定发布吗?',
message: '发布后,项目将进入审核中,待审核完成后学员可在云鹊医App上参加培训学习',
tip: '',
confirmMsg: '取消',
hideMsg: '确定发布'
},
projectStatus: 1, //1.草稿 2.未上架 3.审核中/待审核 4.已上架 5.已下架 6.已拒绝/未上架
status4Flag: 0,//0表示没有上过架,1表示上过架
isPreview: 0 // 1表示是查看信息
}
},
components: {
BreadCrumb,
templateMessage,
selectTemplate,
selectRegion,
setOrganization,
// templateList,
dialogComponet:dialog,
selectCourse
},
created() {
vm = this;
vm.isEditorFn();
vm.isPreviewFn();
},
mounted() {
commonUtil.resizeHeight();
},
methods: {
// 判断是否为编辑状态
isEditorFn(){
if(vm.$route.query.projectId) {
vm.projectId = vm.$route.query.projectId;
vm.editor = true;
vm.active = 1;
vm.canNext = true;
}
},
isPreviewFn() {
if(vm.$route.query.isPreview == 1 && vm.$route.query.projectId) {
vm.projectId = vm.$route.query.projectId;
vm.isPreview = vm.$route.query.isPreview;
vm.active = 1;
vm.canNext = true;
}
},
// 按钮点击下一步
nextStep() {
if (vm.active == 0) {
vm.checkSelectTemplate()
return;
}
if (vm.active == 1) {
// 查看时,点击下一步直接跳
if (vm.isPreview == 1) {
vm.active = 2;
return;
}
// 调用项目信息中的下一步操作
vm.$refs.templateMessage.nextStep();
return;
}
},
// 填写项目信息组件的下一步回调(获取项目id)
next(id) {
vm.projectId = id;
vm.active = 2;
},
// 暂存
save() {
if (vm.active == 1) {
vm.$refs.templateMessage.save();
} else if (vm.active == 2) {
vm.regionComplete();
}
},
confirmFn() {
vm.sendObj.visible = false;
},
// 完成
complete() {
// 4不弹框
if (vm.projectStatus !=4 && vm.isPreview != 1) {
vm.sendObj.visible = true;
} else {
// 查看时,点击完成直接跳到列表页
if (vm.isPreview == 1) {
let query = {};
if (vm.$route.query.pageNum) {
query = { pageNum: vm.$route.query.pageNum };
}
vm.$router.push({ path: "edit-custom", query: query });
return;
}
vm.hidefn();
}
},
// 完成触发的接口
hidefn() {
vm.regionComplete(vm.changeStatus);
},
// 选择学元范围暂存
regionComplete(fishFn) {
let req = {
projectId: vm.projectId,
scopeOfAdministrative: vm.$refs.selectRegion.setScope(),
scopeOfDepartment: 99999999,
flag: fishFn ? 3 : 1, //0:下一步 1:暂存
};
openLoading(vm);
vm.POST("portal/new/scope", req)
.then(res => {
closeLoading(vm);
if(res.code == '000000' && fishFn) {
fishFn();
}
if (!fishFn) {
vm.$message({
type: "info",
message: res.message
});
}
})
.catch(() => {
vm.$message({
type: "warning",
message: res.message
});
})
},
// 完成后更改状态
changeStatus() {
let req = {
projectId: vm.projectId,
changeStatus: 3 //待审核
};
vm.POST("portal/portalInfo/changeStatus", req)
.then(res => {
vm.sendObj.visible = false;
if(res.code == '000000') {
let query = {};
if (vm.$route.query.pageNum) {
query = { pageNum: vm.$route.query.pageNum };
}
vm.$router.push({ path: "edit-custom", query: query });
} else {
vm.$message({
type: "warning",
message: res.message
});
}
})
.catch(() => {
vm.$message({
type: "warning",
message: res.message
});
})
},
//切换tabs
handleClickTabs(tab, event) {
if (tab.name == 'second') {
vm.setRegion();
}
},
// 模板列表选中
checkFn(id) {
vm.canNext = true;
vm.openTemplateId = id;
},
//选中模板后点击下一步时检测(机构和进行中的项目)
checkSelectTemplate() {
openLoading(vm);
vm.GET(`portal/openTemplateProject/checkAfterSelectOneOpenTemplate/${vm.openTemplateId}`)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
if (res.data.status == 0) {
vm.active = 1;
return;
} else {
vm.dialogObj = Object.assign(vm.dialogObj, vm.statusObj[`status_${res.data.status}`]);
vm.dialogObj.visible = true;
return;
}
} else {
vm.$message.info(res.message);
}
})
.catch((err) => {
closeLoading(vm);
vm.$message.warning('请稍后重试');
});
},
// 隐藏弹框
hide() {
vm.dialogObj.visible = false;
},
// 获取行政范围
setRegion() {
vm.getOrganizationList(vm.$refs.selectRegion.getScope());
},
// 查询行政范围的设定机构列表
getOrganizationList(r) {
vm.$refs.setOrganization.init();
vm.$refs.setOrganization.getOrganization(r);
},
// 返回选择模板页
backSelectVue() {
vm.active = 0;
},
// 是否隐藏暂存按钮
hideSave(num) {
this.projectStatus = num;
},
// 从子组件(项目信息)获取项目状态是否为上架
setStatus4Flag(s) {
vm.status4Flag = s;
}
}
}
</script>
<style lang="scss">
.edit-custom-wrap {
.el-step.is-simple:not(:last-of-type) .el-step__title {
max-width: 100%;
}
.top-lin {
position: fixed;
height: 30px;
background: #F0F2F5;
right: 30px;
left: 285px;
z-index: 1001;
top: 125px;
}
.step-content {
background: #fff;
z-index: 1001;
background: #fff;
position: fixed;
right: 30px;
left: 285px;
overflow: hidden;
// height: 60px;
height: 54px;
line-height: 54px;
// margin-top: 66px;
padding: 15px 0 50px 0;
border-bottom: 1px solid #efefef;
margin-bottom: 20px;
background: #fff;
.is-text {
display: none;
}
.el-steps--simple {
background: #fff;
}
.button-green {
color: #ffffff;
background: #449284;
border-color: #bfdad5;
border-radius: 2px;
}
.button-white {
color: #606266;
background: #ffffff;
border-color: #ecedf1;
border-radius: 2px;
}
.step-num {
display: block;
// margin-top: 1.5px;
font-size: 12px;
border: 1px solid #999 !important;
border-radius: 50%;
width: 25px;
height: 18px;
line-height: 16px;
text-align: center;
color: #999;
}
.el-step__title.is-wait {
color: #999;
}
.el-step__title.is-process {
color: #449284;
}
.is-finish {
color: #999 !important;
}
.on-step {
color: #449284;
border: 1px solid #449284 !important;
}
.dis-btn {
width:78px;
height:34px;
background:rgba(240,242,245,1);
border-radius:3px;
font-size:14px;
font-family:PingFangSC-Regular,PingFang SC;
font-weight:400;
color:rgba(144,147,153,1);
line-height:34px;
text-align: center;
cursor: pointer;
}
}
.add-content {
background: #fff;
}
.three-step {
padding-top: 64px;
margin: 10px 0 0 20px;
.area-p {
margin-bottom: 15px;
font-size: 14px;
}
.span_ecology {
line-height: 45px;
margin-left: 8px;
}
.dialog-p {
text-align: center;
span {
color: #449284;
}
}
//隐藏树展开
.table-empty {
img {
width: 100px;
}
p {
margin-top: -50px;
}
}
.el-tree-node__expand-icon {
display: none;
}
.department {
margin-top: 20px;
border: 1px solid #dddddd;
}
.el-tabs__nav-wrap::after {
display: none;
}
.el-tabs__active-bar {
display: none;
}
#tab-first,
#tab-second,
#tab-third {
padding-right: 0px;
}
#tab-first::after {
color: #c7cbd2;
margin-left: 20px;
content: "•";
}
.el-tabs__item.is-active {
color: #fff;
}
.el-tag {
margin: 0 10px 10px 0;
border: 1.3px solid #48a8fe;
color: #1e92fe;
background-color: #e7f6fe;
.el-icon-close {
width: 13px;
height: 13px;
line-height: 13px;
font-size: 12px;
background-color: #0486fe;
border-radius: 50%;
color: #d4edfe;
}
}
.down-button {
margin-left: 10px;
}
.down-button-close {
margin-left: 100px;
float: left;
}
.dialog-success {
p {
text-align: center;
.upload-text{
color: #449284;
}
}
}
.dialog-fail {
.fail-type {
p {
margin-top: 10px;
}
.fail-num {
color: #db3f52;
}
.fail-notice {
color: #e3e3e3;
font-size: 13px;
}
.fail-link {
text-align: center;
color: #449284;
cursor: pointer;
}
}
}
}
.tpl-main {
padding-top: 64px;
}
}
</style>
......@@ -81,6 +81,7 @@
</el-row>
<el-form v-if="isRoleOfOuter" :model="formInline" class="demo-form-inline">
<el-form-item>
<el-button class="add-button" size="small" type="primary" @click="toEditCustomPage()">创建自定义项目</el-button>
<el-button class="add-button" size="small" type="primary" @click="openProject()">新建项目</el-button>
</el-form-item>
</el-form>
......@@ -487,6 +488,9 @@ export default {
},
toTemplatePage(isPreview = 0) {
this.$router.push("template-open?projectType=3&isPreview=" + isPreview);
},
toEditCustomPage(isPreview = 0) {
this.$router.push("edit-custom?projectType=4&isPreview=" + isPreview);
},
toShield(row) {
this.$router.push("item-shield?projectId="+row.id);
......@@ -681,6 +685,8 @@ export default {
this.$router.push("edit-cme?projectType=2&projectId=" + projectId +"&level="+level+'&pageNum='+this.formInline.pageNo);
} else if(row.projectType === 3) {
this.$router.push("template-open?projectType=3&projectId=" + projectId +"&level="+level+'&pageNum='+this.formInline.pageNo);
} else if(row.projectType === 4) {
this.$router.push("eidt-custom?projectType=4&projectId=" + projectId +"&level="+level+'&pageNum='+this.formInline.pageNo);
}
} else if (type === 7) {
//提醒审核
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册