sql-generator - 🔨JSONを使用して、Vue3 + TypeScript + Vite + Ant Design + MonacoEditorに基づいて構造化されたSQLステートメントを生成します。プロジェクトはシンプル(重いロジックと軽いページ)で、練習に適しています〜

(🔨 用 JSON 来生成结构化的 SQL 语句,基于 Vue3 + TypeScript + Vite + Ant Design + MonacoEditor 实现,项目简单(重逻辑轻页面)、适合练手~)

Created at: 2022-05-12 16:05:38
Language: Vue
License: Apache-2.0

構造化SQLジェネレータ

JSONを使用して複雑なSQLを簡単に生成し、SQLの記述効率を大幅に向上させます。

プログラマーの魚の皮

オンライン使用:http ://sql.yupi.icu

プロジェクト紹介ビデオ:https ://www.bilibili.com/video/BV1qa411J7vh/

ツールのスクリーンショット

プロジェクトの役割

  1. 结构化
    記事の概要を書くようなSQL書き込みロジックを書いて読む
  2. 繰り返されるSQLは1回だけ記述する必要があり、SQLが変更されたときに1つを変更できます。
  3. パラメータを渡し、SQLの特定の部分をデバッグできます
  4. SQLの分析と理解を容易にするために、SQLステートメントの参照ツリーと置換プロセスを表示します

コールツリーと置換手順を表示する

アプリケーションシナリオ

複雑なSQLを記述したい場合、SQLの多くのコードは類似、同じではありません。次に、このツールを使用することをお勧めします。SQLを繰り返し作成でき、変更、保守、および理解に役立ちます。

特にビッグデータ分析のシナリオでは、複雑なSQLを作成する必要があることがよくあります。

このホイールがある理由は、Yupiが職場でオフラインでデータを分析するために3000行のSQLを作成する必要があるためです。手で作成する人は夢中になるでしょう!

もちろん、1つとしてもお使いいただけます

重复代码生成器
〜

例

要件:id=1とid=2の2人のクラスメート間の身長差を計算します

SQLは次のようになります。

select (s1.height - s2.height) as 身高差
from 
(select * from student where id = 1) s1,
(select * from student where id = 2) s2

明らかに、上記のSQL中学生のテーブルは2回クエリされており、クエリロジックはクエリのIDを除いて完全に同じです。

学生にクエリを実行するロジックを後で変更する場合は、上記の2つのサブクエリを同時に変更する必要がありますが、これはメンテナンスに役立ちません。

このツールを使用すると、完全なSQLを自動的に生成するために次のJSONを記述するだけで済みます。

{
    "main": "select @身高差() from (@学生表(id = 1)) s1, (@学生表(id = 2)) s2",
    "身高差": "(s1.height - s2.height) as 身高差",
    "学生表": "select * from student where id = #{id}"
}

函数调用 + 传参
同様に、SQLを繰り返し記述する必要はなく、SQL全体のロジックがより明確になります。

もちろん、上記は単なる例です。実際のビッグデータのオフライン分析のシナリオでは、SQLはこれよりもN倍複雑になる可能性があります。

興味のある方は、ドキュメントとより複雑な例をお読みください〜

アドバンテージ

  1. JSONとSQLのオンライン編集をサポートし、コードの強調表示、構文の検証、ワンクリックの書式設定、検索と置換、コードブロックの折りたたみなどを優れたエクスペリエンスでサポートします
  2. SQLのワンクリック生成をサポート
  3. @a(xx =#{yy})などのパラメータ透過送信をサポートします。yy変数は@a式に渡すことができます。
  4. @a(xx = @b(yy = 1))などのネストされたパラメーターの受け渡し(パラメーターとしてサブクエリを使用)をサポートします
  5. ユーザーがJSONで記述できる内容に制限はないため、このツールは重複コードジェネレーターとしても使用できます。
  6. 参照関係の分析を容易にするために、SQLステートメントの呼び出しツリーと置換の詳細の表示をサポートします

ドキュメンテーション

次のコードをジェネレーターに入れて試してみると、使い方がわかります〜

{
  "main": "必填, 代码从这里开始生成, 用 @规则名() 引用其他语句",
  "规则名": "可以编写任意 SQL 语句 @规则名2() @动态传参(a = 求给 ||| b = star)",
  "规则名2": {
    "sql": "用 #{参数名} 指定可被替换的值",
    "params": {
      "参数名": "在 params 中指定静态参数, 会优先被替换"
    }
  },
  "动态传参": "#{a}鱼皮#{b}"
}

補足説明

对象键
:SQL生成ルールの名前を定義します。mainはエントリSQLを表し、生成はこのSQLステートメントから始まります。

对象值
:特定の生成ルールを定義します。SQL文字列またはオブジェクトにすることができます。

sql
:テンプレートSQLステートメントを定義します。これは、フィールドのセット、クエリ条件、計算ロジック、完全なSQLなどの任意の文字列にすることができます。

params
:静的パラメーター。パーサーは最初に変数を現在のステートメントの#{変数名}に置き換えます

#{xxx}
:置き換えることができる変数を定義します。できれば現在のレベルのパラメータで置き換えることができます。そうでない場合は、外部レイヤーから渡されます。

@xxx(yy = 1 ||| zz = #{变量})
:他のSQLを参照し、パラメーターを渡すことができ、パラメーターを変数で表すことができ、|||(3本の縦棒)を使用してパラメーターを区切ります。

複雑な例

要件:SQLの文を使用して、次のテーブルをクエリします

このフォームの難しさは何ですか?

  1. サマリーチェックと詳細チェックの粒度は異なり、group byで区別することはできず、union(赤)のみです。
  2. カテゴリ列の異なる行のデータは交差しており、group byで区別できません。使用できるのは、ユニオンのみです。
  3. 各列は複数のテーブルの結合によって形成され、異なるカテゴリに関連付けることができるテーブルは異なるため、区別する必要があり(灰色は関連付けることができないことを意味します)、不足しているフィールドは埋められます(そうでない場合)。結合することはできません)
  4. 同じ列の計算式は、行ごとに異なる場合があります(青)
  5. 異なる列には異なるフィルター条件があります(たとえば、最後の2つの列は学校全体をチェックするために濃い緑色で、残りの列はグレード1のみをチェックします)
  6. 同じチェーン比を照会するには、2つの完全なデータのみを使用して結合し、転位を計算できます。

明らかに、このテーブルの多くのクエリロジックは繰り返されますが、異なります。

このようにして、最終的なSQLに含まれる基本的なテーブル選択の数はいくつですか?各ベーステーブルクエリを繰り返し書き込む必要があるのは何回ですか?

ただし、この表は、魚の皮が実際の需要を単純化した後にのみ取得され、実際の需要はこれよりも数倍複雑です。

手動で書くのがどれほど嫌なことか考えられますか?!

ただし、このツールを使用して、次の構造化されたJSONを記述します。

{
	"main": "select (a / b - 1) from (@查整体(date = 今天)) a, (@查整体(date = 昨天)) b",
	"查整体": "@查年级() union @查1班() union @查2班() where date = #{date}",
	"查年级": "@查汇总_性别汇总() union @查汇总_性别分组() union @查汇总_爱好汇总() union @查汇总_爱好分组() union @查汇总_电脑类别汇总() union @查汇总_电脑类别分组()",
	"查汇总_性别汇总": "@查除电脑关联表()",
	"查汇总_性别分组": "@查除电脑关联表() group by 性别",
	"查汇总_爱好汇总": "@查除电脑关联表()",
	"查汇总_爱好分组": "@查除电脑关联表() where 爱好 in (xx) group by 爱好",
	"查汇总_电脑类别汇总": "@查除三连和学习表()",
	"查汇总_电脑类别分组": "@查除三连和学习表() group by 电脑类别",

	"查1班": "@查1班_性别汇总() union @查1班_性别分组() union @查1班_爱好汇总() union @查1班_爱好分组() union @查1班_电脑类别汇总() union @查汇总_电脑类别分组()",
	"查1班_性别汇总": "@查除电脑关联表() where 1班",
	"查1班_性别分组": "@查除电脑关联表() where 1班 group by 性别",
	"查1班_爱好汇总": "@查除电脑关联表() where 1班",
	"查1班_爱好分组": "@查除电脑关联表() where 1班 and 爱好 in (xx) group by 爱好",
	"查1班_电脑类别汇总": "@查除三连和学习表() where 1班",
	"查1班_电脑类别分组": "@查除三连和学习表() where 1班 group by 电脑类别",

	"查2班": "@查2班_性别汇总() union @查2班_性别分组() union @查2班_电脑类别汇总() union @查2班_电脑类别分组()",
	"查2班_性别汇总": "@查除电脑关联表() where 2班",
	"查2班_性别分组": "@查除电脑关联表() where 2班 group by 性别",
	"查2班_电脑类别汇总": "@查除三连和学习表() where 2班",
	"查2班_电脑类别分组": "@查除三连和学习表() where 2班 group by 电脑类别",

	"查所有关联表": "@查信息表() left join (@查三连表()) left join (@查学习表()) left join (@查电脑表()) left join (@查全校信息())",
	"查除电脑关联表": "@查信息表() left join (@查三连表()) left join (@查学习表()) left join (@查全校信息())",
	"查除三连和学习表": "@查信息表() left join (@查电脑表()) left join (@查全校信息())",
	"查信息表": "select 字段 from 信息表 where 年级 = 1",
	"查三连表": "select 字段 from 三连表 where 年级 = 1",
	"查学习表": "select 字段 from 学习表 where 年级 = 1",
	"查电脑表": "select 字段 from 电脑表 where 年级 = 1",
	"查全校信息": "select 字段 from 信息表"
}

SQLを自動的に生成できます。また、呼び出し関係を表示することもできます。これは非常に明確です。

達成

JSONとの互換性が最も高いJavaScriptで実装され、ブラウザ側とサーバー側の両方に適用できる論理JSファイルが書き込まれます。

この関数は比較的軽量であるため、純粋なブラウザ側で実装することをお勧めします。

フロントエンドは、

Vue3 + Vite + Ant Design Vue
開発インターフェイスを使用し
Monaco Editor
、コード編集、強調表示、フォーマットなどの機能を実装するために選択し、コード仕様
TypeScript + ESLint
を確認するために使用します。

SQL生成ロジックは次のとおりです。

  1. オブジェクトへのJSON文字列
  2. エントリから始めて、最初にparams静的パラメータを置き換えて、現在のレイヤー分析を取得します
  3. @xxx構文の再帰的解析再帰的解析では、最初に静的パラメーターが置き換えられ、次に外部レイヤーからの呼び出しパラメーターが置き換えられます。
  4. 最終的なSQLを取得する

パーサーは元々、通常の貪欲でない置換によって実装されていましたが、@ a(xx = @b())などのネストされた呼び出しは実装できません。@ a(xx = @b())として認識され、最も近いものと一致します。したがって、サブクエリ置換アルゴリズムは、ネストされた括弧の場合に最適化され、括弧で囲まれたステートメントを含むネストされた呼び出しがサポートされています。