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

README.md

@@ -36,7 +36,7 @@ See [Configuration Reference](https://cli.vuejs.org/config/).
 LearningPath.vue:学习路径页面
 LevelAdd.vue:关卡页面
 LevelAddDetail.vue:创建关卡页面
-
+LevelCheck.vue查看页面
 ```
 
 ### 二、projectcenter:项目文件夹

src/components/BreadCrumb.vue

@@ -68,6 +68,21 @@ export default {
             },
           ];
         }
+        if (n === "/levelcheck" || n === "/LevelCheck") {
+          state.list = [
+            {
+              name: "学习路径",
+              href: "/learningpath",
+            },
+            {
+              name: "关卡",
+              href: "/leveladd",
+            },
+            {
+              name: "查看",
+            },
+          ];
+        }
         if (n === "/projectmanage" || n === "/ProjectManage") {
           state.list = [
             {
@@ -117,7 +132,7 @@ export default {
             },
             {
               name: "添加任务",
-            }
+            },
           ];
         }
         if (n === "/templatelibrary" || n === "/TemplateLibrary") {

src/components/NavLeft.vue

@@ -258,6 +258,12 @@ export default {
           selectedKeys: "sub1",
           pagename: "关卡",
         },
+        {
+          href: "/levelcheck",
+          openKeys: "sub1",
+          selectedKeys: "sub1",
+          pagename: "查看",
+        },
         {
           href: "/leveladddetail",
           openKeys: "sub1",

src/components/drawers/AddVote.vue

@@ -0,0 +1,246 @@
+<template>
+  <a-drawer
+    :visible="addvoteVisible"
+    class="drawerStyle"
+    style="color: red"
+    width="80%"
+    title="添加投票"
+    placement="right"
+    @after-visible-change="afterVisibleChange"
+  >
+    <div class="drawerMain">
+      <div class="header">
+        <div class="headerTitle">添加投票</div>
+        <img
+          style="width: 29px; height: 29px; cursor: pointer"
+          src="../../assets/images/basicinfo/close.png"
+          @click="closeDrawer"
+        />
+      </div>
+      <div class="contentMain">
+        <!-- 投票名称 -->
+        <div class="vote">
+          <div class="votebox">
+            <img
+              class="voteimg"
+              src="../../assets/images/basicinfo/asterisk.png"
+            />
+            <div class="votename">投票名称：</div>
+          </div>
+          <div style="width: 424px">
+            <a-input v-model:value="value" placeholder="请输入投票名称" />
+          </div>
+        </div>
+        <!-- 投票名称 -->
+        <!-- 创建投票 -->
+        <div class="vote">
+          <div class="votebox">
+            <img
+              class="voteimg"
+              src="../../assets/images/basicinfo/asterisk.png"
+            />
+            <div class="votename">创建投票：</div>
+          </div>
+          <div class="votebtn">创建投票</div>
+        </div>
+        <!-- 创建投票 -->
+        <!-- 起止时间 -->
+        <div class="vote">
+          <div class="votebox">
+            <div class="voteimg"></div>
+            <div class="votename">起止时间：</div>
+          </div>
+          <div class="votedate">
+            <a-range-picker />
+          </div>
+        </div>
+        <!-- 起止时间 -->
+        <!-- 基础投票数 -->
+        <div class="vote" style="align-items: flex-start">
+          <div class="votebox" style="margin-top: 10px">
+            <div class="voteimg"></div>
+            <div class="votename">基础投票数：</div>
+          </div>
+          <div>
+            <div class="votebtn">点击上传</div>
+            <div class="voteclassify">支持：xls.xlsx</div>
+          </div>
+        </div>
+        <!-- 基础投票数 -->
+        <!-- 投票说明 -->
+        <div class="vote" style="align-items: flex-start">
+          <div class="votebox" style="margin-top: 10px">
+            <div class="voteimg"></div>
+            <div class="votename">投票说明：</div>
+          </div>
+          <div style="width: 500px">
+            <a-textarea :rows="4" placeholder="请输入投票说明" :maxlength="6" />
+          </div>
+        </div>
+        <!-- 投票说明 -->
+        <!-- 投票说明 -->
+        <div class="vote" style="align-items: flex-start">
+          <div class="votebox" style="margin-top: 10px">
+            <div class="voteimg"></div>
+            <div class="votename">投票说明：</div>
+          </div>
+          <div style="width: 500px">
+            <a-textarea :rows="4" placeholder="请输入投票说明" :maxlength="6" />
+          </div>
+        </div>
+        <!-- 投票说明 -->
+        <!-- 投票说明 -->
+        <div class="vote" style="align-items: flex-start">
+          <div class="votebox" style="margin-top: 10px">
+            <div class="voteimg"></div>
+            <div class="votename">投票说明：</div>
+          </div>
+          <div style="width: 500px">
+            <a-textarea :rows="4" placeholder="请输入投票说明" :maxlength="6" />
+          </div>
+        </div>
+        <!-- 投票说明 -->
+        <!-- 投票说明 -->
+        <div class="vote" style="align-items: flex-start">
+          <div class="votebox" style="margin-top: 10px">
+            <div class="voteimg"></div>
+            <div class="votename">投票说明：</div>
+          </div>
+          <div style="width: 500px">
+            <a-textarea :rows="4" placeholder="请输入投票说明" :maxlength="6" />
+          </div>
+        </div>
+        <!-- 投票说明 -->
+        <!-- 投票说明 -->
+        <div class="vote" style="align-items: flex-start">
+          <div class="votebox" style="margin-top: 10px">
+            <div class="voteimg"></div>
+            <div class="votename">投票说明：</div>
+          </div>
+          <div style="width: 500px">
+            <a-textarea :rows="4" placeholder="请输入投票说明" :maxlength="6" />
+          </div>
+        </div>
+        <!-- 投票说明 -->
+        <!-- 投票说明 -->
+        <div class="vote" style="align-items: flex-start">
+          <div class="votebox" style="margin-top: 10px">
+            <div class="voteimg"></div>
+            <div class="votename">投票说明：</div>
+          </div>
+          <div style="width: 500px">
+            <a-textarea :rows="4" placeholder="请输入投票说明" :maxlength="6" />
+          </div>
+        </div>
+        <!-- 投票说明 -->
+      </div>
+    </div>
+  </a-drawer>
+</template>
+<script>
+import { reactive, toRefs } from "vue";
+export default {
+  name: "AddVote",
+  props: {
+    addvoteVisible: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  setup(props, ctx) {
+    const state = reactive({});
+    const closeDrawer = () => {
+      ctx.emit("update:addvoteVisible", false);
+    };
+
+    const afterVisibleChange = (bool) => {
+      console.log("state", bool);
+    };
+
+    const showDrawer = () => {
+      state.visible = true;
+    };
+
+    return {
+      ...toRefs(state),
+      afterVisibleChange,
+      showDrawer,
+      closeDrawer,
+      // change,
+    };
+  },
+};
+</script>
+<style lang="scss">
+.addvote {
+}
+.drawerStyle {
+  .drawerMain {
+    .header {
+      height: 73px;
+      border-bottom: 1px solid #e8e8e8;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      .headerTitle {
+        font-size: 18px;
+        font-weight: 600;
+        color: #333333;
+        line-height: 25px;
+        margin-left: 24px;
+      }
+    }
+    .contentMain {
+      .vote {
+        display: flex;
+        align-items: center;
+        margin-top: 32px;
+        margin-left: 20px;
+        .votebox {
+          width: 100px;
+          display: flex;
+          align-items: center;
+          justify-content: flex-end;
+          // background-color: pink;
+          .voteimg {
+            width: 10px;
+            height: 10px;
+            margin-right: 5px;
+          }
+          .votename {
+            font-size: 14px;
+            font-weight: 400;
+            color: #333333;
+            line-height: 20px;
+          }
+        }
+
+        .votebtn {
+          width: 130px;
+          height: 40px;
+          background: #388be1;
+          border-radius: 8px;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          cursor: pointer;
+          font-size: 14px;
+          font-weight: 400;
+          color: #ffffff;
+          line-height: 20px;
+        }
+        .voteclassify {
+          font-size: 14px;
+          font-weight: 400;
+          color: #999999;
+          line-height: 20px;
+          margin-top: 16px;
+        }
+        .ant-picker {
+          width: 424px;
+        }
+      }
+    }
+  }
+}
+</style>

src/views/learningpath/LearningPath.vue

@@ -92,9 +92,9 @@
 
     <a-modal
       :closable="sh"
+      centered="true"
       v-model:visible="out"
       :footer="null"
-      style="margin-top: 400px"
     >
       <div class="out">
         <div class="top">
@@ -572,170 +572,183 @@ export default {
 };
 </script>
 <style lang="scss">
-.out {
+.ant-modal {
-  display: block;
+  width: 680px !important;
-  position: absolute;
+  height: 528px !important;
-  top: 90px;
+  .ant-modal-content {
-  width: 680px;
+    width: 680px !important;
-  // height: 525px;
+    height: 528px !important;
-  background-color: #fff;
+    .ant-modal-body {
-
+      width: 680px !important;
-  box-shadow: 0 0 10px rgba(118, 136, 166, 0.21);
+      height: 528px !important;
-  left: 50%;
+      padding: 0 !important;
-  top: 50%;
+      .out {
-  transform: translate(-50%, -50%);
+        display: block;
-  .top {
+        position: absolute;
-    width: 100%;
+        top: 90px;
-    height: 68px;
+        width: 680px;
-
+        // height: 525px;
-    background: linear-gradient(
-      rgba(78, 166, 255, 0.2) 0%,
-      rgba(78, 166, 255, 0) 100%
-    );
-    display: flex;
-    align-items: center;
-    .topimg {
-      width: 18px;
-      height: 18px;
-      margin-left: 27px;
-      margin-top: -2px;
-    }
-    .topc {
-      color: #000000;
-      font-size: 16px;
-      margin-left: 8px;
-    }
-  }
-  .mid {
-    width: 100%;
-    height: 100%;
-    background-color: #fff;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    .d {
-      // margin-top: 8px;
-      // color: #ff4e4e;
-      margin-left: -5px;
-    }
-    .name {
-      width: 78%;
-      // background-color: lightcoral;
-      display: flex;
-      margin-top: 20px;
-      align-items: center;
-      height: 40px;
-      // border: 1px solid black;
-
-      .inname {
-        color: #6f6f6f;
-        font-size: 14px;
-        margin-left: 7px;
-      }
-      .in {
-        margin-left: 14px;
-        width: 81%;
-        position: relative;
-        .ant-input {
-          border-radius: 5px;
-          // height: 120%;
-          width: 100%;
-          height: 40px;
-        }
-        .showcount {
-          position: absolute;
-          right: 10px;
-          color: #c7cbd2;
-          bottom: 5px;
-        }
-      }
-    }
-    .bac {
-      width: 78%;
-      // background-color: lightcoral;
-      display: flex;
-      margin-top: 30px;
-      // border: 1px solid black;
-      .d {
-        margin-top: 18px;
-        color: #ff4e4e;
-      }
-      .inname {
-        color: #6f6f6f;
-        font-size: 14px;
-        margin-left: 7px;
-        margin-top: 15px;
-      }
-      .in {
-        margin-left: 14px;
-        width: 81%;
-        height: 110px;
-        // background-color: red;
-        display: flex;
-        justify-content: space-between;
-        .im {
-          border-radius: 8px;
-          width: 140px;
-          height: 110px;
-          cursor: pointer;
-        }
-      }
-    }
-    .info {
-      width: 78%;
-      // background-color: lightcoral;
-      display: flex;
-      margin-top: 30px;
-      // align-items: center;
-      // height: 40px;
-      // border: 1px solid black;
-
-      .inname {
-        color: #6f6f6f;
-        font-size: 14px;
-        margin-left: 26px;
-        margin-top: 15px;
-      }
-      .in {
-        margin-left: 14px;
-        width: 81%;
-        position: relative;
-        .ant-input {
-          border-radius: 5px;
-          // height: 120%;
-          width: 100%;
-          height: 130px;
-          resize: none;
-        }
-        .showcount {
-          position: absolute;
-          right: 10px;
-          color: #c7cbd2;
-          bottom: 5px;
-        }
-      }
-    }
-    .btn {
-      width: 33%;
-      margin-top: 30px;
-      display: flex;
-      justify-content: space-between;
-      margin-bottom: 30px;
-      .samtn {
-        width: 100px;
-        height: 40px;
-        font-size: 14px;
-        border: 1px solid #4ea6ff;
-        border-radius: 8px;
-        cursor: pointer;
-      }
-      .btn1 {
         background-color: #fff;
-        color: #4ea6ff;
+
-      }
+        box-shadow: 0 0 10px rgba(118, 136, 166, 0.21);
-      .btn2 {
+        left: 50%;
-        background-color: #4ea6ff;
+        top: 50%;
-        color: #fff;
+        transform: translate(-50%, -50%);
+        .top {
+          width: 100%;
+          height: 68px;
+
+          background: linear-gradient(
+            rgba(78, 166, 255, 0.2) 0%,
+            rgba(78, 166, 255, 0) 100%
+          );
+          display: flex;
+          align-items: center;
+          .topimg {
+            width: 18px;
+            height: 18px;
+            margin-left: 27px;
+            margin-top: -2px;
+          }
+          .topc {
+            color: #000000;
+            font-size: 16px;
+            margin-left: 8px;
+          }
+        }
+        .mid {
+          width: 100%;
+          height: 100%;
+          background-color: #fff;
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+          .d {
+            // margin-top: 8px;
+            // color: #ff4e4e;
+            margin-left: -5px;
+          }
+          .name {
+            width: 78%;
+            // background-color: lightcoral;
+            display: flex;
+            margin-top: 20px;
+            align-items: center;
+            height: 40px;
+            // border: 1px solid black;
+
+            .inname {
+              color: #6f6f6f;
+              font-size: 14px;
+              margin-left: 7px;
+            }
+            .in {
+              margin-left: 14px;
+              width: 81%;
+              position: relative;
+              .ant-input {
+                border-radius: 5px;
+                // height: 120%;
+                width: 100%;
+                height: 40px;
+              }
+              .showcount {
+                position: absolute;
+                right: 10px;
+                color: #c7cbd2;
+                bottom: 5px;
+              }
+            }
+          }
+          .bac {
+            width: 78%;
+            // background-color: lightcoral;
+            display: flex;
+            margin-top: 30px;
+            // border: 1px solid black;
+            .d {
+              margin-top: 18px;
+              color: #ff4e4e;
+            }
+            .inname {
+              color: #6f6f6f;
+              font-size: 14px;
+              margin-left: 7px;
+              margin-top: 15px;
+            }
+            .in {
+              margin-left: 14px;
+              width: 81%;
+              height: 110px;
+              // background-color: red;
+              display: flex;
+              justify-content: space-between;
+              .im {
+                border-radius: 8px;
+                width: 140px;
+                height: 110px;
+                cursor: pointer;
+              }
+            }
+          }
+          .info {
+            width: 78%;
+            // background-color: lightcoral;
+            display: flex;
+            margin-top: 30px;
+            // align-items: center;
+            // height: 40px;
+            // border: 1px solid black;
+
+            .inname {
+              color: #6f6f6f;
+              font-size: 14px;
+              margin-left: 26px;
+              margin-top: 15px;
+            }
+            .in {
+              margin-left: 14px;
+              width: 81%;
+              position: relative;
+              .ant-input {
+                border-radius: 5px;
+                // height: 120%;
+                width: 100%;
+                height: 130px;
+                resize: none;
+              }
+              .showcount {
+                position: absolute;
+                right: 10px;
+                color: #c7cbd2;
+                bottom: 5px;
+              }
+            }
+          }
+          .btn {
+            width: 33%;
+            margin-top: 30px;
+            display: flex;
+            justify-content: space-between;
+            margin-bottom: 30px;
+            .samtn {
+              width: 100px;
+              height: 40px;
+              font-size: 14px;
+              border: 1px solid #4ea6ff;
+              border-radius: 8px;
+              cursor: pointer;
+            }
+            .btn1 {
+              background-color: #fff;
+              color: #4ea6ff;
+            }
+            .btn2 {
+              background-color: #4ea6ff;
+              color: #fff;
+            }
+          }
+        }
       }
     }
   }

src/views/learningpath/LevelAdd.vue

@@ -355,7 +355,7 @@
           </div>
           <div class="mid">
             <div class="inher">
-              <div class="cur">当前关卡：关卡1</div>
+              <div class="cur">当前关卡：</div>
               <div class="select">
                 <a-select
                   v-model:value="projectName"
@@ -512,9 +512,6 @@ export default {
           cur: "关卡2",
           jin: "2/10",
           time: "2022-07-15 14:00",
-          haspub: false,
-          checked1: false,
-          checkedd: false,
         },
         {
           key: 2,
@@ -524,9 +521,6 @@ export default {
           cur: "关卡2",
           jin: "2/10",
           time: "2022-07-15 14:00",
-          haspub: false,
-          checked1: false,
-          checkedd: false,
         },
         {
           key: 3,
@@ -536,69 +530,51 @@ export default {
           cur: "关卡2",
           jin: "2/10",
           time: "2022-07-15 14:00",
-          haspub: false,
-          checked1: false,
-          checkedd: false,
         },
         {
           key: 4,
           name: "张三",
           com: "产研部",
           gang: "产品经理",
-          cur: "关卡2",
+          cur: "关卡1",
           jin: "2/10",
           time: "2022-07-15 14:00",
-          haspub: false,
-          checked1: false,
-          checkedd: false,
         },
         {
           key: 5,
           name: "张三",
           com: "产研部",
           gang: "产品经理",
-          cur: "关卡2",
+          cur: "关卡1",
           jin: "2/10",
           time: "2022-07-15 14:00",
-          haspub: false,
-          checked1: false,
-          checkedd: false,
         },
         {
-          key: 5,
+          key: 6,
           name: "张三",
           com: "产研部",
           gang: "产品经理",
           cur: "关卡2",
           jin: "2/10",
           time: "2022-07-15 14:00",
-          haspub: false,
-          checked1: false,
-          checkedd: false,
         },
         {
-          key: 5,
+          key: 7,
           name: "张三",
           com: "产研部",
           gang: "产品经理",
           cur: "关卡2",
           jin: "2/10",
           time: "2022-07-15 14:00",
-          haspub: false,
-          checked1: false,
-          checkedd: false,
         },
         {
-          key: 5,
+          key: 8,
           name: "张三",
           com: "产研部",
           gang: "产品经理",
           cur: "关卡2",
           jin: "2/10",
           time: "2022-07-15 14:00",
-          haspub: false,
-          checked1: false,
-          checkedd: false,
         },
       ],
     });
@@ -691,16 +667,19 @@ export default {
           width: 110,
           align: "center",
           scopedSlots: { customRender: "action" }, //引入的插槽
-          customRender: () => {
+          customRender: (text) => {
             return (
               <div class="opa">
                 <div class="opacation">
-                  <span style="color:#4EA6FF;margin-right:25px;cursor:pointer">
+                  <routerLink to="/levelcheck">
-                    查看
+                    <span style="color:#4EA6FF;margin-right:25px;cursor:pointer">
-                  </span>
+                      查看
+                    </span>
+                  </routerLink>
                   <span
                     onClick={() => {
                       state.visible = true;
+                      console.log(text.record.cur);
                     }}
                     style="color:#4EA6FF;margin-right:25px;cursor:pointer"
                   >
@@ -743,8 +722,11 @@ export default {
   clear: both;
 }
 .ant-modal {
+  width: 549px !important;
+  height: 245px !important;
   .ant-modal-content {
     width: 549px !important;
+    height: 245px !important;
     .ant-modal-body {
       padding: 0 !important;
       width: 549px !important;
@@ -1341,6 +1323,20 @@ export default {
             cursor: pointer;
             margin-right: 20px;
           }
+          .select {
+            .ant-select {
+              //
+              // border: 0 !important;
+              border-radius: 11px;
+              .ant-select-selector {
+                border: 1px solid #4ea6ff !important;
+                .ant-select-selection-placeholder {
+                  padding-left: 15px;
+                  color: #4ea6ff;
+                }
+              }
+            }
+          }
         }
         .talk {
           margin-top: 24px;

src/views/learningpath/LevelAddDetail.vue

@@ -5,7 +5,7 @@
         <div class="tit" style="margin-left: 18px">关卡</div>
         <div class="btn btn3" style="margin-left: 19px">
           <div class="search"></div>
-          <div class="btnText">添加关卡</div>
+          <div class="btnText" @click="showModal">添加关卡</div>
         </div>
         <div class="maincon" style="background-color: #fff">
           <div class="item" v-for="item in level" :key="item.id">
@@ -24,6 +24,52 @@
         </div>
       </div>
     </div>
+    <a-modal
+      v-model:visible="modal"
+      centered="true"
+      :footer="null"
+      :closable="clos"
+    >
+      <div class="header">
+        <div class="headmain">
+          <div class="add">添加关卡</div>
+          <div class="img" style="cursor: pointer" @click="closeModal"></div>
+        </div>
+      </div>
+      <div class="main">
+        <div class="inma">
+          <div class="name">
+            <div class="fir">关卡名称：</div>
+            <div class="input">
+              <a-input
+                style="width: 100%"
+                v-model:value="value1"
+                :maxlength="20"
+                placeholder="请输入关卡名称"
+              />
+            </div>
+            <div class="co">{{ value1.length }}/20</div>
+          </div>
+          <div class="name">
+            <div class="fir">关卡说明：</div>
+            <div class="input">
+              <a-textarea
+                style="width: 100%"
+                v-model:value="value2"
+                :maxlength="100"
+                placeholder="请输入关卡说明"
+                :rows="5"
+              />
+            </div>
+            <div class="co1">{{ value2.length }}/100</div>
+          </div>
+          <div class="btn">
+            <button class="btn1">取消</button>
+            <button class="btn2">确定</button>
+          </div>
+        </div>
+      </div>
+    </a-modal>
     <div class="right">
       <div class="addhead">
         <div class="filt">
@@ -587,6 +633,10 @@ export default {
       tableDataTotal: 100,
       pageSize: 10,
       visible: false,
+      modal: false,
+      clos: false,
+      value1: "",
+      value2: "",
       selectedRowKeys: [],
     });
     const selectProjectName = (value, index) => {
@@ -596,7 +646,13 @@ export default {
       console.log("value", value, index);
     };
     const showDrawer = () => {
-      state.visible = !state.visible;
+      state.visible = true;
+    };
+    const showModal = () => {
+      state.modal = true;
+    };
+    const closeModal = () => {
+      state.modal = false;
     };
     const afterVisibleChange = (bool) => {
       console.log("visible", bool);
@@ -746,6 +802,8 @@ export default {
       selectProjectName2,
       tableDataFunc,
       showDrawer,
+      showModal,
+      closeModal,
       afterVisibleChange,
       drawercolumns,
       onSelectChange,
@@ -761,7 +819,141 @@ export default {
   display: block;
   clear: both;
 }
+.ant-modal {
+  width: 624px !important;
+  height: 388px !important;
+  .ant-modal-content {
+    width: 624px !important;
+    height: 388px !important;
+    border-radius: 4px !important;
+    .ant-modal-body {
+      // background-color: blue;
+      width: 100% !important;
+      height: 100% !important;
+      padding: 0 !important;
 
+      .header {
+        width: 624px;
+        height: 68px;
+        background: linear-gradient(
+          180deg,
+          rgba(78, 166, 255, 0.2) 0%,
+          rgba(78, 166, 255, 0) 100%
+        );
+        display: flex;
+        justify-content: center;
+        .headmain {
+          width: 90%;
+          height: 100%;
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          .add {
+            font-size: 16px;
+            font-weight: 600;
+            color: #333333;
+          }
+          .img {
+            width: 20px;
+            height: 20px;
+            background-image: url(../../assets/images/basicinfo/close22.png);
+            background-size: 100% 100%;
+          }
+        }
+      }
+      .main {
+        width: 100%;
+        height: calc(100% - 68px);
+        // background-color: #bfa;
+        display: flex;
+        justify-content: center;
+        .inma {
+          width: 75%;
+          height: 100%;
+          // background-color: lightblue;
+          .name {
+            display: flex;
+            position: relative;
+            margin-top: 30px;
+            .fir {
+              font-size: 14px;
+              font-weight: 400;
+              color: rgba(0, 0, 0, 0.85);
+              white-space: nowrap;
+              margin-top: 3px;
+            }
+            .input {
+              width: 100%;
+              .ant-input {
+                border-radius: 8px;
+                border: 1px solid #c7cbd2;
+                &::placeholder {
+                  font-size: 12px;
+                  position: absolute;
+                  top: 5px;
+                }
+              }
+              .ant-textarea {
+                border-radius: 8px;
+                border: 1px solid #c7cbd2;
+                &::placeholder {
+                  font-size: 12px;
+                  position: absolute;
+                  top: 5px;
+                }
+              }
+            }
+            .co {
+              position: absolute;
+              right: 10px;
+              top: 4px;
+
+              font-size: 14px;
+              font-weight: 400;
+              color: #c7cbd2;
+            }
+            .co1 {
+              position: absolute;
+              right: 10px;
+              bottom: 8px;
+
+              font-size: 14px;
+              font-weight: 400;
+              color: #c7cbd2;
+            }
+          }
+          .btn {
+            margin-top: 40px;
+            width: 100%;
+            display: flex;
+            justify-content: center;
+            .btn1 {
+              width: 100px;
+              height: 40px;
+              border-radius: 4px;
+              border: 1px solid #387df7;
+              font-size: 14px;
+              color: #387df7;
+              cursor: pointer;
+              background: #ffffff;
+              margin-right: 20px;
+            }
+            .btn2 {
+              width: 100px;
+              height: 40px;
+              border-radius: 4px;
+              font-size: 14px;
+              color: #fff;
+              cursor: pointer;
+              border: 0;
+              background: #388be1;
+            }
+          }
+        }
+      }
+    }
+  }
+}
 .drawerStyle {
   .ant-drawer-content-wrapper {
     // max-width: 1000px;

src/views/learningpath/LevelCheck.vue

@@ -0,0 +1,354 @@
+<template>
+  <div class="checkwrapper">
+    <div class="header">
+      <div class="left">
+        <div class="img"></div>
+        <div class="msg">
+          <div class="name">哈哈</div>
+          <div class="cur">产研部门-产品经理</div>
+        </div>
+      </div>
+      <div class="right">
+        <div class="lne"></div>
+        <div class="jin">
+          <div class="jint">进度排行</div>
+          <div class="jinc">
+            <span style="color: #ff90ae">2&nbsp;</span>/&nbsp;10
+          </div>
+        </div>
+        <div class="lne"></div>
+        <div class="jin">
+          <div class="jint">完成必修</div>
+          <div class="jinc">
+            <span style="color: #a497ff">3&nbsp;</span>/&nbsp;5
+          </div>
+        </div>
+        <div class="lne"></div>
+        <div class="jin">
+          <div class="jint">已获取证书</div>
+          <div class="jinc">
+            <span style="color: #ffb64e">1</span>
+          </div>
+        </div>
+        <div class="lne"></div>
+        <div class="return">
+          <div class="im"></div>
+          <div class="fan">返回</div>
+        </div>
+      </div>
+    </div>
+    <div class="pad"></div>
+    <div class="bottom">
+      <div class="padd"></div>
+      <div class="bomcen">
+        <div class="centop">
+          <div class="d"></div>
+          <div class="topinf">产品经理进阶路径</div>
+          <div class="infor">
+            <div class="sy">说明 &nbsp;></div>
+          </div>
+        </div>
+        <div class="item">
+          <div v-for="item in gq" :key="item.id">
+            <div class="minc">
+              <div class="itmtit">关卡{{ item.id }}名称：{{ item.title }}</div>
+            </div>
+            <div :class="item.haschild ? 'show' : 'i'">
+              <div v-for="it in item.child" :key="it.id" class="ite">
+                <div class="title">{{ it.title }}</div>
+                <div class="btn">
+                  <button
+                    :class="it.done ? 'btnoo' : 'btno'"
+                    style="z-index: 999"
+                  >
+                    已完成
+                  </button>
+                  <button :class="it.done ? 'btntt' : 'btnt'">未完成</button>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="padd"></div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { toRefs, reactive } from "vue";
+export default {
+  name: "LevelCheck",
+  setup() {
+    const state = reactive({
+      gq: [
+        {
+          id: 1,
+          title: "初级产品经理",
+          haschild: true,
+          child: [
+            {
+              id: 1 - 1,
+              done: true,
+              title: "「课程」如何成为一个产品经理",
+            },
+            {
+              id: 1 - 2,
+              done: false,
+              title: "「作业」产品作业",
+            },
+            {
+              id: 1 - 3,
+              done: false,
+              title: "「考试」产品考试",
+            },
+          ],
+        },
+        {
+          id: 2,
+          title: "中级产品经理",
+        },
+      ],
+    });
+    return {
+      ...toRefs(state),
+    };
+  },
+};
+</script>
+
+<style lang="scss" >
+.clearfix:before,
+.clearfix:after {
+  content: "";
+  display: table;
+  clear: both;
+}
+.checkwrapper {
+  width: 100%;
+  height: 100%;
+  .header {
+    display: flex;
+    width: 100%;
+    // background-color: #bfa;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    padding: 20px;
+    .left {
+      display: flex;
+      height: 100%;
+      align-items: center;
+      .img {
+        width: 90px;
+        height: 90px;
+        background-color: red;
+        border-radius: 50%;
+        border: 8px solid #e7f2ff;
+        background-image: url(../../assets/px.jpg);
+        background-size: 100% 100%;
+      }
+      .msg {
+        height: 100%;
+        margin-left: 27px;
+        .name {
+          font-size: 16px;
+          font-weight: 500;
+          color: #363636;
+        }
+        .cur {
+          margin-top: 20px;
+          font-size: 14px;
+          font-weight: 400;
+          color: #878b92;
+        }
+      }
+    }
+    .right {
+      display: flex;
+      height: 100%;
+      align-items: center;
+      .lne {
+        width: 1px;
+        height: 82px;
+        background: #e8effa;
+      }
+      .jin {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        margin-left: 50px;
+        margin-right: 50px;
+
+        .jint {
+          font-size: 16px;
+          font-weight: 400;
+          color: #333330;
+        }
+        .jinc {
+          font-size: 18px;
+          font-weight: 600;
+          color: #959595;
+        }
+      }
+      .return {
+        display: flex;
+        align-items: center;
+        cursor: pointer;
+        margin-left: 30px;
+        margin-right: 40px;
+        .im {
+          width: 42px;
+          height: 42px;
+          background-size: 100% 100%;
+          background-image: url(../../assets/images/leveladd/back.png);
+        }
+        .fan {
+          font-size: 14px;
+          font-weight: 400;
+          color: #4ea6ff;
+          margin-left: 20px;
+        }
+      }
+    }
+  }
+  .pad {
+    // #EFF4FC
+    width: 100%;
+    height: 20px;
+    // background-color: #edf0f5;
+    background-image: linear-gradient(90deg, #edf0f5, #eff4fc);
+  }
+  .bottom {
+    width: 100%;
+    height: 100%;
+    // background-color: #bfa;
+    display: flex;
+    .padd {
+      width: 40px;
+      height: 100%;
+    }
+    .bomcen {
+      // 内容区
+      width: 100%;
+      height: 100%;
+      // background-color: lavenderblush;
+      .centop {
+        margin-top: 25px;
+        display: flex;
+        align-items: center;
+        .d {
+          width: 4px;
+          height: 13px;
+          background: #4ea6ff;
+          border-radius: 2px;
+        }
+        .topinf {
+          font-size: 16px;
+          font-weight: 500;
+          color: #333333;
+          margin-left: 16px;
+        }
+        .infor {
+          display: flex;
+          margin-top: 4px;
+          margin-left: 17px;
+          cursor: pointer;
+          .sy {
+            font-size: 14px;
+            font-weight: 400;
+            color: #4ea6ff;
+            text-align: center;
+          }
+        }
+      }
+      .item {
+        width: 100%;
+        margin-top: 30px;
+        .minc {
+          width: 100%;
+          height: 50px;
+          background: #eff4fc;
+          display: flex;
+          align-items: center;
+          .itmtit {
+            font-size: 14px;
+            font-weight: 400;
+            color: #409eff;
+            margin-left: 20px;
+          }
+        }
+        .show {
+          .ite {
+            width: 100%;
+            height: 49px;
+            border: 1px solid #f0f4fe;
+            border-top: 0;
+            display: flex;
+            align-items: center;
+            position: relative;
+            .title {
+              font-size: 14px;
+              font-weight: 400;
+              color: #6f6f6f;
+              margin-left: 22px;
+            }
+            .btn {
+              position: absolute;
+              // background-color: red;
+              left: 550px;
+
+              .btno {
+                width: 73px;
+                height: 23px;
+                border-radius: 4px;
+                top: -12px;
+                border: 0;
+                color: #ffffff;
+                background: #5dc988;
+                position: absolute;
+                z-index: 999;
+              }
+              .btnoo {
+                width: 73px;
+                height: 23px;
+                border-radius: 4px;
+                top: -12px;
+                border: 0;
+                color: #ffffff;
+                background: #5dc988;
+                position: absolute;
+                z-index: 998;
+              }
+              .btnt {
+                width: 73px;
+                height: 23px;
+                border-radius: 4px;
+                top: -12px;
+                border: 0;
+                position: absolute;
+                background: #f2f6fc;
+                color: #5dc988;
+                z-index: 999;
+              }
+              .btntt {
+                width: 73px;
+                height: 23px;
+                border-radius: 4px;
+                top: -12px;
+                border: 0;
+                position: absolute;
+                background: #f2f6fc;
+                color: #5dc988;
+                z-index: 998;
+              }
+            }
+          }
+        }
+        .i {
+          display: none;
+        }
+      }
+    }
+  }
+}
+</style>

src/views/projectcenter/TaskAdd.vue

@@ -291,23 +291,23 @@
                 <div class="inname">阶段名称：</div>
               </div>
               <div class="in">
-                <a-input v-model:value="valueE" show-count :maxlength="20" placeholder="请输入阶段名称" />
+                <a-input  v-model:value="valueE" show-count :maxlength="20" placeholder="请输入阶段名称" />
               </div>
           </div>
           <div class="name" style="display: flex; align-items: flex-start">
               <div class="namebox">
                 <div class="inname">阶段说明：</div>
               </div>
-              <div class="in">
+              <div class="intext" style="margin-left: 14px">
                 <a-textarea  v-model:value="value" style="height: 88px" show-count :maxlength="100"  placeholder="请输入阶段说明" />
               </div>
           </div>
           <div style="display: flex;width: 100%;justify-content: center;margin-top: 40px">
             <button @click="closeModal"
-              style=" cursor: pointer;height: 40px;width: 100px;border: 1px solid #387DF7;border-radius: 4px;color: #387DF7;background-color: #FFFFFF"
+              style=" cursor: pointer;height: 40px;width: 100px;border: 1px solid #409EFF;border-radius: 4px;color: #409EFF;background-color: #FFFFFF"
             >取消</button>
             <button @click="closeModal"
-              style=" cursor: pointer;margin-left: 16px;margin-bottom: 40px;height: 40px;width: 100px;border: 1px solid #388BE1;border-radius: 4px;color: #FFFFFF;background-color: #388BE1"
+              style=" cursor: pointer;margin-left: 16px;margin-bottom: 40px;height: 40px;width: 100px;border: 1px solid #409EFF;border-radius: 4px;color: #FFFFFF;background-color: #409EFF"
             >确定</button>
           </div>
         </div>
@@ -791,7 +791,7 @@ export default {
             border-radius: 8px;
             // height: 120%;
             width: 384px;
-            height: 40px;
+            height: 88px;
 }
 .addstage {
   .ant-modal {
@@ -806,7 +806,7 @@ export default {
             .ant-input-textarea-show-count::after {
               position: absolute;
               right: 10px;
-              bottom: 10px;
+              bottom: 5px;
             }        
        }
       }

src/views/projectcenter/TaskPage.vue

@@ -479,6 +479,7 @@
             }
             .progress {
                 width: 168px;
+                margin-left: 10px;
                 margin-right: 50px;
                 flex-grow: 1;
                 .progresstext {

src/views/research/ManagePage.vue

@@ -209,7 +209,7 @@ export default {
         font-weight: 500;
       }
       .messagebox {
-        width: 100%;
+        //width: 100%;
         //display: flex;
         margin-top: 20px;
         margin-left: 38px;

src/views/research/ResearchAdd.vue

@@ -64,7 +64,7 @@
             <img class="pictureimg" src="../../assets/images/research/picture.png"/>
             <div class="picturename">图片名称1.jpg</div>
             <img
-                style="width: 20px; height: 20px;position: absolute;right: 0;top:0"
+                style="cursor: pointer; width: 20px; height: 20px;position: absolute;right: 0;top:0"
                 src="../../assets/images/basicinfo/close.png"
             />
         </div>
@@ -91,15 +91,16 @@
             <div class="scoretext">非常满意</div>
             <div class="number">
                 <a-button class="btn" style="margin-left:10px">1</a-button>
-                <a-button class="btn">2</a-button>
+                    <a-button class="btn">2</a-button>
-                <a-button class="btn">3</a-button>
+                    <a-button class="btn">3</a-button>
-                <a-button class="btn">4</a-button>
+                    <a-button class="btn">4</a-button>
-                <a-button class="btn">5</a-button>
+                    <a-button class="btn">5</a-button>
-                <a-button class="btn">6</a-button>
+                    <a-button class="btn">6</a-button>
-                <a-button class="btn">7</a-button>
+                    <a-button class="btn">7</a-button>
-                <a-button class="btn">8</a-button>
+                    <a-button class="btn">8</a-button>
-                <a-button class="btn">9</a-button>
+                    <a-button class="btn">9</a-button>
-                <a-button class="btn" style="margin-right: 10px;">10</a-button>
+                    <a-button class="btn" style="display: flex;align-items:center;margin-right: 10px;justify-content: center">10</a-button>
+                
             </div>
             <div class="scoretext">非常不满意</div>
         </div>
@@ -181,6 +182,7 @@
                 border: 1px solid #D7E5FD;
                 border-radius: 5px;
                 margin: 0 10px;
+                padding: 5px;
                 .btn {
                     border: 1px solid #56A3F9;
                     border-radius: 5px; 
@@ -214,7 +216,8 @@
             display:flex;
         }
         .delete {
-            margin-top: 27px;
+            cursor: pointer;
+            margin-top: 32px;
             margin-left: 20px;
             float: right;
             color: #4EA6FF;
@@ -225,7 +228,7 @@
             // background-color: lightcoral;
             display: flex;
             margin-top: 20px;
-            align-items: center;
+            //align-items: center;
             //height: 40px;
             // border: 1px solid black;
             .namebox {
@@ -248,6 +251,7 @@
                     margin-left: 14px;
                     flex: 1;
                     .addimg {
+                        cursor:pointer;
                         color: rgba(78, 166, 255, 1);
                         font-size: 14px;
                     }

src/views/system/SystemManage.vue

@@ -21,195 +21,30 @@
       添加投票
     </div>
     <div>
-      <a-drawer
+      <add-vote v-model:addvoteVisible="visible" />
-        v-model:visible="visible"
-        class="drawerStyle"
-        style="color: red"
-        width="80%"
-        title="添加投票"
-        placement="right"
-        @after-visible-change="afterVisibleChange"
-      >
-        <div class="drawerMain">
-          <div class="header">
-            <div class="headerTitle">添加投票</div>
-            <img
-              style="width: 29px; height: 29px; cursor: pointer"
-              src="../../assets/images/basicinfo/close.png"
-              @click="closeDrawer"
-            />
-          </div>
-          <div class="contentMain">
-            <!-- 投票名称 -->
-            <div class="vote">
-              <div class="votebox">
-                <img
-                  class="voteimg"
-                  src="../../assets/images/basicinfo/asterisk.png"
-                />
-                <div class="votename">投票名称：</div>
-              </div>
-              <div style="width: 424px">
-                <a-input v-model:value="value" placeholder="请输入投票名称" />
-              </div>
-            </div>
-            <!-- 投票名称 -->
-            <!-- 创建投票 -->
-            <div class="vote">
-              <div class="votebox">
-                <img
-                  class="voteimg"
-                  src="../../assets/images/basicinfo/asterisk.png"
-                />
-                <div class="votename">创建投票：</div>
-              </div>
-              <div class="votebtn">创建投票</div>
-            </div>
-            <!-- 创建投票 -->
-            <!-- 起止时间 -->
-            <div class="vote">
-              <div class="votebox">
-                <div class="voteimg"></div>
-                <div class="votename">起止时间：</div>
-              </div>
-              <div class="votedate">
-                <a-range-picker />
-              </div>
-            </div>
-            <!-- 起止时间 -->
-            <!-- 基础投票数 -->
-            <div class="vote" style="align-items: flex-start">
-              <div class="votebox" style="margin-top: 10px">
-                <div class="voteimg"></div>
-                <div class="votename">基础投票数：</div>
-              </div>
-              <div>
-                <div class="votebtn">点击上传</div>
-                <div class="voteclassify">支持：xls.xlsx</div>
-              </div>
-            </div>
-            <!-- 基础投票数 -->
-            <!-- 投票说明 -->
-            <div class="vote" style="align-items: flex-start">
-              <div class="votebox" style="margin-top: 10px">
-                <div class="voteimg"></div>
-                <div class="votename">投票说明：</div>
-              </div>
-              <div style="width: 500px">
-                <a-textarea
-                  :rows="4"
-                  placeholder="请输入投票说明"
-                  :maxlength="6"
-                />
-              </div>
-            </div>
-            <!-- 投票说明 -->
-            <!-- 投票说明 -->
-            <div class="vote" style="align-items: flex-start">
-              <div class="votebox" style="margin-top: 10px">
-                <div class="voteimg"></div>
-                <div class="votename">投票说明：</div>
-              </div>
-              <div style="width: 500px">
-                <a-textarea
-                  :rows="4"
-                  placeholder="请输入投票说明"
-                  :maxlength="6"
-                />
-              </div>
-            </div>
-            <!-- 投票说明 -->
-            <!-- 投票说明 -->
-            <div class="vote" style="align-items: flex-start">
-              <div class="votebox" style="margin-top: 10px">
-                <div class="voteimg"></div>
-                <div class="votename">投票说明：</div>
-              </div>
-              <div style="width: 500px">
-                <a-textarea
-                  :rows="4"
-                  placeholder="请输入投票说明"
-                  :maxlength="6"
-                />
-              </div>
-            </div>
-            <!-- 投票说明 -->
-            <!-- 投票说明 -->
-            <div class="vote" style="align-items: flex-start">
-              <div class="votebox" style="margin-top: 10px">
-                <div class="voteimg"></div>
-                <div class="votename">投票说明：</div>
-              </div>
-              <div style="width: 500px">
-                <a-textarea
-                  :rows="4"
-                  placeholder="请输入投票说明"
-                  :maxlength="6"
-                />
-              </div>
-            </div>
-            <!-- 投票说明 -->
-            <!-- 投票说明 -->
-            <div class="vote" style="align-items: flex-start">
-              <div class="votebox" style="margin-top: 10px">
-                <div class="voteimg"></div>
-                <div class="votename">投票说明：</div>
-              </div>
-              <div style="width: 500px">
-                <a-textarea
-                  :rows="4"
-                  placeholder="请输入投票说明"
-                  :maxlength="6"
-                />
-              </div>
-            </div>
-            <!-- 投票说明 -->
-            <!-- 投票说明 -->
-            <div class="vote" style="align-items: flex-start">
-              <div class="votebox" style="margin-top: 10px">
-                <div class="voteimg"></div>
-                <div class="votename">投票说明：</div>
-              </div>
-              <div style="width: 500px">
-                <a-textarea
-                  :rows="4"
-                  placeholder="请输入投票说明"
-                  :maxlength="6"
-                />
-              </div>
-            </div>
-            <!-- 投票说明 -->
-          </div>
-        </div>
-      </a-drawer>
     </div>
   </div>
 </template>
 <script>
 import { reactive, toRefs } from "vue";
-
+import AddVote from "../../components/drawers/AddVote";
 export default {
   name: "SystemManage",
+  components: {
+    AddVote,
+  },
   setup() {
     const state = reactive({
-      visible: true,
+      visible: false,
     });
 
-    const afterVisibleChange = (bool) => {
-      console.log("visible", bool);
-    };
-
     const showDrawer = () => {
       state.visible = true;
     };
-    const closeDrawer = () => {
+
-      state.visible = false;
-    };
     return {
       ...toRefs(state),
-      afterVisibleChange,
       showDrawer,
-      closeDrawer,
     };
   },
 };
@@ -217,6 +52,14 @@ export default {
 <style lang="scss">
 .systemManage {
   width: 100%;
+  .ant-input-textarea-show-count {
+    position: relative;
+  }
+  .ant-input-textarea-show-count::after {
+    position: absolute;
+    right: 0px;
+    bottom: 0px;
+  }
 }
 .drawerStyle {
   .drawerMain {