feat:修改学习路径图状态

src/views/roadmap/LearnPath.vue

@@ -6,15 +6,15 @@
           <div @click="returnfun" class="text">学习路径图</div>
           <div class="info" style="margin-right: 14px" v-if="userInfo.jobName">
             <img
-                style="width: 20px; height: 18px; margin-right: 10px"
-                src="../../assets/image/pm.png"
+              style="width: 20px; height: 18px; margin-right: 10px"
+              src="../../assets/image/pm.png"
             />
             <div style="margin-top: 1px">{{ userInfo.jobName }}</div>
           </div>
           <div class="info" v-if="userInfo.bandDesc">
             <img
-                style="width: 18px; height: 17px; margin-right: 11px"
-                src="../../assets/image/band.png"
+              style="width: 18px; height: 17px; margin-right: 11px"
+              src="../../assets/image/band.png"
             />
             <div style="margin-top: 2px">{{ userInfo.bandDesc }}</div>
           </div>
@@ -58,9 +58,9 @@
           <!--          </el-popover>-->
         </div>
         <div
-            :style="{ display: showmapdetail ? 'flex' : 'none' }"
-            class="titleR"
-            @click="returnfun"
+          :style="{ display: showmapdetail ? 'flex' : 'none' }"
+          class="titleR"
+          @click="returnfun"
         >
           返回列表
         </div>
@@ -70,29 +70,29 @@
         <div style="min-width: 770px; width: 100%">
           <el-table :data="data" style="width: 100%" @row-click="gofun">
             <el-table-column
-                prop="img"
-                label="缩略图"
-                #default="scope"
-                align="center"
-                width="255"
+              prop="img"
+              label="缩略图"
+              #default="scope"
+              align="center"
+              width="255"
             >
               <img
-                  :src="scope.row.picUrl"
-                  style="width: 230px; height: 155px"
+                :src="scope.row.picUrl"
+                style="width: 230px; height: 155px"
               />
             </el-table-column>
-            <el-table-column align="center" prop="name" label="路径名称"/>
+            <el-table-column align="center" prop="name" label="路径名称" />
             <el-table-column
-                align="center"
-                prop="introduce"
-                label="路径介绍"
-                #default="scope"
+              align="center"
+              prop="introduce"
+              label="路径介绍"
+              #default="scope"
             >
               <el-popover
-                  placement="top-start"
-                  title="路径介绍"
-                  trigger="hover"
-                  :content="scope.row.remark"
+                placement="top-start"
+                title="路径介绍"
+                trigger="hover"
+                :content="scope.row.remark"
               >
                 <template #reference>
                   <div>{{ scope.row.remark }}</div>
@@ -101,19 +101,28 @@
             </el-table-column>
 
             <el-table-column
-                align="center"
-                prop="organizationName"
-                label="归属组织"
+              align="center"
+              prop="organizationName"
+              label="归属组织"
             />
             <el-table-column
-                #default="scope"
-                align="center"
-                :width="150"
-                prop="state"
-                label="状态"
+              #default="scope"
+              align="center"
+              :width="150"
+              prop="state"
+              label="状态"
             >
-              <img :src="ongoing"
-                   style="width: 99px; height: 99px"
+              <img
+                :src="
+                  scope.row.status === 0
+                    ? ongoing
+                    : scope.row.status === 1
+                    ? completed
+                    : scope.row.status === -1
+                    ? nostarted
+                    : null
+                "
+                style="width: 99px; height: 99px"
               />
             </el-table-column>
           </el-table>
@@ -124,11 +133,11 @@
       <!-- 路径列表-->
       <!-- 路径详情图 -->
       <div
-          :style="{ display: showmapdetail ? 'flex' : 'none' }"
-          class="mapdetail"
+        :style="{ display: showmapdetail ? 'flex' : 'none' }"
+        class="mapdetail"
       >
         <div v-for="(item, i) in detail?.rows" :key="i">
-          <img :src="useImage(`222_0${i + 2}.png`)"/>
+          <img :src="useImage(`222_0${i + 2}.png`)" />
         </div>
         <!--        <div class="modal"-->
         <!--             style="width: calc(100% - 168px); height: 525px;background-image: url('../../src/assets/image/mapdetail.png');background-size: 100%;background-repeat: no-repeat;">-->
@@ -139,24 +148,24 @@
   </div>
 </template>
 <script setup>
-import {reactive, toRefs, ref, onMounted, computed} from "vue";
+import { reactive, toRefs, ref, onMounted, computed } from "vue";
 import nostarted from "../../assets/image/nostarted.png";
 import completed from "../../assets/image/completed.png";
 import ongoing from "../../assets/image/ongoing.png";
-import {boeRequest, request, usePage, useRequest} from "@/api/request";
+import { boeRequest, request, usePage, useRequest } from "@/api/request";
 import {
   ROUTER_CHAPTER_LIST,
   ROUTER_LIST,
   ROUTER_UNCOMPLETE_LIST,
 } from "@/api/api";
-import {useImage} from "@/api/utils";
-import {useRouter} from "vue-router";
+import { useImage } from "@/api/utils";
+import { useRouter } from "vue-router";
 import store from "@/store";
 
 const detail = ref();
 const userInfo = computed(() => store.state.userInfo);
-const {data} = usePage(ROUTER_LIST, {});
-
+const { data } = usePage(ROUTER_LIST, {});
+console.log("datadata", data);
 const router = useRouter();
 
 // const {unCompleteTaskList} = useRequest(ROUTER_UNCOMPLETE_LIST, {});
@@ -164,29 +173,33 @@ const router = useRouter();
 const state = reactive({
   showmapdetail: false,
 });
-const {showmapdetail} = toRefs(state);
+const { showmapdetail } = toRefs(state);
 
 const returnfun = () => {
   state.showmapdetail = false;
 };
 
-async function gofun({routerId, name: routerName}) {
+async function gofun({ routerId, name: routerName }) {
   // console.log(routerId)
   // const data = await request(ROUTER_CHAPTER_LIST, {stuChapterListVo: {routerId}})
   // detail.value = data.data
   // state.showmapdetail = true;
   // router.push({path: "/pathdetails", query: {routerId}});
-  import.meta.env.MODE === 'development' ? router.push({
-    path: "/pathdetails",
-    query: {routerId, routerName}
-  }) : window.open(`http://u-pre.boe.com/pc/forward?to=/fe-student/pathdetails&params=${encodeURIComponent(`routerId=${routerId}&routerName=${routerName}`)}`)
+  import.meta.env.MODE === "development"
+    ? router.push({
+        path: "/pathdetails",
+        query: { routerId, routerName },
+      })
+    : window.open(
+        `http://u-pre.boe.com/pc/forward?to=/fe-student/pathdetails&params=${encodeURIComponent(
+          `routerId=${routerId}&routerName=${routerName}`
+        )}`
+      );
 }
 
-function toUnTask() {
-}
+function toUnTask() {}
 </script>
 <style lang="scss">
-
 .modal {
 }