diff --git a/src/views/learningpath/LevelAdd.vue b/src/views/learningpath/LevelAdd.vue index d1107707..f942b814 100644 --- a/src/views/learningpath/LevelAdd.vue +++ b/src/views/learningpath/LevelAdd.vue @@ -44,7 +44,170 @@ size="large" :tabBarStyle="{ marginLeft: '10px' }" > - + +
+ +
+
+
快速创建项目详情
+
+
+
+
+ +
+
+ +
+
+ +
+
+ 添加任务 +
+
快速添加任务/阶段
+
+
+
+ +
+
+ +
+
+ +
+
+ 添加学员 +
+
快速添加学员
+
+
+
+ +
+
+ +
+
+ +
+
+ 发布 +
+
快速发布项目
+
+
+
+ + +
+
项目概览
+
+
+ 200 +
总人数
+
+
+ 15 +
必修课
+
+
+ 15 +
选修课
+
+
+
+ 50% +
+
完成率
+
+
+
+ 30% +
+
必修完成率
+
+
+
+ 30% +
+
选修完成率
+
+
+
阶段信息
+
+
阶段1
+
阶段2
+
+
+
阶段名称:
+
管理者进阶-腾飞班1第一阶段
+
+
+
+ +
课程完成率
+
+
+ +
考试通过率
+
+
+ +
作业合格率
+
+
+
10
+
+ 阶段任务总数 + +
+
5
+
+ 必修课 + +
+
1
+
+ 选修课 + +
+
+
+
+ +
+ +
@@ -168,7 +331,8 @@
- + +
@@ -249,8 +413,8 @@
- - + +
@@ -550,6 +714,7 @@ export default { pageSize: 10, visible: false, sh: false, + nodata: true, closeDeleteAll: false, curLevel: "", //关卡的数据 @@ -1041,7 +1206,6 @@ export default { .addwrapper { width: 100%; height: 100%; - // background-color: green; .addhead { width: 100%; height: 130px; @@ -1198,6 +1362,491 @@ export default { margin-left: 0px !important; padding-left: 32px !important; } + .onerow { + //width: 100%; + display: flex; + height: 40px; + position: relative; + margin-top: 15px; + margin-left: 38px; + //margin-right: 38px; + .taskmain { + font-size: 18px; + padding-top: 7px; + color: #000000; + } + .btn { + position: absolute; + top: 0; + right: 168px; + background-color: #409eff; + width: 130px; + height: 40px; + border-radius: 8px; + border: 1px solid #409eff; + color: #ffffff; + cursor: pointer; + } + .edit { + position: absolute; + right: 38px; + top: 0; + color: #409eff; + width: 100px; + height: 40px; + border: 1px solid #409eff; + border-radius: 8px; + .editimg { + width: 15px; + height: 15px; + margin-top: -2px; + margin-left: 25px; + margin-right: 5px; + } + .editext { + line-height: 40px; + } + } + .edit:hover { + color: #ffffff; + background-color: #409eff; + cursor: pointer; + .editimg { + background-image: url("../../assets/images/projectadd/edit1.png"); + } + } + } + .second { + display: flex; + justify-content: left; + flex-wrap: wrap; + margin-top: 40px; + margin-left: 20px; + .nubbox { + width: 253px; + height: 116px; + margin-top: 20px; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + background: #fafbfc; + border-radius: 10px; + margin-left: 15px; + .nub1 { + color: #ffb54a; + font-size: 30px; + font-weight: 700; + } + .nub2 { + color: #6d7584; + font-size: 14px; + } + } + .taskbox { + width: 412px; + height: 160px; + border-radius: 10px; + position: relative; + margin-left: 68px; + margin-bottom: 40px; + cursor: pointer; + .leftt { + position: absolute; + top: 18px; + left: 0; + } + .photo { + position: absolute; + top: 42px; + left: 37px; + } + .rightt { + position: absolute; + top: 69px; + right: 26px; + } + .centerbox { + position: absolute; + top: 52px; + left: 145px; + font-size: 20px; + font-weight: 700; + //line-height: 36px; + } + .centermain { + color: rgba(135, 139, 146, 1); + font-size: 14px; + position: absolute; + left: 144px; + bottom: 49px; + } + } + } + .stagemess { + display: flex; + margin-left: 38px; + .stage1 { + width: 100px; + height: 33px; + text-align: center; + line-height: 34px; + border-radius: 6px; + color: #ffffff; + font-size: 16px; + background: #4ea6ff; + margin-right: 10px; + margin-top: 19px; + cursor: pointer; + } + .stage2 { + width: 100px; + height: 33px; + text-align: center; + line-height: 34px; + border-radius: 6px; + border: 1px solid #ebeef3; + color: #000000; + font-size: 16px; + background: #ffffff; + margin-right: 10px; + margin-top: 19px; + cursor: pointer; + } + } + .stagesecond { + display: flex; + margin-left: 39px; + margin-top: 29px; + .staname { + color: #999ba3; + font-size: 14px; + } + .stamess { + color: #4f5156; + font-size: 14px; + } + } + .stagelast { + display: flex; + flex-wrap: wrap; + justify-content: center; + margin-bottom: 55px; + .stagepro { + display: flex; + flex-direction: column; + align-items: center; + margin-top: 55px; + margin-right: 120px; + .ant-progress-circle-path { + stroke: #4ea6ff; + } + .ant-progress-text { + color: #4ea6ff; + font-weight: 700; + } + .protext { + color: #6d7584; + font-size: 14px; + margin-top: 25px; + } + } + .proright { + width: 500px; + margin-top: 55px; + margin-left: 50px; + .ant-progress-bg { + height: 24px !important; + background: #4ea6ff; + } + .ant-progress-inner { + height: 24px; + } + .pronub { + color: #4ea6ff; + font-size: 14px; + margin: 5px 0; + } + .proright1 { + display: flex; + justify-content: right; + .textpro { + color: #6d7584; + font-size: 14px; + margin-right: 20px; + } + .ant-progress-text { + color: #4ea6ff; + font-size: 14px; + font-weight: 700; + } + } + } + } + .sametab { + // margin-left: 30px; + // margin-right: 30px; + margin-top: 30px; + width: 100%; + // background-color: green; + .Lhead { + display: flex; + .btns { + display: flex; + margin-left: 20px; + // flex-wrap: wrap; + .btn { + padding: 0px 26px 0px 26px; + height: 38px; + background: rgba(64, 158, 255, 0); + border-radius: 8px; + border: 1px solid rgba(64, 158, 255, 1); + display: flex; + align-items: center; + justify-content: center; + margin-right: 14px; + flex-shrink: 0; + cursor: pointer; + .search { + background-size: 100%; + } + .btnText { + font-size: 14px; + font-weight: 400; + color: rgba(64, 158, 255, 1); + line-height: 36px; + margin-left: 5px; + } + } + .btn1 { + .search { + width: 15px; + height: 17px; + background-image: url("../../assets/images/courseManage/search1.png"); + } + } + .btn2 { + .search { + width: 16px; + height: 18px; + background-image: url("../../assets/images/courseManage/reset1.png"); + } + } + .btn3 { + margin-right: 0px; + .search { + width: 17px; + height: 18px; + background-image: url("../../assets/images/courseManage/add1.png"); + } + } + .btn1:hover { + background: rgba(64, 158, 255, 1); + .search { + background-image: url("../../assets/images/courseManage/search0.png"); + } + .btnText { + color: #ffffff; + } + } + .btn2:hover { + background: rgba(64, 158, 255, 1); + .search { + background-image: url("../../assets/images/courseManage/reset0.png"); + } + .btnText { + color: #ffffff; + } + } + .btn3:hover { + background: rgba(64, 158, 255, 1); + .search { + background-image: url("../../assets/images/courseManage/add0.png"); + } + .btnText { + color: #ffffff; + } + } + } + } + .Lbom { + position: relative; + margin-bottom: 20px; + .item { + width: 100%; + height: 200px; + // background-color: green; + margin-top: 40px; + border-radius: 8px; + border: 1px solid #f0f4fe; + .itemhead { + height: 50px; + width: 100%; + background-color: #f0f4fe; + display: flex; + align-items: center; + position: relative; + .lev { + margin-left: 27px; + margin-right: 16px; + line-height: 100%; + color: #409eff; + font-size: 16px; + } + .lin { + width: 1px; + height: 35%; + background-color: #c7cbd2; + } + .nam { + margin-left: 16px; + color: #4f5156; + line-height: 100%; + font-size: 16px; + } + .count { + position: absolute; + line-height: 100%; + color: #4f5156; + font-size: 14px; + right: 40px; + span:nth-child(2) { + color: #63ca8c; + } + } + } + .itembomm { + display: flex; + align-items: center; + height: 150px; + .it { + // margin-left: 110px; + // margin-right: 110px; + width: 13%; + text-align: center; + .on { + font-size: 30px; + } + .ittext { + color: #4f5156; + margin-top: 16px; + margin-left: -5px; + } + } + .linee { + background-color: #ecf2fb; + width: 1px; + height: 55%; + } + .itright { + position: absolute; + right: 45px; + display: flex; + .te { + color: #4ea6ff; + font-size: 14px; + cursor: pointer; + } + .more { + position: relative; + height: 30px; + display: flex; + .moreArrow { + width: 13px; + height: 7px; + display: inline-block; + background-image: url("../../assets/images/navtop/down.png"); + background-size: 100%; + margin: 2px; + margin-left: 7px; + margin-top: 6px; + } + .moreItems { + width: 80px; + height: 70px; + display: none; + background: #ffffff; + box-shadow: 2px 3px 9px 3px rgba(0, 0, 0, 0.05); + border-radius: 3px; + border: 0px solid #dcdcdc; + position: absolute; + left: 0px; + top: 20px; + z-index: 100; + .roleItem { + font-size: 14px; + font-weight: 400; + color: rgba(79, 81, 86, 1); + line-height: 36px; + display: flex; + justify-content: center; + cursor: pointer; + } + .roleItem:hover { + color: #4ea6ff; + } + } + } + .more:hover .moreArrow { + background-image: url("../../assets/images/navtop/up.png"); + } + .more:hover .moreItems { + display: block; + } + } + } + + .show { + color: blue; + } + .noshow { + display: none; + } + } + .create { + margin-top: 40px; + .taskbox { + width: 412px; + height: 160px; + border-radius: 10px; + position: relative; + // margin-left: 68px; + margin-bottom: 40px; + cursor: pointer; + .leftt { + position: absolute; + top: 18px; + left: 0; + } + .photo { + position: absolute; + top: 42px; + left: 37px; + } + .rightt { + position: absolute; + top: 69px; + right: 26px; + } + .centerbox { + position: absolute; + top: 52px; + left: 145px; + font-size: 20px; + font-weight: 700; + //line-height: 36px; + } + .centermain { + color: rgba(135, 139, 146, 1); + font-size: 14px; + position: absolute; + left: 144px; + bottom: 49px; + } + } + } + } + } .cont { display: flex; @@ -1206,270 +1855,6 @@ export default { width: 40px; // background-color: red; } - .sametab { - // margin-left: 30px; - // margin-right: 30px; - margin-top: 30px; - width: 100%; - // background-color: green; - .Lhead { - display: flex; - .btns { - display: flex; - margin-left: 20px; - // flex-wrap: wrap; - .btn { - padding: 0px 26px 0px 26px; - height: 38px; - background: rgba(64, 158, 255, 0); - border-radius: 8px; - border: 1px solid rgba(64, 158, 255, 1); - display: flex; - align-items: center; - justify-content: center; - margin-right: 14px; - flex-shrink: 0; - cursor: pointer; - .search { - background-size: 100%; - } - .btnText { - font-size: 14px; - font-weight: 400; - color: rgba(64, 158, 255, 1); - line-height: 36px; - margin-left: 5px; - } - } - .btn1 { - .search { - width: 15px; - height: 17px; - background-image: url("../../assets/images/courseManage/search1.png"); - } - } - .btn2 { - .search { - width: 16px; - height: 18px; - background-image: url("../../assets/images/courseManage/reset1.png"); - } - } - .btn3 { - margin-right: 0px; - .search { - width: 17px; - height: 18px; - background-image: url("../../assets/images/courseManage/add1.png"); - } - } - .btn1:hover { - background: rgba(64, 158, 255, 1); - .search { - background-image: url("../../assets/images/courseManage/search0.png"); - } - .btnText { - color: #ffffff; - } - } - .btn2:hover { - background: rgba(64, 158, 255, 1); - .search { - background-image: url("../../assets/images/courseManage/reset0.png"); - } - .btnText { - color: #ffffff; - } - } - .btn3:hover { - background: rgba(64, 158, 255, 1); - .search { - background-image: url("../../assets/images/courseManage/add0.png"); - } - .btnText { - color: #ffffff; - } - } - } - } - .Lbom { - position: relative; - margin-bottom: 20px; - .item { - width: 100%; - height: 200px; - // background-color: green; - margin-top: 40px; - border-radius: 8px; - border: 1px solid #f0f4fe; - .itemhead { - height: 50px; - width: 100%; - background-color: #f0f4fe; - display: flex; - align-items: center; - position: relative; - .lev { - margin-left: 27px; - margin-right: 16px; - line-height: 100%; - color: #409eff; - font-size: 16px; - } - .lin { - width: 1px; - height: 35%; - background-color: #c7cbd2; - } - .nam { - margin-left: 16px; - color: #4f5156; - line-height: 100%; - font-size: 16px; - } - .count { - position: absolute; - line-height: 100%; - color: #4f5156; - font-size: 14px; - right: 40px; - span:nth-child(2) { - color: #63ca8c; - } - } - } - .itembomm { - display: flex; - align-items: center; - height: 150px; - .it { - // margin-left: 110px; - // margin-right: 110px; - width: 13%; - text-align: center; - .on { - font-size: 30px; - } - .ittext { - color: #4f5156; - margin-top: 16px; - margin-left: -5px; - } - } - .linee { - background-color: #ecf2fb; - width: 1px; - height: 55%; - } - .itright { - position: absolute; - right: 45px; - display: flex; - .te { - color: #4ea6ff; - font-size: 14px; - cursor: pointer; - } - .more { - position: relative; - height: 30px; - display: flex; - .moreArrow { - width: 13px; - height: 7px; - display: inline-block; - background-image: url("../../assets/images/navtop/down.png"); - background-size: 100%; - margin: 2px; - margin-left: 7px; - margin-top: 6px; - } - .moreItems { - width: 80px; - height: 70px; - display: none; - background: #ffffff; - box-shadow: 2px 3px 9px 3px rgba(0, 0, 0, 0.05); - border-radius: 3px; - border: 0px solid #dcdcdc; - position: absolute; - left: 0px; - top: 20px; - z-index: 100; - .roleItem { - font-size: 14px; - font-weight: 400; - color: rgba(79, 81, 86, 1); - line-height: 36px; - display: flex; - justify-content: center; - cursor: pointer; - } - .roleItem:hover { - color: #4ea6ff; - } - } - } - .more:hover .moreArrow { - background-image: url("../../assets/images/navtop/up.png"); - } - .more:hover .moreItems { - display: block; - } - } - } - - .show { - color: blue; - } - .noshow { - display: none; - } - } - .create { - margin-top: 40px; - .taskbox { - width: 412px; - height: 160px; - border-radius: 10px; - position: relative; - // margin-left: 68px; - margin-bottom: 40px; - cursor: pointer; - .leftt { - position: absolute; - top: 18px; - left: 0; - } - .photo { - position: absolute; - top: 42px; - left: 37px; - } - .rightt { - position: absolute; - top: 69px; - right: 26px; - } - .centerbox { - position: absolute; - top: 52px; - left: 145px; - font-size: 20px; - font-weight: 700; - //line-height: 36px; - } - .centermain { - color: rgba(135, 139, 146, 1); - font-size: 14px; - position: absolute; - left: 144px; - bottom: 49px; - } - } - } - } - } } .xwid { // width: 100%;