mirror of
https://github.com/chansee97/nova-admin.git
synced 2025-04-06 03:57:54 +08:00
fix: delete plugin/fetch
This commit is contained in:
chansee97
parent
187c26832c
commit
61bbdedec1
@ -1,249 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import { useRequest } from 'alova'
|
||||
import {
|
||||
FailedRequest,
|
||||
FailedResponse,
|
||||
FailedResponseWithoutTip,
|
||||
dictData,
|
||||
downloadFile,
|
||||
expiredTokenRequest,
|
||||
fetchDelete,
|
||||
fetchFormPost,
|
||||
fetchGet,
|
||||
fetchPost,
|
||||
fetchPut,
|
||||
fetchUpdateToken,
|
||||
getBlob,
|
||||
withoutToken,
|
||||
} from '@/service'
|
||||
|
||||
const msg = ref()
|
||||
const { data: fetchGetData, send: sendFetchGet } = useRequest(fetchGet({ a: 112211 }), {
|
||||
// 当immediate为false时，默认不发出
|
||||
immediate: false,
|
||||
})
|
||||
|
||||
function handleRequestHook() {
|
||||
sendFetchGet()
|
||||
msg.value = fetchGetData.value
|
||||
}
|
||||
function pinterEnv() {
|
||||
msg.value = import.meta.env
|
||||
}
|
||||
async function get() {
|
||||
const res = await fetchGet({ a: 112211, b: false })
|
||||
msg.value = res
|
||||
}
|
||||
function delete2() {
|
||||
fetchDelete().then((res) => {
|
||||
msg.value = res
|
||||
})
|
||||
}
|
||||
function post() {
|
||||
const params = {
|
||||
data: '2022-2-2',
|
||||
data1: [],
|
||||
data2: {},
|
||||
data3: '',
|
||||
data4: null,
|
||||
data5: undefined,
|
||||
}
|
||||
fetchPost(params).then((res) => {
|
||||
msg.value = res
|
||||
})
|
||||
}
|
||||
|
||||
function formPost() {
|
||||
const params = {
|
||||
data: '2022-2-2',
|
||||
}
|
||||
fetchFormPost(params).then((res) => {
|
||||
msg.value = res
|
||||
})
|
||||
}
|
||||
function put() {
|
||||
const params = {
|
||||
data: '2022-2-2',
|
||||
}
|
||||
fetchPut(params).then((res) => {
|
||||
msg.value = res
|
||||
})
|
||||
}
|
||||
|
||||
// 测试请求失败
|
||||
function failedRequest() {
|
||||
FailedRequest().then((res) => {
|
||||
msg.value = res
|
||||
})
|
||||
}
|
||||
// 测试业务失败
|
||||
function failedResponse() {
|
||||
FailedResponse().then((res) => {
|
||||
msg.value = res
|
||||
})
|
||||
}
|
||||
// 测试无提示的业务失败
|
||||
function failedResponseWithoutTip() {
|
||||
FailedResponseWithoutTip().then((res) => {
|
||||
msg.value = res
|
||||
})
|
||||
}
|
||||
// token过期
|
||||
function expiredToken() {
|
||||
expiredTokenRequest().then((res) => {
|
||||
msg.value = res
|
||||
})
|
||||
}
|
||||
// 刷新token
|
||||
function updataToken() {
|
||||
fetchUpdateToken('test token').then((res) => {
|
||||
msg.value = res
|
||||
})
|
||||
}
|
||||
// 不携带token的接口
|
||||
function withoutTokenRequest() {
|
||||
withoutToken().then((res) => {
|
||||
msg.value = res
|
||||
})
|
||||
}
|
||||
// 不携带token的接口
|
||||
function getDictData() {
|
||||
dictData().then((res) => {
|
||||
msg.value = res
|
||||
})
|
||||
}
|
||||
// 模拟获取二进制文件
|
||||
const imagePath = ref('https://images.unsplash.com/photo-1663529628961-80aa6ebcd157?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=764&q=80')
|
||||
function getBlobFile() {
|
||||
getBlob(imagePath.value).then((res) => {
|
||||
msg.value = 'this is blob!'
|
||||
const link = URL.createObjectURL(res)
|
||||
const eleLink = document.createElement('a')
|
||||
eleLink.download = 'okk'
|
||||
eleLink.style.display = 'none'
|
||||
eleLink.href = link
|
||||
document.body.appendChild(eleLink)
|
||||
eleLink.click()
|
||||
document.body.removeChild(eleLink)
|
||||
})
|
||||
}
|
||||
// 下载大文件获取进度
|
||||
const downloadPath = ref('https://suqiqi.oss-cn-beijing.aliyuncs.com/test/video/1.mp4')
|
||||
const { downloading, abort: abortDownloadFile, send: sendDownloadFile } = useRequest(downloadFile(downloadPath.value), {
|
||||
// 当immediate为false时，默认不发出
|
||||
immediate: false,
|
||||
})
|
||||
const downloadProcess = computed(() => {
|
||||
if (!downloading.value.loaded)
|
||||
return 0
|
||||
return Math.floor(downloading.value.loaded / downloading.value.total * 100)
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<n-card title="网络请求示例">
|
||||
<n-space vertical :size="12">
|
||||
<pre class="bg-#eee">
|
||||
{{ msg }}
|
||||
</pre>
|
||||
<n-descriptions label-placement="left" bordered>
|
||||
<n-descriptions-item label="检查环境变量">
|
||||
<n-button strong secondary type="success" @click="pinterEnv">
|
||||
click
|
||||
</n-button>
|
||||
</n-descriptions-item>
|
||||
<n-descriptions-item label="Get">
|
||||
<n-button strong secondary type="success" @click="get">
|
||||
click
|
||||
</n-button>
|
||||
</n-descriptions-item>
|
||||
<n-descriptions-item label="Post">
|
||||
<n-button strong secondary type="success" @click="post">
|
||||
click
|
||||
</n-button>
|
||||
</n-descriptions-item>
|
||||
<n-descriptions-item label="formPost">
|
||||
<n-button strong secondary type="success" @click="formPost">
|
||||
click
|
||||
</n-button>
|
||||
</n-descriptions-item>
|
||||
<n-descriptions-item label="Delete">
|
||||
<n-button strong secondary type="success" @click="delete2">
|
||||
click
|
||||
</n-button>
|
||||
</n-descriptions-item>
|
||||
<n-descriptions-item label="Put">
|
||||
<n-button strong secondary type="success" @click="put">
|
||||
click
|
||||
</n-button>
|
||||
</n-descriptions-item>
|
||||
<n-descriptions-item label="useRequest风格">
|
||||
<n-button strong secondary type="success" @click="handleRequestHook">
|
||||
click
|
||||
</n-button>
|
||||
</n-descriptions-item>
|
||||
<n-descriptions-item label="不带token的接口">
|
||||
<n-button strong secondary type="success" @click="withoutTokenRequest">
|
||||
click
|
||||
</n-button>
|
||||
</n-descriptions-item>
|
||||
<n-descriptions-item label="获取文件下载">
|
||||
<n-button strong secondary type="success" @click="getBlobFile">
|
||||
click
|
||||
</n-button>
|
||||
</n-descriptions-item>
|
||||
<n-descriptions-item label="带进度的下载文件" :span="3">
|
||||
<n-space vertical>
|
||||
<n-input v-model:value="downloadPath" />
|
||||
<div>文件大小：{{ downloading.total }}B</div>
|
||||
<div>已下载：{{ downloading.loaded }}B</div>
|
||||
<n-progress type="line" indicator-placement="inside" :percentage="downloadProcess" />
|
||||
<n-space>
|
||||
<n-button strong secondary @click="sendDownloadFile">
|
||||
开始下载
|
||||
</n-button>
|
||||
<n-button strong secondary type="warning" @click="abortDownloadFile">
|
||||
中断下载
|
||||
</n-button>
|
||||
</n-space>
|
||||
</n-space>
|
||||
</n-descriptions-item>
|
||||
<n-descriptions-item label="转换请求数据">
|
||||
<n-button strong secondary type="success" @click="getDictData">
|
||||
click
|
||||
</n-button>
|
||||
</n-descriptions-item>
|
||||
<n-descriptions-item label="失败-错误状态码">
|
||||
<n-button strong secondary type="error" @click="failedRequest">
|
||||
click
|
||||
</n-button>
|
||||
</n-descriptions-item>
|
||||
<n-descriptions-item label="失败-错误业务码">
|
||||
<n-button strong secondary type="error" @click="failedResponse">
|
||||
click
|
||||
</n-button>
|
||||
</n-descriptions-item>
|
||||
<n-descriptions-item label="失败-错误业务码(无提示)">
|
||||
<n-button strong secondary type="error" @click="failedResponseWithoutTip">
|
||||
click
|
||||
</n-button>
|
||||
</n-descriptions-item>
|
||||
<n-descriptions-item label="401-token过期">
|
||||
<n-button strong secondary @click="expiredToken">
|
||||
click
|
||||
</n-button>
|
||||
</n-descriptions-item>
|
||||
<n-descriptions-item label="refresh token">
|
||||
<n-button strong secondary @click="updataToken">
|
||||
click
|
||||
</n-button>
|
||||
</n-descriptions-item>
|
||||
</n-descriptions>
|
||||
<n-alert title="关于401-token失效刷新" type="warning">
|
||||
请在控制台将网络速率设置为最低（1kb左右）后点击查看，否则会造成请求大量发送
|
||||
</n-alert>
|
||||
</n-space>
|
||||
</n-card>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
Loading…
x
Reference in New Issue
Block a user