From b1cf1b9a6f0b9e0e6113ab1684e80fb37d612770 Mon Sep 17 00:00:00 2001
From: ywyonui <ywyonui@163.com>
Date: Sun, 6 Jul 2025 21:49:44 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E8=AF=B7=E5=81=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/base/server.ts                        |  23 ++
 src/components/BasicListLayout/ListLayout.vue |   4 +-
 src/pages/base/grades/list.vue                |  33 --
 .../leave-request/components/xsQjEdit.vue     | 200 +++++++++
 .../leave-request/components/xsQjList.vue     | 147 +++++++
 src/pages/base/leave-request/index.vue        | 183 ++-------
 src/pages/base/leave-request/xsQjDetail.vue   | 385 ++++++++++++++++++
 src/pages/system/login/login.vue              |   2 +-
 8 files changed, 792 insertions(+), 185 deletions(-)
 create mode 100644 src/pages/base/leave-request/components/xsQjEdit.vue
 create mode 100644 src/pages/base/leave-request/components/xsQjList.vue
 create mode 100644 src/pages/base/leave-request/xsQjDetail.vue

diff --git a/src/api/base/server.ts b/src/api/base/server.ts
index 587d58a..ac41464 100644
--- a/src/api/base/server.ts
+++ b/src/api/base/server.ts
@@ -121,3 +121,26 @@ export const jzXkTkjApi = async (params: any) => {
 export const jzXkJfCxjApi = async (params: any) => {
   return await post("/mobile/jz/xk/jfcx", params);
 };
+
+/**
+ * 发起学生请假
+ */
+export const jzAddXsQjApi = async (params: any) => {
+  return await post("/api/xsQj/save", params);
+};
+
+/**
+ * 查询学生请假列表
+ */
+export const jzXsQjListApi = async (params: any) => {
+  return await get("/api/xsQj/findPage", params);
+};
+
+/**
+ * 查询学生请假流程处理历史
+ */
+export const jzXsQjActivitiHistoryApi = async (params: any) => {
+  return await get("/api/activiti/history/historicFlow", params);
+};
+
+
diff --git a/src/components/BasicListLayout/ListLayout.vue b/src/components/BasicListLayout/ListLayout.vue
index 1ed0509..fb624bd 100644
--- a/src/components/BasicListLayout/ListLayout.vue
+++ b/src/components/BasicListLayout/ListLayout.vue
@@ -19,7 +19,7 @@
       </view>
     </template>
     <view class="p-15">
-      <view v-for="(item,index) in dataList" :key="item.id||index">
+      <view v-for="(item,index) in dataList" :key="item.id || index">
         <slot :data="item" :index="index" :list="dataList"/>
       </view>
     </view>
@@ -32,7 +32,7 @@
 import {reactive} from "vue";
 import type {LayoutOptions, PagingRefInterface} from "@/components/BasicListLayout/type/useLayout";
 
-const dataList = ref([])
+const dataList = ref<any>([])
 const fixed = ref(false)
 const pagingRef = ref<PagingRefInterface | null>(null)
 
diff --git a/src/pages/base/grades/list.vue b/src/pages/base/grades/list.vue
index 1b128e9..1d64bdc 100644
--- a/src/pages/base/grades/list.vue
+++ b/src/pages/base/grades/list.vue
@@ -48,36 +48,6 @@ let pageParams = ref({
 	xsId: getCurXs.id
 })
 
-// 模拟请假申请数据
-const mockLeaveData = [
-  {
-    id: "ks001",
-    applicantName: "施瑞辰",
-    reason: "家里有事要处理",
-    startTime: "2025-02-17 08:00",
-    endTime: "2025-02-17 18:00",
-  },
-  {
-    id: "ks002",
-    applicantName: "李晓明",
-    reason: "身体不适，需要就医",
-    startTime: "2025-02-18 09:00",
-    endTime: "2025-02-18 17:00",
-  },
-  // 可以添加更多模拟数据
-];
-
-// 模拟 API，实际应替换为真实 API 调用
-const testList = async (param?: any): Promise<{ message: string, resultCode: number, rows: any[] }> => {
-  console.log("Simulating API call for ks list with params:", param);
-  // 这里简单返回所有数据，真实场景需要分页
-  return new Promise((resolve) => {
-    setTimeout(() => {
-      resolve({ message: "测试", resultCode: 1, rows: mockLeaveData });
-    }, 500);
-  });
-};
-
 const [register, { reload }] = useLayout({
   api: xsKsccApi,
   componentProps: {},
@@ -92,9 +62,6 @@ const viewDetails = (item: any | null) => {
 </script>
 
 <style lang="scss" scoped>
-.ks-application-page {
-}
-
 .ks-card {
   background-color: #ffffff;
   border-radius: 8px;
diff --git a/src/pages/base/leave-request/components/xsQjEdit.vue b/src/pages/base/leave-request/components/xsQjEdit.vue
new file mode 100644
index 0000000..b2b3891
--- /dev/null
+++ b/src/pages/base/leave-request/components/xsQjEdit.vue
@@ -0,0 +1,200 @@
+<template>
+  <BasicLayout :fixed="false">
+    <view class="p-15">
+      <BasicForm @register="register" />
+    </view>
+    <template #bottom>
+      <view class="white-bg-color py-5">
+        <view class="flex-row items-center pb-10 pt-5">
+          <u-button
+            text="取消"
+            class="ml-15 mr-7"
+            :plain="true"
+            @click="navigateBack"
+          />
+          <u-button
+            text="提交"
+            class="mr-15 mr-7"
+            type="primary"
+            @click="submit"
+          />
+        </view>
+      </view>
+    </template>
+  </BasicLayout>
+</template>
+
+<script setup lang="ts">
+import { navigateBack } from "@/utils/uniapp";
+import { useForm } from "@/components/BasicForm/hooks/useForm";
+import { dicApi } from "@/api/system/dic";
+import { jzAddXsQjApi } from "@/api/base/server";
+import { showToast } from "@/utils/uniapp";
+import dayjs from "dayjs";
+import { useUserStore } from "@/store/modules/user";
+const { getCurXs, getUser } = useUserStore();
+
+// 接收外部传入属性
+const props = withDefaults(defineProps<{
+  data: any
+}>(), {
+  data: () => ({
+    id: "",
+    qjlx: "事假",
+    qjkssj: "2025-07-07 09:00:00",
+    qjjssj: "2025-07-08 10:00:00",
+    qjsc: "25小时",
+    qjsy: "我有事情",
+    sflx: 1
+  })
+});
+
+let formData = ref<any>({});
+
+const [register, { getValue, setValue }] = useForm({
+  schema: [
+    {
+      field: "qjlx",
+      label: "请假类型",
+      required: true,
+      component: "BasicPicker",
+      componentProps: {
+        api: dicApi,
+        param: { pid: 1007011432 },
+        rangeKey: "dictionaryValue",
+        savaKey: "dictionaryCode",
+      },
+    },
+    { interval: true },
+    {
+      field: "qjkstime",
+      label: "开始时间",
+      component: "BasicDateTimes",
+      required: true,
+      componentProps: {
+        type: 'datetime',
+        change: (e: string) => changeKsTime(e)
+      },
+    },
+    {
+      field: "qjjstime",
+      label: "结束时间",
+      component: "BasicDateTimes",
+      required: true,
+      componentProps: {
+        type: 'datetime',
+        change: (e: string) => changeJsTime(e)
+      },
+    },
+    {
+      field: "qjsc",
+      label: "请假时长",
+      component: "BasicInput",
+      componentProps: { 
+        disabled: true,
+        placeholder: "请输入选择开始时间和结束时间"
+      },
+    },
+    { interval: true },
+    {
+      field: "qjsy",
+      label: "请假事由",
+      component: "BasicInput",
+      required: true,
+      itemProps: {
+        labelPosition: "top",
+      },
+      componentProps: {
+        type: "textarea",
+      },
+    },
+    {
+      field: "sflx",
+      label: "是否离校",
+      component: "BasicCheckbox",
+      required: true,
+      itemProps: {
+        labelPosition: "top",
+      },
+      componentProps: {
+        data: [
+          { value: 0, text: "否" },
+          { value: 1, text: "是" },
+        ],
+      },
+    },
+    // {
+    //   field: "qjtp",
+    //   label: "请假图片",
+    //   component: "BasicUpload",
+    //   required: true,
+    //   itemProps: {
+    //     labelPosition: "top",
+    //   },
+    //   componentProps: {},
+    // },
+  ],
+});
+
+setValue(props.data)
+
+const changeKsTime = (selectedTime?: string) => { 
+  if (!selectedTime) {
+    return;
+  }
+  formData.value.qjkstime = selectedTime;
+  validateTime();
+};
+
+const changeJsTime = (selectedTime?: string) => { 
+  if (!selectedTime) {
+    return;
+  }
+  formData.value.qjjstime = selectedTime;
+  validateTime();
+};
+
+const validateTime = () => {
+  const data = formData.value;
+  if (!data.qjkstime || !data.qjjstime) {
+    return false;
+  }
+  // 使用dayjs库进行时间比较
+  const ksTime = dayjs(data.qjkstime).valueOf();
+  const jsTime = dayjs(data.qjjstime).valueOf();
+  if (ksTime > jsTime) {
+    uni.showToast({
+      title: "请假开始时间不能大于请假结束时间!",
+      icon: "none",
+    });
+    return false;
+  }
+  // 计算请假时长（小时）
+  data.qjsc = Math.round((jsTime - ksTime) / (1000 * 60 * 60)) + "小时";
+  setValue({ qjsc: data.qjsc  });
+  return true;
+}
+
+const submit = () => {
+  const fd = getValue();
+  if (!validateTime()) {
+    return;
+  }
+  const params = { ...formData, ...fd };
+  if (props.data && props.data.id) {
+    params.id = props.data.id;
+  } else {
+    params.id = null;
+    params.xsId = getCurXs.id; // 学生ID
+    params.jsId = getCurXs.bzrId; // 班主任ID
+    params.xqId = getCurXs.xqId; // 学期ID
+    params.jzId = getUser.jzId; // 家长ID
+  }
+  params.flag = 1;
+  jzAddXsQjApi(params).then(() => {
+    showToast({ title: "提交成功", icon: "success" });
+    navigateBack();
+  });
+};
+
+</script>
diff --git a/src/pages/base/leave-request/components/xsQjList.vue b/src/pages/base/leave-request/components/xsQjList.vue
new file mode 100644
index 0000000..49ab999
--- /dev/null
+++ b/src/pages/base/leave-request/components/xsQjList.vue
@@ -0,0 +1,147 @@
+<template>
+  <view class="leave-list">
+    <BasicListLayout @register="register" style="position: absolute;">
+      <template v-slot="{ data, index }">
+        <view class="leave-card" @click="goToDetail(data)">
+          <view class="card-header">
+            <text class="applicant-name">{{ data.applicantName }}的请假申请</text>
+          </view>
+          <view class="card-body">
+            <view class="info-row">
+              <text class="label">请假事由:</text>
+              <text class="value">{{ data.reason }}</text>
+            </view>
+            <view class="info-row">
+              <text class="label">开始时间:</text>
+              <text class="value">{{ data.startTime }}</text>
+            </view>
+            <view class="info-row">
+              <text class="label">结束时间:</text>
+              <text class="value">{{ data.endTime }}</text>
+            </view>
+          </view>
+          <view class="card-footer">
+            <text>查看详情</text>
+            <text class="arrow">
+              <uni-icons type="arrowright" size="16" color="#ccc"></uni-icons>
+            </text>
+          </view>
+        </view>
+      </template>
+    </BasicListLayout>
+  </view>
+</template>
+
+<script setup lang="ts">
+import { useLayout } from "@/components/BasicListLayout/hooks/useLayout";
+import { jzXsQjListApi } from "@/api/base/server";
+import { useUserStore } from "@/store/modules/user";
+import { useDataStore } from "@/store/modules/data";
+const { getCurXs } = useUserStore();
+const { setData } = useDataStore();
+
+let pageParams = ref({
+  rows: 10,
+  xsId: getCurXs.id
+})
+
+const [register, { reload }] = useLayout({
+  api: jzXsQjListApi,
+  componentProps: {},
+  param: pageParams.value
+});
+
+// 查看详情或新增处理函数
+const goToDetail = (item: any | null) => {
+  setData(item);
+  let url = '/pages/base/leave-request/leaveApplication'; // 使用新路径
+  if (item && item.id) {
+    console.log('View details for:', item);
+    url += `?id=${item.id}`; // 查看详情时传递 ID
+  } else {
+    console.log('Navigating to create new leave application.');
+    // 新增时不传递 ID
+  }
+  uni.navigateTo({ url });
+};
+</script>
+
+<style lang="scss" scoped>
+.leave-list {
+  display: flex;
+  width: 100%;
+  height: 100%;
+  flex: 1 0 1px;
+  position: relative;
+
+  .leave-card {
+    background-color: #ffffff;
+    border-radius: 8px;
+    margin-bottom: 15px;
+    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
+    overflow: hidden;
+  }
+
+  .card-header {
+    padding: 12px 15px;
+    border-bottom: 1px solid #f0f0f0;
+
+    .applicant-name {
+      font-size: 16px;
+      font-weight: bold;
+      color: #333;
+    }
+  }
+
+  .card-body {
+    padding: 15px;
+
+    .info-row {
+      display: flex;
+      margin-bottom: 10px;
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+
+      .label {
+        font-size: 14px;
+        color: #666;
+        width: 70px;
+        flex-shrink: 0;
+        margin-right: 8px;
+      }
+
+      .value {
+        font-size: 14px;
+        color: #333;
+        flex: 1;
+      }
+    }
+  }
+
+  .card-footer {
+    padding: 12px 15px;
+    border-top: 1px solid #f0f0f0;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    font-size: 14px;
+    color: #888;
+    cursor: pointer;
+
+    .arrow {
+      font-size: 16px;
+      color: #ccc;
+    }
+  }
+
+  ::v-deep .zp-loading-fixed {
+    position: absolute;
+  }
+
+  ::v-deep .d-load-main {
+    position: absolute;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/pages/base/leave-request/index.vue b/src/pages/base/leave-request/index.vue
index 13adbde..212d895 100644
--- a/src/pages/base/leave-request/index.vue
+++ b/src/pages/base/leave-request/index.vue
@@ -1,166 +1,51 @@
 <template>
-  <view class="leave-application-page">
-    <BasicListLayout @register="register">
-      <template v-slot="{ data, index }">
-        <view class="leave-card" @click="viewDetails(data)">
-          <view class="card-header">
-            <text class="applicant-name"
-              >{{ data.applicantName }}的请假申请</text
-            >
-          </view>
-          <view class="card-body">
-            <view class="info-row">
-              <text class="label">请假事由:</text>
-              <text class="value">{{ data.reason }}</text>
-            </view>
-            <view class="info-row">
-              <text class="label">开始时间:</text>
-              <text class="value">{{ data.startTime }}</text>
-            </view>
-            <view class="info-row">
-              <text class="label">结束时间:</text>
-              <text class="value">{{ data.endTime }}</text>
-            </view>
-          </view>
-          <view class="card-footer">
-            <text>查看详情</text>
-            <text class="arrow">
-              <uni-icons type="arrowright" size="16" color="#ccc"></uni-icons>
-            </text>
-          </view>
-        </view>
-      </template>
-      <template #bottom>
-        <view class="button" @click="viewDetails(null)"> <!-- Pass null for new application -->
-          <text>新增请假</text>
-        </view>
-      </template>
-    </BasicListLayout>
+  <view class="leave-page">
+    <!-- 选项卡 -->
+    <BasicTabs class="leave-tabs"
+            ref="tabsRef" :list="tabList" bar-width="60px" scroll-count="4"
+           :current="curTabIndex" @change="switchTab"
+          />
+    <view class="leave-edit" v-if="curTabIndex === 0">
+      <XsQjEdit />
+    </view>
+    <view class="leave-list" v-else>
+      <XsQjList />
+    </view>
+
   </view>
 </template>
 
 <script setup lang="ts">
-import { ref } from "vue";
-import { useLayout } from "@/components/BasicListLayout/hooks/useLayout";
+import XsQjEdit from "./components/xsQjEdit.vue"
+import XsQjList from "./components/xsQjList.vue"
 
-// 模拟请假申请数据
-const mockLeaveData = [
-  {
-    id: "leave001",
-    applicantName: "施瑞辰",
-    reason: "家里有事要处理",
-    startTime: "2025-02-17 08:00",
-    endTime: "2025-02-17 18:00",
-  },
-  {
-    id: "leave002",
-    applicantName: "李晓明",
-    reason: "身体不适，需要就医",
-    startTime: "2025-02-18 09:00",
-    endTime: "2025-02-18 17:00",
-  },
-  // 可以添加更多模拟数据
-];
+const tabList = ref([
+  { name: "请假申请", id: "leave-edit" },
+  { name: "请假记录", id: "leave-list" },
+]);
 
-// 模拟 API，实际应替换为真实 API 调用
-const testList = async (param?: any): Promise<{ message: string, resultCode: number, rows: any[] }> => {
-  console.log("Simulating API call for leave list with params:", param);
-  // 这里简单返回所有数据，真实场景需要分页
-  return new Promise((resolve) => {
-    setTimeout(() => {
-      resolve({ message: "测试", resultCode: 1, rows: mockLeaveData });
-    }, 500);
-  });
-};
+const curTabIndex = ref(0);
 
-const [register, { reload }] = useLayout({
-  api: testList,
-  componentProps: {},
-});
-
-// 查看详情或新增处理函数
-const viewDetails = (item: any | null) => {
-  let url = '/pages/base/leave-request/leaveApplication'; // 使用新路径
-  if (item && item.id) {
-    console.log('View details for:', item);
-    url += `?id=${item.id}`; // 查看详情时传递 ID
-  } else {
-    console.log('Navigating to create new leave application.');
-    // 新增时不传递 ID
-  }
-  uni.navigateTo({ url });
-};
+const switchTab = (index : number) => {
+  curTabIndex.value = index;
+}
 </script>
 
 <style lang="scss" scoped>
-.leave-application-page {
-}
 
-.leave-card {
-  background-color: #ffffff;
-  border-radius: 8px;
-  margin-bottom: 15px;
-  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
-  overflow: hidden;
-}
-
-.card-header {
-  padding: 12px 15px;
-  border-bottom: 1px solid #f0f0f0;
-  .applicant-name {
-    font-size: 16px;
-    font-weight: bold;
-    color: #333;
-  }
-}
-
-.card-body {
-  padding: 15px;
-  .info-row {
-    display: flex;
-    margin-bottom: 10px;
-    &:last-child {
-      margin-bottom: 0;
-    }
-    .label {
-      font-size: 14px;
-      color: #666;
-      width: 70px;
-      flex-shrink: 0;
-      margin-right: 8px;
-    }
-    .value {
-      font-size: 14px;
-      color: #333;
-      flex: 1;
-    }
-  }
-}
-
-.card-footer {
-  padding: 12px 15px;
-  border-top: 1px solid #f0f0f0;
+.leave-page {
+  flex: 1 0 1px;
   display: flex;
-  justify-content: space-between;
-  align-items: center;
-  font-size: 14px;
-  color: #888;
-  cursor: pointer;
-
-  .arrow {
-    font-size: 16px;
-    color: #ccc;
+  flex-direction: column;
+  height: 100vh;
+  .leave-tabs {
+    flex: 0 0 45px;
+  }
+  .leave-edit,
+  .leave-list {
+    flex: 1 0 1px;
+    position: relative;
   }
 }
 
-// 新增按钮样式示例 (可根据 BasicListLayout 的 bottom 插槽调整)
-.button {
-    padding: 10px 15px;
-    background-color: #447ade;
-    color: white;
-    text-align: center;
-    border-radius: 5px;
-    margin: 10px 15px; // 示例外边距
-    font-size: 16px;
-}
 </style> 
\ No newline at end of file
diff --git a/src/pages/base/leave-request/xsQjDetail.vue b/src/pages/base/leave-request/xsQjDetail.vue
new file mode 100644
index 0000000..5895df4
--- /dev/null
+++ b/src/pages/base/leave-request/xsQjDetail.vue
@@ -0,0 +1,385 @@
+<template>
+  <BasicLayout>
+    <view class="course-detail">
+      <!-- 课程信息卡片 -->
+      <view class="info-card">
+        <view class="card-title">课程信息</view>
+        <view class="divider"></view>
+
+        <view class="course-info">
+          <image
+            class="course-image"
+            :src="courseDetail.xkkcImg"
+            mode="aspectFill"
+          ></image>
+
+          <view class="course-content">
+            <view class="course-name">{{ courseDetail.title }}</view>
+            <view class="course-teacher"
+              >开课老师：{{ courseDetail.teacher }}</view
+            >
+            <view class="course-location"
+              >上课地点：{{ courseDetail.location }}</view
+            >
+            <view class="course-time"
+              >上课时间：{{ courseDetail.studyTime }}</view
+            >
+            <view class="course-price">
+              金额：<text class="price-value">¥{{ courseDetail.price }}</text>
+            </view>
+          </view>
+        </view>
+      </view>
+
+      <!-- 老师信息卡片 -->
+      <view class="info-card">
+        <view class="card-title">老师信息</view>
+        <view class="divider"></view>
+
+        <view class="teacher-info">
+          <!-- 教师头部信息区域 -->
+          <view class="teacher-header">
+            <image
+              class="teacher-avatar"
+              :src="teacherInfo.avatar"
+              mode="aspectFill"
+            ></image>
+            <view class="teacher-basic-info">
+              <view class="teacher-name">{{ teacherInfo.name }}</view>
+              <view class="teacher-title">课程教师</view>
+            </view>
+          </view>
+
+          <!-- 教师简介区域 -->
+          <view class="teacher-intro-section">
+            <view class="intro-title">教师简介</view>
+            <view class="teacher-intro">
+              <text>{{ teacherInfo.introduction }}</text>
+            </view>
+          </view>
+        </view>
+      </view>
+
+      <!-- 教学理念 -->
+      <view class="info-card">
+        <view class="card-title">教学理念</view>
+        <view class="divider"></view>
+
+        <view class="content-section">
+          <text>{{ teachingPhilosophy }}</text>
+        </view>
+      </view>
+
+      <!-- 教学计划 -->
+      <view class="info-card">
+        <view class="card-title">教学计划</view>
+        <view class="divider"></view>
+
+        <view class="content-section">
+          <template v-if="teachingPlan && teachingPlan.length > 0">
+            <view
+              v-for="(phase, index) in teachingPlan"
+              :key="index"
+              class="teaching-phase"
+            >
+              <text>{{ phase }}</text>
+            </view>
+          </template>
+          <template v-else>
+            <view class="empty-data">
+              <u-icon name="info-circle" color="#C8C9CC" size="18"></u-icon>
+              <text>暂无教学计划</text>
+            </view>
+          </template>
+        </view>
+      </view>
+    </view>
+    <template #bottom>
+      <view class="white-bg-color py-5">
+        <view class="flex-row items-center pb-10 pt-5">
+          <u-button
+            text="返回"
+            class="ml-15 mr-7"
+            :plain="true"
+            @click="navigateBack"
+          />
+        </view>
+      </view>
+    </template>
+  </BasicLayout>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted, computed } from "vue";
+import { navigateBack } from "@/utils/uniapp";
+import { useDataStore } from "@/store/modules/data";
+import { storeToRefs } from "pinia";
+import { imagUrl } from "@/utils";
+import { kcjhFindKcjhByKcIdApi } from "@/api/base/server";
+
+// 定义课程数据类型
+interface CourseData {
+  id?: string;
+  kcmc?: string;
+  jsName?: string;
+  kcdd?: string;
+  kcje?: number;
+  studyTime?: string;
+  kcjsms?: string;
+  jxll?: string;
+  remark?: string;
+  xkkcImg?: string;
+  [key: string]: any; // 允许其他字段
+}
+
+const useData = useDataStore();
+const { kcData } = storeToRefs(useData);
+
+// 教学计划 - 此处假设没有具体教学计划字段，将备注内容拆分为教学计划
+const teachingPlan = ref<string[]>([]);
+
+const courseData = kcData.value as CourseData;
+if (courseData && courseData.id) {
+  kcjhFindKcjhByKcIdApi({
+    xkkcId: courseData.id,
+  }).then((res) => {
+    if (res.resultCode == 1) {
+      teachingPlan.value = res.result.map(
+        (item: any) => item.jhjd + ":" + item.jhms
+      );
+    }
+  });
+}
+
+// 课程详情数据
+const courseDetail = computed(() => {
+  const data = (kcData.value as CourseData) || {};
+  return {
+    id: data.id || "",
+    title: data.kcmc || "暂无课程名称",
+    teacher: data.jsName || "暂无教师信息",
+    location: data.kcdd || "暂无地点信息",
+    price: data.kcje || 0,
+    studyTime: data.studyTime || "暂无上课时间",
+    xkkcImg: data.xkkcImg || "/static/images/robot-course.jpg", // 默认图片
+  };
+});
+
+// 教师信息
+const teacherInfo = computed(() => {
+  const data = (kcData.value as CourseData) || {};
+  return {
+    name: data.jsName || "暂无教师信息",
+    avatar: imagUrl(data.jstx), // 默认头像
+    introduction: data.kcjsms || "暂无教师介绍",
+  };
+});
+
+// 教学理念
+const teachingPhilosophy = computed(() => {
+  const data = (kcData.value as CourseData) || {};
+  return data.jxll || "暂无教学理念信息";
+});
+</script>
+
+<style lang="scss" scoped>
+.course-detail {
+  background-color: #f5f7fa;
+}
+
+.nav-bar {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 15px;
+  height: 44px;
+  background-color: #2879ff;
+
+  .nav-left {
+    width: 40px;
+    height: 40px;
+    display: flex;
+    align-items: center;
+  }
+
+  .nav-title {
+    font-size: 18px;
+    font-weight: 500;
+    color: #fff;
+  }
+
+  .nav-right {
+    width: 40px;
+  }
+}
+
+.info-card {
+  margin: 15px;
+  background-color: #fff;
+  border-radius: 8px;
+  padding: 15px;
+  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
+
+  .card-title {
+    font-size: 16px;
+    font-weight: bold;
+    color: #333;
+    margin-bottom: 10px;
+  }
+
+  .divider {
+    height: 1px;
+    background-color: #eee;
+    margin-bottom: 15px;
+  }
+}
+
+.course-info {
+  display: flex;
+
+  .course-image {
+    width: 120px;
+    height: 138px;
+    border-radius: 8px;
+    margin-right: 15px;
+  }
+
+  .course-content {
+    flex: 1;
+
+    .course-name {
+      font-size: 18px;
+      font-weight: bold;
+      color: #333;
+      margin-bottom: 10px;
+    }
+
+    .course-teacher,
+    .course-location {
+      font-size: 14px;
+      color: #666;
+      margin-bottom: 8px;
+    }
+
+    .course-time {
+      font-size: 14px;
+      color: #666;
+      margin-bottom: 8px;
+    }
+
+    .course-price {
+      font-size: 14px;
+      color: #666;
+
+      .price-value {
+        color: #ff6b00;
+        font-weight: bold;
+      }
+    }
+  }
+}
+
+.teacher-info {
+  display: flex;
+  flex-direction: column;
+
+  .teacher-header {
+    display: flex;
+    align-items: center;
+    margin-bottom: 15px;
+
+    .teacher-avatar {
+      width: 60px;
+      height: 60px;
+      border-radius: 50%;
+      margin-right: 15px;
+      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
+      border: 2px solid #fff;
+    }
+
+    .teacher-basic-info {
+      .teacher-name {
+        font-size: 18px;
+        font-weight: 500;
+        color: #333;
+        margin-bottom: 4px;
+      }
+
+      .teacher-title {
+        font-size: 14px;
+        color: #666;
+        background-color: #f4f7fc;
+        padding: 2px 8px;
+        border-radius: 4px;
+        display: inline-block;
+      }
+    }
+  }
+
+  .teacher-intro-section {
+    width: 100%;
+
+    .intro-title {
+      font-size: 15px;
+      font-weight: 500;
+      color: #555;
+      margin-bottom: 8px;
+      padding-left: 8px;
+      border-left: 3px solid #2879ff;
+    }
+
+    .teacher-intro {
+      font-size: 14px;
+      color: #666;
+      line-height: 1.6;
+      background-color: #f8f9fc;
+      padding: 12px;
+      border-radius: 8px;
+      text-align: justify;
+    }
+  }
+}
+
+.content-section {
+  font-size: 14px;
+  color: #666;
+  line-height: 1.6;
+
+  .teaching-phase {
+    margin-bottom: 10px;
+
+    &:last-child {
+      margin-bottom: 0;
+    }
+  }
+  
+  .empty-data {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 20px 0;
+    color: #909399;
+    font-size: 14px;
+    
+    text {
+      margin-left: 8px;
+    }
+  }
+}
+
+.bottom-action {
+  padding: 15px;
+  margin-top: 20px;
+
+  .back-btn {
+    width: 100%;
+    height: 44px;
+    line-height: 44px;
+    background-color: #fff;
+    color: #333;
+    border-radius: 22px;
+    font-size: 16px;
+    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
+  }
+}
+</style>
diff --git a/src/pages/system/login/login.vue b/src/pages/system/login/login.vue
index 1e2c776..a55d3e9 100644
--- a/src/pages/system/login/login.vue
+++ b/src/pages/system/login/login.vue
@@ -220,7 +220,7 @@ async function afterRead(event: any, index: number) {
   const tempFilePath = event.tempFilePaths[0];
   showLoading({ title: "上传中" });
   try {
-    const res = await attachmentUpload(tempFilePath);
+    const res = await attachmentUpload(tempFilePath) as { result: Array<{ filePath: string }> };
     const result = res.result;
     if (result && result.length > 0 && result[0].filePath) {
       students.value[index].xstx = result[0].filePath;