Merge remote-tracking branch 'yx/250207-growth-prod-master_1202-zp' into master_1202

.env.development

@@ -41,6 +41,7 @@ VUE_APP_PUBLIC_PATH='/pc'
 VUE_APP_MANAGER_PATH='/manage'
 VUE_APP_STUDENT_PATH='/fe-student'
 VUE_APP_MANAGER_API_PATH='/manageApi'
+VUE_APP_GROWTH_API_PATH=''
 
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true

.env.preview

@@ -37,6 +37,7 @@ VUE_APP_PUBLIC_PATH='/pc-release'
 VUE_APP_MANAGER_PATH='/manage-release'
 VUE_APP_STUDENT_PATH='/fe-student-release'
 VUE_APP_MANAGER_API_PATH='/manageApi-release'
+VUE_APP_GROWTH_API_PATH='/growth'
 
 # 登录地址
 VUE_APP_LOGIN_URL='https://u.boe.com/web-release/'

.env.production

@@ -37,6 +37,7 @@ VUE_APP_PUBLIC_PATH='/pc'
 VUE_APP_MANAGER_PATH='/manage'
 VUE_APP_STUDENT_PATH='/fe-student'
 VUE_APP_MANAGER_API_PATH='/manageApi'
+VUE_APP_GROWTH_API_PATH='/growth'
 
 # 登录地址
 VUE_APP_LOGIN_URL='https://u.boe.com/web/'

.env.testing

@@ -36,6 +36,7 @@ VUE_APP_PUBLIC_PATH='/pc'
 VUE_APP_MANAGER_PATH='/manage'
 VUE_APP_STUDENT_PATH='/fe-student'
 VUE_APP_MANAGER_API_PATH='/manageApi'
+VUE_APP_GROWTH_API_PATH='/growth'
 
 # 登录地址
 VUE_APP_LOGIN_URL='https://u-pre.boe.com/web/'

src/api/growth/growthpath.js

@@ -0,0 +1,8 @@
+// import ajax from '@/utils/xajax.js'
+import ajax from '../ajax';
+// const baseURL = process.env.VUE_APP_GROWTH_API_PATH;
+const baseURL = '/growth';
+// 查询专业力必修列表
+export const listData = (obj) => ajax.get(baseURL, '/professional/student/studentGrowthList', { params: obj })
+// 查询专业力统计
+export const getTotalGrowthTaskDetail = (obj) => ajax.get(baseURL, '/professional/student/getTotalGrowthTaskDetail', { params: obj })

src/components/UserCenter/menu.vue

@@ -14,7 +14,7 @@
         :default-active="activeMenu"
         router
         active-text-color="#3379FB"
-        :default-openeds="['manageTodo','manageFinish','teacherTodo','teacherFinish','lecturer','myqa','notice','mystudy', 'course', 'exam', 'u001', 'u002', 'u003', 'u004','mylecnotes','mycaseRecord']"
+        :default-openeds="['manageTodo','manageFinish','teacherTodo','teacherFinish','lecturer','myqa','notice','mystudy','myGrowth', 'course', 'exam', 'u001', 'u002', 'u003', 'u004','mylecnotes','mycaseRecord']"
         class="el-menu-vertical"
         @open="handleOpen"
         @close="handleClose"
@@ -242,6 +242,17 @@
           <svg-icon :icon-class="activeMenu == '/user/medal'?'myxunzhang-active':'myxunzhang'"></svg-icon>
           <span slot="title">我的勋章</span>
       </el-menu-item>
+        <el-submenu index="myGrowth" v-show="curIdentity == 1">
+          <template slot="title">
+            <!-- <i class="el-icon-s-grid"></i> -->
+            <img src="../../assets/images/myGrowth.jpg" style="width: 1em;height: 1em;margin-right: 8px;"></img>
+            <span>我的必修</span>
+          </template>
+          <el-menu-item index="/growth/growthPage">
+            <!-- <i class="el-icon-menu"></i> -->
+            <span slot="title" class="study textl">专业力必修</span>
+          </el-menu-item>
+        </el-submenu>
         <el-submenu index="mystudy" v-show="curIdentity == 1">
           <template slot="title">
             <!-- <i class="el-icon-s-grid"></i> -->
@@ -422,6 +433,7 @@ export default {
     this.getLastStudy();
     //获取讲师认证中条数
     this.instructorCertification()
+    console.log(this.userInfo,'userInfouserInfo')
   },
   mounted() {
     //console.log(this.userInfo.loginName,'this.userInfo.loginName');

src/data/pages.js

@@ -82,6 +82,9 @@ export const pages=[
     {title:'学习路径图',path:'path',component:'study/StudyPath',hidden:false},
     {title:'学习项目',path:'project',component:'study/StudyProject',hidden:false}
   ]},
+  {title:'我的必修',path:'/growth',hidden:false,children:[
+    {title:'专业力必修',path:'growthPage',component:'growth/index',hidden:false},
+  ]},
   {title:'个人中心',path:'/uc',hidden:false,children:[
     {title:'首页',path:'index',component:'StudyIndex',hidden:false}
   ]},

src/layout/components/AppMain.vue

@@ -6,7 +6,10 @@
         <!-- <div style="height: 20px;"></div> -->
       </div>
       <!-- width: 990px; -->
-      <div class="main-body" style="padding: 30px 20px;flex:1; background-color: #fff;margin-left: 20px;">
+      <div class="main-body" :style="{
+             backgroundColor: bgColor,
+             padding
+            }" style="flex:1; margin-left: 20px;">
         <!-- <div style="margin-bottom: 10px;padding:10px; border-bottom: 1px solid #dbdbdb;"> -->
           <!-- <el-breadcrumb separator-class="el-icon-arrow-right">
             <el-breadcrumb-item :to="{ path: '/uc/index' }"><i class="el-icon-arrow-right"></i>个人中心</el-breadcrumb-item>
@@ -15,10 +18,12 @@
         <!-- </div> -->
         <transition name="fade-transform" mode="out-in">
           <keep-alive :include="cachedViews">
-            <div style="background-color: #FFFFFF;min-height: 600px;padding-bottom: 50px;">
+            <div :style="{
+             backgroundColor: bgColor
+            }" style="min-height: 600px;padding-bottom: 50px;">
             <router-view :key="key" />
             </div>
-          </keep-alive>
+          </keep-alive> 
         </transition>
       </div>
     </div>
@@ -39,7 +44,14 @@ export default {
       return this.$route.meta.title;
     },
     key() {
+      console.log(this.$route)
       return this.$route.path
+    },
+    bgColor() {
+     return this.$route.path === "/growth/growthPage" ? "rgba(0,0,0,0)" : "#fff";
+    },
+    padding(){
+      return this.$route.path === "/growth/growthPage" ? "0" : "30px 20px";
     }
   }
 }

src/views/Forward.vue

@@ -2,7 +2,7 @@
   <div class="box" :class="{ incl: url.includes('projectdetails') }">
     <portal-header style="background: #387DF7;" :hideSearch="true" textColor="#ffffff"></portal-header>
         <iframe :src="url" style="width: 100%;height: 100%;" frameborder="0" ref="iframe"></iframe>
-    <portal-footer></portal-footer>
+    <portal-footer v-if="isShowFooter"></portal-footer>
   </div>
 </template>
 <script>
@@ -16,7 +16,8 @@ import portalFooter from "@/components/PortalFooter.vue";
     data(){
       return {
        url: "",
-       boeUrl:process.env.VUE_APP_BOE_WEB_URL
+       boeUrl:process.env.VUE_APP_BOE_WEB_URL,
+       isShowFooter:true
       }
     },
     mounted() {
@@ -24,6 +25,10 @@ import portalFooter from "@/components/PortalFooter.vue";
       let to = this.$route.query.to;//跳转的地址，以 /开头的地址
       let urlPre=window.location.protocol+'//'+window.location.host;
       this.url=urlPre+to
+
+      if(to.includes('growthList')){
+        this.isShowFooter = false
+      }
       if(params){
          this.url=this.url+'?'+params;
       }

src/views/growth/index.vue

@@ -0,0 +1,390 @@
+<template>
+  <div class="growth" v-loading="loading" id="scrollContainer">
+    <div class="growth-left">
+      <div class="navbar">
+        <div style="display: flex; flex: 1">
+          <div class="nav-title">我的专业力必修</div>
+        </div>
+      </div>
+
+      <div class="growth-item" v-for="item of list" :id="item.id">
+        <div class="growth-nav">
+          <div class="growth-name">{{ item.growthName }}</div>
+          <div class="f-a-c">
+            <div
+              class="growth-state"
+              :style="{
+                color:
+                  item.learningState === 0
+                    ? '#999999'
+                    : item.learningState === 1
+                    ? '#6ba158'
+                    : '#F2903D',
+              }"
+            >
+              {{
+                item.learningState === 0
+                  ? "未开始"
+                  : item.learningState === 1
+                  ? "已完成"
+                  : "进行中"
+              }}
+            </div>
+            <div class="growth-btn" @click="jumpRouter(item)">去学习</div>
+          </div>
+        </div>
+        <template v-if="item.description">
+          <div class="tip-title">说明</div>
+          <div class="tip-content">
+            {{ item.description || "暂无说明" }}
+          </div>
+        </template>
+
+        <div class="progress-title">学习进度</div>
+
+        <div class="progress-content">
+          <div class="f-j-b" style="margin-bottom: 10px">
+            <div class="f-a-c">
+              <div style="font-size: 16px; color: #333333">必修进度</div>
+              <div style="font-size: 18px; color: #999999; margin-left: 12px">
+                {{ item.requiredTaskCompletedNum }}/{{ item.requiredTaskNum }}
+              </div>
+            </div>
+            <div style="font-size: 18px; color: #0077ec">
+              {{ requiredTaskCompletionRate(item) }}%
+            </div>
+          </div>
+          <el-progress
+            :stroke-width="6"
+            :show-text="false"
+            :percentage="requiredTaskCompletionRate(item)"
+            color="#0077EC"
+          ></el-progress>
+        </div>
+        <template v-if="item.electiveTaskNum !== 0">
+          <div class="progress-content">
+            <div class="f-j-b" style="margin-bottom: 10px">
+              <div class="f-a-c">
+                <div style="font-size: 16px; color: #333333">选修进度</div>
+                <div style="font-size: 18px; color: #999999; margin-left: 12px">
+                  {{ item.electiveTaskCompletedNum }}/{{ item.electiveTaskNum }}
+                </div>
+                <el-tooltip
+                  class="item"
+                  effect="light"
+                  :content="`还需完成${item.electivePoorNum}个选修任务`"
+                  placement="top-start"
+                >
+                  <i class="el-icon-question"></i>
+                </el-tooltip>
+              </div>
+              <div style="font-size: 18px; color: #0077ec">
+                {{ electiveTaskCompletionRate(item) }}%
+              </div>
+            </div>
+            <el-progress
+              :stroke-width="6"
+              :show-text="false"
+              color="#0077EC"
+              :percentage="electiveTaskCompletionRate(item)"
+            ></el-progress>
+          </div>
+        </template>
+        <div class="progress-content">
+          <div class="f-j-b" style="margin-bottom: 10px">
+            <div class="f-a-c">
+              <div style="font-size: 16px; color: #333333">总进度</div>
+              <div style="font-size: 18px; color: #999999; margin-left: 12px">
+                {{ item.totalTaskCompletedNum }}/{{ item.totalTaskNum }}
+              </div>
+            </div>
+            <div style="font-size: 18px; color: #0077ec">
+              {{ totalTaskCompletionRate(item) }}%
+            </div>
+          </div>
+          <el-progress
+            :stroke-width="6"
+            :show-text="false"
+            color="#0077EC"
+            :percentage="totalTaskCompletionRate(item)"
+          ></el-progress>
+        </div>
+        <div class="growth-bg-icon">
+          <img src="@/assets/images/growth/growth-bg-icon.png" />
+        </div>
+      </div>
+      <template v-if="!list.length">
+        <div class="empty">
+          <el-empty :image-size="200"></el-empty>
+        </div>
+      </template>
+    </div>
+    <!-- <template v-if="!list || list.length < 2">
+      <div class="growth-right">
+        <div class="title">专业力必修</div>
+        <div
+          :key="item.id"
+          class="item-growth"
+          :class="activeItem.id == item.id ? 'active' : ''"
+          v-for="item of list"
+        >
+          <div class="icon"></div>
+          <div @click="handlerAnchor(item)">
+            {{ item.growthName }}
+          </div>
+        </div>
+      </div>
+    </template> -->
+  </div>
+</template>
+<script>
+import { listData, getTotalGrowthTaskDetail } from "@/api/growth/growthpath";
+export default {
+  data() {
+    return {
+      list: [],
+      loading: false,
+      totalData: {},
+      activeItem: {},
+    };
+  },
+  computed: {
+    // 完成进度
+    totalTaskCompletionRate() {
+      return (item) => {
+        if (item.totalTaskCompletedNum && item.totalTaskNum) {
+          let num = item.totalTaskCompletedNum / item.totalTaskNum;
+          num = num * 100;
+          num = num.toFixed(0);
+          return Number(num);
+        } else {
+          return 0;
+        }
+      };
+    },
+    // 选修进度
+    electiveTaskCompletionRate() {
+      return (item) => {
+        if (item.electiveTaskCompletedNum && item.electiveTaskNum) {
+          let num = item.electiveTaskCompletedNum / item.electiveTaskNum;
+          num = num * 100;
+          num = num.toFixed(0);
+          return Number(num);
+        } else if (item.electiveTaskNum == 0) {
+          return 100;
+        } else {
+          return 0;
+        }
+      };
+    },
+    // 必修进度
+    requiredTaskCompletionRate() {
+      return (item) => {
+        if (item.requiredTaskCompletedNum && item.requiredTaskNum) {
+          let num = item.requiredTaskCompletedNum / item.requiredTaskNum;
+          num = num * 100;
+          num = num.toFixed(0);
+          return Number(num);
+        } else {
+          return 0;
+        }
+      };
+    },
+  },
+  methods: {
+    select(item) {},
+    jumpRouter(item) {
+      let studentPath = process.env.VUE_APP_STUDENT_PATH;
+      let params = encodeURIComponent("routerId=" + item.id);
+      this.$router.push(
+        "/forward?to=" + studentPath + "/growthList&params=" + params
+      );
+    },
+
+    handlerAnchor(item, index) {
+      this.activeItem = item;
+      let dom = document.getElementById(`${item.id}`);
+      dom.classList.add("handler-add-padding");
+      dom.scrollIntoView({ behavior: "smooth" });
+    },
+  },
+  created() {
+    this.loading = true;
+    listData().then((res) => {
+      this.activeItem = res.data[0];
+      this.list = res.data;
+      this.loading = false;
+    });
+    getTotalGrowthTaskDetail().then((res) => {
+      this.totalData = res.data;
+    });
+    // 处理滚动事件的代码
+    let that = this;
+    window.addEventListener("scroll", function () {
+      let dom = document.getElementById(`${that.activeItem.id}`);
+      if (dom) {
+        dom.classList.remove("handler-add-padding");
+      }
+    });
+  },
+};
+</script>
+<style lang="less" scoped>
+.f-a-c {
+  display: flex;
+  align-items: center;
+}
+.f-j-b {
+  display: flex;
+  justify-content: space-between;
+}
+.f-j-c {
+  display: flex;
+  justify-content: center;
+}
+.growth {
+  .empty {
+    height: 600px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    background-color: #ffffff;
+  }
+  .el-icon-question {
+    color: #387df7;
+    font-size: 16px;
+    margin-left: 5px;
+  }
+  .handler-add-padding {
+    padding: 100px 38px 66px 40px !important;
+    margin-top: -80px;
+  }
+  display: flex;
+  .growth-left {
+    margin-right: 10px;
+
+    flex: 1;
+    .growth-item {
+      background: #ffffff;
+      padding: 30px 38px 66px 40px;
+      margin-bottom: 35px;
+      position: relative;
+      .growth-bg-icon {
+        position: absolute;
+        right: 92px;
+        bottom: 0;
+      }
+      .progress-title {
+        // font-weight: 700;
+        font-size: 18px;
+        color: #000000;
+        margin: 28px 0 20px 0;
+      }
+      .progress-content {
+        margin-bottom: 28px;
+      }
+      .tip-title {
+        // font-weight: 700;
+        font-size: 18px;
+        color: #000000;
+        margin: 30px 0 10px 0;
+      }
+      .tip-content {
+        font-size: 16px;
+        color: #333333;
+        line-height: 30px;
+      }
+      .growth-nav {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        padding-bottom: 28px;
+        border-bottom: 2px solid #f5f5f5;
+      }
+      .growth-name {
+        font-weight: bold;
+        font-size: 18px;
+        color: #0071ed;
+      }
+      .growth-state {
+        font-size: 15px;
+        margin-right: 18px;
+      }
+      .growth-btn {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        width: 120px;
+        height: 36px;
+        background: #f2903d;
+        border-radius: 4px;
+        font-size: 16px;
+        color: #ffffff;
+        cursor: pointer;
+      }
+    }
+    .navbar {
+      display: flex;
+      align-items: center;
+      height: 90px;
+      padding-left: 40px;
+      margin-bottom: 10px;
+      color: #ffffff;
+      background-image: url(../../assets/images/growth/growth-bg.png);
+      background-size: 100% 100%;
+      .nav-title {
+        font-weight: 700;
+        font-size: 18px;
+        margin-right: 10%;
+      }
+      .nav-total {
+        // margin-left: 15%;
+        width: 20%;
+      }
+      .total-num {
+        font-weight: bold;
+        font-size: 22px;
+      }
+    }
+  }
+  .growth-right {
+    width: 30%;
+    max-width: 464px;
+    margin-bottom: 35px;
+    background-color: #ffffff;
+    padding: 35px 20px 20px 30px;
+    .title {
+      font-size: 18px;
+      color: #000000;
+      font-weight: 700;
+      margin-bottom: 30px;
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+    }
+    .item-growth {
+      display: flex;
+      align-items: center;
+      border-radius: 5px;
+      font-size: 14px;
+      color: #666666;
+      padding: 10px 20px 10px 8px;
+      cursor: pointer;
+    }
+    .icon {
+      width: 4px;
+      height: 4px;
+      background: #4c5564;
+      border-radius: 50%;
+      margin-right: 10px;
+    }
+    .active {
+      background: #e3edfe;
+      color: #000;
+      .icon {
+        background: #0077ec;
+      }
+    }
+  }
+}
+</style>

vue.config.js

@@ -85,28 +85,28 @@ module.exports = {
             .end()
           config
             .optimization.splitChunks({
-            chunks: 'all',
+              chunks: 'all',
-            cacheGroups: {
+              cacheGroups: {
-              libs: {
+                libs: {
-                name: 'chunk-libs',
+                  name: 'chunk-libs',
-                test: /[\\/]node_modules[\\/]/,
+                  test: /[\\/]node_modules[\\/]/,
-                priority: 10,
+                  priority: 10,
-                chunks: 'initial' // only package third parties that are initially dependent
+                  chunks: 'initial' // only package third parties that are initially dependent
-              },
+                },
-              elementUI: {
+                elementUI: {
-                name: 'chunk-elementUI', // split elementUI into a single package
+                  name: 'chunk-elementUI', // split elementUI into a single package
-                priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
+                  priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
-                test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm
+                  test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm
-              },
+                },
-              commons: {
+                commons: {
-                name: 'chunk-commons',
+                  name: 'chunk-commons',
-                test: resolve('src/components'), // can customize your rules
+                  test: resolve('src/components'), // can customize your rules
-                minChunks: 3, //  minimum common number
+                  minChunks: 3, //  minimum common number
-                priority: 5,
+                  priority: 5,
-                reuseExistingChunk: true
+                  reuseExistingChunk: true
+                }
               }
-            }
+            })
-          })
           config.optimization.runtimeChunk('single'), {
             from: path.resolve(__dirname, './public/robots.txt'), //防爬虫文件
             to: './', //到根目录下
@@ -124,6 +124,17 @@ module.exports = {
     // 114.115.162.187 测试环境
     // 192.168.0.107 晋宇
     proxy: {
+      // "/professional": {
+      //   // target: 'https://u-pre.boe.com',
+      //   // target: 'http://192.168.86.195:32002',
+      //   target: 'http://192.168.68.211:32002',
+      //   changeOrigin: true,
+      // },
+      "/growth": {
+        target: 'https://u-pre.boe.com',
+        // target: 'http://192.168.86.195:32002',
+        changeOrigin: true,
+      },
       '/manageApi': {
         // 目标代理服务器地址
         target: 'https://u-pre.boe.com',