(1)リレーションシップ用のschema追加
one-to-manyリレーションシップ作成の流れは以下の通り。
・モデルのendPointから別のモデルのendPointにドラッグドロップ(実装済み)
・リレーションシップモーダルが開く(実装済み)
・dataServiceで、リレーションシップ用のschemaを追加
・schemaのhtml生成が終わり次第、コネクションの作成。
/src/app/service/data.service.ts
https://github.com/dog-ears/er-diagram-tool/commit/c6b7fa501853122f27855293165a7b1b8af3f43a#diff-ae990bb302f27e60323deb45d6746b17
・addOneToManyRelation()の中身を実装
(2)schema生成時、削除時にコネクションを追加・削除するよう修正
カラムは追加されましたが、endPointがずれてしまいました。
次の「schemaのhtml生成が終わり次第、コネクションの作成」のときに合わせて再描画フラグを立てます。
ついでに、削除時の処理も追加しましょう。
/src/app/schema/schema.component.ts
https://github.com/dog-ears/er-diagram-tool/commit/c6b7fa501853122f27855293165a7b1b8af3f43a#diff-153991cc3d6496727ece175d022d38c5
・JsPlumbServiceのimport、DI
・ngAfterViewInit()、ngOnDestroy()から、それぞれjsPlumbService.initSchema()、jsPlumbService.destroySchema()を呼び出し
/src/app/service/jsPlumb.service.ts
https://github.com/dog-ears/er-diagram-tool/commit/c6b7fa501853122f27855293165a7b1b8af3f43a#diff-da7afb11f9169e78d9b5cfea7afcc510
・Schemaクラスのimport
・initSchema()を実装
-- shcema にbelongstoがあるときのみ処理する
-- belongstoに入っているモデル名からモデルを取得するメソッドgetModelByName()が必要になるので、のちほどdataクラスに追加する。
-- コネクションを生成
・destroySchema()を実装
-- shcema にbelongstoがあるときのみ処理する
-- 自分をターゲットにしているコネクションを削除
/src/app/class/data.ts
https://github.com/dog-ears/er-diagram-tool/commit/c6b7fa501853122f27855293165a7b1b8af3f43a#diff-ba726bfa70586322bd593dddb7beaf87
・getModelByName()を実装
これでコネクションが生成され、
さらにリレーションシップ用のxxx_idというカラムを削除することで、コネクションも削除されます。
しかし、コネクション生成後、Sourceとなるモデルを削除すると、コネクションが残ってしまいます。
なので、こちらも修正
(3)Source Model削除時にコネクションを削除する機能を実装
/src/app/service/jsPlumb.service.ts
https://github.com/dog-ears/er-diagram-tool/commit/579524ff6dfa637b522f0c1e9a6f313bddb662aa#diff-da7afb11f9169e78d9b5cfea7afcc510
・destroyModel()にコネクションを削除する処理を追加
削除コネクション終点にあるschemaのエレメントIDから、shcemaを取得するメソッドgetSchemaByElementId()をdataに実装します。
/src/app/class/data.ts
https://github.com/dog-ears/er-diagram-tool/commit/579524ff6dfa637b522f0c1e9a6f313bddb662aa#diff-15a154169b0b6112f2adcdf51a565ee2
・Schemaクラス読み込み
・getSchemaByElementId()を実装
/src/app/class/model.ts
https://github.com/dog-ears/er-diagram-tool/commit/579524ff6dfa637b522f0c1e9a6f313bddb662aa#diff-15a154169b0b6112f2adcdf51a565ee2
・getSchemaById()を実装
これで、one-to-manyコネクション追加・削除機能の実装が終わりました。
次回は、many-to-manyコネクションを同じように実装していきます。