From 64d84d780360ef2426285a00638c4d396c1ed208 Mon Sep 17 00:00:00 2001
From: ywyonui <ywyonui@163.com>
Date: Fri, 25 Jul 2025 17:59:10 +0800
Subject: [PATCH] =?UTF-8?q?1=E3=80=81=E8=B0=83=E6=95=B4=E8=AF=BE=E8=A1=A8?=
 =?UTF-8?q?=E4=B8=AD=E7=9A=84=E4=BB=A3=E8=AF=BE=202=E3=80=81=E8=B0=83?=
 =?UTF-8?q?=E6=95=B4=E8=AF=B7=E5=81=87=E9=80=BB=E8=BE=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/base/jsQjApi.ts                       |   7 +
 src/pages/view/homeSchool/BanJiKeBiao.vue     |   3 +-
 src/pages/view/homeSchool/JiaoShiKeBiao.vue   |   3 +-
 .../view/hr/jsQj/components/jsQjList.vue      |   2 +-
 src/pages/view/hr/jsQj/detail.vue             | 323 ++++++++----------
 5 files changed, 154 insertions(+), 184 deletions(-)

diff --git a/src/api/base/jsQjApi.ts b/src/api/base/jsQjApi.ts
index 9910371..6925e76 100644
--- a/src/api/base/jsQjApi.ts
+++ b/src/api/base/jsQjApi.ts
@@ -60,6 +60,13 @@ export const findDkByIdApi = async (params: any) => {
   return await get("/api/jsQjDk/findById", params);
 };
 
+/**
+ * 查询代课信息
+ */
+export const findDkPageApi = async (params: any) => {
+  return await get("/api/jsQjDk/findById", params);
+};
+
 /**
  * 查询请假列表
  */
diff --git a/src/pages/view/homeSchool/BanJiKeBiao.vue b/src/pages/view/homeSchool/BanJiKeBiao.vue
index 8ed7d84..fd4cabc 100644
--- a/src/pages/view/homeSchool/BanJiKeBiao.vue
+++ b/src/pages/view/homeSchool/BanJiKeBiao.vue
@@ -167,8 +167,7 @@ const selectDay = (index: number) => {
     jsId: "", // getJs.id,
     bjId: bjId,
     xqId: xqId,
-    rq: "",
-    // rq: rqList.value[index].rq, // 暂时废弃，目前小学都按周几进行查询
+    rq: rqList.value[index].rq, // 用于查询代课信息
     zj: rqList.value[index].zj
   }).then(res => {
     // 根据接口返回的result判断是否已报名
diff --git a/src/pages/view/homeSchool/JiaoShiKeBiao.vue b/src/pages/view/homeSchool/JiaoShiKeBiao.vue
index a63031a..7ff62c2 100644
--- a/src/pages/view/homeSchool/JiaoShiKeBiao.vue
+++ b/src/pages/view/homeSchool/JiaoShiKeBiao.vue
@@ -156,8 +156,7 @@ const selectDay = (index: number) => {
     jsId: getJs.id,
     bjId: "",
     xqId: xqId,
-    rq: "",
-    // rq: rqList.value[index].rq, // 暂时废弃，目前小学都按周几进行查询
+    rq: rqList.value[index].rq, // 用于查询代课信息
     zj: rqList.value[index].zj
   }).then(res => {
     // 根据接口返回的result判断是否已报名
diff --git a/src/pages/view/hr/jsQj/components/jsQjList.vue b/src/pages/view/hr/jsQj/components/jsQjList.vue
index 51e8628..5419c99 100644
--- a/src/pages/view/hr/jsQj/components/jsQjList.vue
+++ b/src/pages/view/hr/jsQj/components/jsQjList.vue
@@ -4,7 +4,7 @@
       <template v-slot="{ data, index }">
         <view class="leave-card" @click="goToDetail(data)">
           <view class="card-header">
-            <text class="applicant-name">{{ data.xsxm }}的请假申请</text>
+            <text class="applicant-name">{{ data.jsxm }}的请假申请</text>
           </view>
           <view class="card-body">
             <view class="info-row">
diff --git a/src/pages/view/hr/jsQj/detail.vue b/src/pages/view/hr/jsQj/detail.vue
index ded2ba7..4d6c751 100644
--- a/src/pages/view/hr/jsQj/detail.vue
+++ b/src/pages/view/hr/jsQj/detail.vue
@@ -1,44 +1,40 @@
 <template>
   <BasicLayout>
-    <view class="p-15">
-      <BasicForm @register="register">
-        <template #dkmx>
-          <view class="back-f8f8f8">
-            <view
-              class="flex-row items-center justify-between py-15 global-bg-color"
-            >
-              <view>
-                <BasicTitle line title="代课明细" :isBorder="false" />
-              </view>
-              <view @click="addEducation">
-                <BasicIcon type="icon-tianjia" size="25" />
-              </view>
-            </view>
-            <view v-if="education.xl.length > 0">
-              <template v-for="(item, index) in education.xl" :key="index">
-                <view class="po-re mb-15">
-                  <BasicForm
-                    v-model="item.value"
-                    :schema="schema"
-                    :formsProps="{ labelWidth: 100 }"
-                  />
-                  <view
-                    @click="deleteMemberFamily(index, item.value)"
-                    class="delete-icon"
-                  >
-                    <BasicIcon type="clear" size="30" />
-                  </view>
-                </view>
-              </template>
-            </view>
-            <view
-              v-else
-              class="p-15 flex-row-center color-9 font-13 white-bg-color"
-              >学历信息暂无数据</view
-            >
+    <view class="qj-detail">
+      <!-- 请假信息卡片 -->
+      <view class="info-card">
+        <view class="card-header">
+          <text class="applicant-name" v-if="dbFlag">{{ dbData.dbZy }}</text>
+          <text class="applicant-name" v-if="dbFlag">学生{{ qjData.xsxm }}的请假申请</text>
+        </view>
+        <view class="divider"></view>
+        <view class="card-body">
+          <view class="info-row">
+            <text class="label">请假类型:</text>
+            <text class="value">{{ qjData.qjlx }}</text>
           </view>
-        </template>
-      </BasicForm>
+          <view class="info-row">
+            <text class="label">开始时间:</text>
+            <text class="value">{{ qjData.qjkstime }}</text>
+          </view>
+          <view class="info-row">
+            <text class="label">结束时间:</text>
+            <text class="value">{{ qjData.qjjstime }}</text>
+          </view>
+          <view class="info-row">
+            <text class="label">请假时长:</text>
+            <text class="value">{{ qjData.qjsc }}</text>
+          </view>
+          <view class="info-row">
+            <text class="label">是否离校:</text>
+            <text class="value">{{ qjData.sflx === 1 ? '是' : '否' }}</text>
+          </view>
+          <view class="info-column">
+            <text class="label">请假事由:</text>
+            <text class="value">{{ qjData.qjsy }}</text>
+          </view>
+        </view>
+      </view>
     </view>
     <template #bottom>
       <view class="white-bg-color py-5">
@@ -62,157 +58,126 @@
 </template>
 
 <script setup lang="ts">
-import { ref } from "vue";
 import { onLoad } from "@dcloudio/uni-app";
+import { navigateBack } from "@/utils/uniapp";
+import { findQjById,  } from "@/api/base/jsQjApi";
+import { useDataStore } from "@/store/modules/data";
+const { getData, getDb, setData } = useDataStore();
 
-const leaveId = ref<string | null>(null);
+const dbFlag = ref(false);
 
-import { useForm } from "@/components/BasicForm/hooks/useForm";
+// 请假基础数据
+const qjData = computed(() => getData || {});
+const dbData = computed(() => getDb || {});
 
-const [register, { getValue }] = useForm({
-  schema: [
-    {
-      field: "ttlx",
-      label: "请假类型",
-      component: "BasicPicker",
-      componentProps: {},
-    },
-    { interval: true },
-    {
-      field: "gsmc",
-      label: "开始时间",
-      component: "BasicDateTimes",
-      required: true,
-      componentProps: {},
-    },
-    {
-      field: "gsmc",
-      label: "结束时间",
-      component: "BasicDateTimes",
-      required: true,
-      componentProps: {},
-    },
-    { interval: true },
-    {
-      field: "gsmc",
-      label: "请假事由",
-      component: "BasicInput",
-      required: true,
-      itemProps: {
-        labelPosition: "top",
-      },
-      componentProps: {
-        type: "textarea",
-      },
-    },
-    { interval: true },
-    {
-      field: "gsmc",
-      label: "代课方式",
-      component: "BasicCheckbox",
-      required: true,
-      itemProps: {
-        labelPosition: "top",
-      },
-      componentProps: {
-        data: [
-          { value: 0, text: "自行协调" },
-          { value: 1, text: "教科处协调" },
-          { value: 2, text: "无须代课" },
-        ],
-      },
-    },
-    { colSlot: "dkmx" },
-    { interval: true },
-    {
-      field: "gsmc",
-      label: "申请人员",
-      component: "BasicDateTimes",
-      required: true,
-      componentProps: {},
-    },
-    {
-    field: "xm",
-    label: "申请时间",
-    component: "BasicDateTimes",
-    required: true,
-    componentProps: {},
-  },
-  ],
-});
+const submit = async () => { 
+  navigateBack();
+};
 
-const schema = reactive<FormsSchema[]>([
-  {
-    field: "dktime",
-    label: "日期",
-    component: "BasicDateTimes",
-    required: true,
-    componentProps: {},
-  },
-  {
-    field: "nl",
-    label: "年级班级",
-    component: "BasicInput",
-    required: true,
-    componentProps: {},
-  },
-  {
-    field: "yhzgx",
-    label: "节次",
-    component: "BasicInput",
-    required: true,
-    componentProps: {},
-  },
-  {
-    field: "yhzgx",
-    label: "代课老师",
-    component: "BasicInput",
-    required: true,
-    componentProps: {},
-  },
-]);
-
-const education = reactive<any>({
-  xl: [{ value: {} }],
-});
-
-function addEducation() {
-  education.xl.push({ value: {} });
-}
-
-function deleteMemberFamily(index: number, item: any) {
-  const list = cloneDeep(education.xl);
-  list.splice(index, 1);
-  education.xl = list;
-}
-
-onLoad((options) => {
-  // 获取页面跳转时传递的参数
-  if (options && options.id) {
-    leaveId.value = options.id;
-    console.log("Loading leave detail for ID:", leaveId.value);
-    // TODO: 调用 API 根据 leaveId.value 获取详细数据
+onLoad(async (data: any) => {
+  // 从待办过来的，需要从后端获取数据
+  if (data && data.from && data.from == "db") {
+    dbFlag.value = true;
+    const res = await findQjById({ id: data.id });
+    nextTick(() => {
+      setData(res.result);
+    });
   } else {
-    console.error("Missing leave ID in options");
-    // 可以显示错误提示或返回上一页
-    // uni.showToast({ title: "缺少申请ID", icon: "error" });
-    // uni.navigateBack();
-     // 如果没有 id，可能是新增
-    console.log("Opening leave detail page for creation (no ID provided).");
+    dbFlag.value = false;
   }
 });
 
-import { navigateBack } from "@/utils/uniapp";
-import { cloneDeep } from "lodash";
-
-function submit() {}
 </script>
 
 <style lang="scss" scoped>
-.delete-icon {
-  position: absolute;
-  right: 0;
-  top: 0;
-  z-index: 1;
+.qj-detail {
+  background-color: #f5f7fa;
 }
-</style> 
\ No newline at end of file
+
+.info-card {
+  margin: 15px;
+  background-color: #fff;
+  border-radius: 8px;
+  padding: 15px;
+  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
+
+  .card-header {
+    font-size: 16px;
+    font-weight: bold;
+    color: #333;
+    margin-bottom: 10px;
+
+    .applicant-name {
+      font-size: 16px;
+      font-weight: bold;
+      color: #333;
+    }
+  }
+
+  .divider {
+    height: 1px;
+    background-color: #eee;
+    margin-bottom: 15px;
+  }
+
+
+  .card-body {
+    padding: 15px;
+
+    .info-row {
+      display: flex;
+      margin-bottom: 10px;
+
+      .label {
+        font-size: 14px;
+        color: #bbb;
+        width: 70px;
+        flex-shrink: 0;
+        margin-right: 8px;
+      }
+
+      .value {
+        font-size: 14px;
+        color: #333;
+        flex: 1;
+      }
+    }
+    .info-column {
+      display: flex;
+      flex-direction: column;
+
+      .label {
+        font-size: 14px;
+        color: #bbb;
+        flex-shrink: 0;
+        margin-right: 8px;
+        width: 100%;
+        margin-bottom: 5px;
+      }
+            
+      .value {
+        font-size: 14px;
+        color: #333;
+        flex: 1;
+      }
+    }
+  }
+
+}
+
+.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>