From bf1fa019d5567060ce560317c558645e57186c21 Mon Sep 17 00:00:00 2001
From: lixg <lixg@dongwu-inc.com>
Date: Wed, 1 Feb 2023 10:01:29 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E5=A2=9E=E5=8A=A0=E6=96=87=E4=BB=B6?=
 =?UTF-8?q?=E4=BB=93=E5=BA=93=E6=95=B0=E6=8D=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/api.js                              |   4 +-
 src/assets/image/file/file.png              | Bin 0 -> 495 bytes
 src/assets/image/file/pngpic.png            | Bin 0 -> 1036 bytes
 src/components/ReturnHead.vue               |  28 ++-
 src/views/filestorag/fileStorag.vue         | 195 ++++++++++++--------
 src/views/pathmap/LevelList.vue             |   8 +-
 src/views/projectdetails/ProjectPath.vue    |   4 +-
 src/views/projectdetails/projectDetails.vue |   6 +-
 8 files changed, 158 insertions(+), 87 deletions(-)
 create mode 100644 src/assets/image/file/file.png
 create mode 100644 src/assets/image/file/pngpic.png

diff --git a/src/api/api.js b/src/api/api.js
index 4213a66..821f1ef 100644
--- a/src/api/api.js
+++ b/src/api/api.js
@@ -2,7 +2,7 @@
  * @Author: lixg lixg@dongwu-inc.com
  * @Date: 2023-01-13 11:42:48
  * @LastEditors: lixg lixg@dongwu-inc.com
- * @LastEditTime: 2023-01-29 18:02:48
+ * @LastEditTime: 2023-01-31 17:32:26
  * @FilePath: /stu_h5/src/api/api.js
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -41,4 +41,4 @@ export const FILE_UPLOAD_ANNEX = import.meta.env.VITE_BASE_API + '/file/uploadFi
 export const ROUTER_DETAILS = '/admin/router/detail'
 export const TASK_LIST = '/stu/tasks'
 export const ONLINE_PROCESS = '/onlineClasses/queryOnlineClassesStudyDetail post'
-export const PROJECT_PROCESS = '/stu/project/process'
\ No newline at end of file
+export const PROJECT_PROCESS = '/stu/project/process'
diff --git a/src/assets/image/file/file.png b/src/assets/image/file/file.png
new file mode 100644
index 0000000000000000000000000000000000000000..f7cd5e37d0d6c873f1dbd8e902d6332bb5a6e6e8
GIT binary patch
literal 495
zcmV<L0TBL)P)<h;3K|Lk000e1NJLTq001fg001Kh1^@s6;>?(n00001b5ch_0Itp)
z=>Px$sYygZR9Hvtm_17aK@f)DxeK`@8Z-z(Fq$ZVsFfgyf=%!TSO`L}(MIfSRV=j7
z+Fu}oML@99IyNGHG<G7!BA}qbKnfH0@-?zSEku;$Hej&>*Bm=9?>;*-#SmYuB=CH)
zj@SDkkXc3}!8H@)Eg(34hS2m94a{X4NpIvVakBdbg=`m00NhCG$61+E1u(q0gPw_1
z>R%8|sQj5iyo(Bqy3OW88tsVW5J^m8bo;h>q3@X+M6_9xe~I@X30RKBD*&RiN%+DU
zpzLz2Ck3j)gYe8Tf`ODeqf%IwK{Ms^+pXkljcu)|HL3*T4<e>7FKbkQVJRn}$~4u5
zD#V9=0k37j?N<M6PR&Y_!j_*+oC*o}{T2+vscdWVt5u*_w23cb0z}TczBM*KRc+$S
zK{ew^8?6)2L{%4pCaQ_*IjX1zbTcUe`6Z)?YNC2PDXIb8Oo~A2@uV80CfX{ZTq3@X
z-{CDC1*zF<DYwdHz|;Fk{ItJ}+|fK(bb?V|@%@`1HemR(2uvLii*ywE^EgTmePC1W
l&i+qu#f7%m4cbRe-vI>G$vQ7UfU^Jq002ovPDHLkV1mC=*%<%;

literal 0
HcmV?d00001

diff --git a/src/assets/image/file/pngpic.png b/src/assets/image/file/pngpic.png
new file mode 100644
index 0000000000000000000000000000000000000000..45976d8278cfa9bab9182f1452e4ee951392c41c
GIT binary patch
literal 1036
zcmV+n1oQieP)<h;3K|Lk000e1NJLTq001li001-y1^@s6@d4WR00001b5ch_0Itp)
z=>Px&#z{m$RA@u(nQcg0R~X0tC%HGy#MfDCQ$?4?xPB;ewN<lLM4=QEMO#K;-!>RS
zhI2aCu@|;4D-^~C+o#eYm4Z~O6}A?}HYsH?h88JZv2`fS)@3?hqB3h<ZgTG#Ct#+X
zHM#fd&J}VXA9C_M|L1r9IrqFI1OV#p_U0;*@&zcZqCgJo+sRg$RnYfA;juGXYLL?-
z{q}$&-J=wHv<PU)Y0N1?kSZ5j9HmWa^GWUPo=!^Xt7;SV#4})<V8MLA|4Cb6*{5o>
zNbPX<LkbkANzxm;1`GmuHV}BD-C24mUQJRn+)d*R-mbVPFaS!aG$;8^wL9J4#iP$1
zm_f>*kG(;E^*he;kyy}%0A`S3Dlg27r0ndz;>oR`4Fk*|14?*m&Low5m{;z78nmH+
z8KhqhkNTyQqb)91a5HGb0W-)ISsHB0FR3Dg{AWQhBrt<s4hQ<1pDTU&NtX=^%s{=N
z;8$-uj<&9c<^p^&+ktG0E!GMKHYMhy)%V*R<)5tua{)e-l7-@QdraU+06}=xxB6PU
z%iR@u%VVb#0W{hV!eSEQf>tOE&V_vS?;dauZ~<nNsb(`y>?wp*VED0{OzGbX#9zq`
zIP&$%GWI9gkS-=cjKgi8A}w+SUh_2^mLMxiY@2z_;kd}25@ZO6)eIm3ti~-Zu?dH@
zxTYp2;jkLFw8U=daFWRkcSf!j-Du9}$~?Rwzb=iqkC!<X8#-UC*H!G?#LxI;$)ig{
zHSo~VpBP-6QdRVMTNWDj6@d%z)#(Sg?70W4S&Y0EBwtMU<C%H*$W_4)xNl|*oyGOA
znMJ%c`U58Y%Nw8x`xR$h4|m|6>HFw-p$@5n1<j-1!xLDE;vG)Q!I5-3I{vsD?c)y2
zri4IDu$av7$)PA18^DD_HIXyzw||Y}r^P8utS-V3z?)6nk6jgbDKjtn(btde;G5ZT
z;{a!h&*061Be*v68ywaQv^YvPjN`}o-|^+-ZDRmuiOD#Buo`*EX;3JIOcjVG^9JDY
z$6mBP7~l`g9=i4eZrGDjwp`KzN*HIyZt@3a51pFE^`RSCp25(vy6x3zeHJx)oqRS9
zHO@X6%Vld$0PApI%k%KAJ6@&<7QCK+Scf0LjoEQbtS;%&i2FReZB@2WC~*nhMl&~+
z+I<e!4)=H{sJ^T5PTTsgzK8vre}w|C{C_pIS0V&mq;8})Us04_DWw_OrFK4(5G)9S
zwV2%<QG2JqfQF>c0aOCmyYuB$R3MlJ$SqMwe(!oo!}LEibrZ4PA{?gx0000<MNUMn
GLSTZwGwX=}

literal 0
HcmV?d00001

diff --git a/src/components/ReturnHead.vue b/src/components/ReturnHead.vue
index eea9944..89478fa 100644
--- a/src/components/ReturnHead.vue
+++ b/src/components/ReturnHead.vue
@@ -2,7 +2,7 @@
  * @Author: lixg lixg@dongwu-inc.com
  * @Date: 2023-01-16 17:26:39
  * @LastEditors: lixg lixg@dongwu-inc.com
- * @LastEditTime: 2023-01-16 18:21:05
+ * @LastEditTime: 2023-01-31 17:19:27
  * @FilePath: /stu_h5/src/components/ReturnHead.vue
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
@@ -23,6 +23,14 @@
       />
       <div style="margin-left: 5px; color: #2478ff">发布</div>
     </div>
+    <div class="publish" v-else-if="showfile" @click="publishClick">
+      <img
+        style="width: 21px; height: 18px; margin-left: 25px; cursor: pointer"
+        src="../assets/image/file/file.png"
+        @click="goFileStorage"
+      />
+    </div>
+
     <div class="publish" v-else></div>
   </div>
 </template>
@@ -40,6 +48,14 @@ export default {
       type: Function,
       default: null,
     },
+    showfile: {
+      type: Boolean,
+      default: false,
+    },
+    courseId: {
+      type: Number,
+      default: null,
+    },
   },
   setup(props, ctx) {
     const router = useRouter();
@@ -49,9 +65,19 @@ export default {
     const publishClick = () => {
       props.publishWork && props.publishWork();
     };
+    const goFileStorage = () => {
+      console.log("props.courseId", props.courseId);
+      router.push({
+        path: "/fileStorag",
+        query: {
+          courseId: props.courseId,
+        },
+      });
+    };
     return {
       returnclick,
       publishClick,
+      goFileStorage,
     };
   },
 };
diff --git a/src/views/filestorag/fileStorag.vue b/src/views/filestorag/fileStorag.vue
index 0d51ee6..0344d17 100644
--- a/src/views/filestorag/fileStorag.vue
+++ b/src/views/filestorag/fileStorag.vue
@@ -1,93 +1,130 @@
+<!--
+ * @Author: lixg lixg@dongwu-inc.com
+ * @Date: 2023-01-13 11:42:48
+ * @LastEditors: lixg lixg@dongwu-inc.com
+ * @LastEditTime: 2023-01-31 17:56:36
+ * @FilePath: /stu_h5/src/views/filestorag/fileStorag.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
 <template>
-    <div class="filestorag">
-        <div class="notice">
-            <div class="noticebox">
-                <div class="main">
-                    <div class="filebox"
-                        v-for="(t,index) in t_items"
-                        :key="index">
-                        <div class="fileimg"
-                        :style="{ 
-                            backgroundImage:
-                            'url('+ t.imgUrl +')'
-                            }"
-                        ></div>
-                        <div class="filename">{{t.text}}</div>
+  <div class="filestorag">
+    <ReturnHead text="文件"></ReturnHead>
+    <div class="notice">
+      <div class="noticebox">
+        <div class="main" v-if="fileList">
+          <div class="filebox" v-for="(item, index) in fileList" :key="index">
+            <img
+              v-if="
+                item.name.indexOf('jpg') !== -1 ||
+                item.name.indexOf('jpeg') !== -1 ||
+                item.name.indexOf('png') !== -1
+              "
+              style="width: 20px; height: 22px; margin-right: 20px"
+              src="@/assets/image/file/pngpic.png"
+            />
+            <div v-else>
+              <img
+                v-if="item.name.indexOf('doc') !== -1"
+                style="width: 20px; height: 22px; margin-right: 20px"
+                src="@/assets/image/file/word.png"
+              />
+              <div v-else>
+                <img
+                  v-if="item.name.indexOf('xls') !== -1"
+                  style="width: 20px; height: 22px; margin-right: 20px"
+                  src="@/assets/image/file/excel.png"
+                />
+                <div v-else>
+                  <img
+                    v-if="item.name.indexOf('ppt') !== -1"
+                    style="width: 20px; height: 22px; margin-right: 20px"
+                    src="@/assets/image/file/ppt.png"
+                  />
+                  <div v-else>
+                    <img
+                      v-if="item.name.indexOf('pdf') !== -1"
+                      style="width: 20px; height: 22px; margin-right: 20px"
+                      src="@/assets/image/file/pdf.png"
+                    />
+                    <div v-else>
+                      <img
+                        v-if="item.name.indexOf('zip') !== -1"
+                        style="width: 20px; height: 22px; margin-right: 20px"
+                        src="@/assets/image/file/zip.png"
+                      />
+                      <img
+                        v-else
+                        style="width: 20px; height: 22px; margin-right: 20px"
+                        src="@/assets/image/file/word.png"
+                      />
                     </div>
+                  </div>
                 </div>
+              </div>
             </div>
+            <span class="filename" :title="item.name">{{ item.name }}</span>
+          </div>
         </div>
+      </div>
     </div>
+  </div>
 </template>
 
-<script>
-    import { reactive, toRefs } from "vue";
-    import Images from "../../assets/image/index";
-export default {
-    name: "FileStorag",
-    setup() {
-        const state = reactive({
-            t_items: [
-                {
-                    id: 1,
-                    text: "示例文档.zip",
-                    imgUrl:Images.zipImg,
-                },
-                {
-                    id: 2,
-                    text: "示例文档.md",
-                    imgUrl:Images.mdImg,
-                },
-                {
-                    id: 3,
-                    text: "示例文档.rar",
-                    imgUrl:Images.rarImg,
-                },
-                {
-                    id: 4,
-                    text: "示例文档.word",
-                    imgUrl:Images.wordImg,
-                },
-            ],
-        });
-
-        return {
-            ...toRefs(state),
-            Images,
-        };
-    }
-};
+<script setup>
+import { reactive, toRefs, computed } from "vue";
+import Images from "../../assets/image/index";
+import ReturnHead from "@/components/ReturnHead.vue";
+import { useRoute, useRouter } from "vue-router";
+import { ROUTER_DETAILS } from "@/api/api";
+import { useRequest } from "@/api/request";
+const {
+  query: { courseId },
+} = useRoute();
+console.log("courseId", courseId);
+//获取共享文档
+const { data } = useRequest(ROUTER_DETAILS, { routerId: courseId });
+// state.t_items = data.value.routerInfo.attach;
+console.log("data", data, data.value.routerInfo);
+const fileList = computed(() => data.value?.routerInfo?.attach);
 </script>
 <style lang="scss" scoped>
-    .filestorag{
+.filestorag {
+  width: 100%;
+  background-color: #f2f5f7;
+  font-size: 13px;
+  color: #677d86;
+  .notice {
+    width: 100%;
+    background-color: #ffffff;
+    margin-top: 10px;
+    .noticebox {
+      width: 90%;
+      margin: 0 auto;
+      .main {
         width: 100%;
-        background-color: #F2F5F7;
-        font-size: 13px;
-        color: #677D86;
-        .notice{
-            width: 100%;
-            background-color: #ffffff;
-            margin-top: 10px;
-            .noticebox{
-                width: 90%;
-                margin: 0 auto;
-                .main{
-                    width: 100%;
-                    .filebox{
-                        display: flex;
-                        margin-left: 16.5px;
-                        padding: 21.5px 0;
-                        align-items: center;
-                        border-bottom: 1px solid #EDF3FF;
-                        .fileimg{
-                            width: 19.5px;
-                            height: 22px;
-                            background-size: 100% 100%;
-                            margin-right: 19px;
-                        }
-                    }
-                }
-            }
+        .filebox {
+          display: flex;
+          margin-left: 16.5px;
+          padding: 21.5px 0;
+          align-items: center;
+          border-bottom: 1px solid #edf3ff;
+          .fileimg {
+            width: 19.5px;
+            height: 22px;
+            background-size: 100% 100%;
+            margin-right: 19px;
+          }
         }
+        .filename {
+          width: calc(100% - 50px);
+          font-size: 13px;
+          display: block;
+          overflow: hidden;
+          white-space: nowrap;
+          text-overflow: ellipsis;
+        }
+      }
     }
+  }
+}
 </style>
\ No newline at end of file
diff --git a/src/views/pathmap/LevelList.vue b/src/views/pathmap/LevelList.vue
index 0e35068..e0dfec9 100644
--- a/src/views/pathmap/LevelList.vue
+++ b/src/views/pathmap/LevelList.vue
@@ -2,13 +2,17 @@
  * @Author: lixg lixg@dongwu-inc.com
  * @Date: 2023-01-19 14:59:34
  * @LastEditors: lixg lixg@dongwu-inc.com
- * @LastEditTime: 2023-01-19 18:59:50
+ * @LastEditTime: 2023-01-31 17:17:37
  * @FilePath: /stu_h5/src/views/pathmap/LevelList.vue
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
 <template>
   <div class="levelList">
-    <ReturnHead text="展开路径图"></ReturnHead>
+    <ReturnHead
+      text="展开路径图"
+      :showfile="true"
+      :courseId="routerId"
+    ></ReturnHead>
     <!-- 学习路径介绍 -->
     <div class="pathdetail">
       <div class="pathName">产品经理学习路径图</div>
diff --git a/src/views/projectdetails/ProjectPath.vue b/src/views/projectdetails/ProjectPath.vue
index b942172..233c56c 100644
--- a/src/views/projectdetails/ProjectPath.vue
+++ b/src/views/projectdetails/ProjectPath.vue
@@ -2,7 +2,7 @@
  * @Author: lixg lixg@dongwu-inc.com
  * @Date: 2023-01-19 11:28:11
  * @LastEditors: lixg lixg@dongwu-inc.com
- * @LastEditTime: 2023-01-29 17:58:47
+ * @LastEditTime: 2023-01-31 18:01:11
  * @FilePath: /stu_h5/src/views/projectdetails/ProjectPath.vue
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
@@ -181,7 +181,7 @@ const handleClick = (tab, event) => {
 const goDetails = () => {
   // router.push({
   //   path: "/levelList",
-  //   query: { routerId: 274 },
+  //   query: { routerId: 2 },
   // });
   router.push({
     path: "/projectdetails",
diff --git a/src/views/projectdetails/projectDetails.vue b/src/views/projectdetails/projectDetails.vue
index 6775984..b1d135a 100644
--- a/src/views/projectdetails/projectDetails.vue
+++ b/src/views/projectdetails/projectDetails.vue
@@ -1,6 +1,10 @@
 <template>
   <div class="projectdetails">
-    <ReturnHead text="项目详情"></ReturnHead>
+    <ReturnHead
+      text="项目详情"
+      :showfile="true"
+      :courseId="projectId || courseId"
+    ></ReturnHead>
     <div class="main">
       <div class="up">
         <!-- <div class="notice">