提交

.env

@@ -2,7 +2,8 @@ VITE_BASE=/fe-student-h5
 VITE_BASE_API=
 VITE_OUTPUT_DIR=./dist
 VITE_BASE_LOGIN_URL=//u-pre.boe.com/m/loginuser?returnUrl=
-VITE_PROXY_URL=http://43.143.139.204/manageApi
+# VITE_PROXY_URL=http://43.143.139.204/manageApi
+VITE_PROXY_URL=https://u-pre.boe.com/manageApi
 
 # 在线
 VITE_BOE_ONLINE_CLASS_URL=//u-pre.boe.com/mobile/pages/study/courseStudy?id=

package-lock.json

@@ -14860,7 +14860,6 @@
       "integrity": "sha512-yl+5qhpjd8e1G4cMXfORkkBlvtPCIgmRf3IYCWYDKIQ7m+PPa5iTm4feiNmCMD6yGqQWMhhK/7M3oWGL9boKwg==",
       "dev": true,
       "requires": {
-        "@babel/core": "^7.12.16",
         "@babel/helper-compilation-targets": "^7.12.16",
         "@babel/helper-module-imports": "^7.12.13",
         "@babel/plugin-proposal-class-properties": "^7.12.13",
@@ -14873,7 +14872,6 @@
         "@vue/babel-plugin-jsx": "^1.0.3",
         "@vue/babel-preset-jsx": "^1.1.2",
         "babel-plugin-dynamic-import-node": "^2.3.3",
-        "core-js": "^3.8.3",
         "core-js-compat": "^3.8.3",
         "semver": "^7.3.4"
       },
@@ -15733,9 +15731,7 @@
       "resolved": "https://registry.npmmirror.com/ajv-formats/-/ajv-formats-2.1.1.tgz",
       "integrity": "sha512-Wx0Kx52hxE7C18hkMEggYlEifqWZtYaRgouJor+WMdPnQyEK13vgEWyVNup7SoeeoLMsr4kf5h6dOW11I15MUA==",
       "dev": true,
-      "requires": {
+      "requires": {}
-        "ajv": "^8.0.0"
-      }
     },
     "ansi-escapes": {
       "version": "3.2.0",

src/api/CONST.js

@@ -9,6 +9,7 @@
 export const PROJECT = 1;
 export const ROUTER = 2;
 export const COURSE = 3;
+export const GROWTH = 4
 export const TASK_TYPES = {
   typeName: {
     1: "在线",

src/api/api.js

@@ -94,4 +94,16 @@ export const QueryEvaluationTaskStatusOne = `/evaluation/queryEvaluationTaskStat
 export const EditVoteInvolvedAndBrowse = `/vote/editVoteInvolvedAndBrowse post`
 export const NO_COMMIT = `/voteSubmit/vote/nocommit post`
 //任务是否删除
-export const checkStudentExist = `/admin/taskmanage/checkStudentExist post`
+export const checkStudentExist = `/admin/taskmanage/checkStudentExist post`
+
+
+
+/**专业力必修模块 */
+let baseUrl = "/growth"
+// let baseUrl = ""
+//查询专业力必修详情
+export const PROFESSIONAL_STUDENT_DETAIL = id => `${baseUrl}/professional/student/studentGrowthDetail/${id}`
+//查询专业力必修详情
+export const PROFESSIONAL_STUDENT_TASKLIST = `${baseUrl}/professional/student/studentTaskList`
+//记录当前学习任务
+export const PROFESSIONAL_STUDENT_LEARN = `${baseUrl}/professional/student/learnCourse`

src/api/growthRequest.js

@@ -0,0 +1,160 @@
+import router from "@/router";
+import {reactive, ref, toRefs, watch} from "vue";
+import axios from 'axios';
+import {getCookie} from "@/api/utils";
+import JSONBigInt from 'json-bigint';
+import {ElMessage} from "element-plus";
+
+const JSONBigIntStr = JSONBigInt({storeAsString: true});
+
+export function usePage(_url, param, callback) {
+
+    const state = reactive({
+        data: {},
+        loading: false,
+        total: 0,
+        size: 10,
+        current: 1,
+        params: {pageNo: 1, pageSize: 10, ...param}
+    })
+
+    watch(param, () => {
+        state.params = {...state.params, ...param}
+        fetchData()
+    })
+
+    function fetchData() {
+        state.loading = true
+        request(_url, state.params).then(r => {
+            state.params.pageNo === 1 ? (state.data = (r.data.records || r.data.rows)) : (state.data = [...state.data, ...(r.data.records || r.data.rows)])
+            state.size = r.data.size
+            state.total = r.data.total
+            state.current = r.data.current
+            state.loading = false
+            callback && callback(r)
+        })
+    }
+
+    fetchData()
+    return {
+        ...toRefs(state),
+        fetchData,
+    };
+}
+
+export function useRequest(_url, params = {}, callback) {
+
+    const state = reactive({
+        data: {},
+        loading: false,
+
+    })
+
+    watch(params, () => {
+        fetchData()
+    })
+
+    function fetchData() {
+        state.loading = true
+        request(_url, params).then(r => {
+            state.data = r.data
+            state.loading = false
+            callback&&callback(r)
+        })
+    }
+
+    fetchData()
+    return {
+        ...toRefs(state),
+        fetchData,
+    };
+}
+
+export async function growthRequest(_url, params) {
+    const s = _url.split(' ')
+    let url = s[0]
+    const method = s[1]?.toLowerCase() || 'get'
+    if (method === 'get') {
+        let paramsArray = [];
+        //拼接参数
+        if (params) {
+            Object.keys(params).forEach(key => paramsArray.push(key + '=' + params[key]))
+            if (url.search(/\?/) === -1) {
+                url += '?' + paramsArray.join('&')
+            } else {
+                url += '&' + paramsArray.join('&')
+            }
+        }
+    }
+    const body = method !== 'get' ? params || {} : {}
+    return axios({
+        url,
+        method,
+        headers: {
+            'token': getCookie('token'),
+            ...method !== 'get' ? {'Content-Type': 'application/json'} : {}
+        },
+        ...method !== 'get' ? {data: JSON.stringify(body)} : {}
+    }).then(resp => resp.data).then(response => {
+        if (response.code !== 200 && response.code !== 0) {
+            if (response.code === 1000) (import.meta.env.MODE === 'development' || import.meta.env.MODE === 'test') ? router.push({path: '/login'}) : window.open(window.location.protocol + import.meta.env.VITE_BASE_LOGIN_URL, '_top')
+
+            else if (response.code === 2001) router.push({path: '/FaceTeachSignUp', query: {courseId: router.currentRoute.value.query.courseId,type:3}})
+
+            else if (response.code === 2002) router.push({path: '/FaceTeachNoCommon', query: {courseId: router.currentRoute.value.query.courseId,type:3}})
+            else if (response.code === 9000) ElMessage.warning("该数据已经被删除或停用，请联系管理员");
+
+            // if (import.meta.env.DEV && response.code === 1000) {
+            //     router.push({path: '/login'})
+            // } else {
+            //     window.open()
+            // response.showMsg && notification.open({
+            //     message: response.showMsg,
+            //     duration: 2,
+            // });
+            // }
+        }
+        return response
+    })
+}
+
+export async function boeRequest(_url, params) {
+    const s = _url.split(' ')
+    let url = s[0]
+    const method = s[1]?.toLowerCase() || 'get'
+    if (method === 'get') {
+        let paramsArray = [];
+        //拼接参数
+        if (params) {
+            Object.keys(params).forEach(key => paramsArray.push(key + '=' + params[key]))
+            if (url.search(/\?/) === -1) {
+                url += '?' + paramsArray.join('&')
+            } else {
+                url += '&' + paramsArray.join('&')
+            }
+        }
+    }
+    const body = method !== 'get' ? params || {} : {}
+    return fetch(url, {
+        method,
+        headers: {
+            token: getCookie('token'),
+            ...method !== 'get' ? {'Content-Type': 'application/json'} : {}
+        },
+        ...method !== 'get' ? {body: JSON.stringify(body)} : {}
+    }).then(res => {
+        return res.text()
+    }).then(res => {
+        return JSONBigIntStr.parse(res)
+    })
+}
+
+const httpupload = axios.create({
+    baseURL: process.env.VUE_APP_BASE_API,
+    timeout: 1000 * 15,
+    headers: { "Content-Type": "multipart/form-data" },
+});
+
+export const fileUp = (data) => httpupload.post( import.meta.env.VITE_BASE_API+"/file/upload", data, {
+    headers: { "Content-Type": "multipart/form-data" },
+});

src/main.js

@@ -6,8 +6,16 @@ import ElementPlus from 'element-plus'
 import 'element-plus/dist/index.css'
 import zhCn from 'element-plus/es/locale/lang/zh-cn'
 import "@/assets/scss/common.scss"
+import * as ElementPlusIconsVue from '@element-plus/icons-vue'
+
+
+
 const app = createApp(App)
 app.use(store).use(router).mount('#app')
 app.use(ElementPlus, {
 	locale: zhCn,
-})
+})
+
+for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
+  app.component(key, component)
+}

src/store/index.js

@@ -7,7 +7,7 @@
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
 import { createStore } from 'vuex'
-import { PROJECT_PROCESS, ROUTER_PROCESS } from "@/api/api";
+import { PROJECT_PROCESS, ROUTER_PROCESS,PROFESSIONAL_STUDENT_DETAIL } from "@/api/api";
 import { request } from "@/api/request";
 import { TASK_TYPES } from "@/api/CONST";
 
@@ -15,12 +15,16 @@ export default createStore({
   state: {
     userInfo: {},
     projectInfo: {},
-    routerInfo: {}
+    routerInfo: {},
+    growthInfo:{}
   },
   getters: {
 
   },
   mutations: {
+    SET_GROWTH_INFO(state, info) {
+      state.growthInfo = info;
+    },
     SET_USER(state, userInfo) {
       state.userInfo = userInfo
     },
@@ -121,6 +125,11 @@ export default createStore({
         content.commit('INIT_PROJECT_INFO')
       })
     },
+    getGrowthInfo(content, { routerId }) {
+      request(PROFESSIONAL_STUDENT_DETAIL(routerId)).then(res => {
+        content.commit("SET_GROWTH_INFO", res.data);
+      })
+    },
     getRouterInfo(content, { routerId, chapterId }) {
       request(ROUTER_PROCESS, { routerId, chapterId }).then(res => {
         content.commit('SET_ROUTER_INFO', res.data)

src/views/growth/growthDetails.vue

@@ -0,0 +1,764 @@
+<template>
+  <div class="growth-details">
+    <ReturnHead text="专业力必修" :gohome="true"></ReturnHead>
+    <div class="main">
+      <div class="tabs">
+        <div
+          class="tabs-item"
+          :class="queryParams.type == 1 ? 'active' : ''"
+          @click="tabClick(1)"
+        >
+          <div class="tabs-text">必修</div>
+          <div class="tabs-line"></div>
+        </div>
+        <div
+          class="tabs-item"
+          :class="queryParams.type == 2 ? 'active' : ''"
+          @click="tabClick(2)"
+        >
+          <div class="tabs-text">选修</div>
+          <div class="tabs-line"></div>
+        </div>
+      </div>
+      <div class="search">
+        <div class="search-input">
+          <el-input
+            v-model="queryParams.taskName"
+            border-radius:
+            :input-style="{
+              width: '100%',
+              height: '34px',
+            }"
+            @change="getList"
+            style="width: 240px"
+            placeholder="搜索关键字"
+          />
+        </div>
+        <el-dropdown>
+          <el-icon color="#00000" :size="24">
+            <Filter />
+          </el-icon>
+          <template #dropdown>
+            <el-dropdown-menu>
+              <el-dropdown-item @click="tabClick(null, 0)"
+                >未开始</el-dropdown-item
+              >
+              <el-dropdown-item @click="tabClick(null, 1)"
+                >已完成</el-dropdown-item
+              >
+              <el-dropdown-item @click="tabClick(null, 2)"
+                >进行中</el-dropdown-item
+              >
+            </el-dropdown-menu>
+          </template>
+        </el-dropdown>
+      </div>
+
+      <div
+        class="down"
+        v-loading="loading"
+        :style="stageProcessList.length ? '' : 'height:400px'"
+      >
+        <template v-if="stageProcessList && stageProcessList.length">
+          <div
+            class="project_second"
+            v-for="(item, key) in stageProcessList"
+            :key="key"
+          >
+            <div
+              style="
+                width: 100%;
+                display: flex;
+                flex-direction: column;
+                align-items: center;
+              "
+            >
+              <div class="secondcontent">
+                <div class="question">
+                  <div style="width: calc(100% - 80px)">
+                    <div class="issue" :title="item.taskName">
+                      【{{ TASK_TYPES.typeName[item.courseType] || "" }}】
+                      {{ item.taskName }}
+                    </div>
+                    <div v-if="item.courseType === '1'" class="progressBox">
+                      <!-- <div>当前进度</div> -->
+                      <div
+                        class="progress"
+                        style="
+                          display: flex;
+                          align-items: center;
+                          margin-bottom: 3px;
+                        "
+                      >
+                        <div style="width: 200px">
+                          <el-progress
+                            :percentage="item.progress"
+                            :show-text="false"
+                            :stroke-width="8"
+                            :color="
+                              {
+                                0: 'rgba(238, 112, 108, 1)',
+                                1: 'rgba(255, 151, 38, 1)',
+                                2: 'rgba(39, 122, 255, 1)',
+                                3: 'rgba(59, 94, 251, 1)',
+                                4: 'rgba(57, 219, 183, 1)',
+                                5: 'rgba(57, 219, 183, 1)',
+                              }[item.progress / 20]
+                            "
+                          />
+                        </div>
+                        <div
+                          style="
+                            font-size: 12px;
+                            font-weight: 500;
+                            color: #277aff;
+                            margin-left: 10px;
+                          "
+                          :style="{
+                            color: {
+                              0: 'rgba(238, 112, 108, 1)',
+                              1: 'rgba(255, 151, 38, 1)',
+                              2: 'rgba(39, 122, 255, 1)',
+                              3: 'rgba(59, 94, 251, 1)',
+                              4: 'rgba(57, 219, 183, 1)',
+                              5: 'rgba(57, 219, 183, 1)',
+                            }[item.progress / 20],
+                          }"
+                        >
+                          {{ item.progress }}%
+                        </div>
+                      </div>
+                    </div>
+                    <!-- <div class="coursetag">
+                      <div
+                        class="tag3"
+                        style="margin-right: 11px; margin-top: 3px"
+                      >
+                        {{ TASK_TYPES.typeName[item.courseType] || "" }}
+                      </div>
+                    </div> -->
+                  </div>
+
+                  <el-dropdown trigger="click">
+                    <template v-if="item.completionStatus === '0'">
+                      <div
+                        class="goclass"
+                        @click="toFinish(item)"
+                        style="background: #2478ff"
+                      >
+                        {{ TASK_TYPES.toName[item.courseType] }}
+                      </div>
+                    </template>
+                    <template v-if="item.completionStatus === '1'">
+                      <div
+                        class="goclass"
+                        @click="toFinish(item)"
+                        style="background: #2478ff"
+                      >
+                        已完成
+                      </div>
+                    </template>
+                    <template v-if="item.completionStatus === '2'">
+                      <div
+                        class="goclass"
+                        @click="toFinish(item)"
+                        style="background: #2478ff"
+                      >
+                        进行中
+                      </div>
+                    </template>
+                    <template v-if="item.lastStudy">
+                      <div
+                        class="goclass"
+                        @click="toFinish(item)"
+                        style="background: #999"
+                      >
+                        继续学习
+                      </div>
+                    </template>
+                    <template v-if="item.completionStatus === '10'">
+                      <div
+                        class="goclass"
+                        @click="toFinish(item)"
+                        style="background: #999"
+                      >
+                        未解锁
+                      </div>
+                    </template>
+                    
+                    <!-- <template #dropdown v-if="el.type===2 && el.targetId?.split(',')?.length > 1">
+                    <el-dropdown-menu>
+                      <el-dropdown-item v-for="(name,key) in el.targetName?.split(',')" :key="key" @click="toOffcoursePlanPage(el.targetId?.split(',')[key])">{{ name }}</el-dropdown-item>
+                    </el-dropdown-menu>
+                  </template> -->
+                  </el-dropdown>
+                </div>
+              </div>
+            </div>
+          </div>
+        </template>
+        <template v-else>
+          <el-empty description="暂无数据" />
+        </template>
+      </div>
+    </div>
+    <!-- 开课列表弹框 -->
+    <el-dialog
+      top="120px"
+      title="开课列表"
+      v-model="openCourseVisible"
+      style="
+        min-height: 320px;
+        padding: 0;
+        border-radius: 4px;
+      "
+      width="80%"
+    >
+      <div style="width: 100%; min-height: 210px; margin-top: 12px">
+        <div
+          v-for="(item, key) in openCourseList"
+          style="
+            width: 100%;
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            margin-bottom: 12px;
+            background: rgb(247, 251, 253);
+            height: 40px;
+            padding: 5px;
+            border-radius: 5px;
+          "
+        >
+          <div
+            style="
+              overflow: hidden;
+              white-space: nowrap;
+              text-overflow: ellipsis;
+              width: 200px;
+            "
+          >
+            {{ item }}
+          </div>
+          <div
+            @click="toOffcoursePlanPage(openCourseIdList[key])"
+            style="
+              width: 60px;
+              height: 30px;
+              text-align: center;
+              line-height: 30px;
+              background: #0078fc;
+              border-radius: 5px;
+              color: #fff;
+              cursor: pointer;
+            "
+          >
+            去上课
+          </div>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { computed, reactive, ref, watch, onMounted } from "vue";
+import { ElLoading } from "element-plus";
+import { useRequest, request } from "@/api/request";
+import { growthRequest } from "@/api/growthRequest";
+import {
+  EvaluationToLearn,
+  QueryEvaluationTaskStatusOne,
+  STUDY_RECORD,
+  SubmitExternalExam,
+  PROFESSIONAL_STUDENT_TASKLIST,
+  PROFESSIONAL_STUDENT_LEARN,
+} from "@/api/api";
+import { useRoute, useRouter } from "vue-router";
+import store from "@/store";
+import { ElMessage } from "element-plus";
+import ReturnHead from "@/components/ReturnHead.vue";
+import { GROWTH, TASK_TYPES } from "@/api/CONST";
+import dayjs from "dayjs";
+import { useStore } from "vuex";
+import { changeTime } from "@/api/method";
+const {
+  query: { courseId, routerId, type, infoId, chapterOrStageId, id },
+} = useRoute();
+const router = useRouter();
+const { commit, dispatch, state } = useStore();
+// 专业力必修详情
+const data = computed(() => state.growthInfo);
+// 查询条件
+const queryParams = reactive({
+  type: 1,
+});
+const tabClick = (type, status) => {
+  // 选修/必修
+  if (type) {
+    queryParams.type = type;
+  }
+  // 任务状态
+  if (status) {
+    queryParams.completionStatus = status;
+  }
+  getList();
+};
+
+console.log(data.value);
+watch(data, () => {
+  if (data.value.code === 6) {
+    router.push({
+      path: "/notpath",
+    });
+  }
+});
+// 学习任务列表
+const stageProcessList = ref([]);
+onMounted(() => {
+  dispatch("getGrowthInfo", { routerId, type });
+  getList();
+});
+
+// 是否加载数据中
+const loading = ref(false);
+const getList = () => {
+  loading.value = true;
+  growthRequest(PROFESSIONAL_STUDENT_TASKLIST, {
+    growthId: routerId,
+    ...queryParams,
+  }).then((res) => {
+    console.log(res);
+    stageProcessList.value = res.data;
+    loading.value = false;
+  });
+};
+const openCourseVisible = ref(false);
+const openCourseList = ref([]);
+const openCourseIdList = ref([]);
+
+const userInfo = computed(() => store.state.userInfo);
+
+async function toFinish(d) {
+  if (d.completionStatus == 10) {
+    ElMessage.warning("当前未解锁");
+    return;
+  }
+  //更新学员当前任务
+  await growthRequest(PROFESSIONAL_STUDENT_LEARN, {
+    growthId: routerId,
+    taskId: d.taskId,
+  });
+
+  if (d.courseType === "2") {
+    if (!d.targetId) {
+      return ElMessage.error("还未添加开课,请联系管理员！");
+    }
+    if (d.targetId.split(",").length > 1) {
+      openCourseList.value = d.targetName?.split(",");
+      openCourseIdList.value = d.targetId?.split(",");
+      openCourseVisible.value = true;
+      return;
+    }
+  }
+
+  // 作业过期判断
+  if (d.courseType == 4) {
+    let date1 = new Date(d.info.submitEndTime).getTime();
+    let date2 = new Date().getTime();
+    if (date1 < date2) {
+      dialogVisibleTip.value = "当前作业已结束";
+      dialogVisible.value = true;
+      //return
+    }
+  }
+  // 直播结束时间
+  if (d.courseType == 6) {
+    let date1 = new Date(d.info.liveEndTime).getTime();
+    let date2 = new Date().getTime();
+    if (date1 < date2) {
+      dialogVisibleTip.value = "当前直播已结束";
+      dialogVisible.value = true;
+      //return
+    }
+  }
+  // 考试 停用
+  if (d.courseType == 5) {
+    // 此处判断外部考试跳转
+    if (d.info.examType == 2) {
+      // 点击即更新状态 进行中
+      request(SubmitExternalExam, {
+        chapterId: 0,
+        externalId: d.courseId,
+        externalName: d.taskName,
+        targetId: data.value.id,
+        studentNo: userInfo.value.userNo,
+      })
+        .then((res) => {
+          console.log(res);
+        })
+        .catch((err) => {
+          console.log(err);
+        });
+      router.push({
+        path: "/externalexam",
+        query: {
+          courseId: d.courseId ? d.courseId : d.info.id,
+          type: GROWTH,
+        },
+      });
+      return;
+    }
+  }
+
+  // 其他活动 结束时间
+  if (d.courseType == 9) {
+    let date1 = new Date(d.info.activityEndTime).getTime();
+    let date2 = new Date().getTime();
+    if (date1 < date2) {
+      dialogVisibleTip.value = "当前活动已结束";
+      dialogVisible.value = true;
+      //return
+    }
+  }
+
+  // 测评模块 请求接口跳转新的页面 - 新增 暂时未调试 目前无测评数据 2023-02-04
+  if (d.courseType == 10) {
+    if (d.completionStatus != 1) {
+      // 肯定没有完成测评
+      // 调用接口 跳转页面
+      request(EvaluationToLearn, {
+        businessType: "project",
+        chapterId: 0,
+        courseId: d.courseId,
+        quizKid: d.info.evaluationTypeId,
+        routerOrProjectId: routerId,
+        studentId: userInfo.value.id,
+        studentName: userInfo.value.realName,
+      })
+        .then((res) => {
+          console.log(res);
+          if (res.code == 200) {
+            let jumpUrl = res.data.quizUrl;
+            // 此处写跳转url
+            window.open(jumpUrl, "_top");
+          }
+        })
+        .catch((err) => {
+          console.log(err);
+        });
+      return;
+    } else {
+      // 进行中 或者 已完成
+      // 调用接口 判断当前测评状态 跳转页面
+      console.log("我是查询测评跳转链接所传递得参数", {
+        quizTaskId: d.quizTaskId,
+      });
+      request(QueryEvaluationTaskStatusOne, {
+        quizTaskId: d.quizTaskId,
+      })
+        .then((res) => {
+          console.log(res);
+          if (res.code == 200) {
+            if (res.data.complete_status == 2) {
+              ElMessage.error("您已完成测评");
+              return;
+            } else {
+              // 重新查询跳转
+              // 调用接口 跳转页面
+              console.log("我是查询测评跳转链接所传递得参数", {
+                businessType: "project",
+                chapterId: 0,
+                courseId: d.courseId,
+                quizKid: d.info.evaluationTypeId,
+                routerOrProjectId: routerId,
+                studentId: userInfo.value.id,
+                studentName: userInfo.value.realName,
+              });
+              request(EvaluationToLearn, {
+                businessType: "project",
+                chapterId: 0,
+                courseId: d.courseId ? d.courseId : d.info.id,
+                quizKid: d.info.evaluationTypeId,
+                routerOrProjectId: routerId,
+                studentId: userInfo.value.id,
+                studentName: userInfo.value.realName,
+              })
+                .then((res) => {
+                  console.log(res);
+                  if (res.code == 200) {
+                    let jumpUrl = res.data.quizUrl;
+                    // 此处写跳转url
+                    window.open(jumpUrl, "_top");
+                  }
+                })
+                .catch((err) => {
+                  console.log(err);
+                });
+              return;
+            }
+          }
+        })
+        .catch((err) => {
+          console.log(err);
+        });
+      return;
+    }
+  }
+
+  if (!TASK_TYPES.path[d.courseType]) {
+    ElMessage.error("暂时未开放");
+    return;
+  }
+
+  if (
+    d.courseType == 3 ||
+    d.courseType == 7 ||
+    (d.courseType == 5 && d.examType == 2)
+  ) {
+    console.log(d, data.value);
+    await request(STUDY_RECORD, {
+      studentId: userInfo.value.id,
+      targetId: data.value.id,
+      logo: GROWTH,
+      type: GROWTH,
+      stageOrChapterId: 0,
+      taskId: d.id,
+      taskType: d.courseType,
+    });
+  }
+
+  if (typeof TASK_TYPES.path[d.courseType] === "string") {
+    TASK_TYPES.path[d.courseType] &&
+      TASK_TYPES.path[d.courseType].startsWith("http") &&
+      window.open(TASK_TYPES.path[d.type] + d.targetId, "_top");
+    TASK_TYPES.path[d.courseType] &&
+      TASK_TYPES.path[d.courseType].startsWith("/") &&
+      router.push({
+        path: TASK_TYPES.path[d.courseType],
+        query: {
+          id: d.id,
+          type: GROWTH,
+          projectId: d.courseId,
+          infoId: data.value.id,
+          courseId: d.courseId ? d.courseId : d.info.id,
+          pName: data.value.growthName,
+          sName: d.taskName,
+          chapterOrStageId: 0,
+          
+          // id: d.id,
+          // type: PROJECT,
+          // infoId: data.value.projectId,
+          // courseId: d.courseId,
+          // pName: data.value.name,
+          // sName,
+          // chapterOrStageId: chapterOrStageId,
+          // studentId: userInfo.value.id,
+          // status: d.status,
+          // targetId: d.targetId,
+          // evaType: d.evaType,
+          // btype: 1,
+          // quizTaskId: d.quizTaskId,
+        },
+      });
+  } else if (typeof TASK_TYPES.path[d.courseType] === "function") {
+    if (d.courseType == 5) {
+      let params = {
+        examType: d.info.examType,
+      };
+      window.open(
+        TASK_TYPES.path[d.courseType](params) + d.info.examinationPaperId,
+        "_top"
+      );
+    } else {
+      let params = {
+        courseId: d.courseId ? d.courseId : d.info.id,
+        targetId: d.targetId ? d.targetId : "",
+      };
+      TASK_TYPES.path[d.courseType](params);
+    }
+  }
+}
+function toOffcoursePlanPage(id) {
+  window.open(
+    `${location.protocol}//${location.host}${
+      import.meta.env.VITE_BASE_API
+    }/stu/project/redirectDetail?courseId=${id}`,
+    "_top"
+  );
+}
+</script>
+
+<style lang="scss" scoped>
+.growth-details {
+  padding: 0 15px 0 10px;
+  height: 100vh;
+  box-sizing: border-box;
+  background-color: #ffffff;
+  .el-dialog__body {
+    width: 80%;
+  }
+  :deep(.el-dialog__body){
+    padding-top: 0px;
+  }
+  .el-dialog__header {
+    display: none;
+  }
+  width: 100%;
+
+  .tabs {
+    padding: 12px 0 9px 0;
+    background-color: #ffffff;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    .tabs-item {
+      width: 135px;
+      display: flex;
+      align-items: center;
+      flex-direction: column;
+      font-size: 18px;
+      font-weight: 700;
+    }
+    .tabs-line {
+      width: 135px;
+      height: 1px;
+      margin-top: 2px;
+    }
+    .active {
+      color: #2478ff;
+      .tabs-line {
+        background-color: #61a4f9;
+      }
+    }
+  }
+  .main {
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    //justify-content: center;
+    .up {
+      width: 100%;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      //justify-content: center;
+      background-color: rgba(255, 255, 255, 1);
+      .content {
+        width: 90%;
+        display: flex;
+        flex-direction: column;
+        .title {
+          margin-top: 15.5px;
+          font-size: 14px;
+          font-weight: 700;
+          line-height: 21.6px;
+          color: rgba(4, 36, 60, 1);
+        }
+        .text2 {
+          display: flex;
+          margin-top: 10px;
+          margin-bottom: 22.5px;
+          font-size: 13px;
+          color: rgba(51, 51, 48, 1);
+          line-height: 24px;
+          text-overflow: ellipsis;
+          overflow: hidden;
+        }
+      }
+    }
+    .search {
+      display: flex;
+      align-items: center;
+      .search-input {
+        flex: 1;
+      }
+
+      :deep(.el-input__wrapper) {
+        box-shadow: none;
+        padding-left: 0;
+      }
+      :deep(.el-input__inner) {
+        padding-left: 40px;
+        background-color: #eee;
+        border-radius: 10px;
+      }
+    }
+    .down {
+      width: 100%;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      //justify-content: center;
+      background-color: rgba(255, 255, 255, 1);
+      .project_title {
+        width: calc(100% - 36.5px);
+        display: flex;
+        font-size: 16px;
+        font-weight: 500;
+        line-height: 12px;
+        color: rgba(13, 35, 58, 1);
+        padding: 17px 0 17px 36.5px;
+        border-bottom: 0.5px solid rgba(241, 242, 243, 1);
+      }
+
+      .project_second {
+        width: 100%;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        margin-top: 10.5px;
+        .secondcontent {
+          width: 100%;
+
+          display: flex;
+          flex-direction: column;
+          justify-content: center;
+          margin-top: 10px;
+          .question {
+            width: 100%;
+            display: flex;
+            padding-left: 6px;
+            box-sizing: border-box;
+            position: relative;
+            height: 72px;
+            border-bottom: 0.5px solid rgba(241, 242, 243, 1);
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            flex-wrap: wrap;
+
+            .issue {
+              width: 100%;
+              font-size: 13px;
+              line-height: 30.29px;
+              color: rgba(110, 123, 132, 1);
+              overflow: hidden;
+              text-overflow: ellipsis;
+              white-space: nowrap;
+            }
+            .coursetag {
+              display: flex;
+              flex-wrap: wrap;
+            }
+            .goclass {
+              width: 63px;
+              height: 23px;
+              background: #2478ff;
+              // box-shadow: 0px 1px 8px 0px rgba(56, 125, 247, 0.7);
+              border-radius: 4px;
+              font-size: 14px;
+              font-weight: 800;
+              color: #ffffff;
+              display: flex;
+              align-items: center;
+              justify-content: center;
+              // margin-right: 37px;
+              cursor: pointer;
+            }
+          }
+        }
+      }
+    }
+  }
+}
+</style>

src/views/growth/growthPath.vue

@@ -0,0 +1,589 @@
+<template>
+  <div class="growth-path">
+    <div class="nav">
+      <ReturnHead text="专业力必修" :gohome="true"></ReturnHead>
+      <div class="tabs">
+        <div
+          class="tabs-item"
+          :class="queryParams.type == 1 ? 'active' : ''"
+          @click="tabClick(1)"
+        >
+          <div class="tabs-text">必修</div>
+          <div class="tabs-line"></div>
+        </div>
+        <div
+          class="tabs-item"
+          :class="queryParams.type == 2 ? 'active' : ''"
+          @click="tabClick(2)"
+        >
+          <div class="tabs-text">选修</div>
+          <div class="tabs-line"></div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 占位容器防止塌陷 -->
+    <div class="placeholder"></div>
+
+    <div
+      class="path-container"
+      v-loading="loading"
+      :style="stageProcessList.length ? '' : 'height:400px'"
+    >
+      <template v-if="stageProcessList && stageProcessList.length">
+        <div
+          class="path-item"
+          @click="toFinish(item)"
+          v-for="(item, index) of stageProcessList"
+          :key="item.id"
+        >
+          <div class="item-content">
+            <div class="icon">
+              <template v-if="item.lastStudy">
+                <img
+                  style="width: 100%; height: 100%"
+                  src="@/assets/image/growth/growth-icon4.png"
+                />
+              </template>
+              <template v-else-if="item.completionStatus === '1'">
+                <img
+                  style="width: 100%; height: 100%"
+                  src="@/assets/image/growth/growth-icon1.png"
+                />
+              </template>
+              <template v-else-if="item.completionStatus === '2'">
+                <img
+                  style="width: 100%; height: 100%"
+                  src="@/assets/image/growth/growth-icon2.png"
+                />
+              </template>
+              <template
+                v-else-if="
+                  item.completionStatus === '0' ||
+                  item.completionStatus === '10'
+                "
+              >
+                <img
+                  style="width: 100%; height: 100%"
+                  src="@/assets/image/growth/growth-icon3.png"
+                />
+              </template>
+            </div>
+            <template v-if="item.completionStatus !== '2'">
+              <div class="item-text">
+                {{
+                  `${item.taskName}${
+                    item.completionStatus === "10" ? "（未解锁）" : ""
+                  }`
+                }}
+              </div>
+            </template>
+            <template v-else>
+              <div class="item-progress">
+                <div
+                  :style="{
+                    width: `${item.progress}%`,
+                  }"
+                  class="progress-content"
+                >
+                  <div class="rocket">
+                    <img
+                      style="width: 100%; height: 100%"
+                      src="@/assets/image/growth/rocket.png"
+                    />
+                  </div>
+                </div>
+                <div class="progress-text">{{ item.taskName }}</div>
+              </div>
+            </template>
+          </div>
+          <template v-if="index != stageProcessList.length - 1">
+            <div
+              class="gap"
+              :style="{
+                height: item.completionStatus !== '2' ? '48px' : '70px',
+              }"
+            >
+              <!-- 虚线不可删除 -->
+              <div></div>
+            </div>
+          </template>
+        </div>
+      </template>
+      <template v-else>
+        <el-empty description="暂无数据" />
+      </template>
+    </div>
+    <el-dialog
+      top="120px"
+      title="开课列表"
+      v-model="openCourseVisible"
+      style="
+        min-height: 320px;
+        padding: 0;
+        border-radius: 4px;
+      "
+      width="80%"
+    >
+      <div style="width: 100%; min-height: 210px; margin-top: 12px">
+        <div
+          v-for="(item, key) in openCourseList"
+          style="
+            width: 100%;
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            margin-bottom: 12px;
+            background: rgb(247, 251, 253);
+            height: 40px;
+            padding: 5px;
+            border-radius: 5px;
+          "
+        >
+          <div
+            style="
+              overflow: hidden;
+              white-space: nowrap;
+              text-overflow: ellipsis;
+              width: 200px;
+            "
+          >
+            {{ item }}
+          </div>
+          <div
+            @click="toOffcoursePlanPage(openCourseIdList[key])"
+            style="
+              width: 60px;
+              height: 30px;
+              text-align: center;
+              line-height: 30px;
+              background: #0078fc;
+              border-radius: 5px;
+              color: #fff;
+              cursor: pointer;
+            "
+          >
+            去上课
+          </div>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import ReturnHead from "@/components/ReturnHead.vue";
+import { computed, reactive, onMounted, onUnmounted, ref } from "vue";
+import { useRoute, useRouter } from "vue-router";
+import { useRequest, request } from "@/api/request";
+import { growthRequest } from "@/api/growthRequest";
+import { GROWTH, TASK_TYPES } from "@/api/CONST";
+import { ElMessage } from "element-plus";
+import {
+  EvaluationToLearn,
+  QueryEvaluationTaskStatusOne,
+  STUDY_RECORD,
+  SubmitExternalExam,
+  PROFESSIONAL_STUDENT_TASKLIST,
+  PROFESSIONAL_STUDENT_LEARN,
+} from "@/api/api";
+import { useStore } from "vuex";
+import store from "@/store";
+const { commit, dispatch, state } = useStore();
+const {
+  query: { courseId, routerId, type, infoId, chapterOrStageId, id },
+} = useRoute();
+const router = useRouter();
+// 专业力必修详情
+const data = computed(() => state.growthInfo);
+const userInfo = computed(() => store.state.userInfo);
+// 查询条件
+const queryParams = reactive({
+  type: 1,
+});
+const tabClick = (type, status) => {
+  // 选修/必修
+  if (type) {
+    queryParams.type = type;
+  }
+  // 任务状态
+  if (status) {
+    queryParams.completionStatus = status;
+  }
+  getList();
+};
+
+// 是否加载数据中
+const loading = ref(false);
+const getList = () => {
+  loading.value = true;
+  growthRequest(PROFESSIONAL_STUDENT_TASKLIST, {
+    growthId: routerId,
+    ...queryParams,
+  }).then((res) => {
+    console.log(res);
+    stageProcessList.value = res.data;
+    loading.value = false;
+  });
+};
+// 学习任务列表
+const stageProcessList = ref([]);
+onMounted(() => {
+  dispatch("getGrowthInfo", { routerId, type });
+  getList();
+});
+const openCourseVisible = ref(false);
+const openCourseList = ref([]);
+const openCourseIdList = ref([]);
+
+async function toFinish(d) {
+  if (d.completionStatus == 10) {
+    ElMessage.warning("当前未解锁");
+    return;
+  }
+  //更新学员当前任务
+  await growthRequest(PROFESSIONAL_STUDENT_LEARN, {
+    growthId: routerId,
+    taskId: d.taskId,
+  });
+
+  if (d.courseType === "2") {
+    if (!d.targetId) {
+      return ElMessage.error("还未添加开课,请联系管理员！");
+    }
+    if (d.targetId.split(",").length > 1) {
+      openCourseList.value = d.targetName?.split(",");
+      openCourseIdList.value = d.targetId?.split(",");
+      openCourseVisible.value = true;
+      return;
+    }
+  }
+
+  // 作业过期判断
+  if (d.courseType == 4) {
+    let date1 = new Date(d.info.submitEndTime).getTime();
+    let date2 = new Date().getTime();
+    if (date1 < date2) {
+      dialogVisibleTip.value = "当前作业已结束";
+      dialogVisible.value = true;
+      //return
+    }
+  }
+  // 直播结束时间
+  if (d.courseType == 6) {
+    let date1 = new Date(d.info.liveEndTime).getTime();
+    let date2 = new Date().getTime();
+    if (date1 < date2) {
+      dialogVisibleTip.value = "当前直播已结束";
+      dialogVisible.value = true;
+      //return
+    }
+  }
+  // 考试 停用
+  if (d.courseType == 5) {
+    // 此处判断外部考试跳转
+    if (d.info.examType == 2) {
+      // 点击即更新状态 进行中
+      request(SubmitExternalExam, {
+        chapterId: 0,
+        externalId: d.courseId,
+        externalName: d.taskName,
+        targetId: data.value.id,
+        studentNo: userInfo.value.userNo,
+      })
+        .then((res) => {
+          console.log(res);
+        })
+        .catch((err) => {
+          console.log(err);
+        });
+      router.push({
+        path: "/externalexam",
+        query: {
+          courseId: d.courseId ? d.courseId : d.info.id,
+          type: GROWTH,
+        },
+      });
+      return;
+    }
+  }
+
+  // 其他活动 结束时间
+  if (d.courseType == 9) {
+    let date1 = new Date(d.info.activityEndTime).getTime();
+    let date2 = new Date().getTime();
+    if (date1 < date2) {
+      dialogVisibleTip.value = "当前活动已结束";
+      dialogVisible.value = true;
+      //return
+    }
+  }
+
+  // 测评模块 请求接口跳转新的页面 - 新增 暂时未调试 目前无测评数据 2023-02-04
+  if (d.courseType == 10) {
+    if (d.completionStatus != 1) {
+      // 肯定没有完成测评
+      // 调用接口 跳转页面
+      request(EvaluationToLearn, {
+        businessType: "project",
+        chapterId: 0,
+        courseId: d.courseId,
+        quizKid: d.info.evaluationTypeId,
+        routerOrProjectId: routerId,
+        studentId: userInfo.value.id,
+        studentName: userInfo.value.realName,
+      })
+        .then((res) => {
+          console.log(res);
+          if (res.code == 200) {
+            let jumpUrl = res.data.quizUrl;
+            // 此处写跳转url
+            window.open(jumpUrl, "_top");
+          }
+        })
+        .catch((err) => {
+          console.log(err);
+        });
+      return;
+    } else {
+      // 进行中 或者 已完成
+      // 调用接口 判断当前测评状态 跳转页面
+      console.log("我是查询测评跳转链接所传递得参数", {
+        quizTaskId: d.quizTaskId,
+      });
+      request(QueryEvaluationTaskStatusOne, {
+        quizTaskId: d.quizTaskId,
+      })
+        .then((res) => {
+          console.log(res);
+          if (res.code == 200) {
+            if (res.data.complete_status == 2) {
+              ElMessage.error("您已完成测评");
+              return;
+            } else {
+              // 重新查询跳转
+              // 调用接口 跳转页面
+              console.log("我是查询测评跳转链接所传递得参数", {
+                businessType: "project",
+                chapterId: 0,
+                courseId: d.courseId,
+                quizKid: d.info.evaluationTypeId,
+                routerOrProjectId: routerId,
+                studentId: userInfo.value.id,
+                studentName: userInfo.value.realName,
+              });
+              request(EvaluationToLearn, {
+                businessType: "project",
+                chapterId: 0,
+                courseId: d.courseId ? d.courseId : d.info.id,
+                quizKid: d.info.evaluationTypeId,
+                routerOrProjectId: routerId,
+                studentId: userInfo.value.id,
+                studentName: userInfo.value.realName,
+              })
+                .then((res) => {
+                  console.log(res);
+                  if (res.code == 200) {
+                    let jumpUrl = res.data.quizUrl;
+                    // 此处写跳转url
+                    window.open(jumpUrl, "_top");
+                  }
+                })
+                .catch((err) => {
+                  console.log(err);
+                });
+              return;
+            }
+          }
+        })
+        .catch((err) => {
+          console.log(err);
+        });
+      return;
+    }
+  }
+
+  if (!TASK_TYPES.path[d.courseType]) {
+    ElMessage.error("暂时未开放");
+    return;
+  }
+
+  if (
+    d.courseType == 3 ||
+    d.courseType == 7 ||
+    (d.courseType == 5 && d.examType == 2)
+  ) {
+    console.log(d, data.value);
+    await request(STUDY_RECORD, {
+      studentId: userInfo.value.id,
+      targetId: data.value.id,
+      logo: GROWTH,
+      type: GROWTH,
+      stageOrChapterId: 0,
+      taskId: d.id,
+      taskType: d.courseType,
+    });
+  }
+
+  if (typeof TASK_TYPES.path[d.courseType] === "string") {
+    TASK_TYPES.path[d.courseType] &&
+      TASK_TYPES.path[d.courseType].startsWith("http") &&
+      window.open(TASK_TYPES.path[d.type] + d.targetId, "_top");
+    TASK_TYPES.path[d.courseType] &&
+      TASK_TYPES.path[d.courseType].startsWith("/") &&
+      router.push({
+        path: TASK_TYPES.path[d.courseType],
+        query: {
+          id: d.id,
+          type: GROWTH,
+          projectId: d.courseId,
+          infoId: data.value.id,
+          courseId: d.courseId ? d.courseId : d.info.id,
+          pName: data.value.growthName,
+          sName: d.taskName,
+          chapterOrStageId: 0,
+
+          // id: d.id,
+          // type: PROJECT,
+          // infoId: data.value.projectId,
+          // courseId: d.courseId,
+          // pName: data.value.name,
+          // sName,
+          // chapterOrStageId: chapterOrStageId,
+          // studentId: userInfo.value.id,
+          // status: d.status,
+          // targetId: d.targetId,
+          // evaType: d.evaType,
+          // btype: 1,
+          // quizTaskId: d.quizTaskId,
+        },
+      });
+  } else if (typeof TASK_TYPES.path[d.courseType] === "function") {
+    if (d.courseType == 5) {
+      let params = {
+        examType: d.info.examType,
+      };
+      window.open(
+        TASK_TYPES.path[d.courseType](params) + d.info.examinationPaperId,
+        "_top"
+      );
+    } else {
+      let params = {
+        courseId: d.courseId ? d.courseId : d.info.id,
+        targetId: d.targetId ? d.targetId : "",
+      };
+      TASK_TYPES.path[d.courseType](params);
+    }
+  }
+}
+function toOffcoursePlanPage(id) {
+  window.open(
+    `${location.protocol}//${location.host}${
+      import.meta.env.VITE_BASE_API
+    }/stu/project/redirectDetail?courseId=${id}`,
+    "_top"
+  );
+}
+</script>
+
+<style lang="scss" scoped>
+.growth-path {
+  min-height: 100vh;
+  background-color: #ffffff;
+
+  :deep(.el-dialog__body){
+    padding-top: 0px;
+  }
+  .path-item {
+    .item-content {
+      display: flex;
+      align-items: center;
+      .progress-content {
+        position: relative;
+        height: 15px;
+        border-radius: 16px;
+        height: 15px;
+        background: linear-gradient(90deg, #fecd49 0%, #e13915 100%);
+        .rocket {
+          position: absolute;
+          width: 36px;
+          height: 36px;
+          right: -18px;
+          top: -11px;
+        }
+      }
+      .item-progress {
+        position: relative;
+        height: 15px;
+        border-radius: 16px;
+        flex: 1;
+        background: #ededed;
+        margin-left: 6px;
+        .progress-text {
+          position: absolute;
+          top: 22px;
+        }
+      }
+      .icon {
+        width: 20px;
+        height: 20px;
+      }
+      .item-text {
+        margin-left: 10px;
+      }
+    }
+    .gap {
+      display: flex;
+      justify-content: center;
+      width: 20px;
+      div {
+        height: 100%;
+        border-left: 1px dashed #c5c6ca;
+        width: 1px;
+      }
+    }
+  }
+
+  .path-container {
+    padding: 28px;
+  }
+  .placeholder {
+    height: 98px;
+  }
+  .nav {
+    position: fixed;
+    left: 0;
+    right: 0;
+    background-color: #f6f6f6;
+  }
+  .tabs {
+    height: 44px;
+    padding: 12px 0 9px 0;
+    margin-top: 10px;
+    box-sizing: border-box;
+    background-color: #ffffff;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    .tabs-item {
+      width: 135px;
+      display: flex;
+      align-items: center;
+      flex-direction: column;
+      font-size: 18px;
+      font-weight: 700;
+    }
+    .tabs-line {
+      width: 135px;
+      height: 1px;
+      margin-top: 2px;
+    }
+    .active {
+      color: #2478ff;
+      .tabs-line {
+        background-color: #61a4f9;
+      }
+    }
+  }
+}
+</style>

vite.config.js

@@ -17,7 +17,7 @@ const path = require("path");
 
 export default defineConfig(({ command, mode }) =>
   ({
-    host: "192.158.3.51",
+    // host: "192.158.3.51",
     base: loadEnv(mode, process.cwd()).VITE_BASE,
     build: {
       outDir: loadEnv(mode, process.cwd()).VITE_OUTPUT_DIR,
@@ -41,8 +41,13 @@ export default defineConfig(({ command, mode }) =>
       ]
     },
     server: {
-      host: "192.168.3.51",
+      // host: "192.168.3.51",
       proxy: {
+        "/professional": {
+				// target: 'http://192.168.237.141:32002',
+				target: 'http://192.168.150.97:32002',
+				changeOrigin: true,
+			  },
         "/file/upload": {
           target: loadEnv(mode, process.cwd()).VITE_PROXY_URL,
           changeOrigin: true,