From 54fa86f8075c1af2a8a74d2a37f59e8be0fdefc6 Mon Sep 17 00:00:00 2001 From: dongwug Date: Wed, 12 Oct 2022 18:32:11 +0800 Subject: [PATCH] =?UTF-8?q?feat:=E4=BF=AE=E6=94=B9=E7=A1=AE=E5=AE=9A?= =?UTF-8?q?=E5=85=8D=E5=8F=97=E5=BC=B9=E7=AA=97=E6=A0=B7=E5=BC=8F=E5=92=8C?= =?UTF-8?q?=E5=8A=A0=E8=BD=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/courselibrary/CoursewareManage.vue | 823 ++++++++++++------- 1 file changed, 503 insertions(+), 320 deletions(-) diff --git a/src/views/courselibrary/CoursewareManage.vue b/src/views/courselibrary/CoursewareManage.vue index 63ce8758..30016243 100644 --- a/src/views/courselibrary/CoursewareManage.vue +++ b/src/views/courselibrary/CoursewareManage.vue @@ -179,196 +179,306 @@
-
+
-
+ + +
+
+ + 新建面授课 +
+
+
-
-
-
课程命名规则
-
-
- 收起 -
-
- 展开 -
-
-
-
-
- - 1、课程名称统一不加书名号。
- 2、项目名称、属地等信息如需体现在课程名称中，请放在课程名称信息 - 之后，如“时间管理（GROW180项目）”或“时间管理（B*）”确保首先 - 看到的是课程内容主题。
- 3、同一课程如先后有多个版本，原则上仅开放最新版本，旧版本应停用 - 版本如必须以年份标明，请以“沟通技巧（2022年）”的方式呈现。 - -
-
-
-
- ⃰ - 封面图 -
- - avatar -
- - -
Upload
+
+
课程信息
+
+
+
+
+ + 课程名称
- +
+
+ +
+
+
+
+
+
+
课程命名规则
+
+
+ 收起 +
+
+ 展开 +
+
+
+
+
+ + 1、课程名称统一不加书名号。
+ 2、项目名称、属地等信息如需体现在课程名称中，请放在课程名称信息 + 之后，如“时间管理（GROW180项目）”或“时间管理（B*）”确保首先 + 看到的是课程内容主题。
+ 3、同一课程如先后有多个版本，原则上仅开放最新版本，旧版本应停用 + 版本如必须以年份标明，请以“沟通技巧（2022年）”的方式呈现。 + +
+
+
+
+
+ + 封面图 +
+
+
+ + avatar +
+ + +
Upload
+
+ +
+
+ 高宽比为16:9 (如:800*450) png或jpg图片 +
+
+
+
+
+ + 目标人群 +
+
+
+ +
+
+
+
+
+ + 课程价值 +
+
+
+ +
+
+
+
+
+ + 内容分类 +
+
+
+ +
+
+
+
+
+ 场景 +
+
+
+ +
+
+
+
+
+ 内容标签 +
+
+
+ +
+
+
+
+
+ Tag 2 + Prevent Default +
+
+
+
+
+
+ + 授课教师 +
+
+
+ +
+
+
+
+
+ 课程简介 +
+
+
+ +
+
+
+
+
+ 附件 +
+
+
+ + 添加附件 +
+
+
+
+
+
+
+
图片1.png
+
152.77K
+
+
删除
+
+
+
+
+
图片2.png
+
+
+
+
上传成功
+
+
100%
+
+
+
删除
+
+
+
+
+
图片2.png
+
+
+
+
上传失败
+
+
80%
+
+
+
重传 取消
+
+
+
+
+
图片2.png
+
+
+
+
正在上传
+
+
60%
+
+
+
暂停 取消
+
+
-
- 高宽比为16:9 (如:800*450) png或jpg图片 -
-
- ⃰ - 目标人群 -
- -
-
-
- 课程价值 -
- -
-
-
- ⃰ - 内容分类 -
- -
-
-
- 场景 -
- -
-
-
-
- 内容标签 -
- -
-
-
- Tag 2 - Prevent Default -
-
-
-
-
- ⃰ - 授课教师 -
- -
-
-
- 课程简介 -
- -
-
-
-
- 附件 -
- 添加附件 -
-
-
-
+
@@ -1567,7 +1677,7 @@ export default defineComponent({ of_hs: false, hideshow: true, bs_hs: true, - ft_hs:false, + ft_hs:true, om_1: false, ftm_1:false, om_ckxq: false, @@ -2525,7 +2635,7 @@ export default defineComponent({ .faceteach { z-index: 999; - width: 85%; + width: 90%; min-width: 1000px; background: #ffffff; box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21); @@ -2533,148 +2643,42 @@ export default defineComponent({ left: 50%; top: 50%; transform: translate(-50%, -50%); - .ft_header { - position: absolute; - width: calc(100%); - height: 40px; - background: linear-gradient( - rgba(78, 166, 255, 0.2) 0%, - rgba(78, 166, 255, 0) 100% - ); - } + // .ft_header { + // position: absolute; + // width: calc(100%); + // height: 40px; + // background: linear-gradient( + // rgba(78, 166, 255, 0.2) 0%, + // rgba(78, 166, 255, 0) 100% + // ); + // } .ft_main { width: calc(100%); position: relative; - .m_header { - display: flex; - align-items: center; - padding-top: 20px; - padding-left: 26px; - font-size: 16px; - .add_icon { - width: 16px; - height: 16px; - margin-right: 10px; - background-image: url(@/assets/images/coursewareManage/add1.png); - background-size: 100% 100%; - } - .close_exit { - position: absolute; - right: 42px; - cursor: pointer; - width: 20px; - height: 20px; - background-image: url(@/assets/images/coursewareManage/close.png); - background-size: 100% 100%; - } - } - .m_title { - margin: 7px auto 25px 52px; - } - .m_body { - display: flex; - height: 500px; - overflow: auto; - .mb_left { - .mbl_items1 { - display: flex; - align-items: center; - margin-left: 87px; - margin-bottom: 10px; - } - .mbl_items2 { - margin-left: 164px; - margin-bottom: 30px; - .i2_top { - display: flex; - .i2_right { - margin-left: 320px; - display: flex; - } - } - .i2_detail { - width: 400px; - } - } - .mbl_items3 { - margin-left: 87px; - margin-bottom: 10px; - .i3_top { - display: flex; - align-items: start; - } - .i3_bottom { - margin-left: 60px; - } - } - .mbl_items4 { - display: flex; - align-items: center; - margin-left: 87px; - margin-bottom: 10px; - } - .mbl_items5 { - display: flex; - align-items: center; - margin-left: 93px; - margin-bottom: 10px; - } - .mbl_items6 { - display: flex; - align-items: center; - margin-left: 87px; - margin-bottom: 10px; - } - .mbl_items7 { - display: flex; - align-items: center; - margin-left: 121px; - margin-bottom: 10px; - } - .mbl_items8 { - margin-left: 93px; - margin-bottom: 10px; - .i8_top { - display: flex; - align-items: center; - margin-bottom: 10px; - } - .i8_bottom { - display: flex; - align-items: center; - margin-left: 71px; - } - } - } - .mb_right { - .mbl_items9 { - display: flex; - align-items: center; - margin-left: 100px; - margin-bottom: 10px; - } - .mbl_items10 { - display: flex; - align-items: flex-start; - margin-left: 107px; - margin-bottom: 30px; - } - .mbl_items11 { - margin-left: 105px; - margin-bottom: 10px; - .i11_top { - display: flex; - align-items: center; - .accessory_icon { - width: 15px; - height: 15px; - background-image: url(@/assets/images/coursewareManage/enclosure.png); - margin-right: 6px; - } - } - } - } - } + // .m_header { + // display: flex; + // align-items: center; + // padding-top: 20px; + // padding-left: 26px; + // font-size: 16px; + // .add_icon { + // width: 16px; + // height: 16px; + // margin-right: 10px; + // background-image: url(@/assets/images/coursewareManage/add1.png); + // background-size: 100% 100%; + // } + // .close_exit { + // position: absolute; + // right: 42px; + // cursor: pointer; + // width: 20px; + // height: 20px; + // background-image: url(@/assets/images/coursewareManage/close.png); + // background-size: 100% 100%; + // } + // } + } } @@ -3544,4 +3548,183 @@ export default defineComponent({ } } } + + + +.modalStyle { + .ant-modal{ + .modalHeader { + display: flex; + align-items: center; + justify-content: space-between; + .headerLeft { + margin-left: 27px; + display: flex; + align-items: center; + .headerLeftText { + font-size: 16px; + font-weight: 400; + color: #000000; + line-height: 36px; + } + } + } + .modalMain{ + .m_title { + margin: 7px auto 25px 32px; + } + .m_body { + display: flex; + .mb_left { + width: 50%; + .mbl_items { + display: flex; + align-items: center; + margin-bottom: 10px; + .item_nam{ + width: 100px; + display: flex; + align-items: center; + justify-content: flex-end; + .asterisk_icon{ + width: 10px; + height: 10px; + margin-right: 5px; + } + } + .item_inp{ + flex:1; + } + .i2_cz{ + width:440px; + margin-left:100px; + .i2_top{ + display:flex; + justify-content: space-between; + } + } + .i8_bottom{ + display:flex; + width:440px; + margin-left:100px; + } + } + + } + .mb_right { + width: 50%; + .mbl_items { + display: flex; + align-items: center; + margin-bottom: 10px; + .item_nam{ + width: 100px; + display: flex; + align-items: center; + justify-content: flex-end; + .asterisk_icon{ + width: 10px; + height: 10px; + margin-right: 5px; + } + } + .item_inp{ + flex:1; + } + .accessory{ + display:flex; + align-items: center; + .accessory_icon{ + width:16px; + height:16px; + margin-right:5px; + } + } + } + .mbl_items12{ + width:440px; + margin-left:100px; + .i12_box1{ + display: flex; + align-items: center; + padding:17px 0px 17px 21px; + border: 1px solid #EFF4FC; + border-radius: 8px; + margin-bottom:10px; + .file_img{ + width:27px; + height:32px; + background-color: red; + margin-right:22px; + } + .file_detail{ + width:250px; + margin-right:21px; + .file_updata{ + display:flex; + align-items: center; + .updatabox{ + position: relative; + width: 230px; + height: 5px; + background-color: rgba(192, 192, 192, 0.25); + border-radius: 3px; + .updatacolor{ + position: absolute; + left:0; + width: 100%; + height: 5px; + background-color: #57C887; + border-radius: 3px; + } + .updatacolor2{ + position: absolute; + left:0; + width: 80%; + height: 5px; + background-color: #FF7474; + border-radius: 3px; + } + .updatacolor3{ + position: absolute; + left:0; + width: 60%; + height: 5px; + background-color: #388BE1; + border-radius: 3px; + } + .updataxq{ + position: absolute; + right:2px; + top:-30px; + color: #57C887; + } + .updataxq2{ + position: absolute; + right:2px; + top:-30px; + color: #FF7474; + } + .updataxq3{ + position: absolute; + right:2px; + top:-30px; + color: #388BE1; + } + } + } + .file_operation{ + display: flex; + span{ + cursor: pointer; + } + } + } + } + } + } + } + } + } +}