数据库问文档重构优化
This commit is contained in:
暮光：城中城
@@ -7,12 +7,19 @@
|
||||
<el-aside>
|
||||
<div style="padding: 10px;height: 100%;box-sizing: border-box;background: #fafafa;">
|
||||
<div style="margin-bottom: 10px;">
|
||||
<el-select v-model="choiceDatasource" @change="datasourceChangeEvents" filterable placeholder="选择数据源" style="width: 100%;">
|
||||
<el-select v-model="choiceDatasource" @change="datasourceChangeEvents" filterable placeholder="请先选择数据源" style="width: 100%;">
|
||||
<el-option v-for="item in datasourceOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<el-menu :router="true" class="el-menu-vertical" style="height: auto;">
|
||||
<el-menu-item index="/"><i class="el-icon-s-home"></i>数据源管理</el-menu-item>
|
||||
<el-menu-item index="/"><i class="el-icon-s-home"></i>控制台</el-menu-item>
|
||||
<el-submenu index="1">
|
||||
<template slot="title">
|
||||
<i class="el-icon-s-platform"></i>
|
||||
<span slot="title">系统管理</span>
|
||||
</template>
|
||||
<el-menu-item index="/data/datasourceManage"><i class="el-icon-coin"></i>数据源管理</el-menu-item>
|
||||
</el-submenu>
|
||||
</el-menu>
|
||||
<el-tree :props="defaultProps" :data="databaseList" @node-click="handleNodeClick"
|
||||
ref="databaseTree" highlight-current draggable
|
||||
|
||||
@@ -8,6 +8,9 @@ import TableInfo from './views/table/Info.vue'
|
||||
import TableDatabase from './views/table/Database.vue'
|
||||
import TableRouterView from './views/table/RouterView.vue'
|
||||
|
||||
import DataDatasourceManage from './views/data/DatasourceManage.vue'
|
||||
import DataRouterView from './views/data/RouterView.vue'
|
||||
|
||||
import CommonNoAuth from './views/common/NoAuth.vue'
|
||||
|
||||
let routes = [
|
||||
@@ -34,6 +37,13 @@ let routes = [
|
||||
{path: 'info', name: '表信息',component: TableInfo},
|
||||
{path: 'database', name: '库信息',component: TableDatabase},
|
||||
]
|
||||
}, {
|
||||
path: '/data',
|
||||
name: '数据信息',
|
||||
component: DataRouterView,
|
||||
children: [
|
||||
{path: 'datasourceManage', name: '数据源管理',component: DataDatasourceManage},
|
||||
]
|
||||
}, {
|
||||
path: '/common',
|
||||
name: '',
|
||||
|
||||
118
zyplayer-doc-ui/db-ui/src/views/data/DatasourceManage.vue
Normal file
118
zyplayer-doc-ui/db-ui/src/views/data/DatasourceManage.vue
Normal file
@@ -0,0 +1,118 @@
|
||||
<template>
|
||||
<div style="padding: 10px;">
|
||||
<div style="max-width: 1200px;margin: 20px auto;">
|
||||
<el-card style="margin: 10px;">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>数据源管理</span>
|
||||
<el-button style="float: right;margin-left: 5px;" :loading="loadDataListLoading" v-on:click="getDatasourceList" plain icon="el-icon-refresh" size="small">刷新</el-button>
|
||||
<el-button style="float: right;" v-on:click="addDatasource" type="primary" icon="el-icon-circle-plus-outline" size="small">新增</el-button>
|
||||
</div>
|
||||
<el-table :data="datasourceList" stripe border style="width: 100%; margin-bottom: 5px;">
|
||||
<el-table-column prop="driverClassName" label="驱动类" width="200"></el-table-column>
|
||||
<el-table-column prop="sourceUrl" label="数据源URL"></el-table-column>
|
||||
<el-table-column prop="sourceName" label="账号"></el-table-column>
|
||||
<el-table-column prop="sourcePassword" label="密码"></el-table-column>
|
||||
<el-table-column label="操作" width="150">
|
||||
<template slot-scope="scope">
|
||||
<el-button v-on:click="editDatasource(scope.row)" type="primary" size="small">修改</el-button>
|
||||
<el-button v-on:click="deleteDatasource(scope.row)" type="danger" size="small">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-card>
|
||||
</div>
|
||||
<!--增加数据源弹窗-->
|
||||
<el-dialog :inline="true" :title="newDatasource.id>0?'编辑数据源':'新增数据源'" :visible.sync="datasourceDialogVisible" width="600px">
|
||||
<el-alert
|
||||
title="重要提醒"
|
||||
description="请录入正确可用的数据库连接、账号、密码信息，否则初始化数据源失败将影响整个系统，有可能需要重启服务才能解决"
|
||||
type="warning" :closable="false"
|
||||
show-icon style="margin-bottom: 10px;">
|
||||
</el-alert>
|
||||
<el-form label-width="120px">
|
||||
<el-form-item label="驱动类：">
|
||||
<el-select v-model="newDatasource.driverClassName" placeholder="驱动类" style="width: 100%">
|
||||
<el-option label="com.mysql.jdbc.Driver" value="com.mysql.jdbc.Driver"></el-option>
|
||||
<el-option label="net.sourceforge.jtds.jdbc.Driver" value="net.sourceforge.jtds.jdbc.Driver"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="数据源URL：">
|
||||
<el-input v-model="newDatasource.sourceUrl" placeholder="数据源URL"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="账号：">
|
||||
<el-input v-model="newDatasource.sourceName" placeholder="账号"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="密码：">
|
||||
<el-input v-model="newDatasource.sourcePassword" placeholder="密码"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" style="text-align: center;">
|
||||
<el-button v-on:click="saveDatasource" type="primary">保存</el-button>
|
||||
<el-button v-on:click="datasourceDialogVisible=false" plain>取消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import toast from '../../common/lib/common/toast'
|
||||
import global from '../../common/config/global'
|
||||
|
||||
var app;
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
loadDataListLoading: false,
|
||||
datasourceDialogVisible: false,
|
||||
datasourceList: [],
|
||||
newDatasource: {},
|
||||
};
|
||||
},
|
||||
mounted: function () {
|
||||
app = this;
|
||||
this.getDatasourceList();
|
||||
},
|
||||
methods: {
|
||||
addDatasource() {
|
||||
this.datasourceDialogVisible = true;
|
||||
this.newDatasource = {driverClassName: "", sourceUrl: "", sourceName: "", sourcePassword: ""};
|
||||
},
|
||||
editDatasource(row) {
|
||||
this.newDatasource = row;
|
||||
this.datasourceDialogVisible = true;
|
||||
},
|
||||
deleteDatasource(row) {
|
||||
this.$confirm('确定要删除此数据源吗？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
row.yn = 0;
|
||||
this.common.post(this.apilist1.manageUpdateDatasource, row, function (json) {
|
||||
app.$message.success("删除成功！");
|
||||
app.getDatasourceList();
|
||||
});
|
||||
}).catch(()=>{});
|
||||
},
|
||||
saveDatasource() {
|
||||
this.datasourceDialogVisible = false;
|
||||
this.common.post(this.apilist1.manageUpdateDatasource, this.newDatasource, function (json) {
|
||||
app.$message.success("保存成功！");
|
||||
app.getDatasourceList();
|
||||
});
|
||||
},
|
||||
getDatasourceList() {
|
||||
this.loadDataListLoading = true;
|
||||
this.common.post(this.apilist1.manageDatasourceList, {}, function (json) {
|
||||
app.datasourceList = json.data || [];
|
||||
setTimeout(()=>{app.loadDataListLoading = false;}, 800);
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
||||
4
zyplayer-doc-ui/db-ui/src/views/data/RouterView.vue
Normal file
4
zyplayer-doc-ui/db-ui/src/views/data/RouterView.vue
Normal file
@@ -0,0 +1,4 @@
|
||||
<template>
|
||||
<router-view></router-view>
|
||||
</template>
|
||||
|
||||
@@ -1,56 +1,8 @@
|
||||
<template>
|
||||
<div style="padding: 10px;">
|
||||
<div style="max-width: 1200px;margin: 20px auto;">
|
||||
<div style="text-align: center;">欢迎使用ヾ(๑╹◡╹)ﾉ"</div>
|
||||
<el-card style="margin: 10px;">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>数据源管理</span>
|
||||
<el-button style="float: right;" v-on:click="addDatasource" type="primary" icon="el-icon-circle-plus-outline" size="small">新增</el-button>
|
||||
</div>
|
||||
<el-table :data="datasourceList" stripe border style="width: 100%; margin-bottom: 5px;">
|
||||
<el-table-column prop="driverClassName" label="驱动类" width="200"></el-table-column>
|
||||
<el-table-column prop="sourceUrl" label="数据源URL"></el-table-column>
|
||||
<el-table-column prop="sourceName" label="账号"></el-table-column>
|
||||
<el-table-column prop="sourcePassword" label="密码"></el-table-column>
|
||||
<el-table-column label="操作" width="150">
|
||||
<template slot-scope="scope">
|
||||
<el-button v-on:click="editDatasource(scope.row)" type="primary" size="small">修改</el-button>
|
||||
<el-button v-on:click="deleteDatasource(scope.row)" type="danger" size="small">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-card>
|
||||
<div style="text-align: center;">欢迎使用ヾ(๑╹◡╹)ﾉ" - 在左上角选择一个数据源吧~</div>
|
||||
</div>
|
||||
<!--增加数据源弹窗-->
|
||||
<el-dialog :inline="true" :title="newDatasource.id>0?'编辑数据源':'新增数据源'" :visible.sync="datasourceDialogVisible" width="600px">
|
||||
<el-alert
|
||||
title="重要提醒"
|
||||
description="请录入正确可用的数据库连接、账号、密码信息，否则初始化数据源失败将影响整个系统，有可能需要重启服务才能解决"
|
||||
type="warning" :closable="false"
|
||||
show-icon style="margin-bottom: 10px;">
|
||||
</el-alert>
|
||||
<el-form label-width="120px">
|
||||
<el-form-item label="驱动类：">
|
||||
<el-select v-model="newDatasource.driverClassName" placeholder="驱动类" style="width: 100%">
|
||||
<el-option label="com.mysql.jdbc.Driver" value="com.mysql.jdbc.Driver"></el-option>
|
||||
<el-option label="net.sourceforge.jtds.jdbc.Driver" value="net.sourceforge.jtds.jdbc.Driver"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="数据源URL：">
|
||||
<el-input v-model="newDatasource.sourceUrl" placeholder="数据源URL"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="账号：">
|
||||
<el-input v-model="newDatasource.sourceName" placeholder="账号"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="密码：">
|
||||
<el-input v-model="newDatasource.sourcePassword" placeholder="密码"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" style="text-align: center;">
|
||||
<el-button v-on:click="saveDatasource" type="primary">保存</el-button>
|
||||
<el-button v-on:click="datasourceDialogVisible=false" plain>取消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -63,49 +15,12 @@
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
datasourceDialogVisible: false,
|
||||
datasourceList: [],
|
||||
newDatasource: {},
|
||||
};
|
||||
},
|
||||
mounted: function () {
|
||||
app = this;
|
||||
this.getDatasourceList();
|
||||
},
|
||||
methods: {
|
||||
addDatasource() {
|
||||
this.datasourceDialogVisible = true;
|
||||
this.newDatasource = {driverClassName: "", sourceUrl: "", sourceName: "", sourcePassword: ""};
|
||||
},
|
||||
editDatasource(row) {
|
||||
this.newDatasource = row;
|
||||
this.datasourceDialogVisible = true;
|
||||
},
|
||||
deleteDatasource(row) {
|
||||
this.$confirm('确定要删除此数据源吗？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
row.yn = 0;
|
||||
this.common.post(this.apilist1.manageUpdateDatasource, row, function (json) {
|
||||
app.$message.success("删除成功！");
|
||||
app.getDatasourceList();
|
||||
});
|
||||
}).catch(()=>{});
|
||||
},
|
||||
saveDatasource() {
|
||||
this.datasourceDialogVisible = false;
|
||||
this.common.post(this.apilist1.manageUpdateDatasource, this.newDatasource, function (json) {
|
||||
app.$message.success("保存成功！");
|
||||
app.getDatasourceList();
|
||||
});
|
||||
},
|
||||
getDatasourceList() {
|
||||
this.common.post(this.apilist1.manageDatasourceList, {}, function (json) {
|
||||
app.datasourceList = json.data || [];
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="table-database-vue">
|
||||
<el-card style="margin: 10px;" shadow="never">
|
||||
<div slot="header" class="clearfix">库信息</div>
|
||||
<el-form label-width="100px">
|
||||
@@ -65,10 +65,8 @@
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
.search-form-box{padding: 10px;}
|
||||
.page-info-box{text-align: right;margin: 20px 0 50px 0;}
|
||||
.table-database-vue .el-table td, .table-database-vue .el-table th{padding: 5px 0;}
|
||||
</style>
|
||||
|
||||
|
||||
@@ -123,5 +123,6 @@
|
||||
.table-info-vue .el-form-item{margin-bottom: 5px;}
|
||||
.table-info-vue .edit-table-desc{cursor: pointer; color: #409EFF;}
|
||||
.table-info-vue .description{cursor: pointer;}
|
||||
.table-info-vue .el-table td, .table-info-vue .el-table th{padding: 5px 0;}
|
||||
</style>
|
||||
|
||||
|
||||
@@ -360,6 +360,8 @@
|
||||
this.userSignOut();
|
||||
} else if (command == 'aboutDoc') {
|
||||
app.aboutDialogVisible = true;
|
||||
} else if (command == 'myInfo') {
|
||||
this.$router.push({path: '/user/myInfo'});
|
||||
} else if (command == 'console') {
|
||||
window.location = this.apilist1.HOST;
|
||||
} else {
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
var URL = {
|
||||
userLogin: '/login',
|
||||
userLogout: '/logout',
|
||||
getUserInfo: '/user/getUserInfo',
|
||||
getSelfUserInfo: '/user/info/selfInfo',
|
||||
pageUpdate: '/zyplayer-doc-wiki/page/update',
|
||||
pageChangeParent: '/zyplayer-doc-wiki/page/changeParent',
|
||||
pageList: '/zyplayer-doc-wiki/page/list',
|
||||
|
||||
@@ -8,11 +8,11 @@ var _fn = {
|
||||
// HOST: 'http://local.zyplayer.com:8083/zyplayer-doc-manage',
|
||||
// HOST1: 'http://local.zyplayer.com:8083/zyplayer-doc-manage',
|
||||
// 也可以直接使用线上的服务调试
|
||||
HOST: 'http://doc.zyplayer.com/zyplayer-doc-manage',
|
||||
HOST1: 'http://doc.zyplayer.com/zyplayer-doc-manage',
|
||||
// HOST: 'http://doc.zyplayer.com/zyplayer-doc-manage',
|
||||
// HOST1: 'http://doc.zyplayer.com/zyplayer-doc-manage',
|
||||
// 打包时使用下面这两行，文件就放在根目录下，所以当前路劲就好
|
||||
// HOST: './',
|
||||
// HOST1: './',
|
||||
HOST: './',
|
||||
HOST1: './',
|
||||
|
||||
mixUrl: function (host, url) {
|
||||
var p;
|
||||
|
||||
14
zyplayer-doc-ui/wiki-ui/src/doc-wiki.html
Normal file
14
zyplayer-doc-ui/wiki-ui/src/doc-wiki.html
Normal file
@@ -0,0 +1,14 @@
|
||||
<!DOCTYPE HTML>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
|
||||
<title>wiki文档管理系统</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import Home from './views/home/Home.vue'
|
||||
|
||||
import UserLogin from './views/user/Login.vue'
|
||||
import UserMyInfo from './views/user/MyInfo.vue'
|
||||
import UserRouterView from './views/user/RouterView.vue'
|
||||
|
||||
import PageShow from './views/page/Show.vue'
|
||||
@@ -23,6 +24,7 @@ let routes = [
|
||||
component: UserRouterView,
|
||||
children: [
|
||||
{path: 'login', name: '系统登录',component: UserLogin, meta: {fullscreen: true}},
|
||||
{path: 'myInfo', name: '我的信息',component: UserMyInfo},
|
||||
]
|
||||
}, {
|
||||
path: '/page',
|
||||
|
||||
49
zyplayer-doc-ui/wiki-ui/src/views/user/MyInfo.vue
Normal file
49
zyplayer-doc-ui/wiki-ui/src/views/user/MyInfo.vue
Normal file
@@ -0,0 +1,49 @@
|
||||
<template>
|
||||
<div class="my-info-vue">
|
||||
<el-breadcrumb separator-class="el-icon-arrow-right" style="padding: 20px 10px;">
|
||||
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>我的信息</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<div style="margin: 0 auto;max-width: 1000px;">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">我的信息</div>
|
||||
<el-form class="search-form-box" label-width="100px">
|
||||
<el-form-item label="账号：">{{userInfo.userNo}}</el-form-item>
|
||||
<el-form-item label="用户名：">{{userInfo.userName}}</el-form-item>
|
||||
<el-form-item label="手机号：">{{userInfo.phone}}</el-form-item>
|
||||
<el-form-item label="邮箱：">{{userInfo.email}}</el-form-item>
|
||||
<el-form-item label="状态：">{{userInfo.delFlag==0?'正常':'停用'}}</el-form-item>
|
||||
<el-form-item label="性别：">{{userInfo.sex==0?'女':'男'}}</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
var app;
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
userInfo: {}
|
||||
};
|
||||
},
|
||||
mounted: function () {
|
||||
app = this;
|
||||
this.getUserInfo();
|
||||
},
|
||||
methods: {
|
||||
getUserInfo() {
|
||||
this.common.post(this.apilist1.getSelfUserInfo, this.searchParam, function (json) {
|
||||
app.userInfo = json.data;
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
.my-info-vue{}
|
||||
.my-info-vue .box-card{margin: 10px;}
|
||||
</style>
|
||||
|
||||
@@ -11,15 +11,15 @@ module.exports = (options = {}) => ({
|
||||
},
|
||||
output: {
|
||||
path: resolve(__dirname, 'dist'),
|
||||
filename: options.dev ? '[name].js' : '[name].js?[chunkhash]',
|
||||
filename: options.dev ? '[name].js' : 'doc-wiki-[name].js?[chunkhash]',
|
||||
chunkFilename: '[id].js?[chunkhash]',
|
||||
publicPath: options.dev ? '/assets/' : publicPath
|
||||
},
|
||||
module: {
|
||||
rules: [{
|
||||
test: /\.vue$/,
|
||||
use: ['vue-loader']
|
||||
},
|
||||
test: /\.vue$/,
|
||||
use: ['vue-loader']
|
||||
},
|
||||
{
|
||||
test: /\.js$/,
|
||||
use: ['babel-loader'],
|
||||
@@ -34,7 +34,7 @@ module.exports = (options = {}) => ({
|
||||
use: [{
|
||||
loader: 'url-loader',
|
||||
options: {
|
||||
limit: 10000
|
||||
limit: 800000
|
||||
}
|
||||
}]
|
||||
}
|
||||
@@ -45,7 +45,8 @@ module.exports = (options = {}) => ({
|
||||
names: ['vendor', 'manifest']
|
||||
}),
|
||||
new HtmlWebpackPlugin({
|
||||
template: 'src/index.html'
|
||||
template: options.dev ? 'src/index.html':'src/doc-wiki.html',
|
||||
filename: options.dev ? 'index.html':'doc-wiki.html',
|
||||
})
|
||||
],
|
||||
resolve: {
|
||||
|
||||
Reference in New Issue
Block a user