af-mobile-client-vue3 1.3.16 → 1.3.18

package/src/views/component/XRequestView/index.vue

@@ -1,234 +1,234 @@
-<script setup lang="ts">
-import { queryProse } from '@af-mobile-client-vue3/api/mock'
-import { getUserPermissions } from '@af-mobile-client-vue3/services/api/search'
-import { post } from '@af-mobile-client-vue3/services/restTools'
-import useUserStore from '@af-mobile-client-vue3/stores/modules/user'
-import { showToast, Button as VanButton, Cell as VanCell, CellGroup as VanCellGroup } from 'vant'
-import { reactive, ref } from 'vue'
-import { useRouter } from 'vue-router'
-
-// 路由
-const router = useRouter()
-// 用户store
-const userStore = useUserStore()
-
-// 数据定义
-const requestTypes = ref('GET, POST, DELETE')
-const getResult = ref('')
-const postResult = ref('')
-const permissionsResult = ref('')
-const storePermissionsResult = ref('')
-const postData = reactive({
-  name: '',
-  value: '',
-})
-
-// 返回上一页
-function onClickLeft() {
-  router.back()
-}
-
-// 发送GET请求示例
-async function handleGetRequest() {
-  try {
-    // 这里使用项目中的模拟API
-    const result = await queryProse()
-    getResult.value = JSON.stringify(result, null, 2)
-    showToast('请求成功')
-  }
-  catch (error) {
-    console.error('GET请求失败:', error)
-    showToast('请求失败')
-  }
-}
-
-// 获取用户权限
-async function handleGetPermissions() {
-  try {
-    const userInfo = userStore.getUserInfo()
-    if (!userInfo || !userInfo.id) {
-      showToast('请先登录')
-      return
-    }
-
-    // 从API获取权限
-    const permissions = await getUserPermissions(userInfo.id.toString())
-    permissionsResult.value = JSON.stringify(permissions, null, 2)
-
-    // 从Store获取权限
-    const storePermissions = userStore.getPermissions()
-    storePermissionsResult.value = JSON.stringify(storePermissions, null, 2)
-
-    showToast('获取权限成功')
-  }
-  catch (error) {
-    console.error('获取权限失败:', error)
-    showToast('获取权限失败')
-  }
-}
-
-// 定义请求数据类型
-interface RequestData {
-  name: string
-  value: string
-}
-
-// 定义返回结果类型
-interface ResponseData {
-  code: number
-  msg: string
-  data: any
-}
-
-// 发送POST请求示例
-async function handlePostRequest() {
-  try {
-    // 这里演示使用通用post方法发送请求
-    // 使用泛型指定返回类型
-    const result = await post<ResponseData>('/api/demo/post', {
-      name: '测试',
-      value: '测试',
-    })
-    postResult.value = JSON.stringify(result, null, 2)
-    showToast('请求成功')
-  }
-  catch (error) {
-    console.error('POST请求失败:', error)
-    showToast('请求失败')
-  }
-}
-
-// 类型定义展示
-const typeDefinitions = `
-
-// 使用泛型扩展特定业务数据类型
-import { get } from '@af-mobile-client-vue3/services/restTools'
-
-interface UserInfo {
-  id: string
-  name: string
-  roles: string[]
-}
-
-// 调用示例
-const userInfo = await get<UserInfo>('/api/user/info')
-// userInfo 类型为 UserInfo，而非 BasicResponseModel<UserInfo>
-// 不用使用 userInfo.data 获取数据
-// 直接使用 userInfo 即可
-`.trim()
-</script>
-
-<template>
-  <div class="request-view">
-    <div class="container">
-      <VanCellGroup title="API请求演示">
-        <VanCell title="基本请求类型" :value="requestTypes" />
-
-        <!-- GET请求部分 -->
-        <div class="request-section">
-          <h3>GET请求示例</h3>
-          <VanButton type="primary" size="small" @click="handleGetRequest">
-            发送GET请求
-          </VanButton>
-          <div v-if="getResult" class="result-box">
-            <h4>响应结果：</h4>
-            <pre>{{ getResult }}</pre>
-          </div>
-        </div>
-
-        <!-- POST请求部分 -->
-        <div class="request-section">
-          <h3>POST请求示例</h3>
-
-          <VanButton type="primary" size="small" @click="handlePostRequest">
-            发送POST请求
-          </VanButton>
-          <div v-if="postResult" class="result-box">
-            <h4>响应结果：</h4>
-            <pre>{{ postResult }}</pre>
-          </div>
-        </div>
-
-        <!-- 用户权限部分 -->
-        <div class="request-section">
-          <h3>用户权限获取</h3>
-          <VanButton type="primary" size="small" @click="handleGetPermissions">
-            获取用户权限
-          </VanButton>
-
-          <div v-if="permissionsResult" class="result-box">
-            <h4>API请求权限结果：</h4>
-            <pre>{{ permissionsResult }}</pre>
-          </div>
-
-          <div v-if="storePermissionsResult" class="result-box">
-            <h4>Store缓存权限结果：</h4>
-            <pre>{{ storePermissionsResult }}</pre>
-          </div>
-        </div>
-
-        <!-- 类型定义说明 -->
-        <div class="code-section">
-          <h3>类型定义</h3>
-          <pre>{{ typeDefinitions }}</pre>
-        </div>
-      </VanCellGroup>
-    </div>
-  </div>
-</template>
-
-<style scoped>
-.request-view {
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-}
-
-.container {
-  flex: 1;
-  padding: 16px;
-  overflow-y: auto;
-}
-
-.request-section {
-  margin: 16px 0;
-  padding: 16px;
-  background-color: #f7f8fa;
-  border-radius: 8px;
-}
-
-.result-box {
-  margin-top: 16px;
-  padding: 12px;
-  background-color: #ffffff;
-  border-radius: 4px;
-  border: 1px solid #ebedf0;
-}
-
-pre {
-  white-space: pre-wrap;
-  word-break: break-all;
-  font-size: 12px;
-  font-family: Consolas, Monaco, monospace;
-  background-color: #f5f7fa;
-  padding: 8px;
-  border-radius: 4px;
-  overflow-x: auto;
-}
-
-.code-section {
-  margin: 16px 0;
-}
-
-h3 {
-  margin: 0 0 12px;
-  font-size: 15px;
-  color: #323233;
-}
-
-h4 {
-  margin: 0 0 8px;
-  font-size: 14px;
-  color: #323233;
-}
-</style>
+<script setup lang="ts">
+import { queryProse } from '@af-mobile-client-vue3/api/mock'
+import { getUserPermissions } from '@af-mobile-client-vue3/services/api/search'
+import { post } from '@af-mobile-client-vue3/services/restTools'
+import useUserStore from '@af-mobile-client-vue3/stores/modules/user'
+import { showToast, Button as VanButton, Cell as VanCell, CellGroup as VanCellGroup } from 'vant'
+import { reactive, ref } from 'vue'
+import { useRouter } from 'vue-router'
+
+// 路由
+const router = useRouter()
+// 用户store
+const userStore = useUserStore()
+
+// 数据定义
+const requestTypes = ref('GET, POST, DELETE')
+const getResult = ref('')
+const postResult = ref('')
+const permissionsResult = ref('')
+const storePermissionsResult = ref('')
+const postData = reactive({
+  name: '',
+  value: '',
+})
+
+// 返回上一页
+function onClickLeft() {
+  router.back()
+}
+
+// 发送GET请求示例
+async function handleGetRequest() {
+  try {
+    // 这里使用项目中的模拟API
+    const result = await queryProse()
+    getResult.value = JSON.stringify(result, null, 2)
+    showToast('请求成功')
+  }
+  catch (error) {
+    console.error('GET请求失败:', error)
+    showToast('请求失败')
+  }
+}
+
+// 获取用户权限
+async function handleGetPermissions() {
+  try {
+    const userInfo = userStore.getUserInfo()
+    if (!userInfo || !userInfo.id) {
+      showToast('请先登录')
+      return
+    }
+
+    // 从API获取权限
+    const permissions = await getUserPermissions(userInfo.id.toString())
+    permissionsResult.value = JSON.stringify(permissions, null, 2)
+
+    // 从Store获取权限
+    const storePermissions = userStore.getPermissions()
+    storePermissionsResult.value = JSON.stringify(storePermissions, null, 2)
+
+    showToast('获取权限成功')
+  }
+  catch (error) {
+    console.error('获取权限失败:', error)
+    showToast('获取权限失败')
+  }
+}
+
+// 定义请求数据类型
+interface RequestData {
+  name: string
+  value: string
+}
+
+// 定义返回结果类型
+interface ResponseData {
+  code: number
+  msg: string
+  data: any
+}
+
+// 发送POST请求示例
+async function handlePostRequest() {
+  try {
+    // 这里演示使用通用post方法发送请求
+    // 使用泛型指定返回类型
+    const result = await post<ResponseData>('/api/demo/post', {
+      name: '测试',
+      value: '测试',
+    })
+    postResult.value = JSON.stringify(result, null, 2)
+    showToast('请求成功')
+  }
+  catch (error) {
+    console.error('POST请求失败:', error)
+    showToast('请求失败')
+  }
+}
+
+// 类型定义展示
+const typeDefinitions = `
+
+// 使用泛型扩展特定业务数据类型
+import { get } from '@af-mobile-client-vue3/services/restTools'
+
+interface UserInfo {
+  id: string
+  name: string
+  roles: string[]
+}
+
+// 调用示例
+const userInfo = await get<UserInfo>('/api/user/info')
+// userInfo 类型为 UserInfo，而非 BasicResponseModel<UserInfo>
+// 不用使用 userInfo.data 获取数据
+// 直接使用 userInfo 即可
+`.trim()
+</script>
+
+<template>
+  <div class="request-view">
+    <div class="container">
+      <VanCellGroup title="API请求演示">
+        <VanCell title="基本请求类型" :value="requestTypes" />
+
+        <!-- GET请求部分 -->
+        <div class="request-section">
+          <h3>GET请求示例</h3>
+          <VanButton type="primary" size="small" @click="handleGetRequest">
+            发送GET请求
+          </VanButton>
+          <div v-if="getResult" class="result-box">
+            <h4>响应结果：</h4>
+            <pre>{{ getResult }}</pre>
+          </div>
+        </div>
+
+        <!-- POST请求部分 -->
+        <div class="request-section">
+          <h3>POST请求示例</h3>
+
+          <VanButton type="primary" size="small" @click="handlePostRequest">
+            发送POST请求
+          </VanButton>
+          <div v-if="postResult" class="result-box">
+            <h4>响应结果：</h4>
+            <pre>{{ postResult }}</pre>
+          </div>
+        </div>
+
+        <!-- 用户权限部分 -->
+        <div class="request-section">
+          <h3>用户权限获取</h3>
+          <VanButton type="primary" size="small" @click="handleGetPermissions">
+            获取用户权限
+          </VanButton>
+
+          <div v-if="permissionsResult" class="result-box">
+            <h4>API请求权限结果：</h4>
+            <pre>{{ permissionsResult }}</pre>
+          </div>
+
+          <div v-if="storePermissionsResult" class="result-box">
+            <h4>Store缓存权限结果：</h4>
+            <pre>{{ storePermissionsResult }}</pre>
+          </div>
+        </div>
+
+        <!-- 类型定义说明 -->
+        <div class="code-section">
+          <h3>类型定义</h3>
+          <pre>{{ typeDefinitions }}</pre>
+        </div>
+      </VanCellGroup>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.request-view {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+
+.container {
+  flex: 1;
+  padding: 16px;
+  overflow-y: auto;
+}
+
+.request-section {
+  margin: 16px 0;
+  padding: 16px;
+  background-color: #f7f8fa;
+  border-radius: 8px;
+}
+
+.result-box {
+  margin-top: 16px;
+  padding: 12px;
+  background-color: #ffffff;
+  border-radius: 4px;
+  border: 1px solid #ebedf0;
+}
+
+pre {
+  white-space: pre-wrap;
+  word-break: break-all;
+  font-size: 12px;
+  font-family: Consolas, Monaco, monospace;
+  background-color: #f5f7fa;
+  padding: 8px;
+  border-radius: 4px;
+  overflow-x: auto;
+}
+
+.code-section {
+  margin: 16px 0;
+}
+
+h3 {
+  margin: 0 0 12px;
+  font-size: 15px;
+  color: #323233;
+}
+
+h4 {
+  margin: 0 0 8px;
+  font-size: 14px;
+  color: #323233;
+}
+</style>

package/src/views/component/XSignatureView/index.vue

@@ -1,50 +1,50 @@
-<script setup lang="ts">
-import XSignature from '@af-mobile-client-vue3/components/data/XSignature/index.vue'
-import NormalDataLayout from '@af-mobile-client-vue3/components/layout/NormalDataLayout/index.vue'
-import { showToast, Image as VanImage } from 'vant'
-import { ref } from 'vue'
-
-const signatureImage = ref('')
-
-function handleSave() {
-  showToast('签名已保存')
-}
-
-function handleClear() {
-  showToast('签名已清除')
-}
-</script>
-
-<template>
-  <NormalDataLayout title="签名组件">
-    <template #layout_content>
-      基础使用
-      <div class="signature-demo">
-        <XSignature v-model="signatureImage" @save="handleSave" @clear="handleClear" />
-        <div v-if="signatureImage" class="preview">
-          <h3>预览签名</h3>
-          <VanImage v-if="signatureImage" :src="signatureImage" />
-        </div>
-      </div>
-    </template>
-  </NormalDataLayout>
-</template>
-
-<style scoped lang="less">
-.signature-demo {
-  padding: 16px;
-  .preview {
-    margin-top: 20px;
-    h3 {
-      margin: 0 0 10px;
-      font-size: 16px;
-      color: #323233;
-    }
-    img {
-      max-width: 100%;
-      border: 1px solid #ebedf0;
-      border-radius: 8px;
-    }
-  }
-}
-</style>
+<script setup lang="ts">
+import XSignature from '@af-mobile-client-vue3/components/data/XSignature/index.vue'
+import NormalDataLayout from '@af-mobile-client-vue3/components/layout/NormalDataLayout/index.vue'
+import { showToast, Image as VanImage } from 'vant'
+import { ref } from 'vue'
+
+const signatureImage = ref('')
+
+function handleSave() {
+  showToast('签名已保存')
+}
+
+function handleClear() {
+  showToast('签名已清除')
+}
+</script>
+
+<template>
+  <NormalDataLayout title="签名组件">
+    <template #layout_content>
+      基础使用
+      <div class="signature-demo">
+        <XSignature v-model="signatureImage" @save="handleSave" @clear="handleClear" />
+        <div v-if="signatureImage" class="preview">
+          <h3>预览签名</h3>
+          <VanImage v-if="signatureImage" :src="signatureImage" />
+        </div>
+      </div>
+    </template>
+  </NormalDataLayout>
+</template>
+
+<style scoped lang="less">
+.signature-demo {
+  padding: 16px;
+  .preview {
+    margin-top: 20px;
+    h3 {
+      margin: 0 0 10px;
+      font-size: 16px;
+      color: #323233;
+    }
+    img {
+      max-width: 100%;
+      border: 1px solid #ebedf0;
+      border-radius: 8px;
+    }
+  }
+}
+</style>