@duxweb/dvha-template 1.0.9 → 1.0.10
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,13 @@ async function createProject(projectName) {
|
|
|
139
139
|
fs.copySync(uiPagesDir, targetPagesDir)
|
|
140
140
|
}
|
|
141
141
|
|
|
142
|
+
// 2.5. 检查并复制UI特定的main.ts文件（如果存在）
|
|
143
|
+
const uiMainTsPath = path.resolve(__dirname, '..', 'template', 'ui-configs', template, 'main.ts')
|
|
144
|
+
if (fs.existsSync(uiMainTsPath)) {
|
|
145
|
+
const targetMainTsPath = path.join(root, 'main.ts')
|
|
146
|
+
fs.copySync(uiMainTsPath, targetMainTsPath)
|
|
147
|
+
}
|
|
148
|
+
|
|
142
149
|
// 3. 更新package.json
|
|
143
150
|
const pkgPath = path.join(root, 'package.json')
|
|
144
151
|
if (fs.existsSync(pkgPath)) {
|
|
@@ -163,9 +170,11 @@ async function createProject(projectName) {
|
|
|
163
170
|
fs.writeJsonSync(pkgPath, pkg, { spaces: 2 })
|
|
164
171
|
}
|
|
165
172
|
|
|
166
|
-
// 4. 更新main.ts
|
|
173
|
+
// 4. 更新main.ts（仅当UI配置没有自定义main.ts时）
|
|
167
174
|
const mainTsPath = path.join(root, 'main.ts')
|
|
168
|
-
|
|
175
|
+
|
|
176
|
+
// 如果UI配置有自定义main.ts，跳过修改；否则修改基础main.ts
|
|
177
|
+
if (!fs.existsSync(uiMainTsPath) && fs.existsSync(mainTsPath)) {
|
|
169
178
|
let mainTsContent = fs.readFileSync(mainTsPath, 'utf-8')
|
|
170
179
|
|
|
171
180
|
// 在导入语句后添加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,181 @@
|
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
import { DuxCard, DuxChart, DuxDashboardQuick } from '@duxweb/dvha-pro'
|
|
3
|
+
import { NButton, NGi, NGrid } from 'naive-ui'
|
|
4
|
+
import { computed, ref } from 'vue'
|
|
5
|
+
|
|
6
|
+
// 基本统计数据
|
|
7
|
+
const stats = ref([
|
|
8
|
+
{
|
|
9
|
+
label: '总订单',
|
|
10
|
+
icon: 'i-tabler:shopping-cart',
|
|
11
|
+
value: 126,
|
|
12
|
+
},
|
|
13
|
+
{
|
|
14
|
+
label: '总用户',
|
|
15
|
+
icon: 'i-tabler:users',
|
|
16
|
+
value: 89,
|
|
17
|
+
},
|
|
18
|
+
{
|
|
19
|
+
label: '总收入',
|
|
20
|
+
icon: 'i-tabler:currency-dollar',
|
|
21
|
+
value: '¥12,543',
|
|
22
|
+
},
|
|
23
|
+
])
|
|
24
|
+
|
|
25
|
+
// 图表数据
|
|
26
|
+
const chartData = computed(() => ({
|
|
27
|
+
labels: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
|
|
28
|
+
data: [
|
|
29
|
+
{
|
|
30
|
+
name: '访问量',
|
|
31
|
+
type: 'line',
|
|
32
|
+
data: [120, 132, 101, 134, 90, 230, 210],
|
|
33
|
+
color: '#18a058',
|
|
34
|
+
},
|
|
35
|
+
],
|
|
36
|
+
}))
|
|
37
|
+
</script>
|
|
38
|
+
|
|
39
|
+
<template>
|
|
40
|
+
<div class="p-6 space-y-6">
|
|
41
|
+
<!-- 欢迎区域 -->
|
|
42
|
+
<DuxCard>
|
|
43
|
+
<div class="text-center py-8">
|
|
44
|
+
<div class="i-tabler:brand-vue text-6xl text-blue-600 mx-auto mb-6" />
|
|
45
|
+
<h1 class="text-3xl font-bold text-gray-900 dark:text-gray-100 mb-4">
|
|
46
|
+
欢迎使用 Dux Pro
|
|
47
|
+
</h1>
|
|
48
|
+
<p class="text-gray-600 dark:text-gray-300 text-lg max-w-2xl mx-auto">
|
|
49
|
+
基于 Vue 3 + Naive UI + Dux Pro 组件库构建的现代化管理后台，提供丰富的业务组件和开箱即用的功能
|
|
50
|
+
</p>
|
|
51
|
+
</div>
|
|
52
|
+
</DuxCard>
|
|
53
|
+
|
|
54
|
+
<!-- 统计卡片 -->
|
|
55
|
+
<NGrid :cols="3" :x-gap="16">
|
|
56
|
+
<NGi v-for="item in stats" :key="item.label">
|
|
57
|
+
<DuxDashboardQuick
|
|
58
|
+
:label="item.label"
|
|
59
|
+
:icon="item.icon"
|
|
60
|
+
:value="item.value"
|
|
61
|
+
/>
|
|
62
|
+
</NGi>
|
|
63
|
+
</NGrid>
|
|
64
|
+
|
|
65
|
+
<!-- 图表区域 -->
|
|
66
|
+
<DuxCard>
|
|
67
|
+
<template #header>
|
|
68
|
+
<div class="flex items-center justify-between">
|
|
69
|
+
<h3 class="text-lg font-semibold">
|
|
70
|
+
数据概览
|
|
71
|
+
</h3>
|
|
72
|
+
<NButton size="small" type="primary">
|
|
73
|
+
查看详情
|
|
74
|
+
</NButton>
|
|
75
|
+
</div>
|
|
76
|
+
</template>
|
|
77
|
+
<DuxChart :option="chartData" style="height: 300px;" />
|
|
78
|
+
</DuxCard>
|
|
79
|
+
|
|
80
|
+
<!-- Dux Pro 特性展示 -->
|
|
81
|
+
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 mb-8">
|
|
82
|
+
<DuxCard>
|
|
83
|
+
<div class="text-center p-4">
|
|
84
|
+
<div class="i-tabler:components text-4xl text-purple-600 mb-4" />
|
|
85
|
+
<h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-2">
|
|
86
|
+
丰富组件
|
|
87
|
+
</h3>
|
|
88
|
+
<p class="text-gray-600 dark:text-gray-300 text-sm">
|
|
89
|
+
提供丰富的业务组件，快速构建管理后台
|
|
90
|
+
</p>
|
|
91
|
+
</div>
|
|
92
|
+
</DuxCard>
|
|
93
|
+
|
|
94
|
+
<DuxCard>
|
|
95
|
+
<div class="text-center p-4">
|
|
96
|
+
<div class="i-tabler:chart-bar text-4xl text-green-600 mb-4" />
|
|
97
|
+
<h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-2">
|
|
98
|
+
数据可视化
|
|
99
|
+
</h3>
|
|
100
|
+
<p class="text-gray-600 dark:text-gray-300 text-sm">
|
|
101
|
+
内置图表组件，轻松展示数据分析结果
|
|
102
|
+
</p>
|
|
103
|
+
</div>
|
|
104
|
+
</DuxCard>
|
|
105
|
+
|
|
106
|
+
<DuxCard>
|
|
107
|
+
<div class="text-center p-4">
|
|
108
|
+
<div class="i-tabler:layout-dashboard text-4xl text-blue-600 mb-4" />
|
|
109
|
+
<h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-2">
|
|
110
|
+
页面布局
|
|
111
|
+
</h3>
|
|
112
|
+
<p class="text-gray-600 dark:text-gray-300 text-sm">
|
|
113
|
+
灵活的布局组件，适应各种业务场景
|
|
114
|
+
</p>
|
|
115
|
+
</div>
|
|
116
|
+
</DuxCard>
|
|
117
|
+
</div>
|
|
118
|
+
|
|
119
|
+
<!-- 快速操作 -->
|
|
120
|
+
<DuxCard>
|
|
121
|
+
<template #header>
|
|
122
|
+
<h3 class="text-lg font-semibold">
|
|
123
|
+
快速操作
|
|
124
|
+
</h3>
|
|
125
|
+
</template>
|
|
126
|
+
<div class="grid grid-cols-2 md:grid-cols-4 gap-4">
|
|
127
|
+
<NButton block type="primary">
|
|
128
|
+
<template #icon>
|
|
129
|
+
<div class="i-tabler:plus" />
|
|
130
|
+
</template>
|
|
131
|
+
创建订单
|
|
132
|
+
</NButton>
|
|
133
|
+
<NButton block>
|
|
134
|
+
<template #icon>
|
|
135
|
+
<div class="i-tabler:users" />
|
|
136
|
+
</template>
|
|
137
|
+
用户管理
|
|
138
|
+
</NButton>
|
|
139
|
+
<NButton block>
|
|
140
|
+
<template #icon>
|
|
141
|
+
<div class="i-tabler:chart-bar" />
|
|
142
|
+
</template>
|
|
143
|
+
数据统计
|
|
144
|
+
</NButton>
|
|
145
|
+
<NButton block>
|
|
146
|
+
<template #icon>
|
|
147
|
+
<div class="i-tabler:settings" />
|
|
148
|
+
</template>
|
|
149
|
+
系统设置
|
|
150
|
+
</NButton>
|
|
151
|
+
</div>
|
|
152
|
+
</DuxCard>
|
|
153
|
+
|
|
154
|
+
<!-- 开始使用 -->
|
|
155
|
+
<div class="bg-gradient-to-r from-blue-50 to-indigo-50 dark:from-blue-950 dark:to-indigo-950 rounded-lg border p-8 text-center">
|
|
156
|
+
<h3 class="text-xl font-bold text-gray-900 dark:text-gray-100 mb-4">
|
|
157
|
+
开始构建您的 Pro 应用
|
|
158
|
+
</h3>
|
|
159
|
+
<p class="text-gray-600 dark:text-gray-300 mb-6">
|
|
160
|
+
Dux Pro 为您提供了构建现代化管理系统所需的所有专业组件
|
|
161
|
+
</p>
|
|
162
|
+
<div class="flex justify-center space-x-4">
|
|
163
|
+
<a
|
|
164
|
+
href="https://github.com/duxweb/dvha" target="_blank"
|
|
165
|
+
class="inline-flex items-center px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium"
|
|
166
|
+
>
|
|
167
|
+
<div class="i-tabler:brand-github mr-2" />
|
|
168
|
+
查看源码
|
|
169
|
+
</a>
|
|
170
|
+
<a href="#" 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">
|
|
171
|
+
<div class="i-tabler:book mr-2" />
|
|
172
|
+
查看文档
|
|
173
|
+
</a>
|
|
174
|
+
</div>
|
|
175
|
+
</div>
|
|
176
|
+
</div>
|
|
177
|
+
</template>
|
|
178
|
+
|
|
179
|
+
<style scoped>
|
|
180
|
+
/* 自定义样式 */
|
|
181
|
+
</style>
|
|
@@ -0,0 +1,14 @@
|
|
|
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
|
+
}
|