提交 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')
......
此差异已折叠。
此差异已折叠。
......@@ -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 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册