Commit 7a68aee6 authored by liaozan's avatar liaozan 🏀

feat: rewrite with vue3

parent 0c0b7062
...@@ -6,18 +6,14 @@ ...@@ -6,18 +6,14 @@
"build": "vite build --mode production" "build": "vite build --mode production"
}, },
"dependencies": { "dependencies": {
"@vitejs/plugin-vue": "^2.3.1",
"ant-design-vue": "^3.1.1", "ant-design-vue": "^3.1.1",
"axios": "^0.26.1", "axios": "^0.26.1",
"consola": "^2.15.3",
"vite-plugin-style-import": "^1.4.1",
"vue": "^3.2.31" "vue": "^3.2.31"
}, },
"devDependencies": { "devDependencies": {
"@vue/compiler-sfc": "^3.2.31", "@vitejs/plugin-vue": "^2.3.1",
"less": "^4.1.2", "typescript": "^4.6.3",
"sass": "^1.50.0", "vite": "^2.9.1",
"unplugin-vue-components": "^0.18.5", "vue-tsc": "^0.33.9"
"vite": "^2.9.1"
} }
} }
\ No newline at end of file
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<div class="start-wrapper"> <div class="start-wrapper">
<a-spin :spinning="loading"> <a-spin :spinning="loading">
<h3 style="margin-bottom: 20px">项目初始代码生成</h3> <h3 style="margin-bottom: 20px">项目初始代码生成</h3>
<a-form ref="downloadForm" :labelCol="{span: 6}" :model="formState" :rules="formRules" :wrapperCol="{span: 18}" class="form-wrapper"> <a-form ref="downloadForm" :labelCol="{span: 6}" :model="formState" :rules="formRules" :wrapperCol="{span: 18}" autocomplete="off" class="form-wrapper">
<a-form-item has-feedback label="GroupId" name="groupId"> <a-form-item has-feedback label="GroupId" name="groupId">
<a-input v-model:value="formState.groupId"/> <a-input v-model:value="formState.groupId"/>
</a-form-item> </a-form-item>
...@@ -121,50 +121,39 @@ const createTreeData = (fileNodeList: FileNode[]): any => { ...@@ -121,50 +121,39 @@ const createTreeData = (fileNodeList: FileNode[]): any => {
return [] return []
} }
return fileNodeList.map((item: FileNode) => { return fileNodeList.map((item: FileNode) => {
// 非叶子结点 return {
if (item.children && item.children.length > 0) { key: Math.random(),
Object.assign(item, { title: item.fileName,
key: item.fileContent! + Math.random(), children: createTreeData(item.children),
children: createTreeData(item.children), selectable: false,
title: item.fileName, isLeaf: item.isFile
selectable: false,
isLeaf: false
})
return item
} else {
return {
key: item.fileContent! + Math.random(),
title: item.fileName,
children: [],
selectable: false,
isLeaf: true
}
} }
}) })
} }
</script> </script>
<style lang="scss" scoped> <style scoped>
.start-wrapper { .start-wrapper {
width: 500px; width: 500px;
min-height: 300px; min-height: 300px;
border-radius: 8px; border-radius: 8px;
box-shadow: 0 0 20px gray; box-shadow: 0 0 20px gray;
margin: 100px auto; margin: 100px auto;
padding: 50px; padding: 50px
}
.button-group { .button-group {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center
}
.generic-btn { .generic-btn {
margin-left: 10px; margin-left: 10px;
} }
}
:deep(.ant-input), :deep(.ant-btn) { /*noinspection CssUnusedSymbol*/
border-radius: 6px; .ant-input, .ant-btn {
} border-radius: 6px;
} }
</style> </style>
\ No newline at end of file
import {createApp} from 'vue' import {createApp} from 'vue'
import App from './App.vue' import App from './App.vue'
import Antd from 'ant-design-vue'
import './index.css' import './index.css'
import 'ant-design-vue/dist/antd.css';
createApp(App).mount('#app') createApp(App).use(Antd).mount('#app')
\ No newline at end of file \ No newline at end of file
import Components from 'unplugin-vue-components/vite'
import {AntDesignVueResolver} from 'unplugin-vue-components/resolvers'
import styleImport, {AndDesignVueResolve, AntdResolve} from 'vite-plugin-style-import'
import {defineConfig} from 'vite' import {defineConfig} from 'vite'
// @ts-ignore
import vue from '@vitejs/plugin-vue' import vue from '@vitejs/plugin-vue'
// noinspection JSUnusedGlobalSymbols
export default defineConfig({ export default defineConfig({
plugins: [ plugins: [vue()]
vue(),
// antd自动按需引入
Components({
resolvers: [
AntDesignVueResolver(),
]
}),
// @ts-ignore
styleImport({
resolves: [
AndDesignVueResolve(),
AntdResolve()
],
// 自定义规则
libs: [
{
libraryName: 'ant-design-vue',
esModule: true,
resolveStyle: (name: any) => {
return `ant-design-vue/es/${name}/style/index`
}
}
]
})
],
// 引用使用less的库要配置一下
css: {
preprocessorOptions: {
less: {
javascriptEnabled: true
}
}
},
// 让terminal显示network地址
server: {
host: '0.0.0.0'
}
}) })
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment