From adf90b1390b420b174d26fcecbd2dbf5b4495df0 Mon Sep 17 00:00:00 2001
From: QDKF <QDKF@example.com>
Date: Wed, 27 Aug 2025 19:06:26 +0800
Subject: [PATCH] =?UTF-8?q?style:=20=E8=B0=83=E6=95=B4=E5=88=9B=E5=BB=BA?=
 =?UTF-8?q?=E8=AF=BE=E7=A8=8B=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 public/images/teacher/folder.jpg              |  Bin 0 -> 6618 bytes
 public/images/teacher/template.png            |  Bin 452 -> 1476 bytes
 .../admin/CourseComponents/CourseCategory.vue |    2 +-
 .../admin/CourseComponents/CourseCreate.vue   | 1172 ++++++++++-------
 .../teacher/course/CoursewareManagement.vue   |    2 +-
 5 files changed, 697 insertions(+), 479 deletions(-)
 create mode 100644 public/images/teacher/folder.jpg

diff --git a/public/images/teacher/folder.jpg b/public/images/teacher/folder.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..f8485888972060f60d5aecd21b893b8374c30cde
GIT binary patch
literal 6618
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

literal 0
HcmV?d00001

diff --git a/public/images/teacher/template.png b/public/images/teacher/template.png
index 5123207cce6663836a25fe95c73402be433beac4..3d624f73c1ca96322fd4a82790a644f62d19a955 100644
GIT binary patch
delta 1465
zcmV;q1xEVB1H=m<iBL{Q4GJ0x0000DNk~Le0000W0000W2nGNE0CReJ^pPPSe+6zy
zL_t(oh3%GWY*S?z$A8Z`?JC7e1a)llk`Ohr7=xjS8WWAEF@E5S(%>a>8(j;-C1@rX
zMGop0;x$#Er<GwMLEQq;xQI$nz!)zP6Qjl}Mg?qTj0|uKZO=K6A9^ZfTeqQnG4c6!
z-uHjr|NniS_qo9Tc7`n$i<z-lf6N>&Uj8kiWm$p7#>OjE^={xApx)m)BqE=?uDjVV
zjIR@kMCptRux<Ma;5p!CAUG06RUHx84J=P25?`GW0hVPM4Gj%<0vmydzdQhZtE&4&
zM1hNdW)TUissMkANIV{ozwYn<GXbeoDpXfjw;EU>B8Gp%mmSA>ytlXaf1qVq9)PM!
zXJ==F<2Vlki-EI%A}}|RNWAfn1f)`_P$(371(*Yfs^)=~L?W@h`c~DZs$$#rZNO#`
znWCzPOw*hhkH-%H7^frP$dMx@;E@0MrQ<laB$LUvYmozph$fTCcYs#FF%08;Rki%E
zj88xXY+06f?AWmtz@w&Vf6iLAY}q&C6+e0M<Trussw%2FXZ`y16Jd-H_$l_F=Xv3L
zKEI|C-?7B5S+hn)!lu*dTSa6$U;_6h5{WH=S_f_1xG~~5PDWMdiip?H(C{_TJsNpe
zSC^T|WbU6jb?Ui*1)LHZ$8o+027`YBlT`I;V9SUh=<MvA<~Ytye_*bN0PJ&J_xsVv
zEz1h`_xHaDJS`$C)9LhGLovl-aS%8GAR-ZfVID}Q)6Jz)X$Q~<;CbG=#bWWk_V)JP
zTIAVmw%&E!EvkAG<*@D#1Ooep;sSv{kh1#$3NYjmrc$Z%fwz2e7kFMoW{*LBmFIaM
zh{!AeRsA>+2wcB-fAQkahGIjZP$O`T|M}Z60ijUnNfDU_cp|bYm&-j^tA+!T$z*Q#
zJZ~p3opQW4A3uKl)|Qr*-$%j&_fam{PO(_r22~-jZTn*2F8>xga=F~vTCd(O#qFxP
z7N`SU5wTQtZAVAPh=Og~z6eNAE?^(`_4WOFiU40-1aM5#e|)4C`KC>q&MFiNDWHY2
z2M0uCers#%Hio?VD)KP!8ZZSY0Z&xU4^(bMxs?j=)4_uWhjlIgp!15w;;SNZi@)@X
zVHk7b@%Y}6@KDaEQmM2Rm;s=woAUYm&dR<4(A?ZCz=i(W4}dfDplmif9r#d0ZWa+0
zk&hh5xnUG?f7!5M!>m%Nw8tm+fNkM$_<?HgRzJc@KObDZdi5|@nx=UU(4?yBdES<z
zM~~jt*4DPa7P)QPt%hOr08NxL>bXLpaL>GX^9HJc20(XrH$Xpth%|L~cMmI2ixw^V
z%=5e@z+?G*enCe^$G}ibm8poBsv1(&W2zd@<#G?Tf48?6hAD+|{mx`E8OnXTZ*Xw%
z(&fvS_m4s_rm3oAvsue^-S?I(S@KaWTmZ@~)3)t5fQ7)62@@tP0-ik$KCx~4dJ$O=
z3<j4iT)6Or-=ZyQWJbmQo?fHT=&zAT<PP8h5t%W2_UxXXo}R;FF{`RHH8sr#UIDIk
zUH9y0e>A#d*REZo5?Ac+SX-7=RMi!fGoT*Wx^CUN>7)H@Syo*plX*r}U!q)M3!dkF
zHy+}OoiYztmSxn}*FPa5D@DWrdVv>8rPBJthYueGyyoU+IdI@WT{s-RQA8dGqW(F(
zs(N=anS7ry++I@vKx=DjaOTXJtALf9OwHrKe~-W)z(io0h%{9uCE!!nb?;fabm`Bh
zb9<<I0~Oo5cdr+XMt4Udkxx|hN)fq$@<iJJTn1di$&S_sJmok}vaPM{kJBZGF-9`m
zwu7pA9px$ba>Fntd7f7kk>5mQ&%nSy_rFcoaSOF9%joLrGGnorS>^iwzWoKk9bHSD
T52V}V00000NkvXXu0mjfvZus0

delta 433
zcmV;i0Z#tJ3&aB<iBL{Q4GJ0x0000DNk~Le0000M0000K2nGNE0Ev9fFp(i2e*tbu
zL_t(Ijh)rKb;2+dhT&I&f>I-x1!BAb*?>$CMsSyKQrKy1s5ndzGC|lN+2G;{>=8(p
z1}lY)A^ghuDi!xUN7mJq!6k`=OtajnwvKkIQa<33isuS<n^h`fl=iXZf=N&~Z*7)E
zSPa|potI#}-*GI4X_lk(8xR6Re`hongJleabhMC2xQBZ>0z4Ekw(K(rmhNz{;in9+
z<vmcK^?Y|+U0?(hJo&HA;4uzgB(gy3IhFxXXutzo{3&*AQY@xfE2{JDXdlkqibO(`
z&Y5M=MKBeQX_nK|a;fALR;+*mOMDhj#Y5>&s=h4U;Ym<5%{avm(fC?lf6focF^(El
zU!y-<(97^K4!b597xX%OisOpH;YeS@p-(KPzOznodxU^CXgj!NG_V0>ZdTro2f()c
zu3@_d2Bb3lHyMjTbsm9cv{gMxyT8L4Y^$@Zq6UBgwc`2ip@IQY8KOE7*t(!~)+kno
bSMe9>>4^Xs2}qRy0000<2SrXqu0mjfVk*2?

diff --git a/src/components/admin/CourseComponents/CourseCategory.vue b/src/components/admin/CourseComponents/CourseCategory.vue
index fd3fd45..daae8d2 100644
--- a/src/components/admin/CourseComponents/CourseCategory.vue
+++ b/src/components/admin/CourseComponents/CourseCategory.vue
@@ -100,7 +100,7 @@ const courseList = ref([
 
 // 跳转到创建课程页面
 const navigateToCreateCourse = () => {
-  // router.push('/teacher/course-create');  
+  router.push('/teacher/course-create');  
 };
 </script>
 
diff --git a/src/components/admin/CourseComponents/CourseCreate.vue b/src/components/admin/CourseComponents/CourseCreate.vue
index dc7cac0..ab51118 100644
--- a/src/components/admin/CourseComponents/CourseCreate.vue
+++ b/src/components/admin/CourseComponents/CourseCreate.vue
@@ -1,510 +1,728 @@
 <template>
-    <div class="course-create-page">
-      <div class="course-form-container flex-col">
-        <!-- 第一行：课程名称和课程分类 -->
-        <div class="course-basic-info-row flex-row">
-          <div class="course-name-label">
-            <span class="required-asterisk">*</span>
-            <span class="label-text">课程名称：</span>
-          </div>
-          <div class="course-name-input-wrapper flex-col">
-            <n-input
-              v-model:value="formData.courseName"
-              placeholder="请输入课程名称"
-              class="form-input"
-              :bordered="false"
-            />
-          </div>
-          <div class="course-category-section flex-col">
-            <div class="course-category-label">
-              <span class="required-asterisk">*</span>
-              <span class="label-text">课程分类：</span>
+  <div class="course-create-container">
+    <div class="form-container">
+      <!-- 表单内容 -->
+      <div class="form-content">
+        <!-- 上半部分：两列布局 -->
+        <div class="form-row">
+          <!-- 左列 -->
+          <div class="form-column">
+            <!-- 课程名称 -->
+            <div class="form-item">
+              <label class="form-label required">课程名称:</label>
+              <n-input v-model:value="formData.courseName" placeholder="请输入课程名称" class="form-input" />
             </div>
-            <div class="course-category-select-wrapper flex-col">
-              <n-select
-                v-model:value="formData.courseCategory"
-                placeholder="分类名称"
-                :options="categoryOptions"
-                class="form-select"
-                :bordered="false"
-              />
-            </div>
-          </div>
-        </div>
-  
-        <!-- 第二行：主讲老师和排序 -->
-        <div class="instructor-sort-row flex-row">
-          <div class="instructor-label">
-            <span class="required-asterisk">*</span>
-            <span class="label-text">主讲老师：</span>
-          </div>
-          <div class="instructor-select-wrapper flex-row">
-            <n-select
-              v-model:value="formData.instructors"
-              multiple
-              placeholder="请选择主讲老师"
-              :options="instructorOptions"
-              class="form-select"
-              :bordered="false"
-              :render-tag="renderInstructorTag"
-            />
-          </div>
-          <div class="course-sort-section flex-row">
-            <div class="course-sort-label">
-              <span class="required-asterisk">*</span>
-              <span class="label-text">排序：</span>
-            </div>
-            <div class="course-sort-input-wrapper">
-              <n-input
-                v-model:value="formData.sort"
-                placeholder="数字越小越排序靠前"
-                class="form-input"
-                :bordered="false"
-              />
-            </div>
-          </div>
-        </div>
-  
-        <!-- 第三行：课程开始时间和结束时间 -->
-        <div class="course-time-row flex-row">
-          <div class="start-time-label">
-            <span class="required-asterisk">*</span>
-            <span class="label-text">课程开始时间：</span>
-          </div>
-          <div class="start-time-picker-wrapper flex-row">
-            <n-date-picker
-              v-model:value="formData.startTime"
-              type="datetime"
-              placeholder="选择时间"
-              class="form-datepicker"
-              :bordered="false"
-            />
-          </div>
-          <div class="end-time-label">
-            <span class="required-asterisk">*</span>
-            <span class="label-text">课程结束时间：</span>
-          </div>
-          <div class="end-time-picker-wrapper flex-row">
-            <n-date-picker
-              v-model:value="formData.endTime"
-              type="datetime"
-              placeholder="选择时间"
-              class="form-datepicker"
-              :bordered="false"
-            />
-          </div>
-        </div>
-  
-        <!-- 第四行：参与学员 -->
-        <div class="student-selection-row flex-row">
-          <div class="student-selection-label">
-            <span class="required-asterisk">*</span>
-            <span class="label-text">参与学员：</span>
-          </div>
-          <div class="student-type-radio-group flex-row">
-            <label class="radio-option" @click="formData.studentType = 'all'">
-              <div class="radio-circle" :class="{ active: formData.studentType === 'all' }">
-                <div class="radio-dot" v-if="formData.studentType === 'all'"></div>
-              </div>
-              <span class="radio-text">全部学员</span>
-            </label>
-            <label class="radio-option" @click="formData.studentType = 'partial'">
-              <div class="radio-circle" :class="{ active: formData.studentType === 'partial' }">
-                <div class="radio-dot" v-if="formData.studentType === 'partial'"></div>
-              </div>
-              <span class="radio-text">仅部分学员</span>
-            </label>
-          </div>
-        </div>
 
-        <!-- 第五行：选择班级（仅在选择部分学员时显示） -->
-        <div class="class-selection-row" v-if="formData.studentType === 'partial'">
-          <div class="class-select-wrapper flex-row">
-            <n-select
-              v-model:value="formData.selectedClasses"
-              multiple
-              placeholder="选择班级（可多选）"
-              :options="classOptions"
-              class="form-select"
-              :bordered="false"
-            />
-          </div>
-        </div>
-  
-        <!-- 第六行：课程封面 -->
-        <div class="course-cover-row flex-row justify-between">
-          <div class="course-cover-label">
-            <span class="required-asterisk">*</span>
-            <span class="label-text">课程封面：</span>
-          </div>
-          <div class="cover-upload-area flex-row">
-            <div class="upload-container flex-col justify-between" style="width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;">
-              <div class="native-upload">
-                <input
-                  type="file"
-                  id="coverUpload"
-                  accept="image/*"
-                  @change="handleNativeFileChange"
-                  style="display: none;"
-                />
-                <label for="coverUpload" class="upload-content" style="cursor: pointer; width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;">
-                  <template v-if="!previewUrl">
-                    <div class="upload-plus-icon" style="font-size: 32px; display: block; text-align: center;">+</div>
-                    <span class="upload-text" style="display: block; text-align: center;">上传</span>
-                  </template>
-                  <div v-if="previewUrl" style="position: relative; width: 100%; height: 100%;">
-                    <img :src="previewUrl" style="max-width: 100%; max-height: 100%; object-fit: contain;" />
-                    <div
-                      class="image-delete-icon"
-                      @click.stop="clearUpload"
-                      style="position: absolute; top: 5px; right: 5px; background-color: rgba(0,0,0,0.5); color: white; width: 20px; height: 20px; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer;"
-                    >
-                      ×
-                    </div>
-                  </div>
+            <!-- 主讲老师 -->
+            <div class="form-item">
+              <label class="form-label required">主讲老师:</label>
+              <n-select v-model:value="formData.instructors" multiple :options="instructorOptions" placeholder="请选择主讲老师"
+                class="form-input" />
+            </div>
+
+
+
+            <!-- 课程开始时间 -->
+            <div class="form-item">
+              <label class="form-label required">课程开始时间:</label>
+              <n-date-picker v-model:value="formData.startTime" type="datetime" placeholder="选择时间" class="form-input" />
+            </div>
+
+            <!-- 参与学员 -->
+            <div class="form-item">
+              <label class="form-label required">参与学员:</label>
+              <div class="radio-container">
+                <label class="radio-option">
+                  <input type="radio" name="studentType" value="all" v-model="formData.studentType"
+                    class="radio-input" />
+                  <span class="radio-label">全部学员</span>
+                </label>
+                <label class="radio-option">
+                  <input type="radio" name="studentType" value="partial" v-model="formData.studentType"
+                    class="radio-input" />
+                  <span class="radio-label">仅部分学员</span>
                 </label>
               </div>
             </div>
-          </div>
-        </div>
-  
-        <!-- 课程简介标题和编辑器 -->
-        <div class="course-description-section flex-col">
-          <div class="course-description-header flex-row">
-            <div class="course-description-label">
-              <span class="required-asterisk">*</span>
-              <span class="label-text">课程简介：</span>
+
+            <!-- 选择班级 -->
+            <div class="form-item">
+              <n-select v-model:value="formData.selectedClasses" multiple :options="classOptions"
+                placeholder="选择班级（可多选）" class="form-input" />
             </div>
           </div>
 
-          <!-- 富文本编辑器区域 -->
-          <div class="description-editor-container flex-col">
-              <QuillEditor
-                v-model="formData.courseDescription"
-                :height="'280px'"
-                placeholder="请输入内容…"
-                class="rich-text-editor"
-              />
+          <!-- 右列 -->
+          <div class="form-column">
+            <!-- 课程分类 -->
+            <div class="form-item">
+              <label class="form-label required">课程分类:</label>
+              <n-select v-model:value="formData.courseCategory" :options="categoryOptions" placeholder="分类名称"
+                class="form-input" />
+            </div>
+
+            <!-- 排序 -->
+            <div class="form-item">
+              <label class="form-label required">排序:</label>
+              <n-select v-model:value="formData.sort" :options="sortOptions" placeholder="数字越小越排序靠前"
+                class="form-input" />
+            </div>
+
+            <!-- 课程结束时间 -->
+            <div class="form-item">
+              <label class="form-label required">课程结束时间:</label>
+              <n-date-picker v-model:value="formData.endTime" type="datetime" placeholder="选择时间" class="form-input" />
+            </div>
           </div>
         </div>
-  
-        <!-- 设置选项区域 -->
-        <div class="course-settings-section">
-          <!-- 离开页面停止播放 -->
-          <div class="stop-on-leave-setting flex-row">
-            <div class="setting-control flex-row">
-              <div class="setting-label">
-                <span class="required-asterisk">*</span>
-                <span class="label-text">离开页面停止播放：</span>
+
+        <!-- 中间部分：课程封面 -->
+        <div class="form-section">
+          <div class="form-item">
+            <label class="form-label required">课程封面:</label>
+            <div class="cover-upload-container">
+              <div class="upload-area" @click="triggerFileUpload">
+                <template v-if="!previewUrl">
+                  <div class="upload-icon">+</div>
+                  <span class="upload-text">上传</span>
+                </template>
+                <div v-else class="preview-container">
+                  <img :src="previewUrl" alt="课程封面预览" class="preview-image" />
+                  <div class="delete-icon" @click.stop="clearUpload">×</div>
+                </div>
               </div>
-              <button
-                @click="formData.stopOnLeave = !formData.stopOnLeave"
-                class="toggle-button"
-                :class="{ 'toggle-button-active': formData.stopOnLeave }"
-              >
-                {{ formData.stopOnLeave ? '开启' : '关闭' }}
-              </button>
+              <input ref="fileInput" type="file" accept="image/*" @change="handleFileChange" style="display: none;" />
+            </div>
+          </div>
+        </div>
+
+        <!-- 课程简介 -->
+        <div class="form-text">
+          <label class="form-label required">课程简介:</label>
+          <div class="rich-editor-container">
+            <div class="editor-container">
+              <Toolbar style="border-bottom: 1px solid #ccc" :editor="editorRef" :defaultConfig="toolbarConfig"
+                :mode="mode" />
+              <Editor style="height: 300px; overflow-y: hidden;" v-model="formData.courseDescription"
+                :defaultConfig="editorConfig" :mode="mode" @onCreated="handleCreated" />
+            </div>
+          </div>
+        </div>
+
+        <!-- 下半部分：设置选项 -->
+        <div class="form-section">
+          <!-- 离开页面停止播放 -->
+          <div class="form-item btn-label">
+            <label class="form-label required">离开页面停止播放</label>
+            <div class="setting-container">
+              <n-switch v-model:value="formData.stopOnLeave" class="form-toggle" />
             </div>
           </div>
 
           <!-- 视频倍数播放 -->
-          <div class="video-speed-setting flex-row">
-            <div class="setting-control flex-row">
-              <div class="setting-label">
-                <span class="required-asterisk">*</span>
-                <span class="label-text">视频倍数播放：</span>
-              </div>
-              <button
-                @click="formData.videoSpeedControl = !formData.videoSpeedControl"
-                class="toggle-button"
-                :class="{ 'toggle-button-active': formData.videoSpeedControl }"
-              >
-                {{ formData.videoSpeedControl ? '开启' : '关闭' }}
-              </button>
+          <div class="form-item btn-label">
+            <label class="form-label required">视频倍数播放</label>
+            <div class="setting-container">
+              <n-switch v-model:value="formData.videoSpeedControl" class="form-toggle" />
             </div>
           </div>
 
           <!-- 显示视频文本 -->
-          <div class="video-text-setting flex-row">
-            <div class="setting-control flex-row">
-              <div class="setting-label">
-                <span class="required-asterisk">*</span>
-                <span class="label-text">显示视频文本：</span>
-              </div>
-              <button
-                @click="formData.showVideoText = !formData.showVideoText"
-                class="toggle-button"
-                :class="{ 'toggle-button-active': formData.showVideoText }"
-              >
-                {{ formData.showVideoText ? '开启' : '关闭' }}
-              </button>
+          <div class="form-item btn-label">
+            <label class="form-label required">显示视频文本</label>
+            <div class="setting-container">
+              <n-switch v-model:value="formData.showVideoText" class="form-toggle" />
             </div>
           </div>
-  
-          <!-- 积分设置 -->
-          <div class="points-setting-row flex-row">
-            <div class="points-setting-control flex-row justify-between">
-              <div class="setting-label">
-                <span class="required-asterisk">*</span>
-                <span class="label-text">积分设置：</span>
-              </div>
-              <button
-                @click="formData.pointsEnabled = !formData.pointsEnabled"
-                class="toggle-button"
-                :class="{ 'toggle-button-active': formData.pointsEnabled }"
-              >
-                {{ formData.pointsEnabled ? '开启' : '关闭' }}
-              </button>
-            </div>
-            <span class="points-description-text">学完可获得</span>
-            <div class="earn-points-input-container">
-              <input
-                type="number"
-                v-model="formData.earnPoints"
-                min="0"
-                max="1000"
-                class="points-input"
-              />
-            </div>
-            <span class="points-description-text">积分</span>
-            <span class="points-description-text">本课程需</span>
-            <div class="required-points-input-container">
-              <input
-                type="number"
-                v-model="formData.requiredPoints"
-                min="0"
-                max="1000"
-                class="points-input"
-              />
-            </div>
-            <span class="points-description-text">积分兑换</span>
-          </div>
-        </div>
 
-        <!-- 底部按钮区域 -->
-        <div class="form-action-buttons flex-row">
-          <div class="button-spacer flex-col"></div>
-          <div class="cancel-button flex-col" @click="handleCancel">
-            <span class="button-text">取消</span>
-          </div>
-          <div class="submit-button flex-col" @click="handleSubmit">
-            <span class="button-text">保存</span>
+          <!-- 积分设置 -->
+          <div class="form-item form-integral">
+            <label class="form-label required">积分设置</label>
+            <div class="setting-container">
+              <n-switch v-model:value="formData.pointsEnabled" class="form-toggle" />
+              <span class="setting-label">学完可获得</span>
+              <n-input-number v-model:value="formData.earnPoints" :min="0" :max="1000" class="score-input"
+                :show-button="false" />
+              <span class="setting-label">积分</span>
+              <span class="setting-label">本课程需</span>
+              <n-input-number v-model:value="formData.requiredPoints" :min="0" :max="1000" class="score-input"
+                :show-button="false" />
+              <span class="setting-label">积分兑换</span>
+            </div>
           </div>
         </div>
       </div>
+
+      <!-- 底部按钮 -->
+      <div class="form-footer">
+        <n-button class="cancel-btn" @click="handleCancel">取消</n-button>
+        <n-button type="primary" class="save-btn" @click="handleSubmit">保存</n-button>
+      </div>
     </div>
-  </template>
-  
-  <script setup lang="ts">
-  import { ref, reactive, h } from 'vue'
-  import { useRouter } from 'vue-router'
-  import { useMessage } from 'naive-ui'
-  import { NInput, NSelect, NDatePicker } from 'naive-ui'
-  import QuillEditor from '@/components/common/QuillEditor.vue'
-  
-  const router = useRouter()
-  const message = useMessage()
-  
-  // 表单数据
-  const formData = reactive({
-    courseName: '',
-    courseCategory: '',
-    instructors: [], // 改为数组，支持多选
-    sort: '',
-    startTime: null,
-    endTime: null,
-    studentType: 'all', // 'all' 或 'partial'
-    selectedClasses: [],
-    courseCover: '',
-    courseDescription: '',
-    // 开关设置
-    allowDiscussion: true,
-    contentProtection: false,
-    allowTextContent: true,
-    studySettings: true,
-    // 视频设置
-    stopOnLeave: true,
-    videoSpeedControl: false,
-    showVideoText: true,
-    // 积分设置
-    pointsEnabled: true,
-    earnPoints: 60,
-    requiredPoints: 60,
-    // 学习设置详细配置
-    studyDuration: 60,
-    studyProgress: 80,
-    totalLessons: 0,
-    studyDeadline: 0
-  })
-  
-  // 课程分类选项
-  const categoryOptions = [
-    { label: '前端开发', value: 'frontend' },
-    { label: '后端开发', value: 'backend' },
-    { label: '移动开发', value: 'mobile' },
-    { label: '人工智能', value: 'ai' },
-    { label: '数据库', value: 'database' },
-    { label: '运维部署', value: 'devops' },
-    { label: '测试', value: 'testing' },
-    { label: '产品设计', value: 'design' }
-  ]
-  
-  // 讲师选项
-  const instructorOptions = [
-    { label: '李清林', value: '李清林' },
-    { label: '刘树光', value: '刘树光' },
-    { label: '肖蒙', value: '肖蒙' },
-    { label: '张老师', value: '张老师' },
-    { label: '王老师', value: '王老师' }
-  ]
-  
-  // 班级选项
-  const classOptions = [
-    { label: '前端开发班', value: 'frontend-class' },
-    { label: '后端开发班', value: 'backend-class' },
-    { label: 'AI算法班', value: 'ai-class' },
-    { label: '全栈开发班', value: 'fullstack-class' }
-  ]
-  
-  // 文件上传
-  const previewUrl = ref('')
-  
-  // 自定义渲染选中的讲师标签
-  const renderInstructorTag = ({ option, handleClose }: any) => {
-    return h('div', {
-      style: {
-        display: 'inline-flex',
-        alignItems: 'center',
-        padding: '2px 8px',
-        margin: '2px',
-        background: '#f0f0f0',
-        borderRadius: '4px',
-        fontSize: '14px'
-      }
-    }, [
-      option.label,
-      h('span', {
-        style: {
-          marginLeft: '4px',
-          cursor: 'pointer',
-          fontSize: '12px'
-        },
-        onClick: handleClose
-      }, '×')
-    ])
-  }
-  
-  // 原生文件上传处理
-  const handleNativeFileChange = (event: Event) => {
-    const input = event.target as HTMLInputElement
-    if (input.files && input.files.length > 0) {
-      const file = input.files[0]
-      
-      // 验证文件类型
-      if (!file.type.startsWith('image/')) {
-        message.error('请上传图片文件')
-        return
-      }
-      
-      // 验证文件大小（限制为2MB）
-      if (file.size > 2 * 1024 * 1024) {
-        message.error('图片大小不能超过2MB')
-        return
-      }
-      
-      // 创建预览URL
-      previewUrl.value = URL.createObjectURL(file)
-      
-    //   // 保存文件到表单数据
-    //   formData.courseCover = file
-      
-      console.log('文件上传成功:', file.name)
+  </div>
+</template>
+
+<script setup lang="ts">
+import { reactive, ref, shallowRef, onBeforeUnmount } from 'vue'
+import { useRouter } from 'vue-router'
+import { useMessage } from 'naive-ui'
+import {
+  NInput,
+  NDatePicker,
+  NSelect,
+  NSwitch,
+  NButton,
+  NInputNumber
+} from 'naive-ui'
+import '@wangeditor/editor/dist/css/style.css'
+// @ts-ignore
+import { Editor, Toolbar } from '@wangeditor/editor-for-vue'
+
+const router = useRouter()
+const message = useMessage()
+
+// 编辑器实例，必须用 shallowRef
+const editorRef = shallowRef()
+
+// 文件上传相关
+const fileInput = ref<HTMLInputElement>()
+const previewUrl = ref('')
+
+const toolbarConfig = {}
+const editorConfig = { placeholder: '请输入内容...' }
+const mode = 'default'
+
+// 组件销毁时，也及时销毁编辑器
+onBeforeUnmount(() => {
+  const editor = editorRef.value
+  if (editor == null) return
+  editor.destroy()
+})
+
+const handleCreated = (editor: any) => {
+  editorRef.value = editor // 记录 editor 实例，重要！
+}
+
+// 表单数据
+const formData = reactive({
+  courseName: '',
+  courseCategory: null, // 改为 null 以显示 placeholder
+  instructors: [],
+  sort: null, // 改为 null 以显示 placeholder
+  startTime: null,
+  endTime: null,
+  studentType: 'all', // 'all' 或 'partial'
+  selectedClasses: [],
+  courseCover: null as File | null,
+  courseDescription: '',
+  // 视频设置
+  stopOnLeave: true,
+  videoSpeedControl: false,
+  showVideoText: true,
+  // 积分设置
+  pointsEnabled: true,
+  earnPoints: 60,
+  requiredPoints: 60
+})
+
+
+
+// 课程分类选项
+const categoryOptions = [
+  { label: '前端开发', value: 'frontend' },
+  { label: '后端开发', value: 'backend' },
+  { label: '移动开发', value: 'mobile' },
+  { label: '人工智能', value: 'ai' },
+  { label: '数据库', value: 'database' },
+  { label: '运维部署', value: 'devops' },
+  { label: '测试', value: 'testing' },
+  { label: '产品设计', value: 'design' }
+]
+
+// 讲师选项
+const instructorOptions = [
+  { label: '李清林', value: '李清林' },
+  { label: '刘树光', value: '刘树光' },
+  { label: '肖蒙', value: '肖蒙' },
+  { label: '张老师', value: '张老师' },
+  { label: '王老师', value: '王老师' }
+]
+
+// 班级选项
+const classOptions = [
+  { label: '前端开发班', value: 'frontend-class' },
+  { label: '后端开发班', value: 'backend-class' },
+  { label: 'AI算法班', value: 'ai-class' },
+  { label: '全栈开发班', value: 'fullstack-class' }
+]
+
+// 排序选项
+const sortOptions = [
+  { label: '1', value: '1' },
+  { label: '2', value: '2' },
+  { label: '3', value: '3' },
+  { label: '4', value: '4' },
+  { label: '5', value: '5' },
+  { label: '6', value: '6' },
+  { label: '7', value: '7' },
+  { label: '8', value: '8' },
+  { label: '9', value: '9' },
+  { label: '10', value: '10' }
+]
+
+// 文件上传相关方法
+const triggerFileUpload = () => {
+  fileInput.value?.click()
+}
+
+const handleFileChange = (event: Event) => {
+  const input = event.target as HTMLInputElement
+  if (input.files && input.files.length > 0) {
+    const file = input.files[0]
+
+    // 验证文件类型
+    if (!file.type.startsWith('image/')) {
+      message.error('请上传图片文件')
+      return
     }
-  }
-  
-  // 清除上传的图片
-  const clearUpload = (event: Event) => {
-    event.preventDefault()
-    event.stopPropagation()
-    
-    // 释放预览URL
-    if (previewUrl.value) {
-      URL.revokeObjectURL(previewUrl.value)
+
+    // 验证文件大小（限制为2MB）
+    if (file.size > 2 * 1024 * 1024) {
+      message.error('图片大小不能超过2MB')
+      return
     }
-    
-    // 清除预览和表单数据
-    previewUrl.value = ''
-    formData.courseCover = ''
-    
-    // 重置文件输入框
-    const fileInput = document.getElementById('coverUpload') as HTMLInputElement
-    if (fileInput) {
-      fileInput.value = ''
+
+    // 创建预览URL
+    previewUrl.value = URL.createObjectURL(file)
+    formData.courseCover = file
+
+    console.log('文件上传成功:', file.name)
+  }
+}
+
+const clearUpload = () => {
+  // 释放预览URL
+  if (previewUrl.value) {
+    URL.revokeObjectURL(previewUrl.value)
+  }
+
+  // 清除预览和表单数据
+  previewUrl.value = ''
+  formData.courseCover = null
+
+  // 重置文件输入框
+  if (fileInput.value) {
+    fileInput.value.value = ''
+  }
+}
+
+// 取消
+const handleCancel = () => {
+  router.back()
+}
+
+// 保存
+const handleSubmit = async () => {
+  try {
+    // 表单验证
+    if (!formData.courseName) {
+      message.error('请输入课程名称')
+      return
     }
-  }
-  
-  // 提交表单
-  const handleSubmit = async () => {
-    try {
-      // 表单验证
-      if (!formData.courseName) {
-        message.error('请输入课程名称')
-        return
-      }
-      
-      if (!formData.courseCategory) {
-        message.error('请选择课程分类')
-        return
-      }
-      
-      if (formData.instructors.length === 0) {
-        message.error('请选择主讲老师')
-        return
-      }
-      
-      if (!formData.courseCover) {
-        message.error('请上传课程封面')
-        return
-      }
-      
-      // 创建FormData对象处理文件上传
-      // 表单提交逻辑已注释，如需使用可取消注释
-      // const formDataToSubmit = new FormData()
-      
-    //   // 添加表单字段
-    //   Object.keys(formData).forEach(key => {
-    //     if (key === 'courseCover' && formData[key] instanceof File) {
-    //       formDataToSubmit.append('courseCover', formData[key])
-    //     } else if (key === 'instructors' || key === 'selectedClasses') {
-    //       // 数组类型需要特殊处理
-    //       formData[key].forEach((item) => {
-    //         formDataToSubmit.append(`${key}[]`, item)
-    //       })
-    //     } else {
-    //       formDataToSubmit.append(key, String(formData[key]))
-    //     }
-    //   })
-      
-      console.log('表单数据:', formData)
-      message.success('课程创建成功！')
-      // 这里可以调用API提交数据
-      // const response = await api.createCourse(formDataToSubmit)
-      router.push('/teacher/course-management')
-    } catch (error) {
-      console.error('提交失败:', error)
-      message.error('提交失败，请重试')
+
+    if (!formData.courseCategory) {
+      message.error('请选择课程分类')
+      return
     }
+
+    if (formData.instructors.length === 0) {
+      message.error('请选择主讲老师')
+      return
+    }
+
+    if (!formData.courseCover || !previewUrl.value) {
+      message.error('请上传课程封面')
+      return
+    }
+
+    console.log('表单数据:', formData)
+    message.success('课程创建成功！')
+    router.push('/teacher/course-management')
+  } catch (error) {
+    console.error('提交失败:', error)
+    message.error('提交失败，请重试')
   }
-  
-  // 取消操作
-  const handleCancel = () => {
-    router.back()
+}
+</script>
+
+<style scoped>
+.course-create-container {
+  min-height: 100vh;
+  padding-bottom: 80px;
+}
+
+.form-container {
+  background: white;
+  overflow: hidden;
+}
+
+.form-content {
+  padding: 24px 24px 0 24px;
+}
+
+.form-row {
+  display: flex;
+  gap: 100px;
+  margin-bottom: 32px;
+}
+
+.form-column {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+}
+
+.form-item {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: flex-end;
+  gap: 10px;
+}
+
+.form-text {
+  display: flex;
+  flex-direction: row;
+  justify-content: flex-end;
+  gap: 10px;
+}
+
+.form-integral {
+  margin-top: 20px;
+  margin-bottom: 20px;
+}
+
+.form-label {
+  font-size: 14px;
+  color: #333;
+  font-weight: 500;
+  min-width: 125px;
+  flex-shrink: 0;
+  text-align: right;
+}
+
+.form-label.required::before {
+  content: '*';
+  color: #ff4d4f;
+  margin-right: 4px;
+}
+
+.form-input {
+  flex: 1;
+  min-width: 0;
+}
+
+/* 最简单的输入框高度统一方法 */
+.form-input {
+  height: 42px;
+}
+
+/* 强制设置下拉菜单高度 */
+.form-input :deep(.n-base-selection) {
+  --n-height: 42px !important;
+  height: 42px !important;
+}
+
+.form-input :deep(.n-base-selection-label) {
+  height: 42px !important;
+  line-height: 42px !important;
+}
+
+/* 强制设置时间选择器高度 */
+.form-input :deep(.n-input__input) {
+  height: 42px !important;
+}
+
+.form-input :deep(.n-input__input-el) {
+  height: 42px !important;
+  line-height: 42px !important;
+}
+
+/* 隐藏下拉菜单的加载状态和清除按钮 */
+.form-input :deep(.n-base-loading),
+.form-input :deep(.n-base-clear) {
+  display: none !important;
+}
+
+/* 隐藏默认下拉箭头 */
+.form-input :deep(.n-base-suffix__arrow) {
+  display: none !important;
+}
+
+/* 为下拉菜单添加自定义箭头 */
+.form-input :deep(.n-base-selection) {
+  position: relative;
+}
+
+.form-input :deep(.n-base-selection)::after {
+  content: '';
+  position: absolute;
+  right: 14px;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 13px;
+  height: 8px;
+  background-image: url('/images/teacher/箭头-灰.png');
+  background-size: contain;
+  background-repeat: no-repeat;
+  background-position: center;
+  pointer-events: none;
+  z-index: 1;
+}
+
+/* 自定义时间选择器图标 */
+.form-input :deep(.n-date-picker-icon svg) {
+  display: none !important;
+}
+
+.form-input :deep(.n-date-picker-icon) {
+  background-image: url('/images/teacher/日历.png') !important;
+  background-size: contain !important;
+  background-repeat: no-repeat !important;
+  background-position: center !important;
+  width: 14px !important;
+  height: 14px !important;
+}
+
+/* 多选标签样式调整 */
+.form-input :deep(.n-tag) {
+  background-color: #F5F8FB !important;
+  border: none !important;
+  color: #666666 !important;
+  margin-top: 3px;
+  margin-bottom: 3px;
+}
+
+.form-input :deep(.n-tag__content) {
+  color: #666666 !important;
+}
+
+.form-input :deep(.n-tag__border) {
+  display: none !important;
+}
+
+/* 关闭按钮样式调整 */
+.form-input :deep(.n-tag__close) {
+  width: 12px !important;
+  height: 12px !important;
+}
+
+.form-input :deep(.n-tag__close .n-base-icon) {
+  width: 12px !important;
+  height: 12px !important;
+  color: #999 !important;
+}
+
+.form-input :deep(.n-tag__close svg) {
+  width: 12px !important;
+  height: 12px !important;
+}
+
+.form-toggle {
+  margin-right: 8px;
+}
+
+.btn-label {
+  margin-top: 30px;
+}
+
+.toggle-container {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex: 1;
+}
+
+.toggle-label {
+  font-size: 14px;
+  color: #666;
+}
+
+/* 单选按钮样式 */
+.radio-container {
+  display: flex;
+  flex-direction: row;
+  gap: 20px;
+  flex: 1;
+}
+
+.radio-option {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  cursor: pointer;
+}
+
+.radio-input {
+  width: 16px;
+  height: 16px;
+  accent-color: #0288D1;
+  cursor: pointer;
+}
+
+.radio-label {
+  font-size: 14px;
+  color: #333;
+  cursor: pointer;
+}
+
+/* 课程封面上传区域 */
+.cover-upload-container {
+  flex: 1;
+  min-width: 0;
+}
+
+.upload-area {
+  width: 160px;
+  height: 130px;
+  border: 2px dashed #d9d9d9;
+  border-radius: 6px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: border-color 0.3s;
+  background-color: #fafafa;
+}
+
+.upload-area:hover {
+  border-color: #0288D1;
+}
+
+.upload-icon {
+  font-size: 32px;
+  color: #999;
+}
+
+.upload-text {
+  font-size: 14px;
+  color: #666;
+}
+
+.preview-container {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.preview-image {
+  max-width: 100%;
+  max-height: 100%;
+  object-fit: contain;
+}
+
+.delete-icon {
+  position: absolute;
+  top: 5px;
+  right: 5px;
+  width: 20px;
+  height: 20px;
+  background-color: rgba(0, 0, 0, 0.5);
+  color: white;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  font-size: 14px;
+}
+
+.delete-icon:hover {
+  background-color: rgba(0, 0, 0, 0.7);
+}
+
+.form-section {
+  margin-bottom: 32px;
+}
+
+.rich-editor-container {
+  flex: 1;
+  border: 1px solid #D8D8D8;
+  overflow: hidden;
+}
+
+.setting-container {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  flex: 1;
+}
+
+.setting-label {
+  font-size: 14px;
+  color: #666;
+}
+
+.score-input {
+  width: 80px;
+}
+
+.form-footer {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  display: flex;
+  justify-content: flex-end;
+  gap: 12px;
+  padding: 20px 24px;
+  background: #fff;
+  border-top: 1px solid #e6e6e6;
+  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
+  z-index: 1000;
+}
+
+.cancel-btn {
+  min-width: 60px;
+  height: 32px;
+  border: 1px solid #0288D1;
+  background: #E2F5FF;
+  color: #0288D1;
+}
+
+.cancel-btn:hover {
+  border-color: #0277BD;
+  background: #B3E5FC;
+  color: #0277BD;
+}
+
+.save-btn {
+  min-width: 60px;
+  height: 32px;
+  background: #0288D1;
+  border-color: #0288D1;
+  color: white;
+}
+
+.save-btn:hover {
+  background: #0277BD;
+  border-color: #0277BD;
+}
+
+/* 响应式设计 */
+@media (max-width: 768px) {
+  .form-row {
+    flex-direction: column;
+    gap: 16px;
   }
-  </script>
-  
-  
-  <style scoped>
-  
-  </style>
-  <style src="@/components/admin/CourseComponents/css/CourseCreate.css"></style>
-  
\ No newline at end of file
+
+  .form-content {
+    padding: 16px;
+  }
+}
+</style>
diff --git a/src/views/teacher/course/CoursewareManagement.vue b/src/views/teacher/course/CoursewareManagement.vue
index bb78beb..ae89a26 100644
--- a/src/views/teacher/course/CoursewareManagement.vue
+++ b/src/views/teacher/course/CoursewareManagement.vue
@@ -232,7 +232,7 @@ const filteredFiles = computed(() => {
 // 获取文件图标
 const getFileIcon = (type: string) => {
   const iconMap: { [key: string]: string } = {
-    folder: '/images/profile/folder.png',
+    folder: '/images/teacher/folder.jpg',
     excel: '/images/activity/xls.png',
     word: '/images/activity/wrod.png',
     pdf: '/images/activity/pdf.png',