样式修改

common/styles/global/components.scss

@@ -145,6 +145,9 @@ view{box-sizing: border-box;}
 	@include ezy-no-repeat-cover();
 	background-image: url("@/static/images/common/return-icon.png");}
 }
+//带下边线的navBar
+.border-navBar-box{border-bottom: 1rpx solid #f4f6fa;}
+
 // 仅一个返回按钮
 .phone-nav-bar-icon{width: 24rpx;height: 38rpx;position: absolute;left: 24rpx;top: var(--status-bar-height);
 		background-image: url("@/static/images/common/nav-bar-jt.svg");@include ezy-no-repeat-cover();

pages/admin/Hetong/Hetong.vue

@@ -16,7 +16,7 @@
 				webview-styles="height: 50vh;margin-top: 75px"></web-view> -->
 		</template>
 		<template v-else>
-			<view>暂无合同</view>
+			<view class="no-hetong-box">暂无合同</view>
 		</template>
 
 		<button v-if="info.id && info.status == 0" type="default" class="phone-green-btn ht-btn" @click="handleQianming">我已阅读</button>

pages/admin/Hetong/HetongList.vue

@@ -1,8 +1,143 @@
 <template>
-	<view>合同列表</view>
+	<view class="phone-list-page ht-list-page">
+		<view class="icon-title-navBar-box border-navBar-box">
+			<text class="nav-bar-title">历史合同</text>
+		</view>
+	<!-- 课程列表 -->
+	<scroll-view scroll-y="true" refresher-enabled="true" :refresher-triggered="data.loading"
+		:refresher-threshold="50" refresher-background="transparent" @refresherrefresh="onRefresh"  @scrolltolower="onScrolltolower"
+		class="admin-phone-tabbar-view">
+		<uni-list class="admin-list-box">
+			<uni-list-item v-for="item in data.list" class="admin-list-item-box">
+				<template v-slot:body>
+					<view class="ht-card-row" @click="checkKecheng(item)">
+						<view class="ht-status">合同状态：<view :class="'status-' + item.status">{{formatStatus(item.status)}}</view></view>
+						<view class="ht-time"><icon class="phone-time-icon" />合同开始时间：{{formatTime(item.startDate)}} </view>
+						<view class="ht-time"><icon class="phone-time-icon" />合同结束时间：{{formatTime(item.endDate)}} </view>
+					</view>
+				</template>
+			</uni-list-item>
+			<uni-load-more :status="data.state" @click="getMore(0)" :contentText="data.contentText"></uni-load-more>
+		</uni-list>
+	</scroll-view>
+	<!-- 页面底端 -->
+	<customTabbarClientVue></customTabbarClientVue>
+	</view>
 </template>
 
-<script>
+<script setup>
+import {ref,reactive} from "vue";
+import {onLoad,onShow} from "@dcloudio/uni-app";
+import {getHetongList} from '@/api/hetong.js'
+import customTabbarClientVue from "@/components/custom-tabbar/custom-tabbar-admin.vue";
+const data = reactive({
+		list: [], // 考试列表
+		loading: false,
+		page: 0,
+		size: 10,
+		state: 'more',
+		contentText: {
+			contentdown: '查看更多',
+			contentrefresh: '加载中',
+			contentnomore: '没有更多'
+		},
+})	
+	
+onLoad((options) => {
+		data.from = options.from;
+	})
+
+onShow(() => {
+	getMore()
+})
+
+function onRefresh() {
+	data.page = 0;
+	data.list = [];
+	data.loading = true;
+	refreshData();
+}
+
+function refreshData() {
+	const opt = {
+		page: 1,
+		size: 10, // 固定查询10条
+	}
+	data.list = [];
+	// 数学
+	data.state = 'loading';
+	data.page++;
+	opt.page = data.page;
+	getHetongList(opt).then(res => {
+		data.list = data.list.concat(res.data.data);
+		data.loading = false;
+		if (res.data.total > data.list.length) {
+			data.state = 'more';
+			data.loading = false;
+		} else {
+			data.state = 'no-more';
+			data.loading = false;
+		}
+	}).catch(err => {
+		data.state = 'more';
+		data.loading = false;
+	})
+}
+
+function getMore() {
+	const opt = {
+		page: 1,
+		size: 10, // 固定查询10条
+	}
+	if (data.state == 'no-more') return;
+	data.state = 'loading';
+	data.page++;
+	opt.page = data.page;
+	getHetongList(opt).then(res => {
+		data.list = data.list.concat(res.data.data);
+		data.loading = false;
+		if (res.data.total > data.list.length) {
+			data.state = 'more';
+			data.loading = false;
+		} else {
+			data.state = 'no-more';
+			data.loading = false;
+		}
+	}).catch(err => {
+		data.state = 'more';
+		data.loading = false;
+	})
+}
+
+function onScrolltolower() {
+	getMore()
+}
+
+function handleSearch() {
+	data.page = 0;
+	refreshData();
+}
+
+// 在现有代码底部添加此方法
+function formatStatus(status) {
+  const statusMap = {
+    0: '待签字',
+    1: '待审核',
+    2: '生效'
+  };
+  return statusMap[status] || '未知状态'; // 处理未知状态
+}
+
+function formatTime(data){
+		console.log(data.split(' ')[0],'data.split()[0]');
+		return data.split(' ')[0];
+}
+
+function checkKecheng(item) {
+	uni.navigateTo({
+		url: `/pages/admin/Hetong/HetongInfo?id=${item.id}`
+	})
+}
 </script>
 
 <style>