108 lines
3.1 KiB
Vue
108 lines
3.1 KiB
Vue
<template>
|
||
<view class="content">
|
||
<view class="title">@r-utils/uni-app & @r-utils/common Playground</view>
|
||
<view class="desc">以下是各模块的使用示例，点击进入独立页面</view>
|
||
|
||
<view class="section-title">@r-utils/uni-app</view>
|
||
<view class="nav-list">
|
||
<navigator url="/pages/request/index" class="nav-item">
|
||
<text class="nav-label">Request — 请求封装</text>
|
||
<text class="nav-desc">类 axios 的 uni.request 封装，支持拦截器</text>
|
||
</navigator>
|
||
<navigator url="/pages/uni-helper/index" class="nav-item">
|
||
<text class="nav-label">UniHelper — 常用工具</text>
|
||
<text class="nav-desc">rpxToPx、showToast、getCurrentPage 等</text>
|
||
</navigator>
|
||
<navigator url="/pages/bluetooth/index" class="nav-item">
|
||
<text class="nav-label">BluetoothUtils — 蓝牙工具</text>
|
||
<text class="nav-desc">蓝牙设备搜索、连接、数据传输</text>
|
||
</navigator>
|
||
<navigator url="/pages/nfc/index" class="nav-item">
|
||
<text class="nav-label">NFC — NFC 功能</text>
|
||
<text class="nav-desc">NFC 标签读写</text>
|
||
</navigator>
|
||
<navigator url="/pages/upload/index" class="nav-item">
|
||
<text class="nav-label">Upload — 文件上传</text>
|
||
<text class="nav-desc">uni.uploadFile 封装</text>
|
||
</navigator>
|
||
</view>
|
||
|
||
<view class="section-title" style="margin-top: 30rpx;">@r-utils/common</view>
|
||
<view class="nav-list">
|
||
<navigator url="/pages/permission/index" class="nav-item">
|
||
<text class="nav-label">Permission — 权限校验</text>
|
||
<text class="nav-desc">权限字符串格式校验</text>
|
||
</navigator>
|
||
<navigator url="/pages/countdown/index" class="nav-item">
|
||
<text class="nav-label">Countdown — 倒计时</text>
|
||
<text class="nav-desc">基于 dayjs 的倒计时类</text>
|
||
</navigator>
|
||
<navigator url="/pages/wait/index" class="nav-item">
|
||
<text class="nav-label">wait — 等待函数</text>
|
||
<text class="nav-desc">异步等待指定时间</text>
|
||
</navigator>
|
||
<navigator url="/pages/knock-test/index" class="nav-item">
|
||
<text class="nav-label">KnockTest — 敲击测试</text>
|
||
<text class="nav-desc">顺序敲击触发回调的状态机</text>
|
||
</navigator>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
</script>
|
||
|
||
<style>
|
||
.content {
|
||
padding: 30rpx;
|
||
}
|
||
|
||
.title {
|
||
font-size: 36rpx;
|
||
font-weight: bold;
|
||
margin-bottom: 12rpx;
|
||
}
|
||
|
||
.desc {
|
||
font-size: 26rpx;
|
||
color: #666;
|
||
margin-bottom: 40rpx;
|
||
}
|
||
|
||
.section-title {
|
||
font-size: 28rpx;
|
||
font-weight: bold;
|
||
color: #42b883;
|
||
margin-bottom: 20rpx;
|
||
padding-bottom: 8rpx;
|
||
border-bottom: 1px solid #eee;
|
||
}
|
||
|
||
.nav-list {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 16rpx;
|
||
margin-bottom: 20rpx;
|
||
}
|
||
|
||
.nav-item {
|
||
padding: 20rpx 24rpx;
|
||
background: #fff;
|
||
border-radius: 12rpx;
|
||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
|
||
}
|
||
|
||
.nav-label {
|
||
display: block;
|
||
font-size: 28rpx;
|
||
font-weight: bold;
|
||
margin-bottom: 6rpx;
|
||
}
|
||
|
||
.nav-desc {
|
||
display: block;
|
||
font-size: 24rpx;
|
||
color: #888;
|
||
}
|
||
</style>
|