diff --git a/zyplayer-doc-ui/db-ui/package.json b/zyplayer-doc-ui/db-ui/package.json
index 76fdef3c..80e6de11 100644
--- a/zyplayer-doc-ui/db-ui/package.json
+++ b/zyplayer-doc-ui/db-ui/package.json
@@ -19,6 +19,7 @@
 		"js-cookie": "^2.2.1",
 		"pouchdb": "^7.1.1",
 		"sql-formatter": "^2.3.3",
+		"umy-ui": "^1.1.6",
 		"vue": "^2.6.10",
 		"vue-axios": "^2.1.5",
 		"vue-clipboard2": "^0.3.1",
diff --git a/zyplayer-doc-ui/db-ui/src/main.js b/zyplayer-doc-ui/db-ui/src/main.js
index 250a453d..7a6441a6 100644
--- a/zyplayer-doc-ui/db-ui/src/main.js
+++ b/zyplayer-doc-ui/db-ui/src/main.js
@@ -1,6 +1,8 @@
 import Vue from 'vue';
 import ElementUI from 'element-ui';
 import 'element-ui/lib/theme-chalk/index.css';
+import UmyUi from 'umy-ui';
+import 'umy-ui/lib/theme-chalk/index.css';
 import App from './App.vue';
 
 import VueRouter from 'vue-router';
@@ -16,6 +18,7 @@ import VueClipboard from 'vue-clipboard2';
 
 Vue.use(VueClipboard);
 Vue.use(ElementUI);
+Vue.use(UmyUi);
 Vue.use(VueRouter);
 Vue.use(VueAxios, axios);
 Vue.use(vueHljs);
diff --git a/zyplayer-doc-ui/db-ui/src/views/data/DataPreview.vue b/zyplayer-doc-ui/db-ui/src/views/data/DataPreview.vue
index dcbdd95e..b2e7b5ce 100644
--- a/zyplayer-doc-ui/db-ui/src/views/data/DataPreview.vue
+++ b/zyplayer-doc-ui/db-ui/src/views/data/DataPreview.vue
@@ -1,25 +1,33 @@
 <template>
-    <div class="data-executor-vue">
-        <div style="padding: 0 10px 10px;height: 100%;box-sizing: border-box;">
-            <el-card style="margin-bottom: 10px;">
-				<ace-editor v-model="sqlExecutorContent" @init="sqlExecutorInit" lang="sql" theme="monokai" width="100%" height="60" :options="sqlEditorConfig" :source="executorSource" style="margin-bottom: 10px;"></ace-editor>
-                <div>
-                    <el-button v-if="sqlExecuting" v-on:click="cancelExecutorSql" type="primary" plain  size="small" icon="el-icon-video-pause">取消执行</el-button>
-                    <el-tooltip v-else effect="dark" content="Ctrl+R、Ctrl+Enter" placement="top">
-                        <el-button v-on:click="doExecutorClick" type="primary" plain  size="small" icon="el-icon-video-play">筛选</el-button>
-                    </el-tooltip>
-                    <el-button icon="el-icon-refresh-left" size="small" @click="refreshData">重置</el-button>
-					<el-button @click="downloadTableData" type="success" size="small" icon="el-icon-download" plain style="margin-left: 30px;">导出</el-button>
-                </div>
-            </el-card>
-            <el-card>
-                <div v-if="!!executeError" style="color: #f00;">{{executeError}}</div>
-                <div v-else-if="sqlExecuting" v-loading="sqlExecuting" style="padding: 20px 0;">数据加载中...</div>
-                <div v-else-if="executeResultList.length <= 0" v-loading="sqlExecuting" style="padding: 20px 0;">暂无数据</div>
+	<div class="data-executor-vue">
+		<div style="padding: 0 10px 10px;height: 100%;box-sizing: border-box;">
+			<el-card style="margin-bottom: 10px;">
+				<ace-editor v-model="sqlExecutorContent" @init="sqlExecutorInit" lang="sql" theme="monokai" width="100%"
+										height="60" :options="sqlEditorConfig" :source="executorSource"
+										style="margin-bottom: 10px;"></ace-editor>
+				<div>
+					<el-button v-if="sqlExecuting" v-on:click="cancelExecutorSql" type="primary" plain size="small"
+										 icon="el-icon-video-pause">取消执行
+					</el-button>
+					<el-tooltip v-else effect="dark" content="Ctrl+R、Ctrl+Enter" placement="top">
+						<el-button v-on:click="doExecutorClick" type="primary" plain size="small" icon="el-icon-video-play">筛选
+						</el-button>
+					</el-tooltip>
+					<el-button icon="el-icon-refresh-left" size="small" @click="refreshData">重置</el-button>
+					<el-button @click="downloadTableData" type="success" size="small" icon="el-icon-download" plain
+										 style="margin-left: 30px;">导出
+					</el-button>
+				</div>
+			</el-card>
+			<el-card>
+				<div v-if="!!executeError" style="color: #f00;">{{ executeError }}</div>
+				<div v-else-if="sqlExecuting" v-loading="sqlExecuting" style="padding: 20px 0;">数据加载中...</div>
+				<div v-else-if="executeResultList.length <= 0" v-loading="sqlExecuting" style="padding: 20px 0;">暂无数据</div>
 				<div v-else style="position: relative;">
 					<div style="position: absolute;right: 0;z-index: 1;" v-show="executeShowTable !== 'table0'">
 						<span v-show="choiceResultObj[executeShowTable] && choiceResultObj[executeShowTable].length > 0">
-							<el-button icon="el-icon-delete" size="small" @click="deleteCheckLine" type="danger" plain style="margin-right: 10px;">删除</el-button>
+							<el-button icon="el-icon-delete" size="small" @click="deleteCheckLine" type="danger" plain
+												 style="margin-right: 10px;">删除</el-button>
 							<!-- 复制选中行 -->
 							<el-dropdown @command="handleCopyCheckLineCommand">
 								<el-button type="primary" size="small" icon="el-icon-document-copy">
@@ -33,56 +41,67 @@
 							</el-dropdown>
 						</span>
 						<el-tooltip effect="dark" content="选择展示列" placement="top">
-							<el-button icon="el-icon-setting" size="small" style="margin-left: 10px;" @click="choiceShowColumnDrawerShow"></el-button>
+							<el-button icon="el-icon-setting" size="small" style="margin-left: 10px;"
+												 @click="choiceShowColumnDrawerShow"></el-button>
 						</el-tooltip>
 					</div>
 					<el-tabs v-model="executeShowTable">
-                        <el-tab-pane label="信息" name="table0">
-                            <pre>{{executeResultInfo}}</pre>
-                        </el-tab-pane>
-						<el-tab-pane :label="'结果'+resultItem.index" :name="resultItem.name" v-for="resultItem in executeResultList" v-if="!!resultItem.index">
-							<div v-if="!!resultItem.errMsg" style="color: #f00;">{{resultItem.errMsg}}</div>
-							<div v-else-if="resultItem.dataList.length <= 0" style="text-align: center; color: #aaa; padding: 20px 0;">暂无数据</div>
+						<el-tab-pane label="信息" name="table0">
+							<pre>{{ executeResultInfo }}</pre>
+						</el-tab-pane>
+						<el-tab-pane :label="'结果'+resultItem.index" :name="resultItem.name"
+												 v-for="resultItem in executeResultList" v-if="!!resultItem.index">
+							<div v-if="!!resultItem.errMsg" style="color: #f00;">{{ resultItem.errMsg }}</div>
+							<div v-else-if="resultItem.dataList.length <= 0"
+									 style="text-align: center; color: #aaa; padding: 20px 0;">暂无数据
+							</div>
 							<template v-else>
-								<el-table :data="resultItem.dataList" stripe border style="width: 100%; margin-bottom: 5px;" class="execute-result-table" :max-height="tableMaxHeight"
-										  @selection-change="handleSelectionChange"
-										  @sort-change="tableSortChange"
-										  :default-sort="tableSort">
-									<el-table-column type="selection" width="55"></el-table-column>
-									<el-table-column type="index" width="50"></el-table-column>
-									<el-table-column sortable v-for="item in resultItem.dataCols" :prop="item.prop" :label="item.prop" :width="item.width">
+								<ux-grid
+										:data="resultItem.dataList"
+										stripe
+										border
+										:height="height"
+										style="width: 100%; margin-bottom: 5px;" class="execute-result-table" :max-height="tableMaxHeight"
+										@selection-change="handleSelectionChange"
+										@sort-change="tableSortChange"
+										:default-sort="tableSort">
+									<ux-table-column type="checkbox" width="55"></ux-table-column>
+									<ux-table-column type="index" width="50" title=" "></ux-table-column>
+									<ux-table-column sortable v-for="item in resultItem.dataCols" :prop="item.prop" :title="item.prop"
+																	 :width="item.width">
 										<template slot="header" slot-scope="scope">
 											<el-tooltip effect="dark" :content="item.desc" placement="top">
-												<span>{{item.prop}}</span>
+												<span>{{ item.prop }}</span>
 											</el-tooltip>
 										</template>
 										<template slot-scope="scope">
 											<textarea readonly :value="scope.row[item.prop]" class="el-textarea__inner" rows="1"></textarea>
 										</template>
-									</el-table-column>
-								</el-table>
+									</ux-table-column>
+								</ux-grid>
 								<el-pagination
-									style="margin-top: 10px;"
-									@size-change="handlePageSizeChange"
-									@current-change="handleCurrentChange"
-									:current-page="currentPage"
-									:page-sizes="[50, 100, 300, 500]"
-									:page-size="pageSize"
-									layout="total, sizes, prev, pager, next, jumper"
-									:total="tableTotalCount">
+										style="margin-top: 10px;"
+										@size-change="handlePageSizeChange"
+										@current-change="handleCurrentChange"
+										:current-page="currentPage"
+										:page-sizes="[50, 100, 300, 500]"
+										:page-size="pageSize"
+										layout="total, sizes, prev, pager, next, jumper"
+										:total="tableTotalCount">
 								</el-pagination>
 							</template>
-                        </el-tab-pane>
-                    </el-tabs>
-                </div>
-            </el-card>
-        </div>
+						</el-tab-pane>
+					</el-tabs>
+				</div>
+			</el-card>
+		</div>
 		<!--选择导出为update的条件列弹窗-->
 		<el-dialog :visible.sync="exportConditionVisible" width="500px" title="选择更新语句条件">
 			<div>
 				更新条件列：
 				<el-select v-model="conditionDataColsChoice" multiple placeholder="请选择" style="width: 370px;">
-					<el-option v-for="item in conditionDataCols" :key="item.prop" :label="item.prop" :value="item.prop"></el-option>
+					<el-option v-for="item in conditionDataCols" :key="item.prop" :label="item.prop"
+										 :value="item.prop"></el-option>
 				</el-select>
 			</div>
 			<span slot="footer" class="dialog-footer">
@@ -94,7 +113,8 @@
 		<el-dialog :visible.sync="downloadDataVisible" width="600px" title="表数据导出">
 			<el-form label-width="120px">
 				<el-form-item label="导出类型：">
-					<el-select v-model="downloadDataParam.downloadType" filterable placeholder="请选择导出类型" style="width: 370px;">
+					<el-select v-model="downloadDataParam.downloadType" filterable placeholder="请选择导出类型"
+										 style="width: 370px;">
 						<el-option label="SQL Inserts" value="insert"></el-option>
 						<el-option label="SQL Updates" value="update"></el-option>
 						<el-option label="JSON" value="json"></el-option>
@@ -102,12 +122,18 @@
 					</el-select>
 				</el-form-item>
 				<el-form-item label="数据表：" v-if="downloadDataParam.downloadType === 'insert'">
-					<el-checkbox :true-label="1" :false-label="0" v-model="downloadDataParam.dropTableFlag" @change="dropTableFlagChange">删除表{{downloadDataParam.dropTableFlag==1?'!!':''}}</el-checkbox>
-					<el-checkbox :true-label="1" :false-label="0" v-model="downloadDataParam.createTableFlag" @change="createTableFlagChange">创建表</el-checkbox>
+					<el-checkbox :true-label="1" :false-label="0" v-model="downloadDataParam.dropTableFlag"
+											 @change="dropTableFlagChange">删除表{{ downloadDataParam.dropTableFlag == 1 ? '!!' : '' }}
+					</el-checkbox>
+					<el-checkbox :true-label="1" :false-label="0" v-model="downloadDataParam.createTableFlag"
+											 @change="createTableFlagChange">创建表
+					</el-checkbox>
 				</el-form-item>
 				<el-form-item label="更新条件列：" v-if="downloadDataParam.downloadType === 'update'">
-					<el-select v-model="downloadDataParam.conditionColumnArr" multiple placeholder="不选则是没有条件的更新" style="width: 370px;">
-						<el-option v-for="item in conditionDataCols" :key="item.prop" :label="item.prop" :value="item.prop"></el-option>
+					<el-select v-model="downloadDataParam.conditionColumnArr" multiple placeholder="不选则是没有条件的更新"
+										 style="width: 370px;">
+						<el-option v-for="item in conditionDataCols" :key="item.prop" :label="item.prop"
+											 :value="item.prop"></el-option>
 					</el-select>
 				</el-form-item>
 			</el-form>
@@ -127,472 +153,486 @@
 					<el-col :span="12">选择展示列</el-col>
 					<el-col :span="12" style="text-align: right;">
 						<el-checkbox v-model="choiceShowColumnAll" @change="choiceShowColumnAllChange">全选</el-checkbox>
-						<el-button type="primary" size="mini" @click="choiceShowColumnOk" style="margin-left: 10px;">确定</el-button>
+						<el-button type="primary" size="mini" @click="choiceShowColumnOk" style="margin-left: 10px;">确定
+						</el-button>
 					</el-col>
 				</el-row>
 			</div>
 			<div style="overflow: auto; height: calc(100vh - 50px);">
-				<el-tree ref="showColumnTree" node-key="name" :props="showColumnProps" :data="tableDataColumns" check-on-click-node show-checkbox
-					@check-change="tableDataColumnsCheckChange">
+				<el-tree ref="showColumnTree" node-key="name" :props="showColumnProps" :data="tableDataColumns"
+								 check-on-click-node show-checkbox
+								 @check-change="tableDataColumnsCheckChange">
 				</el-tree>
 			</div>
 		</el-drawer>
 		<form method="post" ref="downloadForm" :action="downloadFormParam.url" target="_blank">
 			<input type="hidden" :name="key" :value="val" v-for="(val,key) in downloadFormParam.param">
 		</form>
-        <span id="widthCalculate" style="visibility: hidden; white-space: nowrap;position: fixed;"></span>
-    </div>
+		<span id="widthCalculate" style="visibility: hidden; white-space: nowrap;position: fixed;"></span>
+	</div>
 </template>
 
 <script>
-    import datasourceApi from '../../common/api/datasource'
-	import copyFormatter from './copy/index'
-    import sqlFormatter from "sql-formatter";
-	import aceEditor from "../../common/lib/ace-editor";
-	import storageUtil from "../../common/lib/zyplayer/storageUtil";
+import datasourceApi from '../../common/api/datasource'
+import copyFormatter from './copy/index'
+import sqlFormatter from "sql-formatter";
+import aceEditor from "../../common/lib/ace-editor";
+import storageUtil from "../../common/lib/zyplayer/storageUtil";
 
-    export default {
-    	name: 'dataPreview',
-        data() {
-            return {
-                sqlExecuting: false,
-                executeResultList: [],
-                executeResultInfo: "",
-                executeShowTable: "table1",
-                sqlExecutorEditor: {},
-                nowExecutorId: 1,
-                executeError: "",
-				pageParam: {},
-                vueQueryParam: {},
-                pageSize: 50,
-                currentPage: 1,
-                tableTotalCount: 0,
-                tableSort: {},
-                tableMaxHeight: 600,
-				tableStatusInfo: {},
-				// 选择复制
-				choiceResultObj: {},
-				exportConditionVisible: false,
-				tableDataColumns: [],
-				conditionDataCols: [],
-				conditionDataColsChoice: [],
-				// 导出
-				downloadDataVisible: false,
-				downloadDataParam: {
-					downloadType: 'insert',
-					dropTableFlag: 0,
-					createTableFlag: 0,
-					conditionColumnArr: [],
-					retainColumnArr: [],
-				},
-				downloadFormParam: {
-					url: 'zyplayer-doc-db/data-view/downloadMultiple',
-					param: {}
-				},
-				// 选择展示列
-				choiceShowColumnDrawer: false,
-				showColumnProps: {label: 'name'},
-				choiceShowColumnLast: [],
-				choiceShowColumnAll: true,
-				// 编辑器
-				sqlExecutorContent: '',
-				sqlEditorConfig: {
-					wrap: true,
-					autoScrollEditorIntoView: true,
-					enableBasicAutocompletion: true,
-					enableSnippets: true,
-					enableLiveAutocompletion: true,
-					minLines: 3,
-					maxLines: 3,
-				},
-				executorSource: {},
-				columnMap: {},
-				primaryKeyColumn: {},
-				storageKey: {
-					key: 'zyplayer-doc-table-show-columns', subKey: ''
-				},
-            }
-        },
-		components: {
-			'ace-editor': aceEditor
+export default {
+	name: 'dataPreview',
+	data() {
+		return {
+			height: 0,
+			sqlExecuting: false,
+			executeResultList: [],
+			executeResultInfo: "",
+			executeShowTable: "table1",
+			sqlExecutorEditor: {},
+			nowExecutorId: 1,
+			executeError: "",
+			pageParam: {},
+			vueQueryParam: {},
+			pageSize: 50,
+			currentPage: 1,
+			tableTotalCount: 0,
+			tableSort: {},
+			tableMaxHeight: 600,
+			tableStatusInfo: {},
+			// 选择复制
+			choiceResultObj: {},
+			exportConditionVisible: false,
+			tableDataColumns: [],
+			conditionDataCols: [],
+			conditionDataColsChoice: [],
+			// 导出
+			downloadDataVisible: false,
+			downloadDataParam: {
+				downloadType: 'insert',
+				dropTableFlag: 0,
+				createTableFlag: 0,
+				conditionColumnArr: [],
+				retainColumnArr: [],
+			},
+			downloadFormParam: {
+				url: 'zyplayer-doc-db/data-view/downloadMultiple',
+				param: {}
+			},
+			// 选择展示列
+			choiceShowColumnDrawer: false,
+			showColumnProps: {label: 'name'},
+			choiceShowColumnLast: [],
+			choiceShowColumnAll: true,
+			// 编辑器
+			sqlExecutorContent: '',
+			sqlEditorConfig: {
+				wrap: true,
+				autoScrollEditorIntoView: true,
+				enableBasicAutocompletion: true,
+				enableSnippets: true,
+				enableLiveAutocompletion: true,
+				minLines: 3,
+				maxLines: 3,
+			},
+			executorSource: {},
+			columnMap: {},
+			primaryKeyColumn: {},
+			storageKey: {
+				key: 'zyplayer-doc-table-show-columns', subKey: ''
+			},
+		}
+	},
+	components: {
+		'ace-editor': aceEditor
+	},
+	mounted: function () {
+		this.height = 500;
+		// 延迟设置展开的目录，edit比app先初始化
+		// setTimeout(() => {
+		// 	this.doExecutorSqlCommon();
+		// this.$emit('initLoadDataList', {
+		// 	sourceId: this.vueQueryParam.sourceId,
+		// 	host: this.vueQueryParam.host,
+		// 	dbName: this.vueQueryParam.dbName
+		// });
+		// }, 500);
+		let resizeWindow = () => {
+			this.tableMaxHeight = document.body.clientHeight - 420;
+		};
+		resizeWindow();
+		window.onresize = resizeWindow;
+	},
+	methods: {
+		init(param, columnList) {
+			if (this.pageParam.sourceId == param.sourceId) {
+				return;
+			}
+			this.pageParam = param;
+			this.executorSource = {sourceId: param.sourceId, dbName: param.dbName, tableName: param.tableName};
+			this.columnMap = {};
+			columnList.forEach(item => {
+				this.columnMap[item.name] = item;
+				if (item.primaryKey == 1) {
+					this.primaryKeyColumn = item;
+				}
+			});
+			this.tableDataColumns = columnList;
+			// 设置选择展示的列
+			this.storageKey.subKey = param.sourceId + '-' + param.dbName + '-' + param.tableName;
+			let storageShowColumns = storageUtil.set.get(this.storageKey.key, this.storageKey.subKey);
+			this.choiceShowColumnLast = columnList.map(val => val.name);
+			if (storageShowColumns) {
+				let showColumns = storageShowColumns.split(',');
+				showColumns = showColumns.filter(item => this.choiceShowColumnLast.indexOf(item) >= 0);
+				if (showColumns.length > 0) {
+					this.choiceShowColumnLast = showColumns;
+				}
+			}
+			this.doExecutorSqlCommon();
+			// this.vueQueryParam = to.query;
+			// let newName = {key: this.$route.fullPath, val: '数据-'+this.vueQueryParam.tableName};
+			// this.$store.commit('global/addTableName', newName);
+			// datasourceApi.tableStatus(this.pageParam).then(json => {
+			// 	this.tableStatusInfo = json.data || {};
+			// });
 		},
-        mounted: function () {
-			// 延迟设置展开的目录，edit比app先初始化
-			// setTimeout(() => {
-			// 	this.doExecutorSqlCommon();
-				// this.$emit('initLoadDataList', {
-				// 	sourceId: this.vueQueryParam.sourceId,
-				// 	host: this.vueQueryParam.host,
-				// 	dbName: this.vueQueryParam.dbName
-				// });
-			// }, 500);
-			let resizeWindow = () => {
-				this.tableMaxHeight = document.body.clientHeight - 420;
+		sqlExecutorInit(editor) {
+			this.sqlExecutorEditor = editor;
+			this.sqlExecutorEditor.setFontSize(16);
+			let that = this;
+			this.sqlExecutorEditor.commands.addCommand({
+				name: "execute-sql",
+				bindKey: {win: "Ctrl-R|Ctrl-Shift-R|Ctrl-Enter", mac: "Command-R|Command-Shift-R|Command-Enter"},
+				exec: function (editor) {
+					that.doExecutorClick();
+				}
+			});
+		},
+		handleCurrentChange(to) {
+			this.currentPage = to;
+			this.doExecutorSqlCommon();
+		},
+		handlePageSizeChange(to) {
+			this.pageSize = to;
+			this.currentPage = 1;
+			this.doExecutorSqlCommon();
+		},
+		tableSortChange(sort) {
+			if (this.tableSort.prop === sort.prop && this.tableSort.order === sort.order) return;
+			this.tableSort = {prop: sort.prop, order: sort.order};
+			this.doExecutorSqlCommon();
+		},
+		refreshData() {
+			this.tableSort = {};
+			this.currentPage = 1;
+			this.sqlExecutorEditor.setValue('', 1);
+			this.doExecutorSqlCommon();
+		},
+		cancelExecutorSql() {
+			datasourceApi.executeSqlCancel({executeId: this.nowExecutorId}).then(() => {
+				this.sqlExecuting = false;
+				this.$message.success("取消成功");
+			});
+		},
+		doExecutorClick() {
+			this.tableSort = {};
+			this.currentPage = 1;
+			this.doExecutorSqlCommon();
+		},
+		doExecutorSqlCommon() {
+			if (!this.pageParam.sourceId) {
+				this.$message.error("请先选择数据源");
+				return;
+			}
+			if (!this.tableSort.prop) {
+				this.tableSort = {prop: this.pageParam.orderColumn, order: 'ascending'};
+			}
+			let conditionSql = this.sqlExecutorEditor.getSelectedText();
+			conditionSql = conditionSql || this.sqlExecutorEditor.getValue();
+			conditionSql = conditionSql || "";
+			this.executeError = "";
+			this.executeUseTime = "";
+			this.choiceResultObj = {};
+			this.executeResultList = [];
+			this.nowExecutorId = (new Date()).getTime() + Math.ceil(Math.random() * 1000);
+			this.sqlExecuting = true;
+			let param = {
+				sourceId: this.pageParam.sourceId,
+				dbName: this.pageParam.dbName,
+				tableName: this.pageParam.tableName,
+				executeId: this.nowExecutorId,
+				condition: conditionSql,
+				retainColumn: this.choiceShowColumnLast.join(','),
+				pageNum: this.currentPage,
+				pageSize: this.pageSize,
+				orderColumn: this.tableSort.prop,
+				orderType: (this.tableSort.order === 'ascending' ? 'asc' : 'desc'),
+				params: '',
 			};
-			resizeWindow();
-			window.onresize = resizeWindow;
-        },
-        methods: {
-			init(param, columnList) {
-				if (this.pageParam.sourceId == param.sourceId) {
+			datasourceApi.dataViewQuery(param).then(json => {
+				this.sqlExecuting = false;
+				if (json.errCode !== 200) {
+					this.executeError = json.errMsg;
 					return;
 				}
-				this.pageParam = param;
-				this.executorSource = {sourceId: param.sourceId, dbName: param.dbName, tableName: param.tableName};
-				this.columnMap = {};
-				columnList.forEach(item => {
-					this.columnMap[item.name] = item;
-					if (item.primaryKey == 1) {
-						this.primaryKeyColumn = item;
+				let resultList = json.data || [];
+				let executeResultList = [];
+				let executeResultInfo = "", itemIndex = 1;
+				for (let i = 0; i < resultList.length; i++) {
+					let objItem = JSON.parse(resultList[i]);
+					executeResultInfo += this.getExecuteInfoStr(objItem);
+					let resultItem = this.dealExecuteResult(objItem);
+					if (resultItem.updateCount < 0) {
+						resultItem.index = itemIndex;
+						resultItem.name = 'table' + itemIndex;
+						itemIndex++;
 					}
+					executeResultList.push(resultItem);
+				}
+				if (!!json.total) {
+					this.tableTotalCount = json.total || 0;
+				}
+				this.executeShowTable = (itemIndex === 1) ? "table0" : "table1";
+				this.executeResultInfo = executeResultInfo;
+				this.executeResultList = executeResultList;
+			}).catch(e => {
+				this.sqlExecuting = false;
+			});
+		},
+		getExecuteInfoStr(resultData) {
+			var resultStr = resultData.sql;
+			resultStr += "\n> 状态：" + ((!!resultData.errMsg) ? "ERROR" : "OK");
+			if (resultData.updateCount >= 0) {
+				resultStr += "\n> 影响行数：" + resultData.updateCount;
+			}
+			resultStr += "\n> 耗时：" + (resultData.useTime || 0) / 1000 + "s";
+			resultStr += "\n\n";
+			return resultStr;
+		},
+		dealExecuteResult(resultData) {
+			var dataList = resultData.result || [];
+			var executeResultCols = [];
+			if (dataList.length > 0) {
+				var propData = dataList[0];
+				for (var key in propData) {
+					// 动态计算宽度~自己想的一个方法，666
+					document.getElementById("widthCalculate").innerText = key;
+					var width1 = document.getElementById("widthCalculate").offsetWidth;
+					document.getElementById("widthCalculate").innerText = propData[key];
+					var width2 = document.getElementById("widthCalculate").offsetWidth;
+					var width = (width1 > width2) ? width1 : width2;
+					width = (width < 50) ? 50 : width;
+					width = (width > 200) ? 200 : width;
+					let column = this.columnMap[key] || {};
+					executeResultCols.push({prop: key, width: width + 50, desc: (column.description || key)});
+				}
+			}
+			var resultObj = {};
+			resultObj.dataList = dataList;
+			resultObj.dataCols = executeResultCols;
+			resultObj.useTime = resultData.useTime || 0;
+			resultObj.errMsg = resultData.errMsg || "";
+			resultObj.updateCount = resultData.updateCount;
+			return resultObj;
+		},
+		handleSelectionChange(val) {
+			this.$set(this.choiceResultObj, this.executeShowTable, val);
+		},
+		doCopyCheckLineUpdate() {
+			let choiceData = this.choiceResultObj[this.executeShowTable] || [];
+			if (choiceData.length > 0) {
+				let dataCols = this.executeResultList.find(item => item.name === this.executeShowTable).dataCols;
+				let copyData = copyFormatter.format('update', this.pageParam.dbType, dataCols, choiceData, this.conditionDataColsChoice, this.pageParam.dbName, this.pageParam.tableName);
+				this.conditionDataColsChoice = [];
+				this.exportConditionVisible = false;
+				this.$copyText(copyData).then(
+						res => this.$message.success("内容已复制到剪切板！"),
+						err => this.$message.error("抱歉，复制失败！")
+				);
+			}
+		},
+		deleteCheckLine() {
+			let choiceData = this.choiceResultObj[this.executeShowTable] || [];
+			if (choiceData.length > 0) {
+				let primaryKey = this.primaryKeyColumn.name;
+				if (!primaryKey) {
+					this.$message.error("删除失败，未找到数据表的主键列");
+					return;
+				}
+				// 通过主键ID和值删除行的数据
+				let deleteParam = [];
+				choiceData.forEach(item => {
+					let line = {};
+					line[primaryKey] = item[primaryKey];
+					deleteParam.push(line);
 				});
-				this.tableDataColumns = columnList;
-				// 设置选择展示的列
-				this.storageKey.subKey = param.sourceId + '-' + param.dbName + '-' + param.tableName;
-				let storageShowColumns = storageUtil.set.get(this.storageKey.key, this.storageKey.subKey);
-				this.choiceShowColumnLast = columnList.map(val => val.name);
-				if (storageShowColumns) {
-					let showColumns = storageShowColumns.split(',');
-					showColumns = showColumns.filter(item => this.choiceShowColumnLast.indexOf(item) >= 0);
-					if (showColumns.length > 0) {
-						this.choiceShowColumnLast = showColumns;
-					}
-				}
-				this.doExecutorSqlCommon();
-                // this.vueQueryParam = to.query;
-                // let newName = {key: this.$route.fullPath, val: '数据-'+this.vueQueryParam.tableName};
-                // this.$store.commit('global/addTableName', newName);
-				// datasourceApi.tableStatus(this.pageParam).then(json => {
-				// 	this.tableStatusInfo = json.data || {};
-				// });
-            },
-			sqlExecutorInit(editor) {
-				this.sqlExecutorEditor = editor;
-				this.sqlExecutorEditor.setFontSize(16);
-				let that = this;
-				this.sqlExecutorEditor.commands.addCommand({
-					name: "execute-sql",
-					bindKey: {win: "Ctrl-R|Ctrl-Shift-R|Ctrl-Enter", mac: "Command-R|Command-Shift-R|Command-Enter"},
-					exec: function (editor) {
-						that.doExecutorClick();
-					}
+				this.$confirm(`确定要删除选中的${choiceData.length}行数据吗？`, '提示', {
+					confirmButtonText: '确定',
+					cancelButtonText: '取消',
+					type: 'warning'
+				}).then(() => {
+					let param = {
+						sourceId: this.pageParam.sourceId,
+						dbName: this.pageParam.dbName,
+						tableName: this.pageParam.tableName,
+						lineJson: JSON.stringify(deleteParam)
+					};
+					datasourceApi.deleteTableLineData(param).then(() => {
+						this.$message.success("删除成功！");
+						this.refreshData();
+					});
+				}).catch(() => {
 				});
-			},
-            handleCurrentChange(to) {
-                this.currentPage = to;
-                this.doExecutorSqlCommon();
-            },
-            handlePageSizeChange(to) {
-                this.pageSize = to;
-				this.currentPage = 1;
-                this.doExecutorSqlCommon();
-            },
-            tableSortChange(sort) {
-                if (this.tableSort.prop === sort.prop && this.tableSort.order === sort.order) return;
-                this.tableSort = {prop: sort.prop, order: sort.order};
-                this.doExecutorSqlCommon();
-            },
-            refreshData() {
-                this.tableSort = {};
-                this.currentPage = 1;
-				this.sqlExecutorEditor.setValue('', 1);
-                this.doExecutorSqlCommon();
-            },
-            cancelExecutorSql() {
-                datasourceApi.executeSqlCancel({executeId: this.nowExecutorId}).then(() => {
-					this.sqlExecuting = false;
-                    this.$message.success("取消成功");
-                });
-            },
-            doExecutorClick() {
-				this.tableSort = {};
-				this.currentPage = 1;
-                this.doExecutorSqlCommon();
-            },
-            doExecutorSqlCommon() {
-                if (!this.pageParam.sourceId) {
-                    this.$message.error("请先选择数据源");
-                    return;
-				}
-				if (!this.tableSort.prop) {
-					this.tableSort = {prop: this.pageParam.orderColumn, order: 'ascending'};
-				}
-				let conditionSql = this.sqlExecutorEditor.getSelectedText();
-				conditionSql = conditionSql || this.sqlExecutorEditor.getValue();
-				conditionSql = conditionSql || "";
-				this.executeError = "";
-				this.executeUseTime = "";
-				this.choiceResultObj = {};
-				this.executeResultList = [];
-				this.nowExecutorId = (new Date()).getTime() + Math.ceil(Math.random() * 1000);
-				this.sqlExecuting = true;
-				let param = {
-					sourceId: this.pageParam.sourceId,
-					dbName: this.pageParam.dbName,
-					tableName: this.pageParam.tableName,
-					executeId: this.nowExecutorId,
-					condition: conditionSql,
-					retainColumn: this.choiceShowColumnLast.join(','),
-					pageNum: this.currentPage,
-					pageSize: this.pageSize,
-					orderColumn: this.tableSort.prop,
-					orderType: (this.tableSort.order === 'ascending' ? 'asc' : 'desc'),
-					params: '',
-				};
-                datasourceApi.dataViewQuery(param).then(json => {
-					this.sqlExecuting = false;
-                    if (json.errCode !== 200) {
-                        this.executeError = json.errMsg;
-                        return;
-                    }
-                    let resultList = json.data || [];
-                    let executeResultList = [];
-                    let executeResultInfo = "", itemIndex = 1;
-                    for (let i = 0; i < resultList.length; i++) {
-                        let objItem = JSON.parse(resultList[i]);
-                        executeResultInfo += this.getExecuteInfoStr(objItem);
-                        let resultItem = this.dealExecuteResult(objItem);
-                        if (resultItem.updateCount < 0) {
-                            resultItem.index = itemIndex;
-							resultItem.name = 'table' + itemIndex;
-                            itemIndex++;
-                        }
-                        executeResultList.push(resultItem);
-					}
-					if (!!json.total) {
-						this.tableTotalCount = json.total || 0;
-					}
-					this.executeShowTable = (itemIndex === 1) ? "table0" : "table1";
-					this.executeResultInfo = executeResultInfo;
-					this.executeResultList = executeResultList;
-				}).catch(e => {
-					this.sqlExecuting = false;
-				});
-            },
-            getExecuteInfoStr(resultData) {
-                var resultStr = resultData.sql;
-                resultStr += "\n> 状态：" + ((!!resultData.errMsg) ? "ERROR" : "OK");
-                if (resultData.updateCount >= 0) {
-                    resultStr += "\n> 影响行数：" + resultData.updateCount;
-                }
-                resultStr += "\n> 耗时：" + (resultData.useTime || 0) / 1000 + "s";
-                resultStr += "\n\n";
-                return resultStr;
-            },
-            dealExecuteResult(resultData) {
-                var dataList = resultData.result || [];
-                var executeResultCols = [];
-                if (dataList.length > 0) {
-                    var propData = dataList[0];
-                    for (var key in propData) {
-                        // 动态计算宽度~自己想的一个方法，666
-                        document.getElementById("widthCalculate").innerText = key;
-                        var width1 = document.getElementById("widthCalculate").offsetWidth;
-                        document.getElementById("widthCalculate").innerText = propData[key];
-                        var width2 = document.getElementById("widthCalculate").offsetWidth;
-                        var width = (width1 > width2) ? width1 : width2;
-                        width = (width < 50) ? 50 : width;
-                        width = (width > 200) ? 200 : width;
-						let column = this.columnMap[key] || {};
-                        executeResultCols.push({prop: key, width: width + 50, desc: (column.description || key)});
-                    }
-                }
-                var resultObj = {};
-                resultObj.dataList = dataList;
-                resultObj.dataCols = executeResultCols;
-                resultObj.useTime = resultData.useTime || 0;
-                resultObj.errMsg = resultData.errMsg || "";
-                resultObj.updateCount = resultData.updateCount;
-                return resultObj;
-            },
-			handleSelectionChange(val) {
-				this.$set(this.choiceResultObj, this.executeShowTable, val);
-			},
-			doCopyCheckLineUpdate() {
-				let choiceData = this.choiceResultObj[this.executeShowTable] || [];
-				if (choiceData.length > 0) {
-					let dataCols = this.executeResultList.find(item => item.name === this.executeShowTable).dataCols;
-					let copyData = copyFormatter.format('update', this.pageParam.dbType, dataCols, choiceData, this.conditionDataColsChoice, this.pageParam.dbName, this.pageParam.tableName);
-					this.conditionDataColsChoice = [];
-					this.exportConditionVisible = false;
-					this.$copyText(copyData).then(
-							res => this.$message.success("内容已复制到剪切板！"),
-							err => this.$message.error("抱歉，复制失败！")
-					);
-				}
-			},
-			deleteCheckLine() {
-				let choiceData = this.choiceResultObj[this.executeShowTable] || [];
-				if (choiceData.length > 0) {
-					let primaryKey = this.primaryKeyColumn.name;
-					if (!primaryKey) {
-						this.$message.error("删除失败，未找到数据表的主键列");
+			}
+		},
+		handleCopyCheckLineCommand(type) {
+			let choiceData = this.choiceResultObj[this.executeShowTable] || [];
+			if (choiceData.length > 0) {
+				this.conditionDataColsChoice = [];
+				let dataCols = this.executeResultList.find(item => item.name === this.executeShowTable).dataCols;
+				if (type === 'update') {
+					if (!!this.primaryKeyColumn.name) {
+						this.conditionDataColsChoice = [this.primaryKeyColumn.name];
+					} else {
+						// 没有主键的时候，选择更新的条件列
+						this.conditionDataCols = dataCols;
+						this.exportConditionVisible = true;
 						return;
 					}
-					// 通过主键ID和值删除行的数据
-					let deleteParam = [];
-					choiceData.forEach(item => {
-						let line = {};
-						line[primaryKey] = item[primaryKey];
-						deleteParam.push(line);
-					});
-					this.$confirm(`确定要删除选中的${choiceData.length}行数据吗？`, '提示', {
-						confirmButtonText: '确定',
-						cancelButtonText: '取消',
-						type: 'warning'
-					}).then(() => {
-						let param = {
-							sourceId: this.pageParam.sourceId,
-							dbName: this.pageParam.dbName,
-							tableName: this.pageParam.tableName,
-							lineJson: JSON.stringify(deleteParam)
-						};
-						datasourceApi.deleteTableLineData(param).then(() => {
-							this.$message.success("删除成功！");
-							this.refreshData();
-						});
-					}).catch(()=>{});
 				}
-			},
-			handleCopyCheckLineCommand(type) {
-				let choiceData = this.choiceResultObj[this.executeShowTable] || [];
-				if (choiceData.length > 0) {
-					this.conditionDataColsChoice = [];
-					let dataCols = this.executeResultList.find(item => item.name === this.executeShowTable).dataCols;
-					if (type === 'update') {
-						if (!!this.primaryKeyColumn.name) {
-							this.conditionDataColsChoice = [this.primaryKeyColumn.name];
-						} else {
-							// 没有主键的时候，选择更新的条件列
-							this.conditionDataCols = dataCols;
-							this.exportConditionVisible = true;
-							return;
-						}
-					}
-					let copyData = copyFormatter.format(type, this.pageParam.dbType, dataCols, choiceData, this.conditionDataColsChoice, this.pageParam.dbName, this.pageParam.tableName);
-					this.$copyText(copyData).then(
-							res => this.$message.success("内容已复制到剪切板！"),
-							err => this.$message.error("抱歉，复制失败！")
-					);
-				}
-			},
-			doDownloadTableData() {
-				let conditionSql = this.sqlExecutorEditor.getSelectedText();
-				conditionSql = conditionSql || this.sqlExecutorEditor.getValue();
-				conditionSql = conditionSql || "";
-				this.nowExecutorId = (new Date()).getTime() + Math.ceil(Math.random() * 1000);
-				let condition = {}, conditionColumn = {}, retainColumn = {};
-				condition[this.pageParam.tableName] = conditionSql;
-				conditionColumn[this.pageParam.tableName] = this.downloadDataParam.conditionColumnArr.join(",");
-				retainColumn[this.pageParam.tableName] = this.choiceShowColumnLast.join(",");
-				this.downloadFormParam.param = {
-					executeId: this.nowExecutorId,
-					sourceId: this.pageParam.sourceId,
-					dbName: this.pageParam.dbName,
-					tableNames: this.pageParam.tableName,
-					downloadType: this.downloadDataParam.downloadType,
-					dropTableFlag: this.downloadDataParam.dropTableFlag,
-					createTableFlag: this.downloadDataParam.createTableFlag,
-					conditionJson: JSON.stringify(condition),
-					conditionColumnJson: JSON.stringify(conditionColumn),
-					retainColumnJson: JSON.stringify(retainColumn),
-				};
-				setTimeout(() => this.$refs.downloadForm.submit(), 0);
-				this.downloadDataVisible = false;
-			},
-			downloadTableData() {
-				let dataRes = this.executeResultList.find(item => item.name === this.executeShowTable);
-				if (!dataRes || !dataRes.dataList || dataRes.dataList.length <= 0) {
-					this.$message.warning("当前筛选条件下无数据，请重新筛选后再操作导出");
-					return;
-				}
-				let primaryKey = this.primaryKeyColumn.name;
-				if (this.downloadDataParam.conditionColumnArr.length <= 0 && !!primaryKey) {
-					this.downloadDataParam.conditionColumnArr = [primaryKey];
-				}
-				this.conditionDataCols = dataRes.dataCols;
-				this.downloadDataVisible = true;
+				let copyData = copyFormatter.format(type, this.pageParam.dbType, dataCols, choiceData, this.conditionDataColsChoice, this.pageParam.dbName, this.pageParam.tableName);
+				this.$copyText(copyData).then(
+						res => this.$message.success("内容已复制到剪切板！"),
+						err => this.$message.error("抱歉，复制失败！")
+				);
+			}
+		},
+		doDownloadTableData() {
+			let conditionSql = this.sqlExecutorEditor.getSelectedText();
+			conditionSql = conditionSql || this.sqlExecutorEditor.getValue();
+			conditionSql = conditionSql || "";
+			this.nowExecutorId = (new Date()).getTime() + Math.ceil(Math.random() * 1000);
+			let condition = {}, conditionColumn = {}, retainColumn = {};
+			condition[this.pageParam.tableName] = conditionSql;
+			conditionColumn[this.pageParam.tableName] = this.downloadDataParam.conditionColumnArr.join(",");
+			retainColumn[this.pageParam.tableName] = this.choiceShowColumnLast.join(",");
+			this.downloadFormParam.param = {
+				executeId: this.nowExecutorId,
+				sourceId: this.pageParam.sourceId,
+				dbName: this.pageParam.dbName,
+				tableNames: this.pageParam.tableName,
+				downloadType: this.downloadDataParam.downloadType,
+				dropTableFlag: this.downloadDataParam.dropTableFlag,
+				createTableFlag: this.downloadDataParam.createTableFlag,
+				conditionJson: JSON.stringify(condition),
+				conditionColumnJson: JSON.stringify(conditionColumn),
+				retainColumnJson: JSON.stringify(retainColumn),
+			};
+			setTimeout(() => this.$refs.downloadForm.submit(), 0);
+			this.downloadDataVisible = false;
+		},
+		downloadTableData() {
+			let dataRes = this.executeResultList.find(item => item.name === this.executeShowTable);
+			if (!dataRes || !dataRes.dataList || dataRes.dataList.length <= 0) {
+				this.$message.warning("当前筛选条件下无数据，请重新筛选后再操作导出");
+				return;
+			}
+			let primaryKey = this.primaryKeyColumn.name;
+			if (this.downloadDataParam.conditionColumnArr.length <= 0 && !!primaryKey) {
+				this.downloadDataParam.conditionColumnArr = [primaryKey];
+			}
+			this.conditionDataCols = dataRes.dataCols;
+			this.downloadDataVisible = true;
 
-			},
-			dropTableFlagChange() {
-				if (this.downloadDataParam.dropTableFlag === 1) {
-					this.downloadDataParam.createTableFlag = 1;
-				}
-			},
-			createTableFlagChange() {
-				if (this.downloadDataParam.createTableFlag == 0) {
-					this.downloadDataParam.dropTableFlag = 0;
-				}
-			},
-			choiceShowColumnDrawerShow() {
-				this.choiceShowColumnDrawer = true;
-				setTimeout(() => {
-					this.$refs.showColumnTree.setCheckedKeys(this.choiceShowColumnLast);
-					this.choiceShowColumnAll = (this.choiceShowColumnLast.length === this.tableDataColumns.length);
-				}, 10);
-			},
-			choiceShowColumnDrawerClose() {
+		},
+		dropTableFlagChange() {
+			if (this.downloadDataParam.dropTableFlag === 1) {
+				this.downloadDataParam.createTableFlag = 1;
+			}
+		},
+		createTableFlagChange() {
+			if (this.downloadDataParam.createTableFlag == 0) {
+				this.downloadDataParam.dropTableFlag = 0;
+			}
+		},
+		choiceShowColumnDrawerShow() {
+			this.choiceShowColumnDrawer = true;
+			setTimeout(() => {
+				this.$refs.showColumnTree.setCheckedKeys(this.choiceShowColumnLast);
+				this.choiceShowColumnAll = (this.choiceShowColumnLast.length === this.tableDataColumns.length);
+			}, 10);
+		},
+		choiceShowColumnDrawerClose() {
+			this.choiceShowColumnDrawer = false;
+		},
+		choiceShowColumnOk() {
+			let checkedKeys = this.$refs.showColumnTree.getCheckedKeys();
+			if (checkedKeys.length <= 0) {
+				this.$message.warning("必须选择一列展示");
+			} else {
+				storageUtil.set.save(this.storageKey.key, this.storageKey.subKey, checkedKeys.join(','), 50);
+				this.choiceShowColumnLast = checkedKeys;
 				this.choiceShowColumnDrawer = false;
-			},
-			choiceShowColumnOk() {
-				let checkedKeys = this.$refs.showColumnTree.getCheckedKeys();
-				if (checkedKeys.length <= 0) {
-					this.$message.warning("必须选择一列展示");
-				} else {
-					storageUtil.set.save(this.storageKey.key, this.storageKey.subKey, checkedKeys.join(','), 50);
-					this.choiceShowColumnLast = checkedKeys;
-					this.choiceShowColumnDrawer = false;
-					this.doExecutorClick();
-				}
-			},
-			tableDataColumnsCheckChange() {
-				let checkedKeys = this.$refs.showColumnTree.getCheckedKeys();
-				this.choiceShowColumnAll = (checkedKeys.length === this.tableDataColumns.length);
-			},
-			choiceShowColumnAllChange() {
-				let choiceAll = [];
-				if (this.choiceShowColumnAll) {
-					choiceAll = this.tableDataColumns.map(val => val.name);
-				}
-				this.$refs.showColumnTree.setCheckedKeys(choiceAll);
-			},
-        }
-    }
+				this.doExecutorClick();
+			}
+		},
+		tableDataColumnsCheckChange() {
+			let checkedKeys = this.$refs.showColumnTree.getCheckedKeys();
+			this.choiceShowColumnAll = (checkedKeys.length === this.tableDataColumns.length);
+		},
+		choiceShowColumnAllChange() {
+			let choiceAll = [];
+			if (this.choiceShowColumnAll) {
+				choiceAll = this.tableDataColumns.map(val => val.name);
+			}
+			this.$refs.showColumnTree.setCheckedKeys(choiceAll);
+		},
+	}
+}
 </script>
 
 <style>
-    .data-executor-vue .ace-monokai .ace_print-margin{
-        display: none;
-    }
-    .data-executor-vue .el-card__body{
-        padding: 10px;
-    }
-    .data-executor-vue .el-table td, .el-table th{
-        padding: 6px 0;
-    }
-    .data-executor-vue .execute-result-table .el-input__inner{
-        height: 25px;
-        line-height: 25px;
-        padding: 0 5px;
-    }
-    .data-executor-vue .execute-result-table .el-textarea__inner{
-        height: 27px;
-        min-height: 27px;
-        line-height: 25px;
-        padding: 0 5px;
-        resize: none;
-    }
-    .data-executor-vue .execute-use-time{
-        font-size: 12px;margin-right: 10px;
-    }
-    .data-executor-vue-out .el-tabs__nav-scroll{
-        padding-left: 20px;
-    }
-    .data-executor-vue-out .el-button+.el-button{
-        margin-left: 0px;
-    }
-    .data-executor-vue-out .el-table__body-wrapper{
-        height: calc(100vh - 180px);
-        overflow-y: auto;
-    }
+.data-executor-vue .ace-monokai .ace_print-margin {
+	display: none;
+}
+
+.data-executor-vue .el-card__body {
+	padding: 10px;
+}
+
+.data-executor-vue .el-table td, .el-table th {
+	padding: 6px 0;
+}
+
+.data-executor-vue .execute-result-table .el-input__inner {
+	height: 25px;
+	line-height: 25px;
+	padding: 0 5px;
+}
+
+.data-executor-vue .execute-result-table .el-textarea__inner {
+	height: 27px;
+	min-height: 27px;
+	line-height: 25px;
+	padding: 0 5px;
+	resize: none;
+}
+
+.data-executor-vue .execute-use-time {
+	font-size: 12px;
+	margin-right: 10px;
+}
+
+.data-executor-vue-out .el-tabs__nav-scroll {
+	padding-left: 20px;
+}
+
+.data-executor-vue-out .el-button + .el-button {
+	margin-left: 0px;
+}
+
+.data-executor-vue-out .el-table__body-wrapper {
+	height: calc(100vh - 180px);
+	overflow-y: auto;
+}
 </style>
diff --git a/zyplayer-doc-ui/db-ui/src/views/data/Executor.vue b/zyplayer-doc-ui/db-ui/src/views/data/Executor.vue
index 68221697..be813004 100644
--- a/zyplayer-doc-ui/db-ui/src/views/data/Executor.vue
+++ b/zyplayer-doc-ui/db-ui/src/views/data/Executor.vue
@@ -1,35 +1,45 @@
 <template>
-    <div class="data-executor-vue">
-        <div style="padding: 0 10px 10px;height: 100%;box-sizing: border-box;">
-            <el-card style="margin-bottom: 10px;">
-				<ace-editor v-model="sqlExecutorContent" ref="sqlEditor" @init="sqlExecutorInit" lang="sql" theme="monokai" width="100%" height="500" :options="sqlEditorConfig" :source="executorSource" style="margin-bottom: 10px;"></ace-editor>
-                <div>
-                    <el-button v-if="sqlExecuting" v-on:click="cancelExecutorSql" type="primary" plain  size="small" icon="el-icon-video-pause">取消执行</el-button>
-                    <el-tooltip v-else effect="dark" content="Ctrl+R、Ctrl+Enter" placement="top">
-                        <el-button v-on:click="doExecutorSql" type="primary" plain  size="small" icon="el-icon-video-play">执行</el-button>
-                    </el-tooltip>
-                    <el-button icon="el-icon-brush" size="small" @click="formatterSql">SQL美化</el-button>
-                    <el-button v-on:click="addFavorite('')" plain  size="small" icon="el-icon-star-off">收藏</el-button>
-                    <div style="float: right;">
-                        <el-select v-model="choiceDatasourceId" @change="datasourceChangeEvents" size="small" filterable placeholder="请选择数据源" style="width: 300px;margin-left: 10px;">
-                            <el-option v-for="item in datasourceOptions" :key="item.id" :label="item.name" :value="item.id"></el-option>
-                        </el-select>
-                        <el-select v-model="choiceDatabase" @change="databaseChangeEvents" size="small" filterable placeholder="请选择数据库" style="width: 200px;margin-left: 10px;">
-                            <el-option v-for="item in databaseList" :key="item.dbName" :label="item.dbName" :value="item.dbName"></el-option>
-                        </el-select>
-                    </div>
-                </div>
+	<div class="data-executor-vue">
+		<div style="padding: 0 10px 10px;height: 100%;box-sizing: border-box;">
+			<el-card style="margin-bottom: 10px;">
+				<ace-editor v-model="sqlExecutorContent" ref="sqlEditor" @init="sqlExecutorInit" lang="sql" theme="monokai"
+										width="100%" height="500" :options="sqlEditorConfig" :source="executorSource"
+										style="margin-bottom: 10px;"></ace-editor>
+				<div>
+					<el-button v-if="sqlExecuting" v-on:click="cancelExecutorSql" type="primary" plain size="small"
+										 icon="el-icon-video-pause">取消执行
+					</el-button>
+					<el-tooltip v-else effect="dark" content="Ctrl+R、Ctrl+Enter" placement="top">
+						<el-button v-on:click="doExecutorSql" type="primary" plain size="small" icon="el-icon-video-play">执行
+						</el-button>
+					</el-tooltip>
+					<el-button icon="el-icon-brush" size="small" @click="formatterSql">SQL美化</el-button>
+					<el-button v-on:click="addFavorite('')" plain size="small" icon="el-icon-star-off">收藏</el-button>
+					<div style="float: right;">
+						<el-select v-model="choiceDatasourceId" @change="datasourceChangeEvents" size="small" filterable
+											 placeholder="请选择数据源" style="width: 300px;margin-left: 10px;">
+							<el-option v-for="item in datasourceOptions" :key="item.id" :label="item.name"
+												 :value="item.id"></el-option>
+						</el-select>
+						<el-select v-model="choiceDatabase" @change="databaseChangeEvents" size="small" filterable
+											 placeholder="请选择数据库" style="width: 200px;margin-left: 10px;">
+							<el-option v-for="item in databaseList" :key="item.dbName" :label="item.dbName"
+												 :value="item.dbName"></el-option>
+						</el-select>
+					</div>
+				</div>
 				<div v-if="sqlParams.length > 0" class="sql-params">
 					<el-input :placeholder="'请输入'+param.key+'的值'" v-model="param.value" v-for="param in sqlParams">
-						<template slot="prepend">{{param.key}}</template>
+						<template slot="prepend">{{ param.key }}</template>
 					</el-input>
 				</div>
-            </el-card>
-            <el-card>
-                <div style="position: relative;">
+			</el-card>
+			<el-card>
+				<div style="position: relative;">
 					<div style="position: absolute;right: 0;z-index: 1;">
 						<!-- 复制选中行 -->
-						<el-dropdown @command="handleCopyCheckLineCommand" v-show="this.choiceResultObj[this.executeShowTable] && this.choiceResultObj[this.executeShowTable].length > 0">
+						<el-dropdown @command="handleCopyCheckLineCommand"
+												 v-show="this.choiceResultObj[this.executeShowTable] && this.choiceResultObj[this.executeShowTable].length > 0">
 							<el-button type="primary" size="small" icon="el-icon-document-copy">
 								复制选中行<i class="el-icon-arrow-down el-icon--right"></i>
 							</el-button>
@@ -40,71 +50,89 @@
 							</el-dropdown-menu>
 						</el-dropdown>
 					</div>
-                    <el-tabs v-model="executeShowTable">
-                        <el-tab-pane label="执行历史" name="tabHistory">
+					<el-tabs v-model="executeShowTable">
+						<el-tab-pane label="执行历史" name="tabHistory">
 							<el-table :data="myHistoryListList" stripe border style="width: 100%; margin-bottom: 5px;">
 								<el-table-column prop="createTime" label="执行时间" width="160px"></el-table-column>
 								<el-table-column prop="content" label="SQL">
 									<template slot-scope="scope">
-										<pre class="sql-content-line" @dblclick="inputFavoriteSql(scope.row)" :title="scope.row.content">{{scope.row.content}}</pre>
+										<pre class="sql-content-line" @dblclick="inputFavoriteSql(scope.row)"
+												 :title="scope.row.content">{{ scope.row.content }}</pre>
 									</template>
 								</el-table-column>
 								<el-table-column label="操作" width="160px">
 									<template slot-scope="scope">
 										<el-button size="mini" type="primary" @click="inputFavoriteSql(scope.row)">输入</el-button>
-										<el-button size="mini" type="success" @click="addFavorite(scope.row.content)" style="margin-left: 10px;">收藏</el-button>
+										<el-button size="mini" type="success" @click="addFavorite(scope.row.content)"
+															 style="margin-left: 10px;">收藏
+										</el-button>
 									</template>
 								</el-table-column>
 							</el-table>
-                        </el-tab-pane>
-                        <el-tab-pane label="我的收藏" name="tabFavorite">
+						</el-tab-pane>
+						<el-tab-pane label="我的收藏" name="tabFavorite">
 							<el-table :data="myFavoriteList" stripe border style="width: 100%; margin-bottom: 5px;" v-infinite-scroll>
 								<el-table-column prop="createTime" label="执行时间" width="160px"></el-table-column>
 								<el-table-column prop="content" label="SQL">
 									<template slot-scope="scope">
-										<pre class="sql-content-line" @dblclick="inputFavoriteSql(scope.row)" :title="scope.row.content">{{scope.row.content}}</pre>
+										<pre class="sql-content-line" @dblclick="inputFavoriteSql(scope.row)"
+												 :title="scope.row.content">{{ scope.row.content }}</pre>
 									</template>
 								</el-table-column>
 								<el-table-column label="操作" width="160px">
 									<template slot-scope="scope">
 										<el-button size="mini" type="primary" v-on:click="inputFavoriteSql(scope.row)">输入</el-button>
-										<el-button size="mini" type="danger" v-on:click="delFavorite(scope.row)" style="margin-left: 10px;">删除</el-button>
+										<el-button size="mini" type="danger" v-on:click="delFavorite(scope.row)" style="margin-left: 10px;">
+											删除
+										</el-button>
 									</template>
 								</el-table-column>
 							</el-table>
-                        </el-tab-pane>
-                        <el-tab-pane label="信息" name="tabInfo" v-if="!!executeResultInfo">
-                            <pre style="white-space: pre-wrap;">{{executeResultInfo}}</pre>
-                        </el-tab-pane>
-                        <el-tab-pane label="错误" name="tabError" v-if="!!executeError">
-							<div style="color: #f00;">{{executeError}}</div>
-                        </el-tab-pane>
+						</el-tab-pane>
+						<el-tab-pane label="信息" name="tabInfo" v-if="!!executeResultInfo">
+							<pre style="white-space: pre-wrap;">{{ executeResultInfo }}</pre>
+						</el-tab-pane>
+						<el-tab-pane label="错误" name="tabError" v-if="!!executeError">
+							<div style="color: #f00;">{{ executeError }}</div>
+						</el-tab-pane>
 						<template v-else>
-							<el-tab-pane :label="'结果'+resultItem.index" :name="resultItem.name" v-for="resultItem in executeResultList" v-if="!!resultItem.index">
-								<div v-if="!!resultItem.errMsg" style="color: #f00;">{{resultItem.errMsg}}</div>
-								<div v-else-if="resultItem.dataList.length <= 0" style="text-align: center; color: #aaa; padding: 20px 0;">暂无数据</div>
-								<el-table v-else :data="resultItem.dataList" stripe border style="width: 100%; margin-bottom: 5px;" class="execute-result-table" max-height="600"
-										  @selection-change="handleSelectionChange">
-									<el-table-column type="selection" width="55"></el-table-column>
-									<el-table-column type="index" width="50"></el-table-column>
-									<el-table-column v-for="item in resultItem.dataCols" :prop="item.prop" :label="item.prop" :width="item.width">
+							<el-tab-pane :label="'结果'+resultItem.index" :name="resultItem.name"
+													 v-for="resultItem in executeResultList" v-if="!!resultItem.index">
+								<div v-if="!!resultItem.errMsg" style="color: #f00;">{{ resultItem.errMsg }}</div>
+								<div v-else-if="resultItem.dataList.length <= 0"
+										 style="text-align: center; color: #aaa; padding: 20px 0;">暂无数据
+								</div>
+								<ux-grid v-else
+												 :data="resultItem.dataList"
+												 stripe
+												 border
+												 :height="height"
+												 :checkboxConfig="{checkMethod: selectable, highlight: true}"
+						 						 @table-body-scroll="scroll"
+												 style="width: 100%; margin-bottom: 5px;" class="execute-result-table" max-height="600"
+												 @selection-change="handleSelectionChange">
+									<ux-table-column type="checkbox" width="55"></ux-table-column>
+									<ux-table-column type="index" width="50" title=" "></ux-table-column>
+									<ux-table-column v-for="item in resultItem.dataCols" :prop="item.prop" :title="item.prop"
+																	 :width="item.width">
 										<template slot-scope="scope">
 											<textarea readonly :value="scope.row[item.prop]" class="el-textarea__inner" rows="1"></textarea>
 										</template>
-									</el-table-column>
-								</el-table>
+									</ux-table-column>
+								</ux-grid>
 							</el-tab-pane>
 						</template>
-                    </el-tabs>
-                </div>
-            </el-card>
-        </div>
+					</el-tabs>
+				</div>
+			</el-card>
+		</div>
 		<!--选择导出为update的条件列弹窗-->
 		<el-dialog :visible.sync="exportConditionVisible" width="500px" title="选择更新语句条件">
 			<div>
 				更新条件列：
 				<el-select v-model="conditionDataColsChoice" multiple placeholder="请选择" style="width: 370px;">
-					<el-option v-for="item in conditionDataCols" :key="item.prop" :label="item.prop" :value="item.prop"></el-option>
+					<el-option v-for="item in conditionDataCols" :key="item.prop" :label="item.prop"
+										 :value="item.prop"></el-option>
 				</el-select>
 			</div>
 			<span slot="footer" class="dialog-footer">
@@ -112,409 +140,432 @@
 				<el-button type="primary" @click="doCopyCheckLineUpdate">确 定</el-button>
 			</span>
 		</el-dialog>
-        <span id="widthCalculate" style="visibility: hidden; white-space: nowrap;position: fixed;"></span>
-    </div>
+		<span id="widthCalculate" style="visibility: hidden; white-space: nowrap;position: fixed;"></span>
+	</div>
 </template>
 
 <script>
-	import copyFormatter from './copy/index'
-    import sqlFormatter from "sql-formatter"
-    import datasourceApi from '../../common/api/datasource'
-	import aceEditor from "../../common/lib/ace-editor";
-	import sqlParser from "./parser/SqlParser";
+import copyFormatter from './copy/index'
+import sqlFormatter from "sql-formatter"
+import datasourceApi from '../../common/api/datasource'
+import aceEditor from "../../common/lib/ace-editor";
+import sqlParser from "./parser/SqlParser";
 
-    export default {
-        data() {
-            return {
-                datasourceList: [],
-                choiceDatasourceId: "",
-				datasourceOptions: [],
-				datasourceGroupList: [],
-				choiceDatasourceGroup: "",
+export default {
+	data() {
+		return {
+			height: 0,
+			scrollTop: 0,
+			datasourceList: [],
+			choiceDatasourceId: "",
+			datasourceOptions: [],
+			datasourceGroupList: [],
+			choiceDatasourceGroup: "",
 
-                databaseList: [],
-                choiceDatabase: "",
-				editorDbProduct: "",
-                editorDbInfo: [],
-                editorDbTableInfo: {},
-                editorColumnInfo: {},
+			databaseList: [],
+			choiceDatabase: "",
+			editorDbProduct: "",
+			editorDbInfo: [],
+			editorDbTableInfo: {},
+			editorColumnInfo: {},
 
-                sqlExecuting: false,
-                executeResultList: [],
-                executeResultInfo: "",
-                executeShowTable: "tabHistory",
-                sqlExecutorEditor: {},
-                nowExecutorId: 1,
-                executeError: "",
-                // 收藏及历史
-                myFavoriteList: [],
-                myHistoryListList: [],
-				// 选择复制
-				choiceResultObj: {},
-				//
-				exportConditionVisible: false,
-				conditionDataCols: [],
-				conditionDataColsChoice: [],
-				// 编辑器
-				sqlExecutorContent: '',
-				sqlEditorConfig: {
-					wrap: true,
-					autoScrollEditorIntoView: true,
-					enableBasicAutocompletion: true,
-					enableSnippets: true,
-					enableLiveAutocompletion: true,
-					minLines: 15,
-					maxLines: 40,
-				},
-				executorSource: {},
-				// sql参数
-				sqlParams: [],
-				sqlParamWaiting: false,
-				sqlParamHistory: {},
-            }
-        },
-		components: {
-			'ace-editor': aceEditor
+			sqlExecuting: false,
+			executeResultList: [],
+			executeResultInfo: "",
+			executeShowTable: "tabHistory",
+			sqlExecutorEditor: {},
+			nowExecutorId: 1,
+			executeError: "",
+			// 收藏及历史
+			myFavoriteList: [],
+			myHistoryListList: [],
+			// 选择复制
+			choiceResultObj: {},
+			//
+			exportConditionVisible: false,
+			conditionDataCols: [],
+			conditionDataColsChoice: [],
+			// 编辑器
+			sqlExecutorContent: '',
+			sqlEditorConfig: {
+				wrap: true,
+				autoScrollEditorIntoView: true,
+				enableBasicAutocompletion: true,
+				enableSnippets: true,
+				enableLiveAutocompletion: true,
+				minLines: 15,
+				maxLines: 40,
+			},
+			executorSource: {},
+			// sql参数
+			sqlParams: [],
+			sqlParamWaiting: false,
+			sqlParamHistory: {},
+		}
+	},
+	components: {
+		'ace-editor': aceEditor
+	},
+	mounted: function () {
+	  this.height = 500;
+		this.loadDatasourceList();
+	},
+	methods: {
+		sqlExecutorInit(editor) {
+			this.sqlExecutorEditor = editor;
+			this.sqlExecutorEditor.setFontSize(16);
+			let that = this;
+			this.sqlExecutorEditor.commands.addCommand({
+				name: "execute-sql",
+				bindKey: {win: "Ctrl-R|Ctrl-Shift-R|Ctrl-Enter", mac: "Command-R|Command-Shift-R|Command-Enter"},
+				exec: function (editor) {
+					that.doExecutorSql();
+				}
+			});
+			editor.on('change', () => {
+				if (!this.sqlParamWaiting) {
+					this.sqlParamWaiting = true;
+					setTimeout(() => {
+						let content = editor.getValue();
+						let paramArr = sqlParser.parserArr(content, [
+							{start: '${', end: '}'}, {start: '#{', end: '}'}
+						]);
+						this.sqlParams = [];
+						paramArr.forEach(item => {
+							this.sqlParams.push({key: item, value: this.sqlParamHistory[item] || ''});
+						});
+						this.sqlParamWaiting = false;
+					}, 300);
+				}
+			});
 		},
-        mounted: function () {
-            this.loadDatasourceList();
-        },
-        methods: {
-			sqlExecutorInit(editor) {
-				this.sqlExecutorEditor = editor;
-				this.sqlExecutorEditor.setFontSize(16);
-				let that = this;
-				this.sqlExecutorEditor.commands.addCommand({
-					name: "execute-sql",
-					bindKey: {win: "Ctrl-R|Ctrl-Shift-R|Ctrl-Enter", mac: "Command-R|Command-Shift-R|Command-Enter"},
-					exec: function (editor) {
-						that.doExecutorSql();
-					}
-				});
-				editor.on('change', () => {
-					if (!this.sqlParamWaiting) {
-						this.sqlParamWaiting = true;
-						setTimeout(() => {
-							let content = editor.getValue();
-							let paramArr = sqlParser.parserArr(content, [
-								{start: '${', end: '}'}, {start: '#{', end: '}'}
-							]);
-							this.sqlParams = [];
-							paramArr.forEach(item => {
-								this.sqlParams.push({key: item, value: this.sqlParamHistory[item] || ''});
-							});
-							this.sqlParamWaiting = false;
-						}, 300);
-					}
-				});
-			},
-            cancelExecutorSql() {
-                datasourceApi.executeSqlCancel({executeId: this.nowExecutorId}).then(() => {
-                    this.$message.success("取消成功");
-                });
-            },
-            loadHistoryAndFavoriteList() {
-                this.loadHistoryList();
-                this.loadFavoriteList();
-            },
-            loadFavoriteList() {
-                datasourceApi.favoriteList({sourceId: this.choiceDatasourceId}).then(json => {
-                    this.myFavoriteList = json.data || [];
-                });
-            },
-            loadHistoryList() {
-                datasourceApi.historyList({sourceId: this.choiceDatasourceId}).then(json => {
-                    this.myHistoryListList = json.data || [];
-                });
-            },
-            addFavorite(sqlValue) {
-                if (!sqlValue) {
-                    sqlValue = this.sqlExecutorEditor.getSelectedText();
-                    if (!sqlValue) {
-                        sqlValue = this.sqlExecutorEditor.getValue();
-                    }
-                }
-				let sqlParamObj = {};
-				this.sqlParams.forEach(item => {
-					if (!!item.value) {
-						sqlParamObj[item.key] = item.value;
-					}
-				});
-				let param = {
-					name: '我的收藏',
-					content: sqlValue,
-					paramJson: JSON.stringify(sqlParamObj),
-					datasourceId: this.choiceDatasourceId
-				};
-				datasourceApi.updateFavorite(param).then(() => {
-					this.$message.success("收藏成功");
-					this.loadFavoriteList();
-				});
-            },
-            delFavorite(row) {
-                datasourceApi.updateFavorite({id: row.id, yn: 0}).then(() => {
-                    this.$message.success("删除成功");
-                    this.loadFavoriteList();
-                });
-            },
-			inputFavoriteSql(item) {
-				this.sqlExecutorEditor.setValue(item.content, 1);
-				if (!!item.paramJson) {
-					let paramJson = JSON.parse(item.paramJson);
-					for (let key in paramJson) {
-						this.sqlParamHistory[key] = paramJson[key];
-					}
+	  scroll ({scrollTop, scrollLeft}) {
+		  this.scrollTop = scrollTop
+	  },
+	  selectable ({row}) {
+		  return row.id !== 2
+	  },
+		cancelExecutorSql() {
+			datasourceApi.executeSqlCancel({executeId: this.nowExecutorId}).then(() => {
+				this.$message.success("取消成功");
+			});
+		},
+		loadHistoryAndFavoriteList() {
+			this.loadHistoryList();
+			this.loadFavoriteList();
+		},
+		loadFavoriteList() {
+			datasourceApi.favoriteList({sourceId: this.choiceDatasourceId}).then(json => {
+				this.myFavoriteList = json.data || [];
+			});
+		},
+		loadHistoryList() {
+			datasourceApi.historyList({sourceId: this.choiceDatasourceId}).then(json => {
+				this.myHistoryListList = json.data || [];
+			});
+		},
+		addFavorite(sqlValue) {
+			if (!sqlValue) {
+				sqlValue = this.sqlExecutorEditor.getSelectedText();
+				if (!sqlValue) {
+					sqlValue = this.sqlExecutorEditor.getValue();
 				}
-			},
-            formatterSql() {
-                let dataSql = this.sqlExecutorEditor.getSelectedText();
-                if (!!dataSql) {
-                    let range = this.sqlExecutorEditor.getSelectionRange();
-                    this.sqlExecutorEditor.remove(range);
-                } else {
-                    dataSql = this.sqlExecutorEditor.getValue();
-                    this.sqlExecutorEditor.setValue('', 1);
-                }
-                if (!!dataSql) {
-                    dataSql = sqlFormatter.format(dataSql);
-                    this.sqlExecutorEditor.insert(dataSql);
-                }
-            },
-            doExecutorSql() {
-                if (!this.choiceDatasourceId) {
-                    this.$message.error("请先选择数据源");
-                    return;
-                }
-                this.executeError = "";
-                this.executeUseTime = "";
-                this.executeResultList = [];
-                let sqlParamObj = {};
-				this.sqlParams.forEach(item => {
-					if (!!item.value) {
-						sqlParamObj[item.key] = item.value;
-						this.sqlParamHistory[item.key] = item.value;
-					}
-				});
-                this.nowExecutorId = (new Date()).getTime() + Math.ceil(Math.random() * 1000);
-				let sqlValue = this.sqlExecutorEditor.getSelectedText();
-                if (!sqlValue) {
-                    sqlValue = this.sqlExecutorEditor.getValue();
-                }
-                this.sqlExecuting = true;
-                datasourceApi.queryExecuteSql({
-                    sourceId: this.choiceDatasourceId,
-                    dbName: this.choiceDatabase,
-                    executeId: this.nowExecutorId,
-                    sql: sqlValue,
-                    params: JSON.stringify(sqlParamObj),
-                }).then(json => {
-                    this.sqlExecuting = false;
-                    if (json.errCode != 200) {
-						this.executeShowTable = 'tabError';
-                        this.executeError = json.errMsg;
-                        return;
-                    }
-                    let resultList = json.data || [];
-                    let executeResultList = [];
-                    let executeResultInfo = "", itemIndex = 1;
-                    for (let i = 0; i < resultList.length; i++) {
-						let objItem = JSON.parse(resultList[i]);
-                        executeResultInfo += this.getExecuteInfoStr(objItem);
-						let resultItem = this.dealExecuteResult(objItem);
-                        if (resultItem.updateCount < 0) {
-                            resultItem.index = itemIndex;
-                            resultItem.name = 'tab' + itemIndex;
-                            itemIndex++;
-                        }
-                        executeResultList.push(resultItem);
-                    }
-                    this.executeShowTable = (itemIndex === 1) ? "tabInfo" : "tab1";
-                    this.executeResultInfo = executeResultInfo;
-                    this.executeResultList = executeResultList;
-					this.loadHistoryList();
-                });
-            },
-            loadDatasourceList() {
-                datasourceApi.datasourceList({}).then(json => {
-                    this.datasourceList = json.data || [];
-					this.datasourceOptions = this.datasourceList;
-					let datasourceGroupList = [];
-					this.datasourceList.filter(item => !!item.groupName).forEach(item => datasourceGroupList.push(item.groupName || ''));
-					this.datasourceGroupList = Array.from(new Set(datasourceGroupList));
-                    if (this.datasourceList.length > 0) {
-                        this.choiceDatasourceId = this.datasourceList[0].id;
-						this.executorSource = {sourceId: this.choiceDatasourceId};
-                        this.loadDatabaseList();
-                        this.loadSourceBaseInfo();
-                        this.loadHistoryAndFavoriteList();
-                    }
-                });
-            },
-			loadDatabaseList() {
-				datasourceApi.databaseList({sourceId: this.choiceDatasourceId}).then(json => {
-					this.databaseList = json.data || [];
-					if (this.databaseList.length > 0) {
-						// 排除系统库
-						let sysDbName = ["information_schema", "master", "model", "msdb", "tempdb"];
-						let notSysDbItem = this.databaseList.find(item => sysDbName.indexOf(item.dbName) < 0);
-						this.choiceDatabase = (!!notSysDbItem) ?notSysDbItem.dbName : this.databaseList[0].dbName;
-						this.executorSource = {sourceId: this.choiceDatasourceId, dbName: this.choiceDatabase};
-					}
-				});
-            },
-            loadSourceBaseInfo() {
-                datasourceApi.getSourceBaseInfo({sourceId: this.choiceDatasourceId}).then(json => {
-                    let data = json.data || {};
-                    this.editorDbProduct = data.product || '';
-                });
-            },
-			sourceGroupChangeEvents() {
-				let datasourceOptions = [];
-				for (let i = 0; i < this.datasourceList.length; i++) {
-					let item = this.datasourceList[i];
-					if (!this.choiceDatasourceGroup || this.choiceDatasourceGroup == item.groupName) {
-						datasourceOptions.push(item);
-					}
+			}
+			let sqlParamObj = {};
+			this.sqlParams.forEach(item => {
+				if (!!item.value) {
+					sqlParamObj[item.key] = item.value;
 				}
-				this.datasourceOptions = datasourceOptions;
-				if (datasourceOptions.length > 0) {
-					this.choiceDatasourceId = datasourceOptions[0].id;
+			});
+			let param = {
+				name: '我的收藏',
+				content: sqlValue,
+				paramJson: JSON.stringify(sqlParamObj),
+				datasourceId: this.choiceDatasourceId
+			};
+			datasourceApi.updateFavorite(param).then(() => {
+				this.$message.success("收藏成功");
+				this.loadFavoriteList();
+			});
+		},
+		delFavorite(row) {
+			datasourceApi.updateFavorite({id: row.id, yn: 0}).then(() => {
+				this.$message.success("删除成功");
+				this.loadFavoriteList();
+			});
+		},
+		inputFavoriteSql(item) {
+			this.sqlExecutorEditor.setValue(item.content, 1);
+			if (!!item.paramJson) {
+				let paramJson = JSON.parse(item.paramJson);
+				for (let key in paramJson) {
+					this.sqlParamHistory[key] = paramJson[key];
+				}
+			}
+		},
+		formatterSql() {
+			let dataSql = this.sqlExecutorEditor.getSelectedText();
+			if (!!dataSql) {
+				let range = this.sqlExecutorEditor.getSelectionRange();
+				this.sqlExecutorEditor.remove(range);
+			} else {
+				dataSql = this.sqlExecutorEditor.getValue();
+				this.sqlExecutorEditor.setValue('', 1);
+			}
+			if (!!dataSql) {
+				dataSql = sqlFormatter.format(dataSql);
+				this.sqlExecutorEditor.insert(dataSql);
+			}
+		},
+		doExecutorSql() {
+			if (!this.choiceDatasourceId) {
+				this.$message.error("请先选择数据源");
+				return;
+			}
+			this.executeError = "";
+			this.executeUseTime = "";
+			this.executeResultList = [];
+			let sqlParamObj = {};
+			this.sqlParams.forEach(item => {
+				if (!!item.value) {
+					sqlParamObj[item.key] = item.value;
+					this.sqlParamHistory[item.key] = item.value;
+				}
+			});
+			this.nowExecutorId = (new Date()).getTime() + Math.ceil(Math.random() * 1000);
+			let sqlValue = this.sqlExecutorEditor.getSelectedText();
+			if (!sqlValue) {
+				sqlValue = this.sqlExecutorEditor.getValue();
+			}
+			this.sqlExecuting = true;
+			datasourceApi.queryExecuteSql({
+				sourceId: this.choiceDatasourceId,
+				dbName: this.choiceDatabase,
+				executeId: this.nowExecutorId,
+				sql: sqlValue,
+				params: JSON.stringify(sqlParamObj),
+			}).then(json => {
+				this.sqlExecuting = false;
+				if (json.errCode != 200) {
+					this.executeShowTable = 'tabError';
+					this.executeError = json.errMsg;
+					return;
+				}
+				let resultList = json.data || [];
+				let executeResultList = [];
+				let executeResultInfo = "", itemIndex = 1;
+				for (let i = 0; i < resultList.length; i++) {
+					let objItem = JSON.parse(resultList[i]);
+					executeResultInfo += this.getExecuteInfoStr(objItem);
+					let resultItem = this.dealExecuteResult(objItem);
+					if (resultItem.updateCount < 0) {
+						resultItem.index = itemIndex;
+						resultItem.name = 'tab' + itemIndex;
+						itemIndex++;
+					}
+					executeResultList.push(resultItem);
+				}
+				this.executeShowTable = (itemIndex === 1) ? "tabInfo" : "tab1";
+				this.executeResultInfo = executeResultInfo;
+				this.executeResultList = executeResultList;
+				this.loadHistoryList();
+			});
+		},
+		loadDatasourceList() {
+			datasourceApi.datasourceList({}).then(json => {
+				this.datasourceList = json.data || [];
+				this.datasourceOptions = this.datasourceList;
+				let datasourceGroupList = [];
+				this.datasourceList.filter(item => !!item.groupName).forEach(item => datasourceGroupList.push(item.groupName || ''));
+				this.datasourceGroupList = Array.from(new Set(datasourceGroupList));
+				if (this.datasourceList.length > 0) {
+					this.choiceDatasourceId = this.datasourceList[0].id;
 					this.executorSource = {sourceId: this.choiceDatasourceId};
 					this.loadDatabaseList();
 					this.loadSourceBaseInfo();
 					this.loadHistoryAndFavoriteList();
 				}
-			},
-            datasourceChangeEvents() {
+			});
+		},
+		loadDatabaseList() {
+			datasourceApi.databaseList({sourceId: this.choiceDatasourceId}).then(json => {
+				this.databaseList = json.data || [];
+				if (this.databaseList.length > 0) {
+					// 排除系统库
+					let sysDbName = ["information_schema", "master", "model", "msdb", "tempdb"];
+					let notSysDbItem = this.databaseList.find(item => sysDbName.indexOf(item.dbName) < 0);
+					this.choiceDatabase = (!!notSysDbItem) ? notSysDbItem.dbName : this.databaseList[0].dbName;
+					this.executorSource = {sourceId: this.choiceDatasourceId, dbName: this.choiceDatabase};
+				}
+			});
+		},
+		loadSourceBaseInfo() {
+			datasourceApi.getSourceBaseInfo({sourceId: this.choiceDatasourceId}).then(json => {
+				let data = json.data || {};
+				this.editorDbProduct = data.product || '';
+			});
+		},
+		sourceGroupChangeEvents() {
+			let datasourceOptions = [];
+			for (let i = 0; i < this.datasourceList.length; i++) {
+				let item = this.datasourceList[i];
+				if (!this.choiceDatasourceGroup || this.choiceDatasourceGroup == item.groupName) {
+					datasourceOptions.push(item);
+				}
+			}
+			this.datasourceOptions = datasourceOptions;
+			if (datasourceOptions.length > 0) {
+				this.choiceDatasourceId = datasourceOptions[0].id;
 				this.executorSource = {sourceId: this.choiceDatasourceId};
 				this.loadDatabaseList();
 				this.loadSourceBaseInfo();
 				this.loadHistoryAndFavoriteList();
-            },
-            databaseChangeEvents() {
-				this.executorSource = {sourceId: this.choiceDatasourceId, dbName: this.choiceDatabase};
-            },
-            getExecuteInfoStr(resultData) {
-                var resultStr = resultData.sql;
-                resultStr += "\n> 状态：" + ((!!resultData.errMsg) ? "ERROR" : "OK");
-                if (resultData.updateCount >= 0) {
-                    resultStr += "\n> 影响行数：" + resultData.updateCount;
-                }
-                resultStr += "\n> 耗时：" + (resultData.useTime || 0) / 1000 + "s";
-                resultStr += "\n\n";
-                return resultStr;
-            },
-            dealExecuteResult(resultData) {
-                var dataList = resultData.result || [];
-                var executeResultCols = [];
-                if (dataList.length > 0) {
-                    var propData = dataList[0];
-                    for (var key in propData) {
-                        // 动态计算宽度~自己想的一个方法，666
-                        document.getElementById("widthCalculate").innerText = key;
-                        var width1 = document.getElementById("widthCalculate").offsetWidth;
-                        document.getElementById("widthCalculate").innerText = propData[key];
-                        var width2 = document.getElementById("widthCalculate").offsetWidth;
-                        var width = (width1 > width2) ? width1 : width2;
-                        width = (width < 50) ? 50 : width;
-                        width = (width > 200) ? 200 : width;
-                        executeResultCols.push({prop: key, width: width + 25});
-                    }
-                }
-                var resultObj = {};
-                resultObj.dataList = dataList;
-                resultObj.dataCols = executeResultCols;
-                resultObj.useTime = resultData.useTime || 0;
-                resultObj.errMsg = resultData.errMsg || "";
-                resultObj.updateCount = resultData.updateCount;
-                return resultObj;
-            },
-			handleSelectionChange(val) {
-            	this.$set(this.choiceResultObj, this.executeShowTable, val);
-			},
-			doCopyCheckLineUpdate() {
-            	let choiceData = this.choiceResultObj[this.executeShowTable] || [];
-				if (choiceData.length > 0) {
-					let dataCols = this.executeResultList.find(item => item.name === this.executeShowTable).dataCols;
-					let copyData = copyFormatter.format('update', this.editorDbProduct, dataCols, choiceData, this.conditionDataColsChoice);
-					this.conditionDataColsChoice = [];
-					this.exportConditionVisible = false;
-					this.$copyText(copyData).then(
-							res => this.$message.success("内容已复制到剪切板！"),
-							err => this.$message.error("抱歉，复制失败！")
-					);
+			}
+		},
+		datasourceChangeEvents() {
+			this.executorSource = {sourceId: this.choiceDatasourceId};
+			this.loadDatabaseList();
+			this.loadSourceBaseInfo();
+			this.loadHistoryAndFavoriteList();
+		},
+		databaseChangeEvents() {
+			this.executorSource = {sourceId: this.choiceDatasourceId, dbName: this.choiceDatabase};
+		},
+		getExecuteInfoStr(resultData) {
+			var resultStr = resultData.sql;
+			resultStr += "\n> 状态：" + ((!!resultData.errMsg) ? "ERROR" : "OK");
+			if (resultData.updateCount >= 0) {
+				resultStr += "\n> 影响行数：" + resultData.updateCount;
+			}
+			resultStr += "\n> 耗时：" + (resultData.useTime || 0) / 1000 + "s";
+			resultStr += "\n\n";
+			return resultStr;
+		},
+		dealExecuteResult(resultData) {
+			var dataList = resultData.result || [];
+			var executeResultCols = [];
+			if (dataList.length > 0) {
+				var propData = dataList[0];
+				for (var key in propData) {
+					// 动态计算宽度~自己想的一个方法，666
+					document.getElementById("widthCalculate").innerText = key;
+					var width1 = document.getElementById("widthCalculate").offsetWidth;
+					document.getElementById("widthCalculate").innerText = propData[key];
+					var width2 = document.getElementById("widthCalculate").offsetWidth;
+					var width = (width1 > width2) ? width1 : width2;
+					width = (width < 50) ? 50 : width;
+					width = (width > 200) ? 200 : width;
+					executeResultCols.push({prop: key, width: width + 25});
 				}
-			},
-			handleCopyCheckLineCommand(type) {
-            	let choiceData = this.choiceResultObj[this.executeShowTable] || [];
-				if (choiceData.length > 0) {
-					let dataCols = this.executeResultList.find(item => item.name === this.executeShowTable).dataCols;
-					if (type === 'update') {
-						// 选择更新的条件列
-						this.conditionDataCols = dataCols;
-						this.exportConditionVisible = true;
-						return;
-					}
-					let copyData = copyFormatter.format(type, this.editorDbProduct, dataCols, choiceData, '');
-					this.$copyText(copyData).then(
-							res => this.$message.success("内容已复制到剪切板！"),
-							err => this.$message.error("抱歉，复制失败！")
-					);
+			}
+			var resultObj = {};
+			resultObj.dataList = dataList;
+			resultObj.dataCols = executeResultCols;
+			resultObj.useTime = resultData.useTime || 0;
+			resultObj.errMsg = resultData.errMsg || "";
+			resultObj.updateCount = resultData.updateCount;
+			return resultObj;
+		},
+		handleSelectionChange(val) {
+			this.$set(this.choiceResultObj, this.executeShowTable, val);
+		},
+		doCopyCheckLineUpdate() {
+			let choiceData = this.choiceResultObj[this.executeShowTable] || [];
+			if (choiceData.length > 0) {
+				let dataCols = this.executeResultList.find(item => item.name === this.executeShowTable).dataCols;
+				let copyData = copyFormatter.format('update', this.editorDbProduct, dataCols, choiceData, this.conditionDataColsChoice);
+				this.conditionDataColsChoice = [];
+				this.exportConditionVisible = false;
+				this.$copyText(copyData).then(
+						res => this.$message.success("内容已复制到剪切板！"),
+						err => this.$message.error("抱歉，复制失败！")
+				);
+			}
+		},
+		handleCopyCheckLineCommand(type) {
+			let choiceData = this.choiceResultObj[this.executeShowTable] || [];
+			if (choiceData.length > 0) {
+				let dataCols = this.executeResultList.find(item => item.name === this.executeShowTable).dataCols;
+				if (type === 'update') {
+					// 选择更新的条件列
+					this.conditionDataCols = dataCols;
+					this.exportConditionVisible = true;
+					return;
 				}
+				let copyData = copyFormatter.format(type, this.editorDbProduct, dataCols, choiceData, '');
+				this.$copyText(copyData).then(
+						res => this.$message.success("内容已复制到剪切板！"),
+						err => this.$message.error("抱歉，复制失败！")
+				);
 			}
 		}
 	}
+}
 </script>
 
 <style>
-    .data-executor-vue .ace-monokai .ace_print-margin{
-        display: none;
-    }
-    .data-executor-vue .el-card__body{
-        padding: 10px;
-    }
-    .data-executor-vue .sql-params{
-    }
-    .data-executor-vue .sql-params .el-input-group{
-        width: auto;margin: 10px 10px 0 0;
-    }
-    .data-executor-vue .sql-params .el-input__inner{
-        width: 200px;
-    }
-    .data-executor-vue .el-table td, .el-table th{
-        padding: 6px 0;
-    }
-    .data-executor-vue .execute-result-table .el-input__inner{
-        height: 25px;
-        line-height: 25px;
-        padding: 0 5px;
-    }
-    .data-executor-vue .execute-result-table .el-textarea__inner{
-        height: 27px;
-        min-height: 27px;
-        line-height: 25px;
-        padding: 0 5px;
-        resize: none;
-    }
-    .data-executor-vue .sql-content-line{
-        margin: 0;
-		overflow:hidden;
-		text-overflow:ellipsis;
-		display:-webkit-box;
-		-webkit-line-clamp:2;
-		-webkit-box-orient:vertical;
-    }
-    .data-executor-vue .execute-use-time{
-        font-size: 12px;margin-right: 10px;
-    }
-    .data-executor-vue-out .el-tabs__nav-scroll{
-        padding-left: 20px;
-    }
-    .data-executor-vue-out .el-button+.el-button{
-        margin-left: 0px;
-    }
-    .data-executor-vue-out .el-table__body-wrapper{
-        height: calc(100vh - 180px);
-        overflow-y: auto;
-    }
+.data-executor-vue .ace-monokai .ace_print-margin {
+	display: none;
+}
+
+.data-executor-vue .el-card__body {
+	padding: 10px;
+}
+
+.data-executor-vue .sql-params {
+}
+
+.data-executor-vue .sql-params .el-input-group {
+	width: auto;
+	margin: 10px 10px 0 0;
+}
+
+.data-executor-vue .sql-params .el-input__inner {
+	width: 200px;
+}
+
+.data-executor-vue .el-table td, .el-table th {
+	padding: 6px 0;
+}
+
+.data-executor-vue .execute-result-table .el-input__inner {
+	height: 25px;
+	line-height: 25px;
+	padding: 0 5px;
+}
+
+.data-executor-vue .execute-result-table .el-textarea__inner {
+	height: 27px;
+	min-height: 27px;
+	line-height: 25px;
+	padding: 0 5px;
+	resize: none;
+}
+
+.data-executor-vue .sql-content-line {
+	margin: 0;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	display: -webkit-box;
+	-webkit-line-clamp: 2;
+	-webkit-box-orient: vertical;
+}
+
+.data-executor-vue .execute-use-time {
+	font-size: 12px;
+	margin-right: 10px;
+}
+
+.data-executor-vue-out .el-tabs__nav-scroll {
+	padding-left: 20px;
+}
+
+.data-executor-vue-out .el-button + .el-button {
+	margin-left: 0px;
+}
+
+.data-executor-vue-out .el-table__body-wrapper {
+	height: calc(100vh - 180px);
+	overflow-y: auto;
+}
 </style>