Merge branch 'base' into tabbar

src/pages/index/about.vue

@@ -16,28 +16,20 @@
       鸽友们好，我是
       <text class="text-red-500">菲鸽</text>
     </view>
-    <view class="text-center mt-8">
+    <view class="text-center mt-8 text-#fff">
       <wd-button type="primary" @click="gotoPage('request')">去请求页</wd-button>
+      <wd-button type="primary" @click="gotoPage('request2')" class="ml-2">
+        去请求页2 (请求状态一体化)
+      </wd-button>
     </view>
-
-    <view class="text-center py-4">
-      当前平台是：
-      <text class="text-red-500">{{ PLATFORM.platform }}</text>
-    </view>
-    <view class="text-center desc mt-10">设计稿样式编写：</view>
-    <view class="text-center desc">设计稿是750px，css里面全部写rpx 即可</view>
   </view>
   <tabbar />
 </template>
 
 <script lang="ts" setup>
-import PLATFORM from '@/utils/platform'
-
 // 获取屏幕边界到安全区域距离
 const { safeAreaInsets } = uni.getSystemInfoSync()
 
-console.log(PLATFORM)
-
 const gotoPage = (page: string) => {
   uni.navigateTo({
     url: `/pages/index/${page}`,

src/pages/index/index.vue

@@ -19,17 +19,22 @@
     <view class="text-center text-2xl mt-2 mb-8">最好用的 uniapp 开发模板</view>
 
     <view class="text-justify max-w-100 m-auto text-4 indent mb-2">{{ description }}</view>
-    <view class="mt-8 text-center">
-      <text class="text-green-400">当前模板分支：tabbar</text>
+    <view class="text-center mt-8">
+      当前平台是：
+      <text class="text-green-500">{{ PLATFORM.platform }}</text>
+    </view>
+    <view class="text-center mt-4">
+      模板分支是：
+      <text class="text-green-500">tabbar</text>
     </view>
   </view>
   <tabbar />
 </template>
 
 <script lang="ts" setup>
+import PLATFORM from '@/utils/platform'
 // 获取屏幕边界到安全区域距离
 const { safeAreaInsets } = uni.getSystemInfoSync()
-
 const author = ref('菲鸽')
 const description = ref(
   'unibest 是一个集成了多种工具和技术的 uniapp 开发模板，由 uniapp + Vue3 + Ts + Vite4 + UnoCss + UniUI + VSCode 构建，模板具有代码提示、自动格式化、统一配置、代码片段等功能，并内置了许多常用的基本组件和基本功能，让你编写 uniapp 拥有 best 体验。',

src/pages/index/request.vue

@@ -8,35 +8,35 @@
 </route>
 
 <template>
-  <view class="mt-6">
-    <!-- http://localhost:9000/#/pages/index/request -->
-    <button @click="getFoo" class="my-4">测试 GET 请求</button>
-    <view class="text-xl">请求数据如下</view>
-    <view class="text-green h-10">{{ JSON.stringify(data) }}</view>
-    <view class="text-xl">完整数据</view>
-    <view class="text-green h-20">{{ JSON.stringify(originalData) }}</view>
-    <button @click="postFoo" class="my-4">测试 POST 请求</button>
-    <view class="text-xl">请求数据如下</view>
-    <view class="text-green h-10">{{ JSON.stringify(data2) }}</view>
-
-    <button class="my-8" type="warn" @click="reset">一键清空数据</button>
-
+  <view class="p-6 text-center">
     <view class="my-2">使用的是 laf 云后台</view>
     <view class="text-green-400">我的推荐码，可以获得佣金</view>
+
     <!-- #ifdef H5 -->
-    <view class="my-2 text-center">
-      <a class="my-2 text-center" :href="recommendUrl" target="_blank">{{ recommendUrl }}</a>
+    <view class="my-2">
+      <a class="my-2" :href="recommendUrl" target="_blank">{{ recommendUrl }}</a>
     </view>
     <!-- #endif -->
 
     <!-- #ifndef H5 -->
     <view class="my-2 text-left text-sm">{{ recommendUrl }}</view>
     <!-- #endif -->
+
+    <!-- http://localhost:9000/#/pages/index/request -->
+    <button @click="getFoo" class="my-6">1.测试 GET 请求</button>
+    <view class="text-xl">请求数据如下</view>
+    <view class="text-green h-10">{{ JSON.stringify(data) }}</view>
+    <view class="text-xl">完整数据</view>
+    <view class="text-green h-16">{{ JSON.stringify(originalData) }}</view>
+    <button @click="postFoo" class="my-6">2.测试 POST 请求</button>
+    <view class="text-xl">请求数据如下</view>
+    <view class="text-green h-10">{{ JSON.stringify(data2) }}</view>
+    <button class="my-6" type="warn" @click="reset">3.一键清空数据</button>
   </view>
 </template>
 
 <script lang="ts" setup>
-import { getFooAPI, postFooAPI, IFooItem } from '@/service/foo'
+import { getFooAPI, postFooAPI, IFooItem } from '@/service/index/foo'
 
 const recommendUrl = ref('http://laf.run/signup?code=ohaOgIX')
 
@@ -44,6 +44,7 @@ onLoad(() => {
   getFoo()
   postFoo()
 })
+
 const originalData = ref<IResData<IFooItem>>()
 const data = ref<IFooItem>()
 const getFoo = async () => {

src/pages/index/request2.vue

@@ -0,0 +1,30 @@
+<route lang="json5">
+{
+  layout: 'demo',
+  style: {
+    navigationBarTitleText: '请求',
+  },
+}
+</route>
+
+<template>
+  <view class="p-6 text-center">
+    <!-- http://localhost:9000/#/pages/index/request -->
+    <button @click="getFoo" class="my-6">测试 GET 请求</button>
+    <view class="text-xl">请求数据如下</view>
+    <view v-if="loading" class="text-blue h-10">加载中...</view>
+    <view v-else class="text-green h-10">{{ JSON.stringify(data) }}</view>
+    <button class="my-6" type="warn" @click="reset">一键清空数据</button>
+  </view>
+</template>
+
+<script lang="ts" setup>
+import { getFooAPI, IFooItem } from '@/service/index/foo'
+
+const { loading, data, run } = useRequest<IFooItem>(() => getFooAPI('菲鸽'), { immediate: true })
+
+const getFoo = () => run()
+const reset = () => {
+  data.value = undefined
+}
+</script>