對於經常寫sql的人來說智慧提示是非常重要的,這個非常影響寫sql的效率和心情。
這裡說的智慧提示不僅僅是關鍵字(select等)的智慧提示,還得要做到表欄位的智慧提示。
例如: 下面是mysql的智慧提示(是利用codemirror做的)
上圖是我很久以前搞的一個快速開發的後臺系統中的一個小工具。
如果大家需要mysql結合db的schema來智慧提示的可以去參考下開源AntMgr後臺快速開發系統
clickhouse的智慧提示
今天給大家分享ace_editor來封裝clickhouse的智慧提示。
效果如下:
使用方法
git clone下程式碼後開啟demo
https://github.com/yuzd/ace_clickhouse
ace_clickhouse.js
我把 ace_editor 和 ace_lang_tools 還有關於 clickhouse的基本關鍵字提示的全都放在這一個js裡面了。
開啟ace_clickhouse.js 裡面有四大部分
-
最上面的ace_editor -
ace.define("ace/snippets"開頭的是ace_lang_tools -
然後是clickhouse的擴充套件內容(關鍵字和clickhouse的函式等) -
最後一部分是theme
有需要你可以拆出來。
注意:我為了使用簡單,暴露了一個ace_langTools在window的scope下。方便給下面的js使用(下面會講到)
另外一個js:model-sql.js
這個是做表欄位的智慧提示的,
window.sqlTablesCompleter = {
target: {
database: 'log',
table: 'testdb'
},
completerCache: [],
getCompletions: function (editor, session, pos, prefix, callback) {
var self = this;
var key = self.target.database + '.' + self.target.table;
if (self.completerCache[key]) {
callback(null, self.completerCache[key]);
return;
}
var sql = self.buildExploreQuery("COLUMNS");
self._post(sql, function (response) {
self.completerCache[key] = response.data.map(function (item) {
return {
caption: item.text,
value: item.text,
meta: key,
docHTML: self._convertToHTML(item),
};
});
callback(null, self.completerCache[key]);
});
},
_convertToHTML: function (item) {
var desc = item.value, space_index = 0, start = 0, line = "", next_line_end = 60, lines = [];
for (var i = 0; i < desc.length; i++) {
if (desc[i] === ' ') {
space_index = i;
} else if (i >= next_line_end && space_index !== 0) {
line = desc.slice(start, space_index);
lines.push(line);
start = space_index + 1;
next_line_end = i + 60;
space_index = 0;
}
}
line = desc.slice(start);
lines.push(line);
return ["<b>", item.text, "</b>", "<hr></hr>", lines.join(" <br>")].join("");
},
_post: function (sql, callback) {
//這裡需要改造成去請求表的schema的資料,介面的返回格式如下所示
callback(JSON.parse("{\n" +
" \"data\": [\n" +
" {\n" +
" \"text\": \"field1\",\n" +
" \"value\": \"DateTime\"\n" +
" },\n" +
" {\n" +
" \"text\": \"field2\",\n" +
" \"value\": \"String\"\n" +
" }\n" +
" ]\n" +
"}"));
}
};
如上面程式碼裡面的註釋一樣,你需要呼叫一個介面去獲取你需要智慧提示的clickhouse的表的欄位資訊
然後在去把這個智慧提示註冊到ace_editor裡面去
winwo.ace_langTools.addCompleter(sqlTablesCompleter);
這樣就搞定了
如果有哪些clickhouse的函式沒有提示的,可以把函式提示內容新增到第一個js檔案裡面的
ace.define("ace/mode/clickhouse_info" 程式碼塊中Funcs 和 FunctionsCompletions
照葫蘆畫瓢即可!
歡迎關注我的公眾號,分析我的一些個人作品給大家,希望能幫助到大家!