@duxweb/dvha-template 1.0.9 → 1.0.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/bin/index.js
CHANGED
|
@@ -139,6 +139,31 @@ async function createProject(projectName) {
|
|
|
139
139
|
fs.copySync(uiPagesDir, targetPagesDir)
|
|
140
140
|
}
|
|
141
141
|
|
|
142
|
+
// 2.5. 检查并复制UI特定的配置文件（如果存在）
|
|
143
|
+
const uiConfigDir = path.resolve(__dirname, '..', 'template', 'ui-configs', template)
|
|
144
|
+
|
|
145
|
+
// 复制 main.ts
|
|
146
|
+
const uiMainTsPath = path.join(uiConfigDir, 'main.ts')
|
|
147
|
+
if (fs.existsSync(uiMainTsPath)) {
|
|
148
|
+
const targetMainTsPath = path.join(root, 'main.ts')
|
|
149
|
+
fs.copySync(uiMainTsPath, targetMainTsPath)
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
// 复制 vite.config.ts
|
|
153
|
+
const uiViteConfigPath = path.join(uiConfigDir, 'vite.config.ts')
|
|
154
|
+
if (fs.existsSync(uiViteConfigPath)) {
|
|
155
|
+
const targetViteConfigPath = path.join(root, 'vite.config.ts')
|
|
156
|
+
fs.copySync(uiViteConfigPath, targetViteConfigPath)
|
|
157
|
+
}
|
|
158
|
+
|
|
159
|
+
// 对于 pro 模板，删除 uno.config.ts（因为不需要 UnoCSS）
|
|
160
|
+
if (template === 'pro') {
|
|
161
|
+
const targetUnoConfigPath = path.join(root, 'uno.config.ts')
|
|
162
|
+
if (fs.existsSync(targetUnoConfigPath)) {
|
|
163
|
+
fs.removeSync(targetUnoConfigPath)
|
|
164
|
+
}
|
|
165
|
+
}
|
|
166
|
+
|
|
142
167
|
// 3. 更新package.json
|
|
143
168
|
const pkgPath = path.join(root, 'package.json')
|
|
144
169
|
if (fs.existsSync(pkgPath)) {
|
|
@@ -160,12 +185,26 @@ async function createProject(projectName) {
|
|
|
160
185
|
}
|
|
161
186
|
}
|
|
162
187
|
|
|
188
|
+
// 移除排除的依赖
|
|
189
|
+
if (uiConfig.excludeDependencies && Array.isArray(uiConfig.excludeDependencies)) {
|
|
190
|
+
uiConfig.excludeDependencies.forEach((dep) => {
|
|
191
|
+
if (pkg.dependencies && pkg.dependencies[dep]) {
|
|
192
|
+
delete pkg.dependencies[dep]
|
|
193
|
+
}
|
|
194
|
+
if (pkg.devDependencies && pkg.devDependencies[dep]) {
|
|
195
|
+
delete pkg.devDependencies[dep]
|
|
196
|
+
}
|
|
197
|
+
})
|
|
198
|
+
}
|
|
199
|
+
|
|
163
200
|
fs.writeJsonSync(pkgPath, pkg, { spaces: 2 })
|
|
164
201
|
}
|
|
165
202
|
|
|
166
|
-
// 4. 更新main.ts
|
|
203
|
+
// 4. 更新main.ts（仅当UI配置没有自定义main.ts时）
|
|
167
204
|
const mainTsPath = path.join(root, 'main.ts')
|
|
168
|
-
|
|
205
|
+
|
|
206
|
+
// 如果UI配置有自定义main.ts，跳过修改；否则修改基础main.ts
|
|
207
|
+
if (!fs.existsSync(uiMainTsPath) && fs.existsSync(mainTsPath)) {
|
|
169
208
|
let mainTsContent = fs.readFileSync(mainTsPath, 'utf-8')
|
|
170
209
|
|
|
171
210
|
// 在导入语句后添加UI库的导入
|
package/package.json
CHANGED
|
@@ -25,11 +25,11 @@
|
|
|
25
25
|
"clsx": "^2.1.1",
|
|
26
26
|
"lodash-es": "^4.17.21",
|
|
27
27
|
"petite-vue-i18n": "^11.1.4",
|
|
28
|
-
"pinia": "^3.0.
|
|
29
|
-
"pinia-plugin-persistedstate": "^4.
|
|
28
|
+
"pinia": "^3.0.3",
|
|
29
|
+
"pinia-plugin-persistedstate": "^4.3.0",
|
|
30
30
|
"unocss": "^66.1.2",
|
|
31
31
|
"vue": "^3.5.0",
|
|
32
|
-
"vue-router": "^4.
|
|
32
|
+
"vue-router": "^4.5.1"
|
|
33
33
|
},
|
|
34
34
|
"devDependencies": {
|
|
35
35
|
"@antfu/eslint-config": "^4.13.1",
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
import type { IConfig } from '@duxweb/dvha-core'
|
|
2
|
+
import { createDux, i18nProvider, simpleAuthProvider, simpleDataProvider } from '@duxweb/dvha-core'
|
|
3
|
+
import * as DuxPro from '@duxweb/dvha-pro'
|
|
4
|
+
import * as NaiveUI from 'naive-ui'
|
|
5
|
+
import { createApp } from 'vue'
|
|
6
|
+
|
|
7
|
+
import '@duxweb/dvha-pro/style.css'
|
|
8
|
+
|
|
9
|
+
const { createDuxPro, DuxApp, DuxAuthLayout, DuxLayout, DuxLoginPage, DuxPage404, DuxPage500, DuxPageLoading, enUS, zhCN } = DuxPro
|
|
10
|
+
|
|
11
|
+
const app = createApp(DuxApp)
|
|
12
|
+
|
|
13
|
+
const config: IConfig = {
|
|
14
|
+
defaultManage: 'admin',
|
|
15
|
+
manages: [
|
|
16
|
+
{
|
|
17
|
+
name: 'admin',
|
|
18
|
+
title: 'Dux Pro 管理系统',
|
|
19
|
+
routePrefix: '/admin',
|
|
20
|
+
apiUrl: '/admin',
|
|
21
|
+
apiRoutePath: '/routes',
|
|
22
|
+
components: {
|
|
23
|
+
authLayout: DuxAuthLayout,
|
|
24
|
+
noAuthLayout: DuxLayout,
|
|
25
|
+
notFound: DuxPage404,
|
|
26
|
+
loading: DuxPageLoading,
|
|
27
|
+
error: DuxPage500,
|
|
28
|
+
},
|
|
29
|
+
userMenus: [
|
|
30
|
+
{
|
|
31
|
+
label: '设置',
|
|
32
|
+
key: 'setting',
|
|
33
|
+
icon: 'i-tabler:settings',
|
|
34
|
+
path: 'setting',
|
|
35
|
+
},
|
|
36
|
+
],
|
|
37
|
+
routes: [
|
|
38
|
+
{
|
|
39
|
+
name: 'admin.login',
|
|
40
|
+
path: 'login',
|
|
41
|
+
component: DuxLoginPage,
|
|
42
|
+
meta: {
|
|
43
|
+
authorization: false,
|
|
44
|
+
},
|
|
45
|
+
},
|
|
46
|
+
],
|
|
47
|
+
menus: [
|
|
48
|
+
{
|
|
49
|
+
name: 'home',
|
|
50
|
+
path: 'index',
|
|
51
|
+
icon: 'i-tabler:home',
|
|
52
|
+
label: '工作台',
|
|
53
|
+
component: () => import('./pages/home.vue'),
|
|
54
|
+
},
|
|
55
|
+
],
|
|
56
|
+
},
|
|
57
|
+
],
|
|
58
|
+
dataProvider: simpleDataProvider({
|
|
59
|
+
apiUrl: 'https://m1.apifoxmock.com/m1/4407506-4052338-default/admin',
|
|
60
|
+
}),
|
|
61
|
+
authProvider: simpleAuthProvider(),
|
|
62
|
+
i18nProvider: i18nProvider({
|
|
63
|
+
locale: 'zh-CN',
|
|
64
|
+
fallbackLocale: 'en-US',
|
|
65
|
+
messages: {
|
|
66
|
+
'zh-CN': zhCN,
|
|
67
|
+
'en-US': enUS,
|
|
68
|
+
},
|
|
69
|
+
}),
|
|
70
|
+
remote: {
|
|
71
|
+
packages: {
|
|
72
|
+
'naive-ui': NaiveUI,
|
|
73
|
+
'@duxweb/dvha-pro': DuxPro,
|
|
74
|
+
},
|
|
75
|
+
},
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
app.use(createDux(config))
|
|
79
|
+
app.use(NaiveUI)
|
|
80
|
+
app.use(createDuxPro())
|
|
81
|
+
|
|
82
|
+
app.mount('#app')
|
|
@@ -0,0 +1,194 @@
|
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
import { DuxCard } from '@duxweb/dvha-pro'
|
|
3
|
+
import { computed, ref } from 'vue'
|
|
4
|
+
|
|
5
|
+
// 基本统计数据
|
|
6
|
+
const stats = ref([
|
|
7
|
+
{
|
|
8
|
+
label: '总订单',
|
|
9
|
+
icon: 'i-tabler:shopping-cart',
|
|
10
|
+
value: 126,
|
|
11
|
+
},
|
|
12
|
+
{
|
|
13
|
+
label: '总用户',
|
|
14
|
+
icon: 'i-tabler:users',
|
|
15
|
+
value: 89,
|
|
16
|
+
},
|
|
17
|
+
{
|
|
18
|
+
label: '总收入',
|
|
19
|
+
icon: 'i-tabler:currency-dollar',
|
|
20
|
+
value: '¥12,543',
|
|
21
|
+
},
|
|
22
|
+
])
|
|
23
|
+
|
|
24
|
+
// 图表数据
|
|
25
|
+
const chartData = computed(() => ({
|
|
26
|
+
labels: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
|
|
27
|
+
data: [
|
|
28
|
+
{
|
|
29
|
+
name: '访问量',
|
|
30
|
+
type: 'line',
|
|
31
|
+
data: [120, 132, 101, 134, 90, 230, 210],
|
|
32
|
+
color: '#18a058',
|
|
33
|
+
},
|
|
34
|
+
],
|
|
35
|
+
}))
|
|
36
|
+
</script>
|
|
37
|
+
|
|
38
|
+
<template>
|
|
39
|
+
<div class="space-y-4">
|
|
40
|
+
<!-- 欢迎区域 -->
|
|
41
|
+
<DuxCard>
|
|
42
|
+
<div class="text-center py-8">
|
|
43
|
+
<div class="i-tabler:brand-vue text-4xl text-blue-600 mx-auto mb-4" />
|
|
44
|
+
<h1 class="text-3xl font-bold text-gray-900 dark:text-gray-100 mb-4">
|
|
45
|
+
欢迎使用 Dux Pro
|
|
46
|
+
</h1>
|
|
47
|
+
<p class="text-gray-600 dark:text-gray-300 text-lg max-w-2xl mx-auto">
|
|
48
|
+
基于 Vue 3 + Naive UI + Dux Pro 组件库构建的现代化管理后台，提供丰富的业务组件和开箱即用的功能
|
|
49
|
+
</p>
|
|
50
|
+
</div>
|
|
51
|
+
</DuxCard>
|
|
52
|
+
|
|
53
|
+
<!-- Dux Pro 特性展示 -->
|
|
54
|
+
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 mb-4">
|
|
55
|
+
<DuxCard>
|
|
56
|
+
<div class="text-center p-4">
|
|
57
|
+
<div class="i-tabler:components text-4xl text-purple-600 mb-6 mx-auto" />
|
|
58
|
+
<h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-2">
|
|
59
|
+
远程渲染
|
|
60
|
+
</h3>
|
|
61
|
+
<p class="text-gray-600 dark:text-gray-300 text-sm">
|
|
62
|
+
支持字符串渲染为 Vue 页面，远程组件动态加载
|
|
63
|
+
</p>
|
|
64
|
+
</div>
|
|
65
|
+
</DuxCard>
|
|
66
|
+
|
|
67
|
+
<DuxCard>
|
|
68
|
+
<div class="text-center p-4">
|
|
69
|
+
<div class="i-tabler:chart-bar text-4xl text-green-600 mb-6 mx-auto" />
|
|
70
|
+
<h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-2">
|
|
71
|
+
数据可视化
|
|
72
|
+
</h3>
|
|
73
|
+
<p class="text-gray-600 dark:text-gray-300 text-sm">
|
|
74
|
+
内置图表组件，轻松展示数据分析结果
|
|
75
|
+
</p>
|
|
76
|
+
</div>
|
|
77
|
+
</DuxCard>
|
|
78
|
+
|
|
79
|
+
<DuxCard>
|
|
80
|
+
<div class="text-center p-4">
|
|
81
|
+
<div class="i-tabler:layout-dashboard text-4xl text-blue-600 mb-6 mx-auto" />
|
|
82
|
+
<h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-2">
|
|
83
|
+
动态渲染
|
|
84
|
+
</h3>
|
|
85
|
+
<p class="text-gray-600 dark:text-gray-300 text-sm">
|
|
86
|
+
页面布局支持动态渲染，运行时 UnoCSS 样式生成
|
|
87
|
+
</p>
|
|
88
|
+
</div>
|
|
89
|
+
</DuxCard>
|
|
90
|
+
|
|
91
|
+
<DuxCard>
|
|
92
|
+
<div class="text-center p-4">
|
|
93
|
+
<div class="i-tabler:forms text-4xl text-orange-600 mb-6 mx-auto" />
|
|
94
|
+
<h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-2">
|
|
95
|
+
表单组件
|
|
96
|
+
</h3>
|
|
97
|
+
<p class="text-gray-600 dark:text-gray-300 text-sm">
|
|
98
|
+
强大的表单构建器，支持各种表单验证
|
|
99
|
+
</p>
|
|
100
|
+
</div>
|
|
101
|
+
</DuxCard>
|
|
102
|
+
|
|
103
|
+
<DuxCard>
|
|
104
|
+
<div class="text-center p-4">
|
|
105
|
+
<div class="i-tabler:table text-4xl text-indigo-600 mb-6 mx-auto" />
|
|
106
|
+
<h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-2">
|
|
107
|
+
数据表格
|
|
108
|
+
</h3>
|
|
109
|
+
<p class="text-gray-600 dark:text-gray-300 text-sm">
|
|
110
|
+
功能完整的数据表格，支持排序、筛选、分页
|
|
111
|
+
</p>
|
|
112
|
+
</div>
|
|
113
|
+
</DuxCard>
|
|
114
|
+
|
|
115
|
+
<DuxCard>
|
|
116
|
+
<div class="text-center p-4">
|
|
117
|
+
<div class="i-tabler:palette text-4xl text-pink-600 mb-6 mx-auto" />
|
|
118
|
+
<h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-2">
|
|
119
|
+
主题定制
|
|
120
|
+
</h3>
|
|
121
|
+
<p class="text-gray-600 dark:text-gray-300 text-sm">
|
|
122
|
+
灵活的主题配置，支持深色模式和自定义色彩
|
|
123
|
+
</p>
|
|
124
|
+
</div>
|
|
125
|
+
</DuxCard>
|
|
126
|
+
|
|
127
|
+
<DuxCard>
|
|
128
|
+
<div class="text-center p-4">
|
|
129
|
+
<div class="i-tabler:shield-check text-4xl text-red-600 mb-6 mx-auto" />
|
|
130
|
+
<h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-2">
|
|
131
|
+
权限管理
|
|
132
|
+
</h3>
|
|
133
|
+
<p class="text-gray-600 dark:text-gray-300 text-sm">
|
|
134
|
+
完善的权限控制系统，角色和权限精细化管理
|
|
135
|
+
</p>
|
|
136
|
+
</div>
|
|
137
|
+
</DuxCard>
|
|
138
|
+
|
|
139
|
+
<DuxCard>
|
|
140
|
+
<div class="text-center p-4">
|
|
141
|
+
<div class="i-tabler:rocket text-4xl text-cyan-600 mb-6 mx-auto" />
|
|
142
|
+
<h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-2">
|
|
143
|
+
高性能
|
|
144
|
+
</h3>
|
|
145
|
+
<p class="text-gray-600 dark:text-gray-300 text-sm">
|
|
146
|
+
基于 Vue 3 构建，享受最新技术带来的性能提升
|
|
147
|
+
</p>
|
|
148
|
+
</div>
|
|
149
|
+
</DuxCard>
|
|
150
|
+
|
|
151
|
+
<DuxCard>
|
|
152
|
+
<div class="text-center p-4">
|
|
153
|
+
<div class="i-tabler:devices text-4xl text-teal-600 mb-6 mx-auto" />
|
|
154
|
+
<h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-2">
|
|
155
|
+
响应式设计
|
|
156
|
+
</h3>
|
|
157
|
+
<p class="text-gray-600 dark:text-gray-300 text-sm">
|
|
158
|
+
完美适配桌面、平板、手机等各种设备
|
|
159
|
+
</p>
|
|
160
|
+
</div>
|
|
161
|
+
</DuxCard>
|
|
162
|
+
</div>
|
|
163
|
+
|
|
164
|
+
<!-- 开始使用 -->
|
|
165
|
+
<div class="bg-primary-50 dark:bg-primary-950 rounded-lg border border-primary/50 p-8 text-center">
|
|
166
|
+
<h3 class="text-xl font-bold text-gray-900 dark:text-gray-100 mb-4">
|
|
167
|
+
开始构建您的 Pro 应用
|
|
168
|
+
</h3>
|
|
169
|
+
<p class="text-gray-600 dark:text-gray-300 mb-6">
|
|
170
|
+
Dux Pro 为您提供了构建现代化管理系统所需的所有专业组件
|
|
171
|
+
</p>
|
|
172
|
+
<div class="flex justify-center space-x-4">
|
|
173
|
+
<a
|
|
174
|
+
href="https://github.com/duxweb/dvha" target="_blank"
|
|
175
|
+
class="inline-flex items-center px-4 py-2 bg-primary-600 text-white rounded-lg hover:bg-primary-700 text-sm font-medium"
|
|
176
|
+
>
|
|
177
|
+
<div class="i-tabler:brand-github mr-2" />
|
|
178
|
+
查看源码
|
|
179
|
+
</a>
|
|
180
|
+
<a
|
|
181
|
+
href="https://duxweb.dux.plus/dvha/" target="_blank"
|
|
182
|
+
class="inline-flex items-center px-4 py-2 border border-gray-300 text-gray-700 dark:text-gray-300 dark:border-gray-600 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-800 text-sm font-medium"
|
|
183
|
+
>
|
|
184
|
+
<div class="i-tabler:book mr-2" />
|
|
185
|
+
查看文档
|
|
186
|
+
</a>
|
|
187
|
+
</div>
|
|
188
|
+
</div>
|
|
189
|
+
</div>
|
|
190
|
+
</template>
|
|
191
|
+
|
|
192
|
+
<style scoped>
|
|
193
|
+
/* 自定义样式 */
|
|
194
|
+
</style>
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { resolve } from 'node:path'
|
|
2
|
+
import vue from '@vitejs/plugin-vue'
|
|
3
|
+
import VueJsx from '@vitejs/plugin-vue-jsx'
|
|
4
|
+
import { defineConfig } from 'vite'
|
|
5
|
+
|
|
6
|
+
export default defineConfig({
|
|
7
|
+
plugins: [
|
|
8
|
+
vue(),
|
|
9
|
+
VueJsx(),
|
|
10
|
+
],
|
|
11
|
+
build: {
|
|
12
|
+
rollupOptions: {
|
|
13
|
+
input: {
|
|
14
|
+
index: resolve(__dirname, 'index.html'),
|
|
15
|
+
},
|
|
16
|
+
output: {
|
|
17
|
+
entryFileNames: 'js/[name]-[hash].js',
|
|
18
|
+
chunkFileNames: 'js/[name]-[hash].js',
|
|
19
|
+
manualChunks(id) {
|
|
20
|
+
if (id.includes('node_modules')) {
|
|
21
|
+
return id
|
|
22
|
+
.toString()
|
|
23
|
+
.split('node_modules/')[1]
|
|
24
|
+
.split('/')[0]
|
|
25
|
+
.toString()
|
|
26
|
+
}
|
|
27
|
+
},
|
|
28
|
+
},
|
|
29
|
+
},
|
|
30
|
+
outDir: resolve(__dirname, 'dist'),
|
|
31
|
+
},
|
|
32
|
+
})
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "pro",
|
|
3
|
+
"display": "Vue 3 + Dux Pro",
|
|
4
|
+
"description": "使用 Dux Pro 组件库的 Vue 3 项目",
|
|
5
|
+
"dependencies": {
|
|
6
|
+
"@duxweb/dvha-core": "latest",
|
|
7
|
+
"@duxweb/dvha-naiveui": "latest",
|
|
8
|
+
"@duxweb/dvha-pro": "latest",
|
|
9
|
+
"naive-ui": "^2.42.0",
|
|
10
|
+
"vue": "^3.5.0",
|
|
11
|
+
"vue-router": "^4.5.1"
|
|
12
|
+
},
|
|
13
|
+
"devDependencies": {},
|
|
14
|
+
"excludeDependencies": [
|
|
15
|
+
"@iconify-json/tabler",
|
|
16
|
+
"@unocss/preset-icons",
|
|
17
|
+
"@unocss/eslint-plugin",
|
|
18
|
+
"@unocss/reset",
|
|
19
|
+
"unocss"
|
|
20
|
+
]
|
|
21
|
+
}
|