rxthinkcmf/rxthinkcmf-wiki
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

签入版本

Browse Source
This commit is contained in:
gitadmin
2026-10-10 19:17:02 +08:00
parent 3423dea03f
commit 32f941b631
232 changed files with 4264 additions and 6251 deletions
Download Patch File Download Diff File Expand all files Collapse all files
RXThinkCMF_ThinkPhp8_NaiveVue/zh/api-spec/dict-api.md
+5 -8
View File
@@ -128,14 +128,11 @@ export function getDictItemList(code: string) {
```vue
<template>
<el-select v-model="formData.status" placeholder="请选择状态">
<el-option
v-for="item in statusOptions"
:key="item.value"
:label="item.name"
:value="item.value"
/>
</el-select>
<n-select
v-model:value="formData.status"
:options="statusOptions"
placeholder="请选择状态"
/>
</template>
<script setup>
RXThinkCMF_ThinkPhp8_NaiveVue/zh/api-spec/error-code.md
+7 -3
View File
@@ -52,7 +52,11 @@
## 前端错误处理
```typescript
// Axios 响应拦截器
// Axios 响应拦截器（src/utils/http/axios/index.ts）
import { useMessage } from '@/hooks/web/useMessage';
const $message = useMessage();
axios.interceptors.response.use(response => {
const { code, msg, data } = response.data;
@@ -67,12 +71,12 @@ axios.interceptors.response.use(response => {
}
if (code === 403) {
ElMessage.error(msg || '无权限');
$message.error(msg || '无权限');
return;
}
// 其他错误
ElMessage.error(msg || '操作失败');
$message.error(msg || '操作失败');
return Promise.reject(new Error(msg));
});
```
RXThinkCMF_ThinkPhp8_NaiveVue/zh/api-spec/response.md
+12 -5
View File
@@ -253,6 +253,9 @@ $this->fail('缺少id参数', 1);
```typescript
// src/utils/http/axios/index.ts
import { useMessage } from '@/hooks/web/useMessage';
const $message = useMessage();
axios.interceptors.response.use(
response => {
@@ -272,16 +275,16 @@ axios.interceptors.response.use(
// 权限不足
if (code === 403) {
ElMessage.error(msg || '无访问权限');
$message.error(msg || '无访问权限');
return Promise.reject(new Error(msg));
}
// 其他业务错误
ElMessage.error(msg || '操作失败');
$message.error(msg || '操作失败');
return Promise.reject(new Error(msg));
},
error => {
ElMessage.error('网络错误');
$message.error('网络错误');
return Promise.reject(error);
}
);
@@ -301,13 +304,17 @@ const fetchData = async () => {
### 处理导入结果
```typescript
import { useMessage } from 'naive-ui';
const message = useMessage();
const handleImport = async (file) => {
const res = await importUsers(file);
// res = { count: 8, errors: [{ row: 3, reason: "..." }] }
if (res.errors.length === 0) {
ElMessage.success(`成功导入 ${res.count} 条`);
message.success(`成功导入 ${res.count} 条`);
} else {
ElMessage.warning(`成功 ${res.count} 条，失败 ${res.errors.length} 条`);
message.warning(`成功 ${res.count} 条，失败 ${res.errors.length} 条`);
}
};
```
RXThinkCMF_ThinkPhp8_NaiveVue/zh/api-spec/upload.md
+45 -37
View File
@@ -95,51 +95,65 @@ gif, jpg, jpeg, png, bmp, webp, svg
## 前端使用
### Element Plus Upload 组件
### NaiveUI 上传组件
```vue
<template>
<!-- 上传文件（默认 type=file） -->
<el-upload
<n-upload
:action="'/api/upload/uploadFile'"
:headers="{ Authorization: `Bearer ${token}` }"
:on-success="handleUploadSuccess"
:before-upload="beforeUpload"
:headers="uploadHeaders"
@before-upload="beforeUpload"
@change="handleUploadChange"
>
<el-button type="primary">上传文件</el-button>
</el-upload>
<n-button type="primary">上传文件</n-button>
</n-upload>
<!-- 上传图片（指定 type=image） -->
<el-upload
<n-upload
:action="'/api/upload/uploadFile?type=image'"
:headers="{ Authorization: `Bearer ${token}` }"
:on-success="handleImageSuccess"
:headers="uploadHeaders"
accept="image/*"
@change="handleImageChange"
>
<el-button type="primary">上传图片</el-button>
</el-upload>
<n-button type="primary">上传图片</n-button>
</n-upload>
</template>
<script setup>
import { useMessage } from 'naive-ui';
const message = useMessage();
const token = localStorage.getItem('access_token');
const uploadHeaders = { Authorization: `Bearer ${token}` };
const beforeUpload = (file) => {
const isLt10M = file.size / 1024 / 1024 < 10;
const beforeUpload = ({ file }) => {
const isLt10M = file.file.size / 1024 / 1024 < 10;
if (!isLt10M) {
ElMessage.error('文件大小不能超过 10MB');
message.error('文件大小不能超过 10MB');
return false;
}
return isLt10M;
return true;
};
const handleUploadSuccess = (response) => {
if (response.code === 0) {
form.value.file = response.data.fileUrl;
// 上传结束，解析响应
const parseResponse = (data) => {
if (data.code === 0) {
return data.data.fileUrl;
}
message.error(data.msg || '上传失败');
return null;
};
const handleUploadChange = (data) => {
if (data.file.status === 'finished') {
form.value.file = parseResponse(JSON.parse(data.file.event.target.response));
}
};
const handleImageSuccess = (response) => {
if (response.code === 0) {
form.value.avatar = response.data.fileUrl;
const handleImageChange = (data) => {
if (data.file.status === 'finished') {
form.value.avatar = parseResponse(JSON.parse(data.file.event.target.response));
}
};
</script>
@@ -189,25 +203,19 @@ await exampleAdd({
```vue
<template>
<div class="avatar-upload">
<el-avatar :src="form.avatar" :size="80" />
<el-upload
:action="'/api/upload/uploadFile?type=image'"
:headers="{ Authorization: `Bearer ${token}` }"
:show-file-list="false"
:on-success="handleAvatarSuccess"
accept="image/*"
>
<el-button size="small">更换头像</el-button>
</el-upload>
<n-avatar :src="form.avatar" :size="80" />
<UploadImg
v-model:image-url="form.avatar"
:fileType="['image/jpeg', 'image/png', 'image/jpg', 'image/gif']"
:fileSize="10"
/>
</div>
</template>
<script setup>
const form = ref({ avatar: '' });
import { UploadImg } from '@/components/Upload';
const handleAvatarSuccess = (response) => {
form.value.avatar = response.data.fileUrl;
};
const form = ref({ avatar: '' });
</script>
```
@@ -234,7 +242,7 @@ BaseLogic::add()
```ini
; .env
[FILE]
UPLOAD_DIR = D:/uploads/rxthinkcmf ; 上传根目录
UPLOAD_DIR = D:\xampp8.2\htdocs\RXThinkCMF_ThinkPhp6_NaiveVue\uploads ; 上传根目录
DOMAIN_URL = https://cdn.example.com ; 文件访问域名
MAX_SIZE = 10 ; 单文件最大 10MB
IMAGE_EXT = jpg,jpeg,png,gif,bmp,webp,svg