diff --git a/public/code/table.vue b/public/code/table.vue
new file mode 100644
index 00000000..d8413a39
--- /dev/null
+++ b/public/code/table.vue
@@ -0,0 +1,32 @@
+<!--
+ * @Descripttion: 此文件由SCUI生成，典型的VUE增删改列表页面组件
+ * @version: 1.0
+ * @Author: SCUI AutoCode 模板版本 1.0
+ * @Date: <% date %>
+ * @LastEditors: (最后更新作者)
+ * @LastEditTime: (最后更新时间)
+-->
+
+<template>
+	table
+</template>
+
+<script>
+	export default {
+		name: '<% name %>',
+		data() {
+			return {
+
+			}
+		},
+		mounted(){
+
+		},
+		methods: {
+
+		}
+	}
+</script>
+
+<style>
+</style>
diff --git a/src/main.js b/src/main.js
index 909be731..224b17b7 100644
--- a/src/main.js
+++ b/src/main.js
@@ -7,6 +7,7 @@ import config from "./config";
 import router from './router'
 import store from './store'
 import tool from './utils/tool'
+import http from "./utils/request";
 import api from './api'
 import permission from './utils/permission'
 
@@ -14,6 +15,7 @@ const app = createApp(App);
 
 app.config.globalProperties.$CONFIG = config;
 app.config.globalProperties.$TOOL = tool;
+app.config.globalProperties.$HTTP = http;
 app.config.globalProperties.$API = api;
 app.config.globalProperties.$HAS = permission;
 
diff --git a/src/router/index.js b/src/router/index.js
index 4bf3d088..500e06b4 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -36,6 +36,14 @@ const routes = [{
 							title: "个人信息"
 						},
 						component: () => import(/* webpackChunkName: "usercenter" */ '@/views/userCenter'),
+					},
+					{
+						name: "autocode",
+						path: "/autocode",
+						meta: {
+							title: "代码生成器"
+						},
+						component: () => import(/* webpackChunkName: "autocode" */ '@/views/autocode'),
 					}
 				]
 			}
diff --git a/src/style/style.less b/src/style/style.less
index 36d0fe6f..75983473 100644
--- a/src/style/style.less
+++ b/src/style/style.less
@@ -89,9 +89,12 @@ a,button,input,textarea{-webkit-tap-highlight-color:rgba(0,0,0,0);box-sizing: bo
 .el-menu-item.is-active {background: #ecf5ff;}
 .el-menu .el-menu-item a {color: inherit;text-decoration: none;display: block;width:100%;height:100%;position: absolute;top:0px;left:0px;}
 
+.el-form-item-msg {font-size: 12px;color: #999;}
+
 .el-container {height: 100%;}
 .el-aside {border-right: 1px solid #e6e6e6;background: #fff;padding-top:20px;}
 .el-header {background: #fff;border-bottom: 1px solid #e6e6e6;padding:13px 15px;}
+.el-footer {background: #fff;border-top: 1px solid #e6e6e6;padding:13px 15px;}
 .el-main {padding:15px;}
 .el-pagination {margin-top: 20px;}
 .el-drawer__body {overflow: auto;}
diff --git a/src/views/autocode/index.vue b/src/views/autocode/index.vue
new file mode 100644
index 00000000..ca8a2790
--- /dev/null
+++ b/src/views/autocode/index.vue
@@ -0,0 +1,197 @@
+<template>
+	<el-container>
+		<el-main>
+			<el-card shadow="never">
+				<el-tabs tab-position="top" type="card">
+				    <el-tab-pane label="列配置">
+
+						<el-button type="primary" icon="el-icon-plus" @click="table_add"></el-button>
+
+						<el-table :data="columnTableData" stripe @row-dblclick="table_edit">
+							<el-table-column label="排序" type="index" width="50">
+							</el-table-column>
+							<el-table-column label="显示名称" prop="title" width="150">
+								<template #default="scope">
+									<el-input v-if="scope.row.isSet" v-model="scope.row.title" placeholder="请输入内容"></el-input>
+									<span v-else>{{scope.row.title}}</span>
+								</template>
+							</el-table-column>
+							<el-table-column label="prop" prop="prop" width="150">
+								<template #default="scope">
+									<el-input v-if="scope.row.isSet" v-model="scope.row.prop" placeholder="请输入内容"></el-input>
+									<span v-else>{{scope.row.prop}}</span>
+								</template>
+							</el-table-column>
+							<el-table-column label="宽度" prop="width">
+								<template #default="scope">
+									<el-input v-if="scope.row.isSet" v-model="scope.row.width" placeholder="请输入内容"></el-input>
+									<span v-else>{{scope.row.width}}</span>
+								</template>
+							</el-table-column>
+
+							<el-table-column label="操作" fixed="right" width="100">
+								<template #default="scope">
+									<el-button @click="table_edit(scope.row, scope.$index)" type="text" size="small">{{scope.row.isSet?'保存':"修改"}}</el-button>
+									<el-popconfirm title="确定删除吗？" @confirm="table_del(scope.row, scope.$index)">
+										<template #reference>
+											<el-button type="text" size="small">删除</el-button>
+										</template>
+									</el-popconfirm>
+								</template>
+							</el-table-column>
+						</el-table>
+					</el-tab-pane>
+				    <el-tab-pane label="按钮配置">
+
+						<el-form ref="button" :model="button" label-width="80px">
+							<el-form-item label="按钮显示">
+								<el-checkbox label="创建" v-model="button.add"></el-checkbox>
+								<el-checkbox label="编辑" v-model="button.edit"></el-checkbox>
+								<el-checkbox label="删除" v-model="button.del"></el-checkbox>
+							</el-form-item>
+						</el-form>
+
+					</el-tab-pane>
+				    <el-tab-pane label="弹框设置">弹框设置</el-tab-pane>
+				    <el-tab-pane label="API路径配置">
+						<el-form ref="api" :model="api" label-width="80px">
+							<el-form-item label="列表接口">
+								<el-input v-model="api.listUrl"></el-input>
+								<div class="el-form-item-msg">需提前至api/index.js中定义接口路径</div>
+							</el-form-item>
+							<el-form-item label="新增接口">
+								<el-input v-model="api.addUrl"></el-input>
+							</el-form-item>
+							<el-form-item label="编辑接口">
+								<el-input v-model="api.editUrl"></el-input>
+							</el-form-item>
+							<el-form-item label="删除接口">
+								<el-input v-model="api.delUrl"></el-input>
+							</el-form-item>
+						</el-form>
+					</el-tab-pane>
+				</el-tabs>
+			</el-card>
+			<pre style="margin-top: 50px;display: none;">{{ code }}</pre>
+		</el-main>
+		<el-footer>
+			<el-button type="primary" icon="el-icon-download" @click="download">下载VUE文件</el-button>
+			<el-button type="primary" plain icon="el-icon-top-right" @click="showcode">预览代码</el-button>
+		</el-footer>
+	</el-container>
+
+
+	<el-dialog title="代码预览" v-model="codeVisible" width="60%" append-to-body>
+		<el-alert title="需将VUE文件放置views文件夹,路由匹配组件的路径下,如文件名为index.vue可不需要写文件名" type="success" show-icon style="margin-bottom: 20px;"></el-alert>
+		<pre contenteditable class="code">{{ code }}</pre>
+		<template #footer>
+			<el-button type="primary" @click="codeVisible = false">确 定</el-button>
+		</template>
+	</el-dialog>
+
+</template>
+
+<script>
+	export default {
+		name: 'autocode',
+		data() {
+			return {
+				codeVisible: false,
+				code: '',
+				button: {
+					add: true,
+					edit: true,
+					del: true
+				},
+				api: {
+					listUrl: "user.list",
+					addUrl: "user.add",
+					editUrl: "user.edit",
+					delUrl: "user.del"
+				},
+				columnTableData: [
+					{
+						title: "状态",
+						prop: "state",
+						width: "100"
+					},
+					{
+						title: "姓名",
+						prop: "name",
+						width: "200"
+					},
+					{
+						title: "类型",
+						prop: "type",
+						width: "100"
+					}
+				]
+			}
+		},
+		mounted(){
+			this.getTpl()
+		},
+		methods: {
+
+			table_add(){
+				var newRow = {
+					title: "",
+					prop: "",
+					width: "100",
+					isSet: true
+				}
+				this.columnTableData.push(newRow)
+			},
+
+			table_edit(row){
+				if(row.isSet){
+					row.isSet = false
+				}else{
+					row.isSet = true
+				}
+			},
+
+			table_del(row, index){
+
+				this.columnTableData.splice(index, 1)
+			},
+
+			showcode(){
+				this.codeVisible=true;
+			},
+
+			//同步获取模板文件
+			async getTpl(){
+				var data = await this.$HTTP.get('code/table.vue')
+				this.code = this.templateEngine(data, {name:"SCUI Demo", date:new Date().toLocaleString()})
+			},
+			//下载按钮
+			download(){
+				this.createFile(this.code)
+			},
+			//创建文件并下载
+			createFile(row){
+				const element = document.createElement('a')
+				element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(row))
+				element.setAttribute('download', 'index.vue')
+				element.style.display = 'none'
+				element.click()
+			},
+			//模板引擎
+			templateEngine(tpl, data){
+				/* eslint-disable */
+				var reg = /<%\s*([^%>]\S+)\s*%>/;
+				var _exec = null;
+				while (_exec = (reg.exec(tpl))) {
+					tpl = tpl.replace(_exec[0], data[_exec[1]]);
+				}
+				return tpl;
+				/* eslint-enable */
+			}
+		}
+	}
+</script>
+
+<style scoped>
+	.code {height:400px;overflow: auto;background: #333;color: #999;padding:20px;font-size: 14px;font-family: "consolas";line-height: 1.5;}
+</style>