admin/wot-design-uni
1
0
Fork 0
mirror of https://gitee.com/wot-design-uni/wot-design-uni.git synced 2025-12-06 17:18:40 +08:00
Code Issues Packages Projects Releases Wiki Activity

docs: ✏️ 添加优秀案例页面

Browse Source
This commit is contained in:
Moonofweisheng 2025-02-27 12:55:51 +08:00
parent b1e1db3fae
commit ef7c98bffb
14 changed files with 108 additions and 123 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.github/ISSUE_TEMPLATE/1-bug-report.yml vendored
View File

@ -7,7 +7,7 @@ body:
attributes:
value: |
在向我们提交 Bug 报告前，请优先使用以下方式尝试解决问题：
- 在组件文档 [wot-design-uni](https://wot-design-uni.pages.dev/) 确认使用方法是否正确
- 在组件文档 [wot-design-uni](https://wot-design-uni.cn/) 确认使用方法是否正确
- 尝试在 [Issue](https://github.com/Moonofweisheng/wot-design-uni/issues) 列表中搜索相同问题
- 如果不是反馈 Bug，请到 [Discussions 讨论区](https://github.com/Moonofweisheng/wot-design-uni/discussions) 发帖。

24
README.md
View File

@ -63,27 +63,29 @@
扫描二维码访问演示，注意：因微信审核机制限制，当前的微信小程序示例可能不是最新版本，可以 clone 代码到本地预览。
<p style="display:flex;gap:24px">
<img src="https://wot-design-uni.pages.dev/wx.jpg" width="200" height="200"/>
<img src="https://wot-design-uni.pages.dev/alipay.png" width="200" height="200" />
<img src="https://wot-design-uni.pages.dev/h5.png" width="200" height="200" />
<img src="https://wot-design-uni.pages.dev/android.png" width="200" height="200" />
<img src="https://wot-design-uni.cn/wx.jpg" width="200" height="200"/>
<img src="https://wot-design-uni.cn/alipay.png" width="200" height="200" />
<img src="https://wot-design-uni.cn/h5.png" width="200" height="200" />
<img src="https://wot-design-uni.cn/android.png" width="200" height="200" />
</p>
## 快速上手
详细说明见 [快速上手](https://wot-design-uni.pages.dev/guide/quick-use.html)。
详细说明见 [快速上手](https://wot-design-uni.cn/guide/quick-use.html)。
## 链接
- [常见问题](https://wot-design-uni.pages.dev/guide/common-problems.html)
- [更新日志](https://wot-design-uni.pages.dev/guide/changelog.html)
- [常见问题](https://wot-design-uni.cn/guide/common-problems.html)
- [更新日志](https://wot-design-uni.cn/guide/changelog.html)
- [Discussions 讨论区](https://github.com/Moonofweisheng/wot-design-uni/discussions)
- [QQ 群](https://wot-design-uni.pages.dev/guide/join-group.html)
- [QQ 群](https://wot-design-uni.cn/guide/join-group.html)
## 优秀案例
我们非常欢迎大家一起贡献优秀的 Demo 与案例，欢迎在此 [issue](https://github.com/Moonofweisheng/wot-design-uni/issues/16) 提交案例。
[这里](https://wot-design-uni.cn/guide/cases.html)我们收集了一些优秀的案例，欢迎大家体验！
我们也非常欢迎大家一起贡献优秀的 Demo 与案例，欢迎在此 [issue](https://github.com/Moonofweisheng/wot-design-uni/issues/16) 提交案例。
## 周边生态
@ -130,8 +132,8 @@
### 扫码捐赠
<p>
<img src="https://wot-design-uni.pages.dev/weixinQrcode.jpg" width="200" height="200" style="margin-right:30px"/>
<img src="https://wot-design-uni.pages.dev/alipayQrcode.jpg" width="200" height="200" />
<img src="https://wot-design-uni.cn/weixinQrcode.jpg" width="200" height="200" style="margin-right:30px"/>
<img src="https://wot-design-uni.cn/alipayQrcode.jpg" width="200" height="200" />
</p>
## 鸣谢

16
docs/.vitepress/config.mts
View File

@ -1,10 +1,10 @@
/*
* @Author: weisheng
* @Date: 2023-07-27 10:26:09
* @LastEditTime: 2025-02-23 15:56:46
* @LastEditTime: 2025-02-27 12:47:41
* @LastEditors: weisheng
* @Description:
* @FilePath: /wot-design-uni/docs/.vitepress/config.mts
* @FilePath: \wot-design-uni\docs\.vitepress\config.mts
* 记得注释
*/
import { defineConfig } from 'vitepress';
@ -122,6 +122,9 @@ export default defineConfig({
}, {
text: '更新日志',
link: '/guide/changelog',
},{
text: '⭐ 案例',
link: '/guide/cases',
},{
text: '加群沟通',
link: '/guide/join-group',
@ -186,6 +189,9 @@ export default defineConfig({
{
text: '更新日志',
link: '/guide/changelog',
},{
text: '⭐ 案例',
link: '/guide/cases',
},{
text: '加群沟通',
link: '/guide/join-group',
@ -199,11 +205,7 @@ export default defineConfig({
{
text: '榜上有名',
link: '/reward/donor',
},
{
text: '🤖 生活小工具',
link: '/reward/living',
},
}
],
'/component/': [

66
docs/guide/cases.md Normal file
View File

@ -0,0 +1,66 @@
# 案例
我们非常欢迎大家一起贡献优秀的 Demo 与案例，欢迎在此 [issue](https://github.com/Moonofweisheng/wot-design-uni/issues/16) 提交案例。
Wot UI 已被很多公司和团队在生产环境使用，下面是一些优秀的案例：
<div class="cases-container">
<el-card shadow="hover">
<template #header>
<span class="case-title">调剂宝</span>
</template>
<el-image src="/cases/tiaojibao.jpg" />
</el-card>
<el-card shadow="hover">
<template #header>
<span class="case-title">BodyLang体态评估</span>
</template>
<el-image src="/cases/BodyLang.png" />
</el-card>
<el-card shadow="hover">
<template #header>
<span class="case-title">尘才咨询</span>
</template>
<el-image src="/cases/chencaizixun.png" />
</el-card>
<el-card shadow="hover">
<template #header>
<span class="case-title">日常计数器</span>
</template>
<el-image src="/cases/richangjishuqi.jpg" />
</el-card>
<el-card shadow="hover">
<template #header>
<span class="case-title">蜗趣记账</span>
</template>
<el-image src="/cases/woqujizhang.jpg" />
</el-card>
<el-card shadow="hover">
<template #header>
<span class="case-title">薪资速算器</span>
</template>
<el-image src="/cases/salary-calculator.jpg" />
</el-card>
</div>
<style scoped>
.cases-container {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
gap: 20px;
margin: 20px 0;
}
.case-title {
font-size: 18px;
font-weight: 500;
}
:deep(.el-card__body .el-image) {
width: 100%;
border-radius: 4px;
}
</style>
<script setup>
</script>

19
docs/guide/introduction.md
View File

@ -45,21 +45,9 @@
- [更新日志](/guide/changelog)
- [常见问题](/guide/common-problems)
- [Discussions 讨论区](https://github.com/Moonofweisheng/wot-design-uni/discussions)
- [QQ 群](/guide/join-group.html)
- [互助交流群](/guide/join-group.html)
- [优秀案例](/guide/cases)
## 优秀案例
我们非常欢迎大家一起贡献优秀的 Demo 与案例，欢迎在此 [issue](https://github.com/Moonofweisheng/wot-design-uni/issues/16) 提交案例。
<el-card style="max-width: 250px" shadow="hover">
<template #header>
<span style=" font-size:18px;font-wight:500">薪资速算器</span>
</template>
<el-image
:src="salaryCalculator"
style="width: 100%"
/>
</el-card>
## 赞助我们
@ -67,7 +55,7 @@
捐赠后您的昵称、留言等将会展示在[捐赠榜单](/reward/donor.html)中。
## 周边生态
## 生态推荐
| 项目 | 描述 |
| ----------------------------------------------------------------------------------------------------------- | ---------------------------------------------------- |
@ -97,5 +85,4 @@ import WxQrcode from '/wx.jpg'
import AlipayQrcode from '/alipay.png'
import H5Qrcode from '/h5.png'
import AndroidQrcode from '/android.png'
import salaryCalculator from '/salary-calculator.jpg'
</script>

7
docs/index.md
View File

@ -24,10 +24,9 @@ hero:
- theme: brand
text: 🥤一杯咖啡
link: /reward/reward
- theme: brand
text: 🤖 生活小工具
link: /reward/living
- theme: alt
text: ⭐ 优秀案例
link: /guide/cases
features:
- icon: 🎯

BIN
docs/public/cases/BodyLang.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 90 KiB

BIN
docs/public/cases/chencaizixun.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 96 KiB

BIN
docs/public/cases/richangjishuqi.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 44 KiB

0
docs/public/salary-calculator.jpg → docs/public/cases/salary-calculator.jpg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 47 KiB

After

Width:  |  Height:  |  Size: 47 KiB

BIN
docs/public/cases/tiaojibao.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 79 KiB

BIN
docs/public/cases/woqujizhang.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 82 KiB

73
docs/reward/living.md
View File

@ -1,73 +0,0 @@
# 🤖 生活小工具
本章节提供了一些工作、生活中常用的一些小工具，大家可以使用，也是对我们的支持。
如果对您有帮助，可以点赞转发给朋友，谢谢！
## 工具列表
<div class="tools-container">
<el-card class="tool-card" shadow="hover">
<template #header>
<span class="tool-title">薪资速算器</span>
</template>
<el-image
:src="salaryCalculator"
class="tool-image"
/>
</el-card>
<el-card class="tool-card" shadow="hover">
<template #header>
<span class="tool-title">调剂宝——福利码：uh3p</span>
</template>
<el-image
:src="tiaojiHelper"
class="tool-image"
/>
<div class="tool-desc">
2025考研调剂必备神器，助你把握每一个调剂机会！
<el-link type="primary" href="/ads/tiaojibao.html" target="_blank">查看详情</el-link>
</div>
</el-card>
</div>
<style>
.tools-container {
display: flex;
flex-wrap: wrap;
gap: 20px;
margin: 20px 0;
}
.tool-card {
flex: 0 0 250px;
transition: all 0.3s;
}
.tool-card:hover {
transform: translateY(-5px);
}
.tool-title {
font-size: 18px;
font-weight: 500;
}
.tool-image {
width: 100%;
border-radius: 4px;
}
.tool-desc {
margin-top: 12px;
font-size: 14px;
color: #666;
line-height: 1.6;
}
</style>
<script setup>
import salaryCalculator from '/salary-calculator.jpg'
import tiaojiHelper from '/tiaojibao.png'
</script>

24
src/uni_modules/wot-design-uni/readme.md
View File

@ -65,27 +65,29 @@
扫描二维码访问演示，注意：因微信审核机制限制，当前的微信小程序示例可能不是最新版本，可以clone代码到本地预览。
<p style="display:flex;gap:24px">
<img src="https://wot-design-uni.pages.dev/wx.jpg" width="200" height="200"/>
<img src="https://wot-design-uni.pages.dev/alipay.png" width="200" height="200" />
<img src="https://wot-design-uni.pages.dev/h5.png" width="200" height="200" />
<img src="https://wot-design-uni.pages.dev/android.png" width="200" height="200" />
<img src="https://wot-design-uni.cn/wx.jpg" width="200" height="200"/>
<img src="https://wot-design-uni.cn/alipay.png" width="200" height="200" />
<img src="https://wot-design-uni.cn/h5.png" width="200" height="200" />
<img src="https://wot-design-uni.cn/android.png" width="200" height="200" />
</p>
## 快速上手
详细说明见 [快速上手](https://wot-design-uni.pages.dev/guide/quick-use.html)。
详细说明见 [快速上手](https://wot-design-uni.cn/guide/quick-use.html)。
## 链接
- [常见问题](https://wot-design-uni.pages.dev/guide/common-problems.html)
- [更新日志](https://wot-design-uni.pages.dev/guide/changelog.html)
- [常见问题](https://wot-design-uni.cn/guide/common-problems.html)
- [更新日志](https://wot-design-uni.cn/guide/changelog.html)
- [Discussions 讨论区](https://github.com/Moonofweisheng/wot-design-uni/discussions)
- [QQ 群](https://wot-design-uni.pages.dev/guide/join-group.html)
- [QQ 群](https://wot-design-uni.cn/guide/join-group.html)
## 优秀案例
我们非常欢迎大家一起贡献优秀的 Demo 与案例，欢迎在此 [issue](https://github.com/Moonofweisheng/wot-design-uni/issues/16) 提交案例。
[这里](https://wot-design-uni.cn/guide/cases.html)我们收集了一些优秀的案例，欢迎大家体验！
我们也非常欢迎大家一起贡献优秀的 Demo 与案例，欢迎在此 [issue](https://github.com/Moonofweisheng/wot-design-uni/issues/16) 提交案例。
## 周边生态
@ -135,8 +137,8 @@
### 扫码捐赠
<p>
<img src="https://wot-design-uni.pages.dev/weixinQrcode.jpg" width="200" height="200" style="margin-right:30px"/>
<img src="https://wot-design-uni.pages.dev/alipayQrcode.jpg" width="200" height="200" />
<img src="https://wot-design-uni.cn/weixinQrcode.jpg" width="200" height="200" style="margin-right:30px"/>
<img src="https://wot-design-uni.cn/alipayQrcode.jpg" width="200" height="200" />
</p>