diff --git a/src/api/base/xkTfApi.ts b/src/api/base/xkTfApi.ts
new file mode 100644
index 0000000..62f3c52
--- /dev/null
+++ b/src/api/base/xkTfApi.ts
@@ -0,0 +1,33 @@
+import { get, post } from "@/utils/request";
+
+/**
+ * 获取选课退费分页查询
+ * @param params 
+ * @returns 
+ */
+export const findPageXkTfApi = async (params: any) => {
+  return await get("/api/xkTf/findPage", params);
+}; 
+
+/**
+ * 获取选课退费详情
+ * @param params 
+ * @returns 
+ */
+export const getXkTfDetailByIdApi = async (id: string) => {
+  return await get("/api/xkTf/getDetailById?id=" + id);
+}; 
+
+/**
+ * 审批退费
+ */
+export const xkTfSpApi = async (params: any) => {
+  return await post("/api/xkTf/sp", params);
+};
+
+/**
+ * 审批转办
+ */
+export const xkTfSpTransferApi = async (params: any) => {
+  return await post("/api/xkTf/spTransfer", params);
+};
diff --git a/src/api/base/xxtsApi.ts b/src/api/base/xxtsApi.ts
new file mode 100644
index 0000000..07c515a
--- /dev/null
+++ b/src/api/base/xxtsApi.ts
@@ -0,0 +1,6 @@
+import { get } from "@/utils/request";
+
+// 根据ID获取消息推送详情
+export const xxtsFindByIdApi = async (params: any) => {
+  return await get("/api/xxts/findById", params);
+};
\ No newline at end of file
diff --git a/src/pages/base/xs/qj/components/progressList.vue b/src/components/LcglSpList/index.vue
similarity index 70%
rename from src/pages/base/xs/qj/components/progressList.vue
rename to src/components/LcglSpList/index.vue
index ebd52d9..98dd224 100644
--- a/src/pages/base/xs/qj/components/progressList.vue
+++ b/src/components/LcglSpList/index.vue
@@ -4,7 +4,7 @@
       <text class="applicant-name">审批进度</text>
     </view>
     <view class="divider"></view>
-    <view class="progress-list">
+    <view class="progress-list" v-if="approvalList.length > 0">
       <view class="progress-item" v-for="(approver, index) in approvalList" :key="index">
         <view class="progress-item-row">
           <view class="item-avatar">
@@ -27,34 +27,57 @@
         <view class="progress-item-line" v-if="index < approvalList.length - 1"></view>
       </view>
     </view>
+    <view class="empty-state" v-else>
+      <view class="empty-icon">
+        <uni-icons type="info" size="40" color="#999"></uni-icons>
+      </view>
+      <view class="empty-text">暂无审批进度信息</view>
+      <view class="empty-subtext">可能审批流程尚未启动或数据加载失败</view>
+      <view class="retry-button" @click="loadApprovalProcess" v-if="hasError">
+        <text class="retry-text">重新加载</text>
+      </view>
+    </view>
   </view>
 </template>
 
 <script setup lang="ts">
 import dayjs from "dayjs";
-import { getXsQjApprovalProcessApi } from "@/api/base/server";
+import { getByYwIdAndYwTypeApi } from "@/api/base/lcglSpApi";
 
 // 接收外部传入属性
 const props = withDefaults(defineProps<{
-  qjId: string
+  ywId: string,
+  ywType: string,
+  showSqr: boolean,
+  showSpr: boolean,
+  showCsr: boolean,
 }>(), {
-  qjId: ''
+  ywId: '',
+  ywType: '',
+  showSqr: true,
+  showSpr: true,
+  showCsr: false
 });
 
 // 审批流程数据
 const approvalList = ref<any[]>([]);
+// 错误状态标识
+const hasError = ref(false);
 
 // 获取审批流程
 const loadApprovalProcess = async () => {
-  if (!props.qjId) return;
+  if (!props.ywId || !props.ywType) return;
   
   try {
-    // 调用后端API获取审批流程数据
-    const res = await getXsQjApprovalProcessApi(props.qjId, 'XS_QJ');
+    // 重置错误状态
+    hasError.value = false;
     
+    // 调用后端API获取审批流程数据
+    const res = await getByYwIdAndYwTypeApi(props.ywId, props.ywType);
+    approvalList.value = [];
     if (res.resultCode === 1 && res.result) {
       // 转换为前端显示格式（后端已按sort字段排序）
-      approvalList.value = res.result.map((item: any) => ({
+      const list = res.result.map((item: any) => ({
         userName: item.userName || getDefaultUserName(item.spType),
         spType: item.spType,
         approveStatus: item.approveStatus,
@@ -62,55 +85,44 @@ const loadApprovalProcess = async () => {
         approveRemark: item.approveRemark,
         avatar: item.avatar || '/static/base/home/11222.png'
       }));
+      for (let item of list) {
+        if ((item.spType === 'SQ' && !props.showSqr)
+        || (item.spType === 'SP' && !props.showSpr)
+        || (item.spType === 'CC' && !props.showCsr)) {
+          continue;
+        }
+        approvalList.value.push(item);
+      }
     } else {
-      loadMockData();
+      hasError.value = true;
     }
   } catch (error) {
     console.error('获取审批流程失败:', error);
-    // 如果API调用失败，使用模拟数据
-    loadMockData();
+    approvalList.value = [];
+    hasError.value = true;
   }
 };
 
 // 获取默认用户名
 const getDefaultUserName = (spType: string) => {
   switch (spType) {
-    case 'SQ': return '学生';
-    case 'SP': return '班主任';
-    case 'CC': return '家长';
+    case 'SQ': return '申请人';
+    case 'SP': return '审批人';
+    case 'CC': return '抄送人';
+    case 'DK': return '代课老师';
+    case 'JWC': return '教科处';
     default: return '未知';
   }
 };
 
-// 加载模拟数据（备用方案）
-const loadMockData = () => {
-  const mockData = [
-    {
-      userName: '学生',
-      spType: 'SQ',
-      approveStatus: 'approved',
-      approveTime: new Date(),
-      approveRemark: '申请人提交',
-      avatar: '/static/base/home/11222.png'
-    },
-    {
-      userName: '班主任',
-      spType: 'SP',
-      approveStatus: 'pending',
-      approveTime: null,
-      approveRemark: '待审批',
-      avatar: '/static/base/home/11222.png'
-    }
-  ];
-  approvalList.value = mockData;
-};
-
 // 获取审批类型文本
 const getSpTypeText = (spType: string) => {
   switch (spType) {
     case 'SQ': return '申请人';
     case 'SP': return '审批人';
     case 'CC': return '抄送人';
+    case 'DK': return '代课老师';
+    case 'JWC': return '教科处';
     default: return '';
   }
 };
@@ -144,15 +156,15 @@ const formatTime = (time: string | Date) => {
   return dayjs(time).format('YYYY-MM-DD HH:mm');
 };
 
-// 监听qjId变化
-watch(() => props.qjId, (newVal) => {
+// 监听ywId变化
+watch(() => props.ywId, (newVal) => {
   if (newVal) {
     loadApprovalProcess();
   }
 });
 
 // 初始化
-if (props.qjId) {
+if (props.ywId) {
   loadApprovalProcess();
 }
 </script>
@@ -272,5 +284,43 @@ if (props.qjId) {
       }
     }
   }
+
+  .empty-state {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    padding: 40px 20px;
+
+    .empty-icon {
+      margin-bottom: 16px;
+    }
+
+    .empty-text {
+      font-size: 16px;
+      color: #333;
+      margin-bottom: 8px;
+      font-weight: 500;
+    }
+
+    .empty-subtext {
+      font-size: 14px;
+      color: #999;
+      margin-bottom: 20px;
+      text-align: center;
+    }
+
+    .retry-button {
+      padding: 8px 24px;
+      background-color: #007AFF;
+      border-radius: 4px;
+      cursor: pointer;
+
+      .retry-text {
+        color: #FFFFFF;
+        font-size: 14px;
+      }
+    }
+  }
 }
-</style>
+</style>
\ No newline at end of file
diff --git a/src/components/PreviewImage/index.vue b/src/components/PreviewImage/index.vue
new file mode 100644
index 0000000..247b174
--- /dev/null
+++ b/src/components/PreviewImage/index.vue
@@ -0,0 +1,134 @@
+<template>
+  <view class="image-preview-container">
+    <view class="preview-title" v-if="title">{{ title }}</view>
+    <view class="image-list" v-if="imageList && imageList.length > 0">
+      <view 
+        class="image-item"
+        v-for="(image, index) in imageList"
+        :key="index"
+        @click="previewImages(index)"
+        :style="{ width: width + 'rpx', height: height + 'rpx' }"
+      >
+        <image 
+          :src="getImageUrl(image)"
+          class="preview-image"
+          mode="aspectFill"
+        />
+        <view class="image-overlay" v-if="showOverlay">
+          <uni-icons type="eye" size="24" color="#fff"></uni-icons>
+        </view>
+      </view>
+    </view>
+    <view class="no-image" v-else>
+      {{ emptyText || '暂无图片' }}
+    </view>
+  </view>
+</template>
+
+<script setup lang="ts">
+import { imagUrl } from '@/utils'
+
+const props = defineProps({
+  imageList: {
+    type: Array as () => string[],
+    default: () => []
+  },
+  title: {
+    type: String,
+    default: ''
+  },
+  emptyText: {
+    type: String,
+    default: '暂无图片'
+  },
+  showOverlay: {
+    type: Boolean,
+    default: true
+  },
+  width: {
+    type: Number,
+    default: 120
+  },
+  height: {
+    type: Number,
+    default: 120
+  }
+})
+
+const getImageUrl = (url: string) => {
+  if (url && (url.startsWith('http://') || url.startsWith('https://'))) {
+    return url
+  }
+  return imagUrl(url)
+}
+
+const previewImages = (currentIndex: number) => {
+  if (!props.imageList || props.imageList.length === 0) return
+  
+  const urls = props.imageList.map(item => getImageUrl(item))
+  
+  uni.previewImage({
+    current: currentIndex,
+    urls: urls as string[]
+  })
+}
+</script>
+
+<style scoped>
+.image-preview-container {
+  padding: 20rpx;
+  background-color: #fff;
+}
+
+.preview-title {
+  font-size: 32rpx;
+  font-weight: bold;
+  margin-bottom: 20rpx;
+  color: #333;
+}
+
+.image-list {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 20rpx;
+}
+
+.image-item {
+  position: relative;
+  border-radius: 10rpx;
+  overflow: hidden;
+  border: 1rpx solid #eee;
+}
+
+.image-item:hover .image-overlay {
+  opacity: 1;
+}
+
+.preview-image {
+  width: 100%;
+  height: 100%;
+  display: block;
+}
+
+.image-overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  opacity: 0;
+  transition: opacity 0.3s;
+}
+
+.no-image {
+  text-align: center;
+  color: #999;
+  padding: 40rpx 0;
+  font-size: 28rpx;
+}
+
+</style>
\ No newline at end of file
diff --git a/src/pages/base/xs/qj/detail.vue b/src/pages/base/xs/qj/detail.vue
index bb047d5..8b6d3ea 100644
--- a/src/pages/base/xs/qj/detail.vue
+++ b/src/pages/base/xs/qj/detail.vue
@@ -48,7 +48,7 @@
       </view>
 
       <!-- 审批流程 -->
-      <ProgressList :qjId="qjId" />
+      <LcglSpList :yw-id="qjId" yw-type="XS_QJ" />
     </view>
     <template #bottom>
       <view class="white-bg-color py-5">
@@ -69,7 +69,7 @@
 import { ref, onMounted } from 'vue';
 import { useDataStore } from "@/store/modules/data";
 import { getXsQjDetailApi } from "@/api/base/server";
-import ProgressList from "./components/progressList.vue";
+import LcglSpList from "@/components/LcglSpList/index.vue";
 
 const { getData } = useDataStore();
 
diff --git a/src/pages/base/xs/qj/sp.vue b/src/pages/base/xs/qj/sp.vue
index 5c8565e..eadc3c9 100644
--- a/src/pages/base/xs/qj/sp.vue
+++ b/src/pages/base/xs/qj/sp.vue
@@ -77,8 +77,7 @@ import { xsQjFindByIdApi, xsQjSpApi } from "@/api/base/server";
 import { useUserStore } from "@/store/modules/user";
 import { useDataStore } from "@/store/modules/data";
 import { ref, nextTick } from "vue";
-import { xxtsFindByIdApi, xxtsBlApi } from "@/api/base/server";
-import ProgressList from "./components/progressList.vue";
+import { xxtsFindByIdApi } from "@/api/base/server";
 
 const { getJs, loginByOpenId } = useUserStore();
 const { getData, setXxts, setData, getXxts } = useDataStore();
diff --git a/src/pages/view/hr/jsQj/detail.vue b/src/pages/view/hr/jsQj/detail.vue
index 140249e..3b6135f 100644
--- a/src/pages/view/hr/jsQj/detail.vue
+++ b/src/pages/view/hr/jsQj/detail.vue
@@ -35,7 +35,7 @@
 
       <!-- 审批流程 -->
       <view v-show="curTabIndex === 2">
-        <ProgressList :qjId="qjId" />
+        <LcglSpList :yw-id="qjId" yw-type="JS_QJ" />
       </view>
     </view>
     <template #bottom>
@@ -53,7 +53,7 @@ import { useDataStore } from "@/store/modules/data";
 import { ref, computed } from "vue";
 import JsQjDetailInfo from "./components/jsQjDetailInfo.vue";
 import JsQjDetailDk from "./components/jsQjDetailDk.vue";
-import ProgressList from "./components/progressList.vue";
+import LcglSpList from "@/components/LcglSpList/index.vue";
 
 const { getData, setData } = useDataStore();
 
diff --git a/src/pages/view/hr/jsQj/dkQr.vue b/src/pages/view/hr/jsQj/dkQr.vue
index 2d6628b..7d977b1 100644
--- a/src/pages/view/hr/jsQj/dkQr.vue
+++ b/src/pages/view/hr/jsQj/dkQr.vue
@@ -32,7 +32,7 @@
 
       <!-- 审批流程 -->
       <view v-show="curTabIndex === 2">
-        <ProgressList :qjId="qjId" />
+        <LcglSpList :yw-id="qjId" yw-type="JS_QJ" />
       </view>
     </view>
     <template #bottom>
@@ -76,7 +76,7 @@ import { useDataStore } from "@/store/modules/data";
 import { ref } from "vue";
 import JsQjDetailInfo from "./components/jsQjDetailInfo.vue";
 import JsQjDetailDk from "./components/jsQjDetailDk.vue";
-import ProgressList from "./components/progressList.vue";
+import LcglSpList from "@/components/LcglSpList/index.vue";
 import { QjPageUtils } from "@/utils/qjPageUtils";
 
 const { getJs } = useUserStore();
diff --git a/src/pages/view/hr/jsQj/jwcQr.vue b/src/pages/view/hr/jsQj/jwcQr.vue
index 37e92b2..732033b 100644
--- a/src/pages/view/hr/jsQj/jwcQr.vue
+++ b/src/pages/view/hr/jsQj/jwcQr.vue
@@ -32,7 +32,7 @@
 
       <!-- 审批流程 -->
       <view v-show="curTabIndex === 2">
-        <ProgressList :qjId="qjId" />
+        <LcglSpList :yw-id="qjId" yw-type="JS_QJ" />
       </view>
     </view>
     <template #bottom>
@@ -77,7 +77,7 @@ import { useDataStore } from "@/store/modules/data";
 import { ref } from "vue";
 import JsQjDetailInfo from "./components/jsQjDetailInfo.vue";
 import JsQjDetailDk from "./components/jsQjDetailDk.vue";
-import ProgressList from "./components/progressList.vue";
+import LcglSpList from "@/components/LcglSpList/index.vue";
 import { QjPageUtils } from "@/utils/qjPageUtils";
 
 const { getJs } = useUserStore();
diff --git a/src/pages/view/hr/jsQj/jwcXt.vue b/src/pages/view/hr/jsQj/jwcXt.vue
index a67b778..3ccb0b2 100644
--- a/src/pages/view/hr/jsQj/jwcXt.vue
+++ b/src/pages/view/hr/jsQj/jwcXt.vue
@@ -29,7 +29,7 @@
 
       <!-- 审批流程 -->
       <view v-show="curTabIndex === 2">
-        <ProgressList :qjId="qjId" />
+        <LcglSpList :yw-id="qjId" yw-type="JS_QJ" />
       </view>
     </view>
     <template #bottom>
@@ -52,7 +52,7 @@ import { useDataStore } from "@/store/modules/data";
 import { ref } from "vue";
 import JsQjDetailInfo from "./components/jsQjDetailInfo.vue";
 import JsQjDkEdit from "./components/jsQjDkEdit.vue";
-import ProgressList from "./components/progressList.vue";
+import LcglSpList from "@/components/LcglSpList/index.vue";
 import { QjPageUtils } from "@/utils/qjPageUtils";
 
 const { getJs } = useUserStore();
diff --git a/src/pages/view/hr/jsQj/sp.vue b/src/pages/view/hr/jsQj/sp.vue
index 5235b6b..9e18dd0 100644
--- a/src/pages/view/hr/jsQj/sp.vue
+++ b/src/pages/view/hr/jsQj/sp.vue
@@ -35,7 +35,7 @@
 
       <!-- 审批流程 -->
       <view v-show="curTabIndex === 2">
-        <ProgressList :qjId="qjId" />
+        <LcglSpList :yw-id="qjId" yw-type="JS_QJ" />
       </view>
     </view>
     <template #bottom>
@@ -62,7 +62,7 @@ import { useDataStore } from "@/store/modules/data";
 import { ref } from "vue";
 import JsQjDetailInfo from "./components/jsQjDetailInfo.vue";
 import JsQjDetailDk from "./components/jsQjDetailDk.vue";
-import ProgressList from "./components/progressList.vue";
+import LcglSpList from "@/components/LcglSpList/index.vue";
 import { QjPageUtils } from "@/utils/qjPageUtils";
 
 const { getJs } = useUserStore();
diff --git a/src/pages/view/routine/xk/tf/detail.vue b/src/pages/view/routine/xk/tf/detail.vue
new file mode 100644
index 0000000..8183fd0
--- /dev/null
+++ b/src/pages/view/routine/xk/tf/detail.vue
@@ -0,0 +1,22 @@
+<template>
+	<view>
+		
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style>
+
+</style>
diff --git a/src/pages/view/routine/xk/tf/sp.vue b/src/pages/view/routine/xk/tf/sp.vue
new file mode 100644
index 0000000..8183fd0
--- /dev/null
+++ b/src/pages/view/routine/xk/tf/sp.vue
@@ -0,0 +1,22 @@
+<template>
+	<view>
+		
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style>
+
+</style>