clickhouse智能提示编辑器

有需要你可以拆出来。

注意：我为了使用简单，暴露了一个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("&nbsp<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

照葫芦画瓢即可！

欢迎关注我的公众号，分析我的一些个人作品给大家，希望能帮助到大家！