1

2026-09-24 16:25:22 +08:00
commit 7428184f01
1198 changed files with 314515 additions and 0 deletions
@@ -0,0 +1,138 @@
+<template>
+	<hr-page page-bg="#F3F4F6" status-bg="#FFFFFF" nav-title="离线同步" :xloading="true" @right-click="onSort">
+		<template v-slot:right>
+			<x-icon name="arrow-up-down-line" color="#6B7280" font-size="17"></x-icon>
+		</template>
+
+		<view class="hr-body">
+
+			<view class="os-box">
+				<x-icon name="cloud-off-line" color="#92400E" font-size="15"></x-icon>
+				<text class="os-box-t">当前网络不可用，以下记录已暂存本机</text>
+				<view class="hr-offbar-cnt">
+					<text class="os-box-c">{{ pendingCount }}</text>
+				</view>
+			</view>
+
+			<hr-sec title="待上传队列" :more="'共 ' + tasks.length + ' 条'"></hr-sec>
+			<hr-card variant="list">
+				<hr-lrow v-for="(t, i) in tasks" :key="i" :icon="t.icon" :theme="t.theme" :title="t.title"
+					:sub="t.sub" :value="t.status" :value-bold="true" :is-last="i == tasks.length - 1"
+					@click="onTaskClick(t)"></hr-lrow>
+			</hr-card>
+
+			<hr-tip style="margin-top:14px" theme="info" icon="ℹ"
+				text="提交失败的记录会自动进入本队列；网络恢复后按时间顺序自动重传，无需手动操作。"></hr-tip>
+
+			<view v-if="syncing" class="os-progress">
+				<view class="hr-row-between" style="margin-bottom:9px">
+					<text class="os-p-t">正在重传…</text>
+					<text class="os-p-v">{{ progress }}%</text>
+				</view>
+				<hr-progress :percent="progress"></hr-progress>
+			</view>
+
+			<view style="height:14px"></view>
+		</view>
+
+		<template v-slot:footer>
+			<view class="hr-fixedbar">
+				<view :class="syncing ? 'hr-btn hr-btn-disabled' : 'hr-btn hr-btn-primary'" style="flex:1"
+					@click="onRetryAll">
+					<text class="os-foot-t">{{ syncing ? '正在重传…' : '立即重试全部上传' }}</text>
+				</view>
+			</view>
+		</template>
+	</hr-page>
+</template>
+
+<script lang="uts" setup>
+	import { ref, computed } from 'vue'
+	import { offlineTasks } from '@/mock/index.uts'
+	import { HrOfflineTask } from '@/mock/types.uts'
+
+	/**
+	 * s19 离线同步
+	 * 提交失败就地拦截 + 进离线队列；网络恢复后按时间顺序自动重传。
+	 */
+	const tasks = ref<HrOfflineTask[]>(offlineTasks)
+	const syncing = ref(false)
+	const progress = ref(0)
+	let timer : number = 0
+
+	const pendingCount = computed(() : number => {
+		return tasks.value.length
+	})
+
+	function onTaskClick(t : HrOfflineTask) : void {
+		uni.showModal({ title: t.title, content: t.sub, showCancel: false })
+	}
+
+	function onRetryAll() : void {
+		if (syncing.value) { return }
+		syncing.value = true
+		progress.value = 0
+		timer = setInterval(() => {
+			progress.value = progress.value + 10
+			if (progress.value >= 100) {
+				clearInterval(timer)
+				timer = 0
+				syncing.value = false
+				tasks.value = [] as HrOfflineTask[]
+				uni.showToast({ title: '全部同步完成', icon: 'success' })
+			}
+		}, 260)
+	}
+
+	function onSort() : void {
+		uni.showToast({ title: '按暂存时间排序', icon: 'none' })
+	}
+</script>
+
+<style>
+	.os-box {
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		background-color: #FFFBEB;
+		border: 2rpx solid #FDE68A;
+		border-radius: 24rpx;
+		padding: 18rpx 32rpx 18rpx 32rpx;
+	}
+
+	.os-box-t {
+		flex: 1;
+		font-size: 26.8rpx;
+		font-weight: bold;
+		color: #92400E;
+		margin-left: 18rpx;
+	}
+
+	.os-box-c {
+		font-size: 22.4rpx;
+		font-weight: bold;
+		color: #FFFFFF;
+	}
+
+	.os-progress {
+		margin-top: 28rpx;
+	}
+
+	.os-p-t {
+		font-size: 26.8rpx;
+		font-weight: bold;
+		color: #1F2937;
+	}
+
+	.os-p-v {
+		font-size: 25.8rpx;
+		font-weight: bold;
+		color: #2563EB;
+	}
+
+	.os-foot-t {
+		font-size: 32.4rpx;
+		font-weight: bold;
+		color: #FFFFFF;
+	}
+</style>