feat: 优化表格empty显示
自动部署 / build (push) Successful in 1m29s
Details
自动部署 / build (push) Successful in 1m29s
Details
parent
5b8bc70e72
commit
8e80683427
|
|
@ -1,5 +1,5 @@
|
|||
import "axios";
|
||||
import { IToastOptions } from "@/components";
|
||||
import "axios";
|
||||
|
||||
declare module "axios" {
|
||||
interface AxiosRequestConfig {
|
||||
|
|
@ -13,5 +13,13 @@ declare module "axios" {
|
|||
* @private
|
||||
*/
|
||||
closeToast?: () => void;
|
||||
/**
|
||||
* 响应异常提示
|
||||
*/
|
||||
resErrorTip?: boolean | string;
|
||||
/**
|
||||
* 请求异常提示
|
||||
*/
|
||||
reqErrorTip?: boolean | string;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,15 +1,28 @@
|
|||
import { Notification } from "@arco-design/web-vue";
|
||||
import { AxiosInstance } from "axios";
|
||||
import { has, isString } from "lodash-es";
|
||||
|
||||
const successCodes = [2000];
|
||||
const expiredCodes = [4050, 4051];
|
||||
let tipShowing = false;
|
||||
const resMessageTip = `响应异常，请检查参数或稍后重试!`;
|
||||
const reqMessageTip = `请求失败，请检查网络或稍后重试!`;
|
||||
|
||||
let logoutTipShowing = false;
|
||||
|
||||
/**
|
||||
* 异常拦截器
|
||||
* @param axios Axios实例
|
||||
*/
|
||||
export function addExceptionInterceptor(axios: AxiosInstance, exipreHandler?: (...args: any[]) => any) {
|
||||
axios.interceptors.request.use(null, (error) => {
|
||||
const msg = error.response?.data?.message;
|
||||
Notification.error({
|
||||
title: "请求提示",
|
||||
content: msg ?? `发送请求失败，请检查参数或稍后重试!`,
|
||||
});
|
||||
return Promise.reject(error);
|
||||
});
|
||||
|
||||
axios.interceptors.response.use(
|
||||
(res) => {
|
||||
const code = res.data?.code;
|
||||
|
|
@ -23,23 +36,52 @@ export function addExceptionInterceptor(axios: AxiosInstance, exipreHandler?: (.
|
|||
if (error.response) {
|
||||
const code = error.response.data?.code;
|
||||
if (expiredCodes.includes(code)) {
|
||||
Notification.warning({
|
||||
title: "登陆提示",
|
||||
content: "当前登陆已过期，请重新登陆！",
|
||||
if (!logoutTipShowing) {
|
||||
logoutTipShowing = true;
|
||||
Notification.warning({
|
||||
title: "登陆提示",
|
||||
content: "当前登陆已过期，请重新登陆！",
|
||||
onClose: () => (logoutTipShowing = false),
|
||||
});
|
||||
exipreHandler?.(error);
|
||||
}
|
||||
return Promise.reject(error);
|
||||
}
|
||||
const resMsg = error.response?.data?.message;
|
||||
let message: string | null = resMsg ?? resMessageTip;
|
||||
if (has(error.config, "resErrorTip")) {
|
||||
const tip = error.config.resErrorTip;
|
||||
if (tip) {
|
||||
message = isString(tip) ? tip : message;
|
||||
} else {
|
||||
message = null;
|
||||
}
|
||||
}
|
||||
if (message) {
|
||||
Notification.error({
|
||||
title: "请求提示",
|
||||
content: message,
|
||||
});
|
||||
exipreHandler?.(error);
|
||||
}
|
||||
return Promise.reject(error);
|
||||
}
|
||||
|
||||
// 客户端请求错误
|
||||
if (error.request) {
|
||||
if (!tipShowing) {
|
||||
tipShowing = true;
|
||||
const resMsg = error.response?.message;
|
||||
let message: string | null = resMsg ?? reqMessageTip;
|
||||
if (has(error.config, "reqErrorTip")) {
|
||||
const tip = error.config.reqErrorTip;
|
||||
if (tip) {
|
||||
message = isString(tip) ? tip : message;
|
||||
} else {
|
||||
message = null;
|
||||
}
|
||||
}
|
||||
if (message) {
|
||||
Notification.error({
|
||||
title: "请求提示",
|
||||
content: `请求服务器失败，请检查网络或稍后重试!`,
|
||||
onClose: () => (tipShowing = false),
|
||||
content: message,
|
||||
});
|
||||
}
|
||||
return Promise.reject(error);
|
||||
|
|
|
|||
|
|
@ -0,0 +1,106 @@
|
|||
<template>
|
||||
<a-empty>
|
||||
<template #image>
|
||||
<svg
|
||||
height="104"
|
||||
node-id="1"
|
||||
template-height="104"
|
||||
template-width="122"
|
||||
version="1.1"
|
||||
viewBox="0 0 122 104"
|
||||
width="122"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<defs node-id="20"></defs>
|
||||
<g node-id="22">
|
||||
<g node-id="23">
|
||||
<g node-id="24">
|
||||
<g node-id="25">
|
||||
<g node-id="27">
|
||||
<g node-id="29">
|
||||
<path
|
||||
d="M 15.00 82.30 L 14.43 82.07 L 14.20 81.50 L 14.43 80.93 L 15.00 80.70 L 85.00 80.70 L 85.57 80.93 L 85.80 81.50 L 85.57 82.07 L 85.00 82.30 L 15.00 82.30 Z M 89.00 82.30 L 88.43 82.07 L 88.20 81.50 L 88.43 80.93 L 89.00 80.70 L 91.50 80.70 L 92.07 80.93 L 92.30 81.50 L 92.07 82.07 L 91.50 82.30 L 89.00 82.30 Z M 98.00 82.30 L 97.43 82.07 L 97.20 81.50 L 97.43 80.93 L 98.00 80.70 L 107.00 80.70 L 107.57 80.93 L 107.80 81.50 L 107.57 82.07 L 107.00 82.30 L 98.00 82.30 Z M 38.00 89.80 L 37.43 89.57 L 37.20 89.00 L 37.43 88.43 L 38.00 88.20 L 45.00 88.20 L 45.57 88.43 L 45.80 89.00 L 45.57 89.57 L 45.00 89.80 L 38.00 89.80 Z M 49.50 89.80 L 48.93 89.57 L 48.70 89.00 L 48.93 88.43 L 49.50 88.20 L 80.00 88.20 L 80.57 88.43 L 80.80 89.00 L 80.57 89.57 L 80.00 89.80 L 49.50 89.80 Z M 94.20 62.00 L 94.46 61.39 L 95.00 61.20 L 95.54 61.39 L 95.80 62.00 L 95.80 65.00 L 95.57 65.57 L 95.00 65.80 L 92.00 65.80 L 91.39 65.54 L 91.20 65.00 L 91.39 64.46 L 92.00 64.20 L 94.20 64.20 L 94.20 62.00 Z M 95.80 68.00 L 95.54 68.61 L 95.00 68.80 L 94.46 68.61 L 94.20 68.00 L 94.20 65.00 L 94.43 64.43 L 95.00 64.20 L 98.00 64.20 L 98.61 64.46 L 98.80 65.00 L 98.61 65.54 L 98.00 65.80 L 95.80 65.80 L 95.80 68.00 Z M 18.20 38.00 L 18.46 37.39 L 19.00 37.20 L 19.54 37.39 L 19.80 38.00 L 19.80 41.00 L 19.57 41.57 L 19.00 41.80 L 16.00 41.80 L 15.39 41.54 L 15.20 41.00 L 15.39 40.46 L 16.00 40.20 L 18.20 40.20 L 18.20 38.00 Z M 92.30 12.70 L 95.00 12.70 L 95.61 12.96 L 95.80 13.50 L 95.61 14.04 L 95.00 14.30 L 92.30 14.30 L 92.30 17.00 L 92.04 17.61 L 91.50 17.80 L 90.96 17.61 L 90.70 17.00 L 90.70 14.30 L 88.00 14.30 L 87.39 14.04 L 87.20 13.50 L 87.39 12.96 L 88.00 12.70 L 90.70 12.70 L 90.70 10.00 L 90.96 9.39 L 91.50 9.20 L 92.04 9.39 L 92.30 10.00 L 92.30 12.70 Z M 19.80 44.00 L 19.54 44.61 L 19.00 44.80 L 18.46 44.61 L 18.20 44.00 L 18.20 41.00 L 18.43 40.43 L 19.00 40.20 L 22.00 40.20 L 22.61 40.46 L 22.80 41.00 L 22.61 41.54 L 22.00 41.80 L 19.80 41.80 L 19.80 44.00 Z"
|
||||
fill="#c3cbd6"
|
||||
fill-rule="nonzero"
|
||||
group-id="1,2,3,4,6,8"
|
||||
id="Path-2"
|
||||
node-id="13"
|
||||
stroke="none"
|
||||
target-height="80.6"
|
||||
target-width="93.6"
|
||||
target-x="14.2"
|
||||
target-y="9.2"
|
||||
/>
|
||||
<path
|
||||
d="M 28.29 70.34 L 28.68 70.19 L 29.00 70.34 L 29.15 70.67 L 29.00 71.05 L 27.94 72.11 L 27.59 72.26 L 27.23 72.11 L 26.17 71.05 L 26.02 70.67 L 26.17 70.34 L 26.50 70.19 L 26.88 70.34 L 27.59 71.05 L 28.29 70.34 Z M 26.88 73.17 L 26.50 73.33 L 26.17 73.17 L 26.02 72.85 L 26.17 72.46 L 27.23 71.40 L 27.59 71.26 L 27.94 71.40 L 29.00 72.46 L 29.15 72.85 L 29.00 73.17 L 28.68 73.33 L 28.29 73.17 L 27.59 72.46 L 26.88 73.17 Z M 37.12 18.00 L 37.50 17.85 L 37.83 18.00 L 37.98 18.32 L 37.83 18.71 L 36.77 19.77 L 36.41 19.91 L 36.06 19.77 L 35.00 18.71 L 34.85 18.32 L 35.00 18.00 L 35.32 17.85 L 35.71 18.00 L 36.41 18.71 L 37.12 18.00 Z M 35.71 20.83 L 35.32 20.98 L 35.00 20.83 L 34.85 20.50 L 35.00 20.12 L 36.06 19.06 L 36.41 18.91 L 36.77 19.06 L 37.83 20.12 L 37.98 20.50 L 37.83 20.83 L 37.50 20.98 L 37.12 20.83 L 36.41 20.12 L 35.71 20.83 Z"
|
||||
fill="#c3cbd6"
|
||||
fill-rule="nonzero"
|
||||
group-id="1,2,3,4,6,8"
|
||||
id="Path复制"
|
||||
node-id="14"
|
||||
stroke="none"
|
||||
target-height="55.480774"
|
||||
target-width="11.966061"
|
||||
target-x="26.016972"
|
||||
target-y="17.845398"
|
||||
/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<g node-id="26">
|
||||
<path
|
||||
d="M 45.00 35.00 L 77.00 35.00 L 78.18 35.24 L 79.12 35.88 L 79.76 36.82 L 80.00 38.00 L 80.00 71.00 L 79.76 72.18 L 79.12 73.12 L 78.18 73.76 L 77.00 74.00 L 45.00 74.00 L 43.82 73.76 L 42.88 73.12 L 42.24 72.18 L 42.00 71.00 L 42.00 38.00 L 42.24 36.82 L 42.88 35.88 L 43.82 35.24 L 45.00 35.00 Z"
|
||||
fill="#ffffff"
|
||||
fill-rule="evenodd"
|
||||
group-id="1,2,3,5"
|
||||
id="矩形"
|
||||
node-id="16"
|
||||
stroke="#c3cbd6"
|
||||
stroke-linecap="butt"
|
||||
stroke-width="1.6"
|
||||
target-height="39"
|
||||
target-width="38"
|
||||
target-x="42"
|
||||
target-y="35"
|
||||
/>
|
||||
<path
|
||||
d="M 57.00 33.00 L 57.64 32.85 L 58.16 32.48 L 59.05 31.52 L 59.50 31.14 L 60.00 31.00 L 62.00 31.00 L 62.51 31.14 L 62.99 31.52 L 63.91 32.48 L 64.42 32.85 L 65.00 33.00 L 68.00 33.00 L 68.78 33.16 L 69.41 33.59 L 69.84 34.22 L 70.00 35.00 L 70.00 36.00 L 69.84 36.78 L 69.41 37.41 L 68.78 37.84 L 68.00 38.00 L 54.00 38.00 L 53.22 37.84 L 52.59 37.41 L 52.16 36.78 L 52.00 36.00 L 52.00 35.00 L 52.16 34.22 L 52.59 33.59 L 53.22 33.16 L 54.00 33.00 L 57.00 33.00 Z"
|
||||
fill="#f5f7f9"
|
||||
fill-rule="evenodd"
|
||||
group-id="1,2,3,5"
|
||||
id="路径"
|
||||
node-id="17"
|
||||
stroke="#c3cbd6"
|
||||
stroke-linecap="butt"
|
||||
stroke-width="1.6"
|
||||
target-height="7"
|
||||
target-width="18"
|
||||
target-x="52"
|
||||
target-y="31"
|
||||
/>
|
||||
<g node-id="28">
|
||||
<path
|
||||
d="M 50.83 52.09 L 54.72 55.13 L 50.83 52.09 Z M 60.61 48.15 L 60.63 53.16 L 60.61 48.15 Z M 70.41 51.75 L 66.50 54.95 L 70.41 51.75 Z"
|
||||
fill="none"
|
||||
group-id="1,2,3,5,7"
|
||||
id="路径-7"
|
||||
node-id="18"
|
||||
stroke="#c3cad7"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
target-height="6.9805374"
|
||||
target-width="19.58184"
|
||||
target-x="50.827675"
|
||||
target-y="48.147778"
|
||||
/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
</template>
|
||||
</a-empty>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts"></script>
|
||||
|
|
@ -1,6 +1,7 @@
|
|||
import { TableColumnData as BaseColumn, TableData as BaseData, Table as BaseTable } from "@arco-design/web-vue";
|
||||
import { merge } from "lodash-es";
|
||||
import { PropType, computed, defineComponent, reactive, ref } from "vue";
|
||||
import AniEmpty from "../empty/index.vue";
|
||||
import { Form, FormInstance, FormModal, FormModalInstance, FormModalProps, FormProps } from "../form";
|
||||
import { config } from "./table.config";
|
||||
|
||||
|
|
@ -110,6 +111,8 @@ export const Table = defineComponent({
|
|||
renderData.value = data;
|
||||
props.pagination.total = total;
|
||||
props.pagination.current = paging.page;
|
||||
} catch (e) {
|
||||
// todo
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
|
|
@ -188,7 +191,11 @@ export const Table = defineComponent({
|
|||
data={this.renderData}
|
||||
columns={this.columns}
|
||||
onPageChange={(current: number) => this.loadData({ current })}
|
||||
></BaseTable>
|
||||
>
|
||||
{{
|
||||
empty: () => <AniEmpty />,
|
||||
}}
|
||||
</BaseTable>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ export interface IToastOptions {
|
|||
mask?: boolean;
|
||||
/**
|
||||
* 是否覆盖窗口(即不允许其他操作)
|
||||
* @default false
|
||||
* @default true
|
||||
*/
|
||||
cover?: boolean;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -27,7 +27,7 @@ const props = defineProps({
|
|||
},
|
||||
mask: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
default: true,
|
||||
},
|
||||
cover: {
|
||||
type: Boolean,
|
||||
|
|
|
|||
|
|
@ -67,6 +67,7 @@ declare module '@vue/runtime-core' {
|
|||
ColorPicker: typeof import('./../components/editor/components/ColorPicker.vue')['default']
|
||||
DragResizer: typeof import('./../components/editor/components/DragResizer.vue')['default']
|
||||
Editor: typeof import('./../components/editor/index.vue')['default']
|
||||
Empty: typeof import('./../components/empty/index.vue')['default']
|
||||
Header: typeof import('./../components/editor/panel-main/components/header.vue')['default']
|
||||
ImagePicker: typeof import('./../components/editor/components/ImagePicker.vue')['default']
|
||||
InputColor: typeof import('./../components/editor/components/InputColor.vue')['default']
|
||||
|
|
|
|||
|
|
@ -1,2 +1,8 @@
|
|||
export * from "./delConfirm";
|
||||
|
||||
/**
|
||||
* 暂停一段时间
|
||||
* @param ms 时长(毫秒)
|
||||
* @returns
|
||||
*/
|
||||
export const sleep = (ms: number) => new Promise(res => setTimeout(res, ms))
|
||||
Loading…
Reference in New Issue