+ Current copied: {{ text || 'none' }}
+
+ {{ response }}
+
+ 1.转到登录页,登录成功后跳转回原页面
++ 2.弹出重新登录弹窗,登录后关闭弹窗,不进行任何页面跳转(刷新后还是会跳转登录页面) +
+{{ response }}
+ {{ paramsStr }}
+ {{ decodeURIComponent(paramsStr) }}
+ 当前页: {{ page }}
+ +重试次数{{ count }}
+{{ error }}
+ diff --git a/admin/apps/web-antd/src/views/demos/features/vue-query/typing.ts b/admin/apps/web-antd/src/views/demos/features/vue-query/typing.ts new file mode 100644 index 00000000..95558dd8 --- /dev/null +++ b/admin/apps/web-antd/src/views/demos/features/vue-query/typing.ts @@ -0,0 +1,18 @@ +export interface IProducts { + limit: number; + products: { + brand: string; + category: string; + description: string; + discountPercentage: string; + id: string; + images: string[]; + price: string; + rating: string; + stock: string; + thumbnail: string; + title: string; + }[]; + skip: number; + total: number; +} diff --git a/admin/apps/web-antd/src/views/demos/features/watermark/index.vue b/admin/apps/web-antd/src/views/demos/features/watermark/index.vue new file mode 100644 index 00000000..77b3f179 --- /dev/null +++ b/admin/apps/web-antd/src/views/demos/features/watermark/index.vue @@ -0,0 +1,86 @@ + + + +按钮组:
+单选:{{ radioValue }}
+单选插槽:{{ radioValue }}
+多选{{ checkValue }}
+自定义图标{{ checkValue }}
+一个基础的抽屉示例
+ + + + + +指定抽屉在内容区域打开,不会覆盖顶部和左侧菜单等区域
+ + + + + +可根据内容自动计算滚动高度
+ +通过 setState 动态调整抽屉数据
+ + +通过共享 sharedData 来进行数据交互
+ +打开抽屉并设置表单schema以及数据
+ ++ 表单组件基础示例,请注意,该页面用到的参数代码会添加一些简单注释,方便理解,请仔细查看。 +
+使用tailwind自定义表单项的布局,使用Divider分割表单。
+• validateAndSubmitForm(): 验证表单并提交
+• validate(): 手动验证整个表单
+• validateField(): 验证单个字段(这里测试用户名字段)
+• 填充部分数据后验证,会滚动到第一个错误字段
+这里是左侧内容
+这里是左侧内容
+这里是左侧内容
+这里是左侧内容
+这里是左侧内容
++ 双列布局组件是一个在Page组件上扩展的相对基础的布局组件,支持左侧折叠(当拖拽导致左侧宽度比最小宽度还要小时,还可以进入折叠状态)、拖拽调整宽度等功能。 +
+以上宽度设置的数值是百分比,最小值为1,最大值为100。
++ 这是一个实验性的组件,用法可能会发生变动,也可能最终不会被采用。在其用法正式出现在文档中之前,不建议在生产环境中使用。 +
+ +调整滑块来改变遮罩层模糊程度:{{ blur }}
+一个基础的弹窗示例
+ + + +在内容区域打开弹窗的示例
+ + + +可根据内容并自动调整高度
+ + + +配置 draggable 可开启拖拽功能
+ + + +通过 setState 动态调整弹窗数据
+ + + + + + +通过共享 sharedData 来进行数据交互
+ + + +弹窗与表单结合
+ + + +在已经打开的弹窗中再次打开弹窗
+ + + +遮罩层应用类似毛玻璃的模糊效果
+ + + +通过快捷方法创建动态提示弹窗,适合一些轻量的提示和确认、输入等
+ + + + + ++ Tippy + 是一个轻量级的提示工具库,它可以用来创建各种交互式提示,如工具提示、引导提示等。 +
+ ++ 指令形式使用比较简洁,直接在需要展示tooltip的组件上用v-tippy传递配置,适用于固定内容的工具提示。 +
++ 更多配置请 + + ,这里只列出了一些常用的配置 +
+ +