Merge branch 'master' of ssh://gitlab.dongwu-inc.com:10022/BOE/fe-manage

README.md

@@ -44,6 +44,8 @@ LevelAddDetail.vue:创建关卡页面
 ```
 ProjectManage.vue:项目页面
 ProjectAdd.vue:创建项目页面
+TaskPage.vue:任务页面
+TaskAdd.vue:创建任务页面
 TemplateLibrary.vue:模板页面
 
 ```
@@ -68,6 +70,7 @@ ExaminationCenter.vue:考试中心页面
 ```
 ResearchManage.vue:调研管理页面
 ResearchAdd.vue:创建调研页面
+ManagePage:调研管理-管理页面
 
 ```
 

src/assets/scss/common.scss

@@ -210,7 +210,11 @@ display: none;
     overflow-x: scroll;
     display: flex;
     flex-direction: column;
-    
+    height: 100%;
+		.contentMain {
+      flex: 1;
+			overflow-y: scroll;
+		}
    
 	}}
 	//抽屉--------------------------------------------------------

src/views/learningpath/LearningPath.vue

@@ -137,8 +137,22 @@
               @click="chooseImg(item.id)"
               v-for="item in imgData"
               :key="item.key"
+              style="
+                border-radius: 8px;
+                width: 136px;
+                height: 106px;
+                background-size: 100%;
+                background-repeat: no-repeat;
+              "
+              :style="{
+                border:
+                  learnPathBg === item.id
+                    ? '2px solid rgba(78, 166, 255, 1)'
+                    : '2px solid rgba(78, 166, 255, 0)',
+                'background-image': 'url(' + item.source + ')',
+              }"
             >
-              <img class="im" :src="item.source" />
+              <!-- <img class="im" :src="item.source" /> -->
             </div>
           </div>
         </div>
@@ -245,6 +259,7 @@ export default {
           source: require("../../assets/images/leveladd/3.png"),
         },
       ],
+      learnPathBg: null, //选择的路径图背景
       currentPage: 1,
       tableDataTotal: 100,
       pageSize: 10,
@@ -371,6 +386,7 @@ export default {
     };
     const chooseImg = (id) => {
       console.log(id);
+      state.learnPathBg = id;
     };
     const getTableDate = () => {
       let data = state.tableData;

src/views/learningpath/LevelAdd.vue

@@ -48,7 +48,7 @@
             <div class="sametab">
               <div class="Lhead">
                 <a-input
-                  v-model:value="value"
+                  v-model:value="gatename"
                   style="width: 270px; height: 40px; border-radius: 8px"
                   placeholder="关卡名称"
                 />
@@ -268,6 +268,7 @@ export default {
   methods: {},
   setup() {
     const state = reactive({
+      gatename: null, //关卡名称
       projectNameList: [
         {
           id: 1,
@@ -354,7 +355,7 @@ export default {
   },
 };
 </script>
-<style scoped lang="scss">
+<style lang="scss">
 .clearfix:before,
 .clearfix:after {
   content: " ";
@@ -513,6 +514,11 @@ export default {
       margin-top: 10px;
       // margin-left: 10px;
     }
+    .ant-tabs > .ant-tabs-nav,
+    .ant-tabs > div > .ant-tabs-nav {
+      margin-left: 0px !important;
+      padding-left: 32px !important;
+    }
     .cont {
       display: flex;
       .pad {

src/views/learningpath/LevelAddDetail.vue

@@ -247,6 +247,11 @@
               :scroll="{ x: 1500, y: 300 }"
               @expand="expandTable"
               :pagination="false"
+              :row-selection="{
+                columnWidth: '40px',
+                selectedRowKeys: selectedRowKeys,
+                onChange: onSelectChange,
+              }"
             />
             <!-- :pagination= showSizeChanger: true, showQuickJumper: true,
       hideOnSinglePage: true, pageSizeOptions: [], pageSize: pageSize, current:
@@ -374,16 +379,11 @@ export default {
       projectNameList2: [
         {
           id: 1,
-          value: "批量操作",
-          label: "批量操作",
-        },
-        {
-          id: 2,
           value: "删除任务",
           label: "删除任务",
         },
         {
-          id: 3,
+          id: 2,
           value: "移动任务到关卡",
           label: "移动任务到关卡",
         },
@@ -556,6 +556,7 @@ export default {
       tableDataTotal: 100,
       pageSize: 10,
       visible: false,
+      selectedRowKeys: [],
     });
     const selectProjectName = (value, index) => {
       console.log("value", value, index);
@@ -576,18 +577,29 @@ export default {
           dataIndex: "state",
           // width: "30%",
           key: "state",
-          width: 90,
+          width: 40,
-          align: "center",
+          align: "left",
-          className: "h",
+          className: "classify",
           scopedSlots: { customRender: "action" }, //引入的插槽
           customRender: (text) => {
-            console.log(text.record.checked1);
+            // console.log(text.record.checked1);
             return (
               <div class="racona">
-                <div class="img"></div>
+                <div
-                <a-checkbox class="ch" v-model:checked={text.record.checkedd}>
+                  class="img"
+                  style={{ cursor: "pointer" }}
+                  onClick={() => {
+                    console.log("点击了");
+                  }}
+                ></div>
+                <span> {text.record.lei}</span>
+
+                {/**
+								<div class="img"></div>
+                <a-checkbox class="ch" checked={text.record.checkedd}>
                   {text.record.lei}
                 </a-checkbox>
+*/}
               </div>
             );
           },
@@ -610,15 +622,19 @@ export default {
           className: "h",
           scopedSlots: { customRender: "action" }, //引入的插槽
           customRender: (text) => {
-            console.log(text.record.checked1);
+            // console.log(text.record.checked1);
             return (
               <div class="opat">
                 <div class="opacationt clearfix">
                   <a-switch
                     style="margin-left:-50px;margin-top:3px"
-                    v-model:checked={text.record.checked1}
+                    checked={text.record.checked1}
                     size="small"
                     active-color="red"
+                    onClick={() => {
+                      console.log("点击了");
+                      text.record.checked1 = !text.record.checked1;
+                    }}
                   />
                   <div class="showt clearfix">
                     <div
@@ -669,6 +685,11 @@ export default {
       return columns;
     };
 
+    const onSelectChange = (selectedRowKeys) => {
+      console.log("selectedRowKeys changed: ", selectedRowKeys);
+      state.selectedRowKeys = selectedRowKeys;
+    };
+
     return {
       ...toRefs(state),
       selectProjectName,
@@ -677,12 +698,13 @@ export default {
       showDrawer,
       afterVisibleChange,
       drawercolumns,
+      onSelectChange,
     };
   },
 };
 </script>
 
-<style  lang="scss" >
+<style lang="scss">
 .clearfix:after,
 .clearfix:before {
   content: " ";
@@ -1103,6 +1125,21 @@ export default {
           }
         }
         .tableBox {
+          .classify {
+            margin-left: 10px !important;
+            padding-left: 9px !important;
+          }
+          .ant-checkbox-wrapper {
+            align-items: center;
+            margin-top: -2px;
+          }
+          .ant-table-selection-column {
+            padding: 0px !important;
+            padding-left: 68px !important;
+          }
+          .ant-table-thead > tr > th {
+            background-color: rgba(239, 244, 252, 1);
+          }
           // margin: 20px 38px 30px;
           th.h {
             background-color: #eff4fc !important;
@@ -1186,18 +1223,20 @@ export default {
     // background-color: #bfa;
     display: flex;
     align-items: center;
-    justify-content: center;
+    // justify-content: center;
     height: 100%;
     .img {
-      margin-left: -40px;
+      // margin-left: -40px;
-      margin-top: -2px;
+      // margin-top: -2px;
       width: 17px;
       height: 14px;
       background-image: url("../../assets/images/leveladd/z1.png");
+      position: absolute;
+      left: -47px;
     }
     .ch {
       margin-left: 10px;
     }
   }
 }
-</style>
+</style>

src/views/projectcenter/TaskPage.vue

@@ -5,29 +5,488 @@
         <div class="box">
             <img src="../../assets/images/projectadd/picture.png"/>
         </div>
+        <div class="imgfor">
+            <div class="forz">管理者进阶-腾飞班</div>
+            <div class="fort">项目经理：黄华/刘俊</div>
+            <div class="fort">起止时间：2022-07-21 00:00至2020-10-21 00:00</div>
+        </div>
+        <div class="right">
+            <div class="end">
+                <div style="margin-top: 20px;margin-left: 10px">
+                    <img class="endimg" src="../../assets/images/projectadd/ending.png"/>
+                    <span class="endtext">结束项目</span>
+                </div>             
+            </div>
+            <div class="end">
+                <div style="margin-top: 20px;margin-left: 10px">
+                    <img class="endimg" src="../../assets/images/leveladd/more.png"/>
+                    <div class="tableSelect" style="margin-left: 10px;margin-right: 20px">
+                  <a-select
+                    style="width: 50px; color: #7096E3"
+                    value="更多"
+                    dropdownClassName="tabledropdown"
+                  >
+                    <a-select-option value="撤回" label="撤回">
+                      <div>撤回</div>
+                    </a-select-option>
+                    <a-select-option value="复制" label="复制">
+                      <div>复制</div>
+                    </a-select-option>
+                    <a-select-option value="存为模板" label="存为模板">
+                      <div>存为模板</div>
+                    </a-select-option>
+                  </a-select>
+                </div>
+                </div>
+            </div>
+            <div class="end">
+                 <div style="margin-top: 20px;margin-left: 10px;margin-right:30px">
+                    <img class="ending" src="../../assets/images/leveladd/back.png" />
+                    <span class="endtext" style="color:#4EA6FF">返回</span>
+                </div>
+            </div>
+        </div>
     </div>
     <div class="split"></div>
-    <div>2</div>
+    <div class="content">
+        <a-tabs class="tab"
+            v-model:activeKey="activeKey"
+            size="large"
+            :tabBarStyle="{ marginLeft: '10px' }">
+            <a-tab-pane key="1" tab="概览">Content of Tab Pane 1</a-tab-pane>
+            <a-tab-pane key="2" tab="任务" force-render>
+                <div class="onerow">
+                    <div class="taskmain">任务大纲</div>
+                    <button class="btn">批量面授报名</button>
+                    <div class="edit">
+                        <img class="editimg" src="../../assets/images/projectadd/edit.png"/>
+                        <span class="editext">编辑</span>
+                    </div>
+                </div>
+                <div class="stage">
+                    <span class="stageimg"><img src="../../assets/images/projectadd/close.png"/></span>
+                    <span class="stagename">阶段1腾飞班阶级1</span>
+                </div>
+                <div class="course">
+                    <div class="first">
+                        <div class="icon"><img src="../../assets/images/leveladd/zai.png"/></div>
+                        <div>
+                            <div class="iconame">「在线」</div>
+                            <div class="icontext">时间管理</div>
+                        </div>
+                    </div>
+                    <div class="type">
+                        <div class="typename">选修</div>
+                    </div>
+                    <div class="time">
+                        <div class="timetext">开始时间</div>
+                        <div class="timetext">2022-09-16 14:03</div>
+                    </div>
+                    <div class="progress">
+                        <div class="progresstext">25/50人</div>
+                        <div style="display: flex">
+                            <a-progress :showInfo="false" :percent="50" strokeColor="#FFC067" trailColor="rgba(253, 209, 98, 0.2)"/>
+                            <span class="progresstext" style="margin-left: 10px">50%</span>
+                        </div>
+                    </div>
+                    <div class="operations">
+                       
+                        <div class="operation">管理</div>
+                        
+                    </div>
+                </div>
+                <div class="course">
+                    <div class="first">
+                        <div class="icon"><img src="../../assets/images/leveladd/zhi.png"/></div>
+                        <div>
+                            <div class="iconame">「直播」</div>
+                            <div class="icontext">管理直播间</div>
+                        </div>
+                    </div>
+                    <div class="type">
+                        <div class="typename1">必修</div>
+                    </div>
+                    <div class="time">
+                        <div class="timetext">开始时间</div>
+                        <div class="timetext">2022-09-16 14:03</div>
+                    </div>
+                    <div class="progress">
+                        <div class="progresstext">0/50人</div>
+                        <div style="display: flex">
+                            <a-progress :showInfo="false" :percent="0" strokeColor="#FFC067" trailColor="rgba(253, 209, 98, 0.2)"/>
+                            <span class="progresstext" style="margin-left: 10px">0%</span>
+                        </div>
+                    </div>
+                    <div class="operations">
+                        <div class="operation">考勤</div>
+                        <div class="operation">管理</div>
+                        <div class="operation">二维码</div>
+                    </div>
+                </div>
+                <div class="course">
+                    <div class="first">
+                        <div class="icon"><img src="../../assets/images/leveladd/mian.png"/></div>
+                        <div>
+                            <div class="iconame">「面授」</div>
+                            <div class="icontext">管理面授课</div>
+                        </div>
+                    </div>
+                    <div class="type">
+                        <div class="typename">选修</div>
+                    </div>
+                    <div class="time">
+                        <div class="timetext">开始时间</div>
+                        <div class="timetext">2022-09-16 14:03</div>
+                    </div>
+                    <div class="progress">
+                        <div class="progresstext">0/50人</div>
+                        <div style="display: flex">
+                            <a-progress :showInfo="false" :percent="0" strokeColor="#FFC067" trailColor="rgba(253, 209, 98, 0.2)"/>
+                            <span class="progresstext" style="margin-left: 10px">0%</span>
+                        </div>
+                    </div>
+                    <div class="operations">
+                        <div class="operation">学员</div>
+                        <div class="operation">管理</div>
+                        <div class="operation">二维码</div>
+                    </div>
+                </div>
+                <div class="course">
+                    <div class="first">
+                        <div class="icon"><img src="../../assets/images/leveladd/huo.png"/></div>
+                        <div>
+                            <div class="iconame">「活动」</div>
+                            <div class="icontext">管理活动</div>
+                        </div>
+                    </div>
+                    <div class="type">
+                        <div class="typename1">必修</div>
+                    </div>
+                    <div class="time">
+                        <div class="timetext">开始时间</div>
+                        <div class="timetext">2022-09-16 14:03</div>
+                    </div>
+                    <div class="progress">
+                        <div class="progresstext">0/50人</div>
+                        <div style="display: flex">
+                            <a-progress :showInfo="false" :percent="0" strokeColor="#FFC067" trailColor="rgba(253, 209, 98, 0.2)"/>
+                            <span class="progresstext" style="margin-left: 10px">0%</span>
+                        </div>
+                    </div>
+                    <div class="operations">
+                        <div class="operation">考勤</div>
+                        <div class="operation">管理</div>
+                        <div class="operation">二维码</div>
+                    </div>
+                </div>
+                <div class="course">
+                    <div class="first">
+                        <div class="icon"><img src="../../assets/images/leveladd/zuo.png"/></div>
+                        <div>
+                            <div class="iconame">「作业」</div>
+                            <div class="icontext">管理者作业</div>
+                        </div>
+                    </div>
+                    <div class="type">
+                        <div class="typename">选修</div>
+                    </div>
+                    <div class="time">
+                        <div class="timetext">开始时间</div>
+                        <div class="timetext">2022-09-16 14:03</div>
+                    </div>
+                    <div class="progress">
+                        <div class="progresstext">0/50人</div>
+                        <div style="display: flex">
+                            <a-progress :showInfo="false" :percent="0" strokeColor="#FFC067" trailColor="rgba(253, 209, 98, 0.2)"/>
+                            <span class="progresstext" style="margin-left: 10px">0%</span>
+                        </div>
+                    </div>
+                    <div class="operations">
+                        
+                        <div class="operation">管理</div>
+                        
+                    </div>
+                </div>
+                <div class="course">
+                    <div class="first">
+                        <div class="icon"><img src="../../assets/images/leveladd/kao.png"/></div>
+                        <div>
+                            <div class="iconame">「考试」</div>
+                            <div class="icontext">管理者考试</div>
+                        </div>
+                    </div>
+                    <div class="type">
+                        <div class="typename">选修</div>
+                    </div>
+                    <div class="time">
+                        <div class="timetext">开始时间</div>
+                        <div class="timetext">2022-09-16 14:03</div>
+                    </div>
+                    <div class="progress">
+                        <div class="progresstext">0/50人</div>
+                        <div style="display: flex">
+                            <a-progress :showInfo="false" :percent="0" strokeColor="#FFC067" trailColor="rgba(253, 209, 98, 0.2)"/>
+                            <span class="progresstext" style="margin-left: 10px">0%</span>
+                        </div>
+                    </div>
+                    <div class="operations">
+                        
+                        <div class="operation">管理</div>
+                        
+                    </div>
+                </div>
+                <div class="stage" style="margin-top: 0">
+                    <span class="stageimg"><img src="../../assets/images/projectadd/close.png"/></span>
+                    <span class="stagename">阶段2 腾飞班阶级2</span>
+                </div>
+                <div style="display: flex; height: 20px"></div>
+            </a-tab-pane>
+            <a-tab-pane key="3" tab="学员">Content of Tab Pane 3</a-tab-pane>
+            <a-tab-pane key="4" tab="公告">Content of Tab Pane 3</a-tab-pane>
+            <a-tab-pane key="5" tab="项目积分">Content of Tab Pane 3</a-tab-pane>
+            <a-tab-pane key="6" tab="排行榜">Content of Tab Pane 3</a-tab-pane>
+            <a-tab-pane key="7" tab="设置">Content of Tab Pane 3</a-tab-pane>
+        </a-tabs>
+    </div>
 </div>
 </template>
+<script lang="ts">
+</script>
 <style lang="scss">
 .taskpage {
     width: 100%;
     display: flex;
     flex-direction: column;
+    //position: relative;
     .header {
         width: 100%;
         display: flex;
+        flex-wrap: wrap;
         .box {
             border: 12px solid #E7F2FF;
             margin: 16px 0 16px 19px;
             border-radius: 8px;
+            //float: left;
+        }
+        .imgfor {
+            display: flex;
+            flex: 1;
+            flex-direction: column;
+            margin-top: 38px;
+            margin-left: 15px;
+            //float: left;
+            //position: absolute;
+            //left: 210px;
+            .forz {
+                font-size: 16px;
+                color: #363636;
+                font-weight: 500;
+            }
+            .fort {
+                font-size: 14px;
+                color: #878B92;
+
+            }
+        }
+        .right {
+            display: flex;
+            //position: absolute;
+            //right: 10px;
+            //top: 5px;
+            //float: right;
+            .end {
+                border-left: 1px solid #E8EFFA;
+                height: 82px;
+                margin-top:30px;
+                //width: 113px;
+                .endimg {
+                    width: 42px;
+                    height: 42px;
+                    
+                }
+                .endtext {
+                    font-size: 14px;
+                    color: #57C887;
+                    padding: 7px;
+                }
+                
+            }
+        }
+    }
+    .tableBox {
+    margin: 20px 38px 30px;
+    .ant-table-thead > tr > th {
+      font-size: 14px;
+      font-weight: 400;
+      color: #999ba3;
+      line-height: 36px;
+      padding: 5px 16px;
+      background-color: #eff4fc;
+    }
+    
+    }
+        .split {
+        width: 100%;
+        height: 20px;
+        background-color: #edf0f5;
+    }
+    .content {
+        //display: flex;
+        margin: 0 37px;
+        .onerow {
+            width: 100%;
+            display: flex;
+            height: 40px;
+            position: relative;
+            //margin-top: 5xp;
+            .taskmain {
+                font-size: 18px;
+                color: #000000;
+            }
+            .btn {
+                position: absolute;
+                top: 0;
+                right: 110px;
+                background-color: #409EFF;
+                width: 130px;
+                height: 40px;
+                border-radius: 8px;
+                border: 1px solid #409EFF;
+                color: #FFFFFF;
+                cursor: pointer;
+            }
+            .edit {
+                position: absolute;
+                right: 0;
+                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");
+                }
+            }
+        }
+        .stage {
+            display: flex;
+            height: 49px;
+            background-color: #EFF4FC;
+            align-items: center;
+            margin-top: 20px;
+            .stageimg {
+                margin-left: 31px;
+            }
+            .stagename {
+                color: #409EFF;
+                font-size: 16px;
+                padding-left: 9px;
+                line-height: 36px;
+            }
+        }
+        .course {
+            width: 100%;
+            display: flex;
+            flex-wrap: wrap;
+            align-items: center;
+            padding: 10px;
+            //margin: 0 12px;
+            border: 1px solid #F2F6FC;
+            .first {  
+                //position: relative; 
+                display: flex;
+                flex-grow: 1;
+                align-items: center;
+                //height: 71px;
+                margin-left: 12px;
+                margin-right: 50px;
+                .icon {
+                    //position: absolute;
+                }            
+                .iconame {
+                    //position: absolute;
+                    color: #4F5156;
+                    font-size: 16px;
+                }
+                .icontext {
+                    //positipn: absolute;
+                    color: #999BA3;
+                    font-size: 14px;
+                    margin-left: 8px;
+                    width: 83px;
+                }
+            }
+            .type {
+                //height: 71px;
+                display: flex;
+                flex-grow: 1;
+                align-items: center;
+                margin-right: 50px;
+                .typename {
+                    width: 63px;
+                    height: 23px;
+                    color: #5DC988;
+                    font-size: 14px;
+                    background-color: #F2F6FC;
+                    border-radius: 4px;
+                    text-align: center;
+                }
+                .typename1 {
+                    width: 63px;
+                    height: 23px;
+                    color: #F0F4FE;
+                    font-size: 14px;
+                    background-color: #5DC988;
+                    border-radius: 4px;
+                    text-align: center;
+                }
+            }
+            .time {
+                //height: 71px; 
+                flex-grow: 1;
+                margin-right: 50px;
+                .timetext {
+                    font-size: 14px;
+                    color: #999BA3;
+                }
+            }
+            .progress {
+                width: 168px;
+                margin-right: 50px;
+                flex-grow: 1;
+                .progresstext {
+                    color: #FFC067;
+                    font-size: 14px;
+                }
+            }
+            .operations {
+                display: flex;
+                width: 200px;
+                //flex-grow: 1;
+                .operation {
+                    color: #4EA6FF;
+                    font-size: 14px;
+                    padding: 10px;
+                    margin-left: auto;
+                }
+            }
         }
     }
-    .split {
-    width: 100%;
-    height: 20px;
-    background-color: #edf0f5;
-  }
 }
 </style>

src/views/research/ResearchAdd.vue

@@ -278,6 +278,7 @@
         margin-bottom: 14px;
         .btn {
             display: flex;
+            margin-bottom: 20px;
             justify-content: center;
             cursor: pointer;
         }