diff --git a/src/api/courseChaptersApi.ts b/src/api/courseChaptersApi.ts
index 6e85cfd..10135cd 100644
--- a/src/api/courseChaptersApi.ts
+++ b/src/api/courseChaptersApi.ts
@@ -1,3 +1,26 @@
+import request from '@/utils/request'
+
+/**
+ * 请求视频资源
+ * @param par 
+ */
+
+export function aaaApi(par:any){
+    if(par)return request.get(`url${par}`)
+    else return request.get(`url`)
+    
+}
+
+export const uploadFile = (data:any) => {
+    return request({
+        url:'/upload',
+        method:"POST",
+        data
+    })
+}
+
+
+
 /**
  * 获取计算机导论信息
  * @returns
@@ -27,3 +50,4 @@ export function getOrogramObjectiveApi() {
     setTimeout(() => resolve(data), 500 * Math.random())
   })
 }
+
diff --git a/src/assets/icons/pdf.svg b/src/assets/icons/pdf.svg
new file mode 100644
index 0000000..7f4e0fe
--- /dev/null
+++ b/src/assets/icons/pdf.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1717149275738" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="12133" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M923.136 969.557333H193.024v-909.653333h521.386667l208.725333 207.701333z" fill="#7CCDFF" p-id="12134"></path><path d="M912.896 253.952l2.56 671.914667c0 15.530667-12.458667 27.989333-27.989333 27.989333H237.909333c-15.530667 0-27.989333-12.458667-27.989333-27.989333V96.938667c0-15.530667 12.458667-27.989333 27.989333-27.989334l493.397334-1.024-38.912-39.936H239.274667c-36.352 0-65.706667 29.354667-65.706667 65.706667v835.584c0 36.352 29.354667 65.706667 65.706667 65.706667h646.826666c36.352 0 65.706667-29.354667 65.706667-65.706667V293.888l-38.912-39.936z" fill="#4191FB" p-id="12135"></path><path d="M692.394667 222.72c0 39.424 31.914667 71.338667 71.338666 71.338667h188.245334L692.394667 27.989333v194.730667z" fill="#C7E2FF" p-id="12136"></path><path d="M557.568 482.304H158.72c-50.346667 0-91.136-40.789333-91.136-91.136v-60.245333c0-50.346667 40.789333-91.136 91.136-91.136h398.848c50.346667 0 91.136 40.789333 91.136 91.136v60.245333c0 50.346667-40.789333 91.136-91.136 91.136z" fill="#4191FB" p-id="12137"></path><path d="M122.026667 287.573333h80.042666c17.408 0 30.549333 4.096 39.082667 12.458667 8.704 8.362667 12.970667 20.138667 12.970667 35.328 0 15.701333-4.778667 27.989333-14.165334 36.864-9.386667 8.874667-23.893333 13.312-43.349333 13.312H170.496v57.856H122.026667v-155.818667z m48.469333 66.389334h11.776c9.216 0 15.872-1.536 19.626667-4.778667 3.754667-3.242667 5.632-7.338667 5.632-12.458667 0-4.949333-1.706667-9.045333-4.949334-12.458666s-9.386667-5.12-18.432-5.12h-13.653333v34.816zM280.064 287.573333H351.573333c14.165333 0 25.429333 1.877333 34.133334 5.802667 8.704 3.754667 15.872 9.386667 21.504 16.384 5.632 7.168 9.728 15.530667 12.288 24.917333 2.56 9.557333 3.754667 19.626667 3.754666 30.208 0 16.725333-1.877333 29.525333-5.632 38.741334s-9.045333 16.896-15.701333 23.04-13.994667 10.24-21.674667 12.458666c-10.581333 2.901333-20.138667 4.266667-28.672 4.266667h-71.509333v-155.818667z m48.128 35.328V407.893333h11.776c10.069333 0 17.237333-1.194667 21.504-3.413333s7.509333-6.144 10.069333-11.605333c2.389333-5.632 3.584-14.506667 3.584-26.965334 0-16.554667-2.730667-27.818667-8.021333-33.962666-5.461333-6.144-14.336-9.216-26.794667-9.216l-12.117333 0.170666zM448.853333 287.573333h118.954667v33.450667h-70.656V348.16h60.416v31.402667h-60.416v63.658666H448.853333v-155.648z" fill="#FFFFFF" p-id="12138"></path><path d="M590.677333 470.016c-1.365333 0.682667-3.242667 1.194667-0.853333 0.682667-2.56 0.512-2.218667 0.853333-4.949333 0 2.048 0.512-3.584-2.048-0.853334-0.512 2.56 1.536-1.877333-2.218667-0.512-0.341334 0.170667 0.170667 1.365333 1.706667 1.706667 1.706667-0.853333 0-2.048-3.072-0.341333-0.341333 1.194667 1.877333 2.218667 3.925333 3.242666 5.973333 1.365333 2.56-1.024-2.56 0 0.170667 0.341333 1.024 0.853333 2.048 1.194667 3.072 0.853333 2.389333 1.706667 4.778667 2.389333 7.338666 1.194667 4.266667 2.218667 8.533333 3.072 12.970667 0.170667 1.194667 0.512 2.218667 0.682667 3.413333-0.341333-2.218667 0.170667 1.706667 0.170667 2.389334 0.341333 3.754667 0.341333 7.68 0.170666 11.434666 0 1.706667-0.170667 3.242667-0.341333 4.949334 0 0.682667-0.512 4.608-0.170667 2.389333-0.512 3.584-1.194667 6.997333-1.877333 10.581333-2.901333 13.482667-7.168 26.453333-11.946667 39.253334-1.194667 3.072-2.389333 6.314667-3.754666 9.386666 0 0-1.024 2.389333-0.341334 1.024 0.512-1.365333-0.512 1.024-0.512 1.024-0.682667 1.706667-1.536 3.413333-2.218666 4.949334-2.730667 6.144-5.632 12.288-8.704 18.261333-6.144 12.117333-12.629333 24.064-19.456 35.669333-12.970667 22.357333-26.453333 44.373333-40.618667 66.048-6.997333 10.752-14.165333 21.333333-21.674667 31.744-3.754667 5.12-7.509333 10.410667-11.264 15.36-0.853333 1.194667-1.706667 2.389333-2.730666 3.584l-0.512 0.682667c1.024-1.194667-0.512 0.682667-0.512 0.682667-2.048 2.730667-4.266667 5.461333-6.314667 8.021333-15.872 19.456-32.938667 38.058667-51.541333 54.784-4.778667 4.266667-9.557333 8.362667-14.506667 12.288-1.365333 1.024-2.730667 2.218667-4.096 3.242667l-0.682667 0.512c1.194667-1.024-0.682667 0.512-0.682666 0.512-2.56 1.877333-5.12 3.754667-7.850667 5.632-2.730667 1.877333-5.461333 3.584-8.192 5.12-1.365333 0.682667-2.56 1.365333-3.925333 2.048l-2.048 1.024c-0.170667 0.170667-2.901333 1.194667-1.536 0.682666 1.536-0.682667-0.682667 0.341333-0.853334 0.341334-0.682667 0.170667-1.365333 0.512-2.048 0.682666-1.536 0.512-3.242667 1.024-4.778666 1.365334-1.365333 0.341333-2.730667 0.682667-4.266667 0.853333 2.901333-0.341333-1.365333 0-2.218667 0-1.365333 0-2.901333-0.170667-4.266666-0.170667-1.877333 0 0.512 0 0.682666 0.170667-0.682667-0.170667-1.194667-0.341333-1.877333-0.341333-0.682667-0.170667-1.194667-0.341333-1.877333-0.512 2.901333 0.853333 1.024 0.512 0.341333 0 0.512 0.341333 1.024 1.194667 1.536 1.536 1.706667 1.194667-1.194667-1.536 0 0.170666 0.853333 1.365333-0.341333-1.706667-0.682667-2.389333-0.512-1.706667 0.170667 0.512 0.170667 0.853333 0-0.682667 0-1.365333-0.170667-2.048 0-1.024 0.682667-5.12 0-1.877333 0.341333-1.536 0.682667-3.072 1.194667-4.608 0.170667-0.682667 0.512-1.194667 0.682667-1.877333-0.170667 0.341333-1.024 2.048-0.170667 0.682666 0.682667-1.194667 1.194667-2.389333 1.877333-3.584 0.341333-0.512 2.389333-3.413333 1.536-2.389333-1.024 1.365333 0.341333-0.512 0.512-0.512 0.682667-0.853333 1.536-1.706667 2.389334-2.56 1.024-1.024 2.048-1.877333 3.072-2.730667 1.194667-1.194667-0.170667 0-0.341334 0.170667 0.512-0.512 1.194667-0.853333 1.706667-1.194667 2.730667-1.877333 5.632-3.584 8.704-5.12 1.365333-0.682667 2.56-1.194667 3.925333-1.877333 1.706667-0.682667-0.170667 0-0.341333 0.170667 0.682667-0.341333 1.365333-0.512 2.048-0.853334 2.901333-1.194667 5.973333-2.218667 9.045333-3.072 6.485333-2.048 12.970667-3.925333 19.626667-5.632 13.653333-3.754667 27.477333-6.997333 41.301333-9.898666 13.824-2.901333 27.818667-5.290667 41.813334-7.509334 3.242667-0.512 6.485333-1.024 9.728-1.365333 0 0 2.730667-0.341333 1.194666-0.170667-1.706667 0.170667 1.706667-0.170667 2.048-0.341333 1.877333-0.170667 3.754667-0.512 5.632-0.682667 6.997333-0.853333 14.165333-1.706667 21.162667-2.389333 56.32-5.632 113.152-5.973333 169.813333-3.413333 6.997333 0.341333 13.994667 0.682667 20.992 1.194666 3.072 0.170667 6.314667 0.512 9.386667 0.682667 1.536 0.170667 3.072 0.341333 4.778667 0.512 1.877333 0.170667 0.170667 0-0.170667 0 1.365333 0.170667 2.56 0.341333 3.925333 0.682667 6.485333 1.194667 12.8 2.730667 18.944 5.12 2.730667 1.024 0.341333 0.170667-0.170666-0.170667 0.512 0.341333 1.194667 0.512 1.706666 0.853333 1.194667 0.512 2.389333 1.194667 3.413334 1.706667 2.389333 1.365333 4.778667 2.901333 7.168 4.437333 0.170667 0.170667 1.877333 1.536 0.512 0.341334-1.536-1.194667 0.512 0.512 0.853333 0.853333 1.024 0.853333 1.877333 1.706667 2.730667 2.56s1.706667 1.877333 2.56 2.730667c0.341333 0.512 0.853333 1.024 1.194666 1.536-0.853333-1.024-1.024-1.365333-0.170666 0 0.682667 1.024 1.365333 2.048 2.048 3.242666 0.341333 0.512 2.048 4.437333 1.365333 2.730667-0.682667-1.706667 0.512 1.706667 0.682667 2.218667s1.194667 3.754667 0.853333 4.096c-0.170667 0.170667-0.170667-3.072-0.170667-1.194667v1.877333c0 0.682667-0.512 4.778667 0 2.730667 0.512-2.048-0.512 1.365333-0.682666 2.048-0.170667 0.512-0.341333 1.024-0.512 1.706667 0.341333-1.024 1.024-2.218667 0.170666-0.512-1.194667 2.389333 1.706667-1.365333-0.341333 0.512l-1.194667 1.194666c-1.024 1.194667 0.512-0.512 0.682667-0.512-0.682667 0.341333-1.536 0.853333-2.218667 1.194667 0.341333-0.170667 2.389333-0.682667 0.853334-0.512-0.512 0-1.365333 0.341333-1.706667 0.512 1.024-0.341333 2.389333-0.170667 0.512-0.170667-1.194667 0-2.56-0.170667-3.754667 0 0.170667 0 2.730667 0.512 0.853334 0.170667-0.682667-0.170667-1.365333-0.170667-1.877334-0.341333-1.536-0.341333-3.072-0.853333-4.437333-1.194667-1.024-0.341333-4.608-1.877333-1.877333-0.682667-5.461333-2.56-10.581333-5.632-15.701334-8.874666-2.389333-1.536-4.778667-3.072-6.997333-4.778667-1.194667-0.853333-2.218667-1.706667-3.413333-2.56 0.170667 0.170667 1.706667 1.365333 0.341333 0.341333-0.853333-0.682667-1.877333-1.536-2.730667-2.218666-4.608-3.754667-8.874667-7.68-13.141333-11.776-8.874667-8.533333-17.066667-17.92-24.746667-27.648-0.512-0.512-0.853333-1.194667-1.365333-1.706667 0-0.170667-1.536-2.048-0.512-0.682667 1.024 1.365333-0.682667-1.024-1.024-1.194666-0.512-0.512-0.853333-1.194667-1.365333-1.706667-1.877333-2.56-3.754667-4.949333-5.461334-7.509333-3.584-5.12-7.168-10.24-10.581333-15.36-15.701333-23.210667-30.378667-47.104-44.373333-71.338667-13.824-23.893333-27.477333-47.957333-38.741334-73.216-0.682667-1.365333-1.194667-2.901333-1.877333-4.266667 1.024 2.218667-0.853333-2.218667-1.194667-2.730666-1.194667-3.072-2.56-6.314667-3.584-9.386667-2.218667-6.314667-4.437333-12.8-6.144-19.285333s-3.242667-13.141333-4.266666-19.797334c-0.170667-0.512-0.170667-1.194667-0.170667-1.706666-0.341333-1.706667 0.170667 1.194667 0.170667 1.365333 0.170667-0.853333-0.341333-2.56-0.341334-3.413333-0.341333-2.730667-0.512-5.632-0.512-8.362667-0.170667-5.290667-0.170667-10.752 0-16.042667 0.170667-2.56 0.341333-4.949333 0.512-7.509333 0.170667-1.194667 0.170667-2.56 0.341334-3.754667 0-0.682667 0.170667-1.194667 0.170666-1.877333 0.341333-2.389333-0.682667 3.754667 0-0.170667 0.853333-4.949333 1.706667-9.898667 2.901334-14.677333l2.048-7.168 1.024-3.072c0.170667-0.682667 1.706667-4.266667 0.853333-2.048-1.024 2.218667 0.682667-1.536 0.853333-1.877333 0.512-0.853333 0.853333-1.706667 1.365334-2.56 0.853333-1.706667 1.877333-3.242667 2.901333-4.778667 0.170667-0.341333 0.512-0.682667 0.853333-1.024 0.853333-1.365333-1.024 1.536-1.024 1.365333 0-0.512 1.706667-1.877333 2.048-2.218666l1.706667-1.706667c2.048-3.072-2.56 0.853333-0.682667-0.512 6.656-4.608 10.410667-13.824 5.632-21.333333-4.266667-6.656-13.994667-10.410667-21.333333-5.632-18.602667 12.629333-26.112 36.352-29.525333 57.685333-4.096 26.282667-3.072 52.394667 3.925333 78.336 7.850667 29.184 21.504 56.661333 36.010667 83.285333 14.848 27.477333 30.72 54.442667 47.445333 80.725334 15.189333 24.064 31.061333 47.786667 49.834667 69.461333 8.704 10.069333 18.090667 19.456 28.16 27.818667 10.752 8.874667 22.528 17.749333 35.328 23.552 14.336 6.485333 31.232 9.898667 45.397333 1.024 14.506667-9.045333 18.944-26.112 16.384-42.154667-4.437333-29.184-33.792-47.786667-60.416-53.589333-15.36-3.413333-31.061333-4.096-46.762667-4.949334-15.36-0.682667-30.549333-1.365333-45.909333-1.536-31.232-0.512-62.464-0.170667-93.525333 1.877334-61.781333 3.754667-123.904 12.970667-183.296 30.72-14.848 4.437333-29.354667 10.24-41.301334 20.309333-11.776 9.898667-19.626667 24.576-20.309333 39.936-0.341333 7.68 1.365333 16.213333 5.973333 22.528 6.144 8.533333 15.189333 11.946667 25.258667 13.141333 15.189333 1.706667 30.549333-3.754667 43.690667-11.264 12.8-7.338667 24.405333-17.066667 35.669333-26.624 10.410667-8.874667 20.309333-18.261333 29.696-28.16 19.626667-20.48 37.376-43.008 53.930667-66.048 16.213333-22.528 31.061333-46.08 45.568-69.632 15.189333-25.088 30.208-50.346667 42.666666-76.970666 13.141333-28.330667 25.088-58.709333 27.818667-89.941334 1.194667-13.482667-0.682667-26.965333-4.096-40.106666-2.901333-10.752-6.656-21.845333-13.482667-30.549334-3.754667-4.949333-8.362667-8.704-14.336-10.752-6.656-2.218667-13.312-0.682667-19.456 2.048-7.338667 3.413333-9.728 14.677333-5.632 21.333334 4.778667 7.509333 13.141333 9.045333 20.992 5.461333z" fill="#4191FB" p-id="12139"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/ppt 内容图标.svg b/src/assets/icons/ppt 内容图标.svg
new file mode 100644
index 0000000..0cc80a2
--- /dev/null
+++ b/src/assets/icons/ppt 内容图标.svg	
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1717149223148" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11088" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M923.136 969.557333H193.024v-909.653333h521.386667l208.725333 207.701333z" fill="#7CCDFF" p-id="11089"></path><path d="M912.896 253.952l2.56 671.914667c0 15.530667-12.458667 27.989333-27.989333 27.989333H237.909333c-15.530667 0-27.989333-12.458667-27.989333-27.989333V96.938667c0-15.530667 12.458667-27.989333 27.989333-27.989334l493.397334-1.024-38.912-39.936H239.274667c-36.352 0-65.706667 29.354667-65.706667 65.706667v835.584c0 36.352 29.354667 65.706667 65.706667 65.706667h646.826666c36.352 0 65.706667-29.354667 65.706667-65.706667V293.888l-38.912-39.936z" fill="#4191FB" p-id="11090"></path><path d="M692.394667 222.72c0 39.424 31.914667 71.338667 71.338666 71.338667h188.245334L692.394667 27.989333v194.730667z" fill="#C7E2FF" p-id="11091"></path><path d="M557.568 482.304H158.72c-50.346667 0-91.136-40.789333-91.136-91.136v-60.245333c0-50.346667 40.789333-91.136 91.136-91.136h398.848c50.346667 0 91.136 40.789333 91.136 91.136v60.245333c0 50.346667-40.789333 91.136-91.136 91.136z" fill="#4191FB" p-id="11092"></path><path d="M135.168 287.573333h80.042667c17.408 0 30.549333 4.096 39.082666 12.458667 8.704 8.362667 12.970667 20.138667 12.970667 35.328 0 15.701333-4.778667 27.989333-14.165333 36.864-9.386667 8.874667-23.893333 13.312-43.349334 13.312h-26.282666v57.856H135.168v-155.818667z m48.298667 66.389334h11.776c9.216 0 15.872-1.536 19.626666-4.778667 3.754667-3.242667 5.632-7.338667 5.632-12.458667 0-4.949333-1.706667-9.045333-4.949333-12.458666s-9.386667-5.12-18.432-5.12h-13.653333v34.816zM292.181333 287.573333h80.042667c17.408 0 30.549333 4.096 39.082667 12.458667 8.704 8.362667 12.970667 20.138667 12.970666 35.328 0 15.701333-4.778667 27.989333-14.165333 36.864-9.386667 8.874667-23.893333 13.312-43.349333 13.312h-26.282667v57.856h-48.298667v-155.818667z m48.469334 66.389334h11.776c9.216 0 15.872-1.536 19.626666-4.778667 3.754667-3.242667 5.632-7.338667 5.632-12.458667 0-4.949333-1.706667-9.045333-4.949333-12.458666s-9.386667-5.12-18.432-5.12h-13.653333v34.816zM438.613333 287.573333h146.261334V325.973333H535.893333v117.248h-48.128V325.973333H438.613333v-38.4z" fill="#FFFFFF" p-id="11093"></path><path d="M548.522667 562.688c-87.210667 0-158.037333 70.656-158.037334 158.037333s70.656 158.037333 158.037334 158.037334c87.210667 0 158.037333-70.656 158.037333-158.037334h-158.037333v-158.037333z" fill="#4191FB" p-id="11094"></path><path d="M583.68 527.36v158.037333h158.037333c0-87.210667-70.826667-158.037333-158.037333-158.037333z" fill="#4191FB" p-id="11095"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/ppt.svg b/src/assets/icons/ppt.svg
new file mode 100644
index 0000000..bfbe121
--- /dev/null
+++ b/src/assets/icons/ppt.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1717062811098" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3731" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M923.136 969.557333H193.024v-909.653333h521.386667l208.725333 207.701333z" fill="#7CCDFF" p-id="3732"></path><path d="M912.896 253.952l2.56 671.914667c0 15.530667-12.458667 27.989333-27.989333 27.989333H237.909333c-15.530667 0-27.989333-12.458667-27.989333-27.989333V96.938667c0-15.530667 12.458667-27.989333 27.989333-27.989334l493.397334-1.024-38.912-39.936H239.274667c-36.352 0-65.706667 29.354667-65.706667 65.706667v835.584c0 36.352 29.354667 65.706667 65.706667 65.706667h646.826666c36.352 0 65.706667-29.354667 65.706667-65.706667V293.888l-38.912-39.936z" fill="#4191FB" p-id="3733" data-spm-anchor-id="a313x.search_index.0.i3.2afa3a81EN0Hhm"></path><path d="M692.394667 222.72c0 39.424 31.914667 71.338667 71.338666 71.338667h188.245334L692.394667 27.989333v194.730667z" fill="#C7E2FF" p-id="3734"></path><path d="M557.568 482.304H158.72c-50.346667 0-91.136-40.789333-91.136-91.136v-60.245333c0-50.346667 40.789333-91.136 91.136-91.136h398.848c50.346667 0 91.136 40.789333 91.136 91.136v60.245333c0 50.346667-40.789333 91.136-91.136 91.136z" fill="#4191FB" p-id="3735" data-spm-anchor-id="a313x.search_index.0.i2.2afa3a81EN0Hhm" class="selected"></path><path d="M135.168 287.573333h80.042667c17.408 0 30.549333 4.096 39.082666 12.458667 8.704 8.362667 12.970667 20.138667 12.970667 35.328 0 15.701333-4.778667 27.989333-14.165333 36.864-9.386667 8.874667-23.893333 13.312-43.349334 13.312h-26.282666v57.856H135.168v-155.818667z m48.298667 66.389334h11.776c9.216 0 15.872-1.536 19.626666-4.778667 3.754667-3.242667 5.632-7.338667 5.632-12.458667 0-4.949333-1.706667-9.045333-4.949333-12.458666s-9.386667-5.12-18.432-5.12h-13.653333v34.816zM292.181333 287.573333h80.042667c17.408 0 30.549333 4.096 39.082667 12.458667 8.704 8.362667 12.970667 20.138667 12.970666 35.328 0 15.701333-4.778667 27.989333-14.165333 36.864-9.386667 8.874667-23.893333 13.312-43.349333 13.312h-26.282667v57.856h-48.298667v-155.818667z m48.469334 66.389334h11.776c9.216 0 15.872-1.536 19.626666-4.778667 3.754667-3.242667 5.632-7.338667 5.632-12.458667 0-4.949333-1.706667-9.045333-4.949333-12.458666s-9.386667-5.12-18.432-5.12h-13.653333v34.816zM438.613333 287.573333h146.261334V325.973333H535.893333v117.248h-48.128V325.973333H438.613333v-38.4z" fill="#FFFFFF" p-id="3736"></path><path d="M548.522667 562.688c-87.210667 0-158.037333 70.656-158.037334 158.037333s70.656 158.037333 158.037334 158.037334c87.210667 0 158.037333-70.656 158.037333-158.037334h-158.037333v-158.037333z" fill="#4191FB" p-id="3737"></path><path d="M583.68 527.36v158.037333h158.037333c0-87.210667-70.826667-158.037333-158.037333-158.037333z" fill="#4191FB" p-id="3738"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/文本.svg b/src/assets/icons/文本.svg
index 0cb294b..9f7ecac 100644
--- a/src/assets/icons/文本.svg
+++ b/src/assets/icons/文本.svg
@@ -1 +1 @@
-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1717496491909" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="16639" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><path d="M399.387199 158.662603c17.451464 0 31.600719-14.149255 31.600719-31.600719L430.987918 96.232738c0-17.451464-14.149255-31.600719-31.600719-31.600719-17.451464 0-31.600719 14.149255-31.600719 31.600719l0 30.829146C367.786481 144.513348 381.935736 158.662603 399.387199 158.662603z" fill="#1296db" p-id="16640"></path><path d="M624.957655 158.662603c17.451464 0 31.600719-14.149255 31.600719-31.600719L656.558373 96.232738c0-17.451464-14.149255-31.600719-31.600719-31.600719-17.451464 0-31.600719 14.149255-31.600719 31.600719l0 30.829146C593.356936 144.513348 607.506191 158.662603 624.957655 158.662603z" fill="#1296db" p-id="16641"></path><path d="M427.2682 229.567489c11.341303 18.258852 42.468231 49.15963 87.164199 49.15963 44.479027 0 75.987648-30.66951 87.596034-48.789193 9.324366-14.56574 5.097088-33.745569-9.350972-43.26027-14.431687-9.499351-33.966603-5.457292-43.666522 8.856715-0.134053 0.200568-13.773701 19.992333-34.57854 19.992333-20.228717 0-32.809243-18.320251-33.662681-19.60143-9.273201-14.59644-28.607548-19.020192-43.332924-9.874905C422.608064 195.262172 418.056398 214.744899 427.2682 229.567489z" fill="#1296db" p-id="16642"></path><path d="M498.431983 896.779503 259.370259 896.779503c-40.658002 0-73.734328-33.076326-73.734328-73.734328L185.635931 212.101699c0-40.658002 33.076326-73.734328 73.734328-73.734328 17.451464 0 31.600719-14.149255 31.600719-31.600719s-14.149255-31.600719-31.600719-31.600719c-75.508741 0-136.935766 61.427024-136.935766 136.935766l0 610.943476c0 75.508741 61.427024 136.935766 136.935766 136.935766l239.061724 0c17.451464 0 31.600719-14.149255 31.600719-31.600719C530.032702 910.928758 515.883447 896.779503 498.431983 896.779503z" fill="#1296db" p-id="16643"></path><path d="M901.909337 212.101699c0-75.508741-61.432141-136.935766-136.935766-136.935766-17.45658 0-31.600719 14.149255-31.600719 31.600719s14.144138 31.600719 31.600719 31.600719c40.652885 0 73.734328 33.076326 73.734328 73.734328l0 431.874101c0 1.039679 0.207731 2.02103 0.305969 3.035126-3.163039 5.531993-11.175527 14.616906-30.096459 14.616906L658.681734 661.627832c-46.402843 0-93.840248 10.095939-93.840248 84.96716l0 133.947711c0 38.5899 15.08558 64.008826 44.937468 75.596745 6.897084 2.6432 13.475919 3.868097 19.853164 3.868097 20.290115 0 38.543851-12.395308 58.427714-30.783097 0.530073-0.488117 1.043772-0.997724 1.543146-1.527796 212.305337-225.220485 212.305337-261.321704 212.305337-273.186939 0-1.898233-0.178055-3.76372-0.49835-5.587252 0.25685-1.62194 0.49835-3.252067 0.49835-4.945639L901.908314 212.101699zM644.378983 883.534851c-6.907317 6.326079-11.531638 9.772574-14.354939 11.618619-0.781806-1.934049-1.980097-6.259564-1.980097-14.611789L628.043946 746.593969c0-14.385639 2.103918-18.413372 1.939165-18.413372 0 0 0 0-0.005117 0 0.910743-0.606821 6.259564-3.353374 28.704762-3.353374l126.700657 0C747.023758 771.338536 693.851745 831.011614 644.378983 883.534851z" fill="#1296db" p-id="16644"></path><path d="M743.911884 523.368932 280.431947 523.368932c-17.451464 0-31.600719 14.149255-31.600719 31.600719 0 17.451464 14.149255 31.600719 31.600719 31.600719l463.479937 0c17.45658 0 31.600719-14.149255 31.600719-31.600719C775.512602 537.518187 761.368464 523.368932 743.911884 523.368932z" fill="#1296db" p-id="16645"></path><path d="M743.911884 365.366362 280.431947 365.366362c-17.451464 0-31.600719 14.149255-31.600719 31.600719 0 17.451464 14.149255 31.600719 31.600719 31.600719l463.479937 0c17.45658 0 31.600719-14.149255 31.600719-31.600719C775.512602 379.515616 761.368464 365.366362 743.911884 365.366362z" fill="#1296db" p-id="16646"></path></svg>
\ No newline at end of file
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1717062926867" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2329" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M896 928H128a32 32 0 0 1-32-32V128a32 32 0 0 1 32-32h768a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32zM160 864h704V160H160z" fill="#4A8BFE" p-id="2330"></path><path d="M768 288H256a32 32 0 0 1 0-64h512a32 32 0 0 1 0 64z" fill="#4A8BFE" p-id="2331"></path><path d="M512 800a32 32 0 0 1-32-32V256a32 32 0 0 1 64 0v512a32 32 0 0 1-32 32z" fill="#4A8BFE" p-id="2332"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/文本1.png b/src/assets/icons/文本1.png
new file mode 100644
index 0000000..56043d1
Binary files /dev/null and b/src/assets/icons/文本1.png differ
diff --git a/src/assets/icons/简介.svg b/src/assets/icons/简介.svg
new file mode 100644
index 0000000..7b626e0
--- /dev/null
+++ b/src/assets/icons/简介.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1717062723385" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2642" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M782.933333 938.666667H241.066667c-76.8 0-138.666667-61.866667-138.666667-138.666667v-576C102.4 147.2 164.266667 85.333333 241.066667 85.333333h541.866666c76.8 0 138.666667 61.866667 138.666667 138.666667v576c0 76.8-61.866667 138.666667-138.666667 138.666667zM241.066667 149.333333c-40.533333 0-74.666667 34.133333-74.666667 74.666667v576c0 40.533333 34.133333 74.666667 74.666667 74.666667h541.866666c40.533333 0 74.666667-34.133333 74.666667-74.666667v-576c0-40.533333-34.133333-74.666667-74.666667-74.666667H241.066667z" fill="#0000FF" p-id="2643"></path><path d="M716.8 362.666667H307.2c-17.066667 0-32-14.933333-32-32s14.933333-32 32-32h409.6c17.066667 0 32 14.933333 32 32s-14.933333 32-32 32zM631.466667 544H307.2c-17.066667 0-32-14.933333-32-32s14.933333-32 32-32h324.266667c17.066667 0 32 14.933333 32 32s-14.933333 32-32 32zM537.6 725.333333H307.2c-17.066667 0-32-14.933333-32-32s14.933333-32 32-32h230.4c17.066667 0 32 14.933333 32 32S554.666667 725.333333 537.6 725.333333z" fill="#0000FF" p-id="2644"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/视频.svg b/src/assets/icons/视频.svg
index b000ea0..a566bb5 100644
--- a/src/assets/icons/视频.svg
+++ b/src/assets/icons/视频.svg
@@ -1 +1 @@
-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1717496455519" class="icon" viewBox="0 0 1365 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="14725" xmlns:xlink="http://www.w3.org/1999/xlink" width="42.65625" height="32"><path d="M256.006827 42.669796a42.666382 42.666382 0 1 1 85.332764 0v938.660408a42.666382 42.666382 0 1 1-85.332764 0zM554.671502 383.147526c0-23.039846 16.213225-33.279778 37.546417-23.039847l227.838481 114.345905c41.813055 21.333191 40.959727 55.466297 0 75.94616l-33.279778 17.066553-193.705376 96.426024c-21.333191 10.239932-38.399744 0-38.399744-23.039847z" fill="#1296db" p-id="14726"></path><path d="M0.008533 384.000853A41.813055 41.813055 0 0 1 41.821588 341.334471h255.998293a42.666382 42.666382 0 0 1 43.51971 42.666382 41.813055 41.813055 0 0 1-41.813054 42.666383h-255.998294A42.666382 42.666382 0 0 1 0.008533 384.000853zM0.008533 639.999147A41.813055 41.813055 0 0 1 41.821588 597.332764h255.998293a42.666382 42.666382 0 0 1 43.51971 42.666383 41.813055 41.813055 0 0 1-41.813054 42.666382h-255.998294A42.666382 42.666382 0 0 1 0.008533 639.999147zM1024.001707 384.000853a41.813055 41.813055 0 0 1 41.813054-42.666382h255.998294a42.666382 42.666382 0 0 1 41.813054 42.666382 41.813055 41.813055 0 0 1-41.813054 42.666383h-255.998294a42.666382 42.666382 0 0 1-41.813054-42.666383zM1024.001707 639.999147a41.813055 41.813055 0 0 1 41.813054-42.666383h255.998294a42.666382 42.666382 0 0 1 41.813054 42.666383 41.813055 41.813055 0 0 1-41.813054 42.666382h-255.998294a42.666382 42.666382 0 0 1-41.813054-42.666382z" fill="#1296db" p-id="14727"></path><path d="M1024.001707 42.669796a42.666382 42.666382 0 1 1 85.332764 0v938.660408a42.666382 42.666382 0 1 1-85.332764 0z" fill="#1296db" p-id="14728"></path><path d="M1262.933447 0.003413H102.407851A101.54599 101.54599 0 0 0 0.008533 101.549403v820.047866A103.252645 103.252645 0 0 0 102.407851 1023.996587h1160.525596a101.54599 101.54599 0 0 0 102.399318-101.54599V101.549403A103.252645 103.252645 0 0 0 1262.933447 0.003413z m17.066553 870.394198a68.266212 68.266212 0 0 1-67.412884 68.266211H152.754182a68.266212 68.266212 0 0 1-67.412884-68.266211V153.602389a68.266212 68.266212 0 0 1 67.412884-68.266211h1059.832934a68.266212 68.266212 0 0 1 67.412884 68.266211z" fill="#1296db" p-id="14729"></path></svg>
\ No newline at end of file
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1717062860487" class="icon" viewBox="0 0 1241 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4769" xmlns:xlink="http://www.w3.org/1999/xlink" width="242.3828125" height="200"><path d="M193.84646453 62h872.72727276c60.00000029 0 109.09090898 49.09090869 109.09090899 109.09090898v681.81818204c0 60.00000029-49.09090869 109.09090898-109.09090899 109.09090898H193.84646453c-60.00000029 0-109.09090898-49.09090869-109.09090898-109.09090898V171.09090898c0-60.00000029 49.09090869-109.09090898 109.09090898-109.09090898z" fill="#2F77F1" p-id="4770"></path><path d="M84.75555555 225.63636348h1090.90909072v54.54545449H84.75555555v-54.5454545z m673.63636377 340.90909101c9.5454545 5.4545458 15.00000029 16.36363653 15.0000003 27.27272725s-5.4545458 21.81818145-15.0000003 27.27272724L589.30101004 726.09090928c-9.5454545 5.4545458-21.81818145 5.4545458-31.36363594-1e-8-9.5454545-5.4545458-16.36363653-16.36363653-15.00000029-27.27272724V490.18181855c0-10.90909073 5.4545458-21.81818145 15.00000029-27.27272724 9.5454545-5.4545458 21.81818145-5.4545458 31.36363594 0L758.39191932 566.54545449z" fill="#AFFCFE" p-id="4771"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/软件1.png b/src/assets/icons/软件1.png
new file mode 100644
index 0000000..e29fb67
Binary files /dev/null and b/src/assets/icons/软件1.png differ
diff --git a/src/assets/icons/音乐.png b/src/assets/icons/音乐.png
new file mode 100644
index 0000000..d7c983a
Binary files /dev/null and b/src/assets/icons/音乐.png differ
diff --git a/src/assets/icons/音频.svg b/src/assets/icons/音频.svg
index eea7eb7..156ef38 100644
--- a/src/assets/icons/音频.svg
+++ b/src/assets/icons/音频.svg
@@ -1 +1 @@
-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1717496536759" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="17702" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><path d="M988.74783 23.733531a106.803451 106.803451 0 0 0-84.406083-22.397368L373.460126 81.902696c-60.536887 9.150925-107.955315 62.840616-107.955315 122.225639v514.627531a172.715706 172.715706 0 0 0-94.772864-28.156691C76.471022 690.599175 0.064 765.214407 0.064 857.299587 0.064 949.384767 76.471022 1024 170.731947 1024c94.196932 0 170.603954-74.615233 170.603954-166.700413V384.011199l606.776703-91.957195v331.673028a172.715706 172.715706 0 0 0-94.836856-28.156692c-94.196932 0-170.603954 74.679225-170.603954 166.764406 0 92.08518 76.407022 166.700413 170.603954 166.700412 94.260924 0 170.667947-74.615233 170.667946-166.700412V100.652493c0-30.204451-12.798496-58.233158-35.195864-76.918962zM170.795939 949.896707c-52.281857 0-94.836857-41.53112-94.836857-92.59712 0-51.129992 42.555-92.661112 94.836857-92.661112s94.772864 41.595113 94.772864 92.661112c0 51.066-42.491007 92.59712-94.772864 92.59712zM341.335901 309.012011v-104.947669c0-22.589346 20.477594-45.434661 43.770856-49.01824l530.881622-80.438548a29.052586 29.052586 0 0 1 23.421248 5.375368 25.852962 25.852962 0 0 1 8.702977 20.669571v116.466316L341.335901 308.948019z m511.939847 545.919855c-52.281857 0-94.772864-41.53112-94.772865-92.59712s42.491007-92.59712 94.772865-92.59712c52.281857 0 94.836857 41.53112 94.836856 92.59712s-42.555 92.59712-94.836856 92.59712z" fill="#1296db" p-id="17703"></path></svg>
\ No newline at end of file
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1717150947553" class="icon" viewBox="0 0 1210 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="24415" xmlns:xlink="http://www.w3.org/1999/xlink" width="236.328125" height="200"><path d="M186.181818 0h837.818182a186.181818 186.181818 0 0 1 186.181818 186.181818v651.636364a186.181818 186.181818 0 0 1-186.181818 186.181818H186.181818a186.181818 186.181818 0 0 1-186.181818-186.181818V186.181818a186.181818 186.181818 0 0 1 186.181818-186.181818z m551.563637 234.589091l-218.903273 67.072c-26.624 7.68-47.895273 35.374545-47.895273 61.719273v230.632727s-15.825455-10.705455-51.2-5.585455C367.802182 595.781818 325.818182 635.438545 325.818182 677.236364c0 41.704727 41.984 67.304727 93.928727 59.904 51.991273-7.447273 89.879273-45.847273 89.879273-87.552V426.821818c0-18.432 22.295273-26.391273 22.295273-26.391273l193.489454-60.648727s21.504-7.168 21.504 12.567273v183.761454s-19.688727-11.264-55.016727-7.168c-51.991273 6.423273-93.928727 45.335273-93.928727 87.04 0 41.751273 41.984 68.096 93.928727 61.952 51.991273-6.376727 93.975273-45.288727 93.975273-87.04V268.660364c-0.279273-26.112-21.783273-41.472-48.128-34.071273z" fill="#409EFF" p-id="24416"></path></svg>
\ No newline at end of file
diff --git a/src/assets/images/1.mp3 b/src/assets/images/1.mp3
new file mode 100644
index 0000000..fdf84f7
Binary files /dev/null and b/src/assets/images/1.mp3 differ
diff --git a/src/assets/images/软件1.png b/src/assets/images/软件1.png
new file mode 100644
index 0000000..e29fb67
Binary files /dev/null and b/src/assets/images/软件1.png differ
diff --git a/src/assets/images/软件2.png b/src/assets/images/软件2.png
new file mode 100644
index 0000000..a29a9f2
Binary files /dev/null and b/src/assets/images/软件2.png differ
diff --git a/src/assets/images/软件3.png b/src/assets/images/软件3.png
new file mode 100644
index 0000000..aab26b7
Binary files /dev/null and b/src/assets/images/软件3.png differ
diff --git a/src/assets/images/软件4.png b/src/assets/images/软件4.png
new file mode 100644
index 0000000..65101fb
Binary files /dev/null and b/src/assets/images/软件4.png differ
diff --git a/src/assets/images/软件5.png b/src/assets/images/软件5.png
new file mode 100644
index 0000000..5a910bd
Binary files /dev/null and b/src/assets/images/软件5.png differ
diff --git a/src/assets/images/软件6.png b/src/assets/images/软件6.png
new file mode 100644
index 0000000..815d396
Binary files /dev/null and b/src/assets/images/软件6.png differ
diff --git a/src/assets/images/软件7.png b/src/assets/images/软件7.png
new file mode 100644
index 0000000..c96de3d
Binary files /dev/null and b/src/assets/images/软件7.png differ
diff --git a/src/assets/images/软件8.png b/src/assets/images/软件8.png
new file mode 100644
index 0000000..2d2ede4
Binary files /dev/null and b/src/assets/images/软件8.png differ
diff --git a/src/views/courseResources/index.vue b/src/views/courseResources/index.vue
index ed18b47..eb32f83 100644
--- a/src/views/courseResources/index.vue
+++ b/src/views/courseResources/index.vue
@@ -1,386 +1,355 @@
 <template>
-  <div class="top">
-    <div class="loop" @click="click(2)">
-        <img src="D:\前端\前端code\img\简介.svg" alt="" width="50px" height="50px">
+  <div>
+    <div class="top">
+      <div class="loop active-nav" @click="click($event,2)">
+        <img src="../../assets/icons/课程简介.svg" alt="" width="50px" height="50px">
         <p>简介</p>
-    </div>
-    <div class="loop" @click="click(1)">
-        <img src="D:\前端\前端code\img\ppt.svg" alt="" width="50px" height="50px">
+      </div>
+      <div class="loop" @click="click($event,1)">
+        <img src="../../assets/icons/ppt.svg" alt="" width="50px" height="50px">
         <p>ppt</p>
-    </div>
-    <div class="loop"  @click="click(0)">
-        <img src="D:\前端\前端code\img\视频.svg" alt="" width="50px" height="50px">
+      </div>
+      <div class="loop" @click="click($event,0)">
+        <img src="../../assets/icons/视频.svg" alt="" width="50px" height="50px">
         <p>视频</p>
-    </div>
-    <div class="loop"  @click="click(3)">
-        <img src="D:\前端\前端code\img\文本.svg" alt="" width="50px" height="50px">
+      </div>
+      <div class="loop" @click="click($event,3)">
+        <img src="../../assets/icons/文本.svg" alt="" width="50px" height="50px">
         <p>文本</p>
-    </div>
-    <div class="loop"  @click="click(4)">
-        <img src="D:\前端\前端code\img\音频.svg" alt="" width="50px" height="50px">
+      </div>
+      <div class="loop" @click="click($event,4)">
+        <img src="../../assets/icons/音频.svg" alt="" width="50px" height="50px">
         <p>音频</p>
+      </div>
     </div>
-
-  </div>
-  <div class="body" v-if="activeIndex == 0" >
-        <ul>
-            <li>
-              <video src="D:\前端\前端code\vedio\薛之谦 - 病态.mp4" controls width="390px" ></video>
-              <div class="text1">软件工程的奥秘<br>构建无暇的应用程序关键技巧</div> 
-            </li>
-
-            <li>
-              <video src="D:\前端\前端code\vedio\薛之谦 - 病态.mp4" controls width="390px"></video>
-              <div class="text1">如何成为顶级工程师<br>成功之路解析</div> 
-            </li>
-            <li>
-              <video src="D:\前端\前端code\vedio\薛之谦 - 病态.mp4" controls width="390px"></video>
-              <div class="text1">软件工程的黑科技<br>提高开发效率的秘密技巧大揭秘</div> 
-            </li>
-            <li>
-              <video src="D:\前端\前端code\vedio\薛之谦 - 病态.mp4" controls width="390px"></video>
-              <div class="text1">软件工程界的未来趋势<br>AI、大数据和区块的巨大影响</div> 
-            </li>
-            <li>
-              <video src="D:\前端\前端code\vedio\薛之谦 - 病态.mp4" controls width="390px"></video>
-              <div class="text1">软件工程中常见的陷阱级如何避免<br>优化你的开发过程</div> 
-            </li>
-            <li>
-              <video src="D:\前端\前端code\vedio\薛之谦 - 病态.mp4" controls width="390px"></video>
-              <div class="text1">精通软件工程的必备工具<br>代码管理、测试和持续集成</div> 
-            </li>
-            <li>
-              <video src="D:\前端\前端code\vedio\薛之谦 - 病态.mp4" controls width="390px"></video>
-              <div class="text1">软件工程师面试攻略<br>如何在技术中脱颖而出</div> 
-            </li>
-            <li>
-              <video src="D:\前端\前端code\vedio\薛之谦 - 病态.mp4" controls width="390px"></video>
-              <div class="text1">软件工程实战经验分析<br>高效团队合作的秘密武器</div> 
-            </li>
-        </ul>
+    <div class="body" v-if="activeIndex == 0">
+      <ul>
+        <li v-for="item, index in videoList" :key="index">
+          <video :src="item.url" controls width="390px"></video>
+          <div class="text1">软件工程的奥秘<br>构建无暇的应用程序关键技巧</div>
+          <form action="">
+            <input type="file" multiple @change="uploadChange" style="cursor: pointer;"><br>
+            <button type="submit" @click="submitUploadFile" style="cursor: pointer;">上传</button>
+            <button><a href="http://ceshi132132.oss-cn-wuhan-lr.aliyuncs.com/img/1c52b390170a4734aba783a5473e891b.jpg?Expires=1717731833&OSSAccessKeyId=LTAI5tFkdu3y5WddxbjgaG2F&Signature=KtuZCTVO7cbwZAdD7ytpphkYhLw%3D" download="">下载</a></button>
+            <button type="reset" style="cursor: pointer;">重选</button>
+          </form>
+        </li>
+      </ul>
     </div>
 
-    <div class="body" v-if="activeIndex==1">
+    <div class="body" v-if="activeIndex == 1">
       <ul>
-        <li>
-          <img src="D:\前端\前端code\img\ppt1.png" title="ppt" height="200px" width="390px">
+        <li v-for="item, index in pptList" :key="index">
+          <img :src="item.url" title="ppt" height="200px" width="390px">
           <div class="text1">软件工程的奥秘<br>构建无暇的应用程序关键技巧</div>
           <form action="">
-          <input type="file" multiple><br>
-          <button type="submit">上传</button>
-          <button type="reset">重选</button>
+            <input type="file" multiple @change="uploadChange"><br>
+            <button type="submit" @click="submitUploadFile" style="cursor: pointer;">上传</button>
+            <button><a href="http://ceshi132132.oss-cn-wuhan-lr.aliyuncs.com/img/1c52b390170a4734aba783a5473e891b.jpg?Expires=1717731833&OSSAccessKeyId=LTAI5tFkdu3y5WddxbjgaG2F&Signature=KtuZCTVO7cbwZAdD7ytpphkYhLw%3D" download="">下载</a></button>
+            <button type="reset" style="cursor: pointer;">重选</button>
           </form>
         </li>
+
+      </ul>
+    </div>
+    <div class="body" v-if="activeIndex == 2">
+      <ul>
         <li>
-          <img src="D:\前端\前端code\img\文本1.png" title="content" height="200px" width="390px">
-          <div class="text1">如何成为顶级工程师<br>成功之路解析</div> 
-          <form action="">
-          <input type="file" multiple><br>
-          <button type="submit">上传</button>
-          <button type="reset">重选</button>
-          </form>
+          <img src="../../assets/images/软件1.png" title="软件工程的奥秘" width="390px" height="200px">
+          <div class="text1">软件工程的奥秘<br>构建无暇的应用程序关键技巧</div>
+          <div class="text2">课程类型:公共任选课<br>
+            授课老师:王易系<br>
+            报名人数:130人
+          </div>
         </li>
         <li>
-          <img src="D:\前端\前端code\img\音乐.png" title="music" height="200px" width="390px">
+          <img src="../../assets/images/软件2.png" title="顶级工程师" width="390px" height="200px">
+          <div class="text1">如何成为顶级工程师<br>成功之路解析</div>
+          <div class="text2">课程类型:公共任选课<br>
+            授课老师:刘苏杭<br>
+            报名人数:126人
+          </div>
+        </li>
+        <li>
+          <img src="../../assets/images/软件3.png" title="软件黑科技" width="390px" height="200px">
           <div class="text1">软件工程的黑科技<br>提高开发效率的秘密技巧大揭秘</div>
-          <form action="">
-          <input type="file" multiple><br>
-          <button type="submit">上传</button>
-          <button type="reset">重选</button>
-          </form> 
+          <div class="text2">课程类型:公共任选课<br>
+            授课老师:安书名<br>
+            报名人数:117人
+          </div>
         </li>
         <li>
-          <img src="D:\前端\前端code\img\PDF1.png" title="pdf" height="200px" width="390px">
+          <img src="../../assets/images/软件4.png" title="未来趋势" width="390px" height="200px">
           <div class="text1">软件工程界的未来趋势<br>AI、大数据和区块的巨大影响</div>
-          <form action="">
-          <input type="file" multiple><br>
-          <button type="submit">上传</button>
-          <button type="reset">重选</button>
-          </form> 
+          <div class="text2">课程类型:公共任选课<br>
+            授课老师:萨基姆<br>
+            报名人数:140人
+          </div>
         </li>
         <li>
-          <img src="D:\前端\前端code\img\ppt1.png" title="ppt" height="200px" width="390px">
-          <div class="text1">软件工程的奥秘<br>构建无暇的应用程序关键技巧</div>
-          <form action="">
-          <input type="file" multiple><br>
-          <button type="submit">上传</button>
-          <button type="reset">重选</button>
-          </form>
+          <img src="../../assets/images/软件5.png" title="避免陷阱" width="390px" height="200px">
+          <div class="text1">软件工程中常见的陷阱级如何避免<br>优化你的开发过程</div>
+          <div class="text2">课程类型:公共任选课<br>
+            授课老师:何舒心<br>
+            报名人数:125人
+          </div>
         </li>
         <li>
-          <img src="D:\前端\前端code\img\文本1.png" title="content" height="200px" width="390px">
-          <div class="text1">如何成为顶级工程师<br>成功之路解析</div> 
-          <form action="">
-          <input type="file" multiple><br>
-          <button type="submit">上传</button>
-          <button type="reset">重选</button>
-          </form>
+          <img src="../../assets/images/软件6.png" title="必备工具" width="390px" height="200px">
+          <div class="text1">精通软件工程的必备工具<br>代码管理、测试和持续集成</div>
+          <div class="text2">课程类型:公共任选课<br>
+            授课老师:朱佳娜<br>
+            报名人数:121人
+          </div>
         </li>
         <li>
-          <img src="D:\前端\前端code\img\音乐.png" title="music" height="200px" width="390px">
-          <div class="text1">软件工程的黑科技<br>提高开发效率的秘密技巧大揭秘</div>
-          <form action="">
-          <input type="file" multiple><br>
-          <button type="submit">上传</button>
-          <button type="reset">重选</button>
-          </form> 
+          <img src="../../assets/images/软件7.png" title="面试攻略" width="390px" height="200px">
+          <div class="text1">软件工程师面试攻略<br>如何在技术中脱颖而出</div>
+          <div class="text2">课程类型:公共任选课<br>
+            授课老师:胡树立<br>
+            报名人数:117人
+          </div>
         </li>
         <li>
-          <img src="D:\前端\前端code\img\PDF1.png" title="pdf" height="200px" width="390px">
-          <div class="text1">软件工程界的未来趋势<br>AI、大数据和区块的巨大影响</div> 
-          <form action="">
-          <input type="file" multiple><br>
-          <button type="submit">上传</button>
-          <button type="reset">重选</button>
-          </form>
+          <img src="../../assets/images/软件8.png" alt="实战经验" width="390px" height="200px">
+          <div class="text1">软件工程实战经验分析<br>高效团队合作的秘密武器</div>
+          <div class="text2">课程类型:公共任选课<br>
+            授课老师:张海山<br>
+            报名人数:125人
+          </div>
         </li>
       </ul>
     </div>
-    <div class="body" v-if="activeIndex==2">
-    <ul>
-      <li>
-        <img src="D:\前端\前端code\img\软件1.jpg" title="软件工程的奥秘" width="390px" height="200px" >
-        <div class="text1">软件工程的奥秘<br>构建无暇的应用程序关键技巧</div>
-        <div class="text2">课程类型:公共任选课<br>
-          授课老师:王易系<br>
-          报名人数:130人
-        </div>
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件2.png" title="顶级工程师" width="390px" height="200px" >
-        <div class="text1">如何成为顶级工程师<br>成功之路解析</div>
-        <div class="text2">课程类型:公共任选课<br>
-          授课老师:刘苏杭<br>
-          报名人数:126人
-        </div>
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件3.jpg" title="软件黑科技" width="390px" height="200px" >
-        <div class="text1">软件工程的黑科技<br>提高开发效率的秘密技巧大揭秘</div>
-        <div class="text2">课程类型:公共任选课<br>
-          授课老师:安书名<br>
-          报名人数:117人
-        </div> 
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件4.png" title="未来趋势" width="390px" height="200px" >
-        <div class="text1">软件工程界的未来趋势<br>AI、大数据和区块的巨大影响</div>
-        <div class="text2">课程类型:公共任选课<br>
-          授课老师:萨基姆<br>
-          报名人数:140人
-        </div> 
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件5.jpg" title="避免陷阱" width="390px" height="200px" >
-        <div class="text1">软件工程中常见的陷阱级如何避免<br>优化你的开发过程</div>
-        <div class="text2">课程类型:公共任选课<br>
-          授课老师:何舒心<br>
-          报名人数:125人
-        </div>
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件6.jpg" title="必备工具" width="390px" height="200px" >
-        <div class="text1">精通软件工程的必备工具<br>代码管理、测试和持续集成</div>
-        <div class="text2">课程类型:公共任选课<br>
-          授课老师:朱佳娜<br>
-          报名人数:121人
-        </div> 
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件7.png" title="面试攻略" width="390px" height="200px" >
-        <div class="text1">软件工程师面试攻略<br>如何在技术中脱颖而出</div>
-        <div class="text2">课程类型:公共任选课<br>
-          授课老师:胡树立<br>
-          报名人数:117人
-        </div>
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件8.jpg" alt="实战经验" width="390px" height="200px" >
-        <div class="text1">软件工程实战经验分析<br>高效团队合作的秘密武器</div>
-        <div class="text2">课程类型:公共任选课<br>
-          授课老师:张海山<br>
-          报名人数:125人
-        </div> 
-      </li>
-    </ul>
-    </div>
-    <div class="body" v-if="activeIndex==3">
+    <div class="body" v-if="activeIndex == 3">
       <ul>
-      <li>
-        <img src="D:\前端\前端code\img\软件1.jpg" title="软件工程的奥秘" width="390px" height="200px" >
-        
-        <textarea name="" id="">点击输入文本内容:</textarea>
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件2.png" title="顶级工程师" width="390px" height="200px" >
-        
-        <textarea name="" id="">点击输入文本内容:</textarea>
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件3.jpg" title="软件黑科技" width="390px" height="200px" >
-       
-        <textarea name="" id="">点击输入文本内容:</textarea>
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件4.png" title="未来趋势" width="390px" height="200px" >
-        
-        <textarea name="" id="">点击输入文本内容:</textarea>
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件5.jpg" title="避免陷阱" width="390px" height="200px" >
-        
-        <textarea name="" id="">点击输入文本内容:</textarea>
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件6.jpg" title="必备工具" width="390px" height="200px" >
-        
-        <textarea name="" id="">点击输入文本内容:</textarea>
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件7.png" title="面试攻略" width="390px" height="200px" >
-        
-        <textarea name="" id="">点击输入文本内容:</textarea>
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件8.jpg" alt="实战经验" width="390px" height="200px" >
-        
-        <textarea name="" id="">点击输入文本内容:</textarea>
-      </li>
-    </ul>
+        <li v-for="item, index in textList" :key="index">
+          <img src="../../assets/icons/文本1.png" title="软件工程的奥秘" width="390px" height="200px">
+          <textarea name="" id="">点击输入文本内容:</textarea>
+          <form action="">
+            <input type="file" multiple @change="uploadChange" style="cursor: pointer;"><br>
+            <button type="submit" @click="submitUploadFile" style="cursor: pointer;">上传</button>
+            <button><a href="http://ceshi132132.oss-cn-wuhan-lr.aliyuncs.com/img/1c52b390170a4734aba783a5473e891b.jpg?Expires=1717731833&OSSAccessKeyId=LTAI5tFkdu3y5WddxbjgaG2F&Signature=KtuZCTVO7cbwZAdD7ytpphkYhLw%3D" download="">下载</a></button>
+            <button type="reset" style="cursor: pointer;">重选</button>
+          </form>
+        </li>
+       </ul>
     </div>
-    <div class="body" v-if="activeIndex==4">
+    <div class="body" v-if="activeIndex == 4">
       <ul>
-      <li>
-        <img src="D:\前端\前端code\img\软件1.jpg" title="软件工程的奥秘" width="390px" height="200px" >
-        <div class="text1">点击播放软件工程的奥秘</div>
-        <audio src="D:\前端\前端code\vedio\tsukuyumi - 徐小湛《高等数学》第17讲 函数的连续性.mp3" controls></audio>
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件2.png" title="顶级工程师" width="390px" height="200px" >
-        <div class="text1">点击播放顶级工程师</div>
-        <audio src="D:\前端\前端code\vedio\tsukuyumi - 徐小湛《高等数学》第17讲 函数的连续性.mp3" controls></audio>
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件3.jpg" title="软件黑科技" width="390px" height="200px" >
-        <div class="text1">点击播放软件黑科技</div>
-        <audio src="http://192.168.192.1" controls></audio>
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件4.png" title="未来趋势" width="390px" height="200px" >
-        <div class="text1">点击播放软件工程为了趋势</div>
-        <audio src="D:\前端\前端code\vedio\tsukuyumi - 徐小湛《高等数学》第17讲 函数的连续性.mp3" controls></audio>
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件5.jpg" title="避免陷阱" width="390px" height="200px" >
-        <div class="text1">点击播放软件工程如何避免陷阱</div>
-        <audio src="D:\前端\前端code\vedio\tsukuyumi - 徐小湛《高等数学》第17讲 函数的连续性.mp3" controls></audio>
+        <li v-for="item, index in audioList" :key="index">
+          <img src="../../assets/icons/音乐.png" title="软件工程的奥秘" width="390px" height="180px">
+          <div class="text1">点击播放软件工程的奥秘</div>
+          <video src="../../assets/images/1.mp3" controls height="50px" width="300px"></video>
+          <!-- <audio src="../../assets/images/1.mp3" controls></audio> -->
+          <form action="">
+            <input type="file" multiple @change="uploadChange" style="cursor: pointer;"><br>
+            <button type="submit" @click="submitUploadFile" style="cursor: pointer;">上传</button>
+            <button><a href="http://ceshi132132.oss-cn-wuhan-lr.aliyuncs.com/img/1c52b390170a4734aba783a5473e891b.jpg?Expires=1717731833&OSSAccessKeyId=LTAI5tFkdu3y5WddxbjgaG2F&Signature=KtuZCTVO7cbwZAdD7ytpphkYhLw%3D" download="">下载</a></button>
+            <button type="reset" style="cursor: pointer;">重选</button>
+          </form>
+        </li>
+      </ul>
+    </div>
+    <div class="" @click="gotoinfo">
 
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件6.jpg" title="必备工具" width="390px" height="200px" >
-        <div class="text1">点击播放软件工程的必备工具</div>
-        <audio src="D:\前端\前端code\vedio\tsukuyumi - 徐小湛《高等数学》第17讲 函数的连续性.mp3" controls></audio>
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件7.png" title="面试攻略" width="390px" height="200px" >
-        <div class="text1">点击播放软件工程的面试攻略</div>
-        <audio src="D:\前端\前端code\vedio\tsukuyumi - 徐小湛《高等数学》第17讲 函数的连续性.mp3" controls></audio>
-      </li>
-      <li>
-        <img src="D:\前端\前端code\img\软件8.jpg" alt="实战经验" width="390px" height="200px" >
-        <div class="text1">点击播放软件工程的实战经验</div>
-        <!-- <audio src="../../../../前端code/vedio/tsukuyumi - 徐小湛《高等数学》第17讲 函数的连续性.mp3" controls></audio> -->
-        <audio controls>
-  <source src="../../../../前端code/vedio/tsukuyumi - 徐小湛《高等数学》第17讲 函数的连续性.mp3" type="audio/mpeg">
-  <source src="../../../../前端code/vedio/tsukuyumi - 徐小湛《高等数学》第17讲 函数的连续性.mp3" type="audio/ogg">
-  您的浏览器不支持该音频格式。
-</audio>
-        <!-- <embed height="50" width="100" src="D:\前端\前端code\vedio\tsukuyumi - 徐小湛《高等数学》第17讲 函数的连续性.mp3" controls > -->
-      </li>
-    </ul>
     </div>
-  <div class="" @click="gotoinfo">
-    
+    <div class="buttom">
+      <el-pagination background layout="prev, pager, next,total" :page-size="pageSize" :total="total" class="pagination"
+        :pager-count="11" @current-change="currentChange" />
+    </div>
   </div>
-  
 </template>
-<script lang="ts" setup>
-import {ref} from 'vue'
+<script setup>
+import { ref } from 'vue'
 import { useRouter } from 'vue-router'
+import { aaaApi } from '../../api/courseChaptersApi'
 // import {getVideoUrlApi} from 'src/api/assats'
-const activeIndex=ref(0)
+import { uploadFile } from '../../api/courseChaptersApi'
+const activeIndex = ref(0)
 const router = useRouter()
 const gotoinfo = () => {
   console.log(router);
   router.push('/courseResourcesManagement/courseInfo')
 }
-function click(index:any){
-console.log(index);
-activeIndex.value = index
+function click(e,index) {
+  document.querySelectorAll('.loop').forEach(item=> item.classList.remove('active-nav'))
+  e.currentTarget.classList.add('active-nav')
+  activeIndex.value = index
+  
 }
+//====================获取视频资源
 
+const page = ref(1)
+const total = ref(50)
+const pageSize = ref(8)
+const videoList = ref([
+  { url: '1' },
+  { url: '2' },
+  { url: '3' },
+  { url: '4' },
+  { url: '5' },
+  { url: '6' },
+  { url: '7' },
+  { url: '8' },
+ 
+])
+const pptList = ref([
+  { url: '/src/assets/images/0.jpg' },
+  { url: 'http://ceshi132132.oss-cn-wuhan-lr.aliyuncs.com/img/1c52b390170a4734aba783a5473e891b.jpg?Expires=1717731833&OSSAccessKeyId=LTAI5tFkdu3y5WddxbjgaG2F&Signature=KtuZCTVO7cbwZAdD7ytpphkYhLw%3D' },
+  { url: '3' },
+  { url: '4' },
+  { url: '5' },
+  { url: '6' },
+  { url: '7' },
+  { url: '8' },
+])
+const textList = ref([
+  { url: '1' },
+  { url: '2' },
+  { url: '3' },
+  { url: '4' },
+  { url: '5' },
+  { url: '6' },
+  { url: '7' },
+  { url: '8' },
+])
+const audioList = ref([
+  { url: '1' },
+  { url: '2' },
+  { url: '3' },
+  { url: '4' },
+  { url: '5' },
+  { url: '6' },
+  { url: '7' },
+  { url: '8' },
+])
 
+function changePage() {
+  //   aaaApi(`?page=${page.value}&pageSize=${pageSize.value}`).then(res=>{
+  //     // @ts-ignore
+  //     videoList.vlue =res.list
+  //   // @ts-ignore
+  //   total.value = res.total
+  // })
+}
+
+
+
+function currentChange(number) {
+  console.log(number, 'num')
+  page.value = number
+  changePage()
+}
+const file = ref(null)
+const uploadChange = (e) => {
+  console.log(e.target.files[0]);
+  file.value = e.target.files[0]
+}
+const uploadFileEvent = () => {
+
+}
+const submitUploadFile = async () => {
+  const formData = new FormData()
+  formData.append('courseId',1)
+  formData.append('file',file.value)
+  await uploadFile(formData)
+}
+//============
 
 </script>
-<style lang="scss" scoped>
-.top{
+<style lang="scss">
+.top {
   width: 1620px;
   height: 100px;
   display: flex;
   justify-content: space-around;
   border: 1px solid rgb(187, 181, 181);
   background-color: rgb(255, 255, 255);
-  li{
+
+  li {
     height: 99px !important;
     border-bottom: 1px solid;
   }
-  &>*{
+
+  &>* {
     transition: .1s;
     cursor: pointer;
   }
-  &>*:hover{
+
+ .active-nav {
     border-bottom: 5px solid blue !important;
   }
 }
-.body{
+
+.body {
   width: 1620px;
   height: 680px;
   display: flex;
   background-color: rgb(237, 237, 238);
 }
-li{
-    list-style-type: none;
+
+li {
+  list-style-type: none;
 }
-.body ul{
+
+.body ul {
   width: 100%;
   display: flex;
   flex-wrap: wrap;
   align-content: space-evenly;
   justify-content: space-between;
 }
-.body li{
-    height: 320px;
-    width: 390px;
-    background-color: rgb(237, 237, 238);
+
+.body li {
+  height: 320px;
+  width: 390px;
+  background-color: rgb(237, 237, 238);
 
 }
-.loop{
+
+.loop {
   width: 100px;
   height: 99px;
   text-align: center;
   padding: 20px;
-  border-bottom: 1px solid rgb(187, 181, 181);;
+  border-bottom: 1px solid rgb(187, 181, 181);
+  ;
   background-color: rgb(253, 252, 252);
 }
-.body .text1{
+
+.body .text1 {
   font-size: 25px;
   line-height: 30px;
 }
-.body .text2{
+
+.body .text2 {
   font-size: 18px;
   line-height: 20px;
   color: rgb(186, 43, 11);
 }
-
-
+.body a{
+  all:initial;
+  cursor: pointer;
+}
+.buttom {
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  // .pagination{
+  // width: ;
+  // $height:150px;
+  // height:  $height;
+  // button,li{
+  //   height:  $height !important;
+  // }
+}
 </style>
+
+<!-- 上传git
+  git add .
+  git commit -m '介绍'
+  git pull
+  git push
+  
+   -->
\ No newline at end of file