WebclientサンプルPG「ひぐまショップデモ」
-
竹本さん、サンプルデモをありがとうございます。WebClientがどんどん普及するといいですね。
-
サンプルデモをありがとうございます。
実行しようとしたところ、以下のようなエラーが出てしまうのですが、設定もれなど、なにかお心当たりありますでしょうか？
Error: "Web client requests cannot be handled when the online MDI is open" (-276) Application: "higumashop" ("")4.6環境でWebClientが実行できることは確認していますが、4.7環境ではこのプロジェクトが初めてです。
ご回答いただけましたら幸いです。
-
kanai さんお世話になっております。
オプション>設定>動作環境>実行モードが「バックグラウンド」になっていますか＾－＾？
-
お二方とも、ありがとうございます。
実行モードがオンラインとなっておりました、失念しておりました……。
無事動作いたしました。
-
kanai さんよかったです＾－＾。ここの設定も差分iniに入れておけばよかったですね；；
-
RIAやWebClientのサンプルプログラム等も、バックグラウンドでの動作をデフォルトにしてもらえると分かりやすいですね。フォアグラウンドでも設定次第では動いてしまうところが分かりにくいのかもしれません。
-
サンプルプログラム公開ありがとうございます。
動かしてみましたが、伝票形式の明細の追加方法がわかりません。
ソースを見る限りでは、F4を押せば良いような気がしますが。。。
-
kido さんこんにちは。
Web系ではF5キーなど使うとリロードされたりするので
なるべくファンクションキーを使わずにMEISAI.component.tsにて記述しているPageDownでF4をシミュレートしていますー。
-
竹本様
早速の回答ありがとうございます。
PageDownで正常に動作しました。
Webの開発は経験不足なもので。。。。
ちなみにEdgeでは正常に動作しましたが、chromeだと以下のエラーで動作しませんでした。
http://localhost/Magic47Scripts/MGrqispi.dll Http failure response for
http://localhost/Magic47Scripts/MGrqispi.dll:413 Request Entity Too Large Do you wish to retry connecting?
-
kido さん。
1.Chromeのキャッシュを全削除
2.Web_Client_Cacheフォルダの中身を全削除
ではいかがでしょうか？？
Edgeはうごいているので1で終わりそうです＾－＾。
-
ISHIJIMA様
こちらのPCの問題みたいですね。
Edgeで動作するのでよしとします。
動作確認ありがとうございました。
-
竹本様
Chromeのキャッシュクリアで解決しました。
単純な事でした。。。お騒がせしました。
竹本様、ISHIJIMA様ありがとうございました。
-
竹本さん、こんにちは。
WebclientサンプルPGをありがとうございます。
いろいろなノウハウが満載されていて、とても参考になりました。
いくつかコメントさせてください。１．テンプレートのファイル名
これは運用的なことですが、「*.ts」ファイルで「templateUrl」を「フォーム名.component.bs.html」のように変更し、MAGICの出力ファイルと一致しないように変更するアイデアはなかなか良いと思いました。
・不用意に編集したものを失う心配がない
・必要ならオリジナルといつでも比較できる複数のタスクを持つプログラムでも、割と気楽に再作成できるかもですね。（指定がプログラム単位だから...）
勿論、出力後フォーム毎に「*.ts」の「templateUrl」や追加したロジックは書き直さなければなりませんが...
（よく使うロジック等は定型文化しておかないと危険ですね）２．テーブルのWebスタイル
プログラム「SLIPEDIT」の「MEISAI」タスクのテーブルは「R=繰り返し可能な項目」で作成されているようでした。
どのスタイルを使うべきかについて、何か方針みたいなものはありますか？
「R=繰り返し可能な項目」だと、テーブルヘッダのタイトルは手で追加しないといけないので、「H=HTMLテーブル」でも良さそうにも思いましたが...３．画面のデザインとロジックの追加の手順
２のプログラムを見ると、MAGICが出力したと思われる「MEISAI.component.html」には、テーブルの末尾に追加されているボタンの部分が抜けていました。
推測ですが、①ボタンを追加する前の段階で「Webアプリケーションの作成」を行い、
②テンプレート「MEISAI.component.bs.html」の編集を行い、
③フォームのテーブルにボタンを追加し、
④ロジックを「MEISAI.component.ts」に追加という手順で作成したということでしょうか。
やはり「隠す予定のボタンは最初からあると画面デザインの際に邪魔だから...」ということなんでしょうね。 -
muka さんこんにちは！
ちょっとでも参考になってWebClientが広まればうれしいです。
1. よく上書きして「ひーーーー；；」ってなったもので。
2. 弊社は基本「R=繰り返し可能な項目」でやっています。
「H=HTMLテーブル」だと基本Tableタグを使用するのでスマホなどレスポンシブな画面には使いにくいという判断です。
そこでBootstrapなどを使用しdivタグでゴリゴリ書いています。
3. もったいないかもですが弊社の場合「Magicが吐き出したタグ」をほぼ使用していません。
そうですね。ボタンはjavascriptからMaigcを制御するために。
tsファイルからSimulateClick関数を使うためのものだけと割り切っています。明細だとペットショップデモだと「行編集」ボタンとか「行追加」ボタンで編集･追加を行うのですが
「ボタンをクリックするのも面倒だなぁ」とキーボードでAPGのように操作したかったので作成いたしました＾－＾。ダウンロード本当にありがとうございました；；orz
-
竹本さん、こんにちは。
コメントありがとうございます。
>弊社は基本「R=繰り返し可能な項目」でやっています。
>「H=HTMLテーブル」だと基本Tableタグを使用するのでスマホなどレスポンシブな画面には使いにくいという判断です。
なるほど！参考になりました。
ちなみにBootstrapのTableクラスに「table-responsive」がありますよね。これが使えるかなと思ったのですが、テーブルのヘッダ自体がスクロールによって動いて隠れてしまいますね。
しかしこれを「R=繰り返し可能な項目」で作成されるスクロール領域の上にヘッダを書いてしまえば、件数が何件あっても固定的に表示できますね。有難うございました。またいろいろ教えて下さい。 m(__)m
-
竹本さん、こんにちは。
今更ながら気付いたのですが、ひとつ質問させてください。
このサンプルPGのウインドウタイプが「O=オーバレイ」になっている「MSYAINEDIT」「ZOOMMTOKUI」「ZOOMMSYOUHIN」等のプログラムの件です。
通常であれば、「*.ts」ファイルの中の「private static readonly width」「private static readonly height」の値でウインドウのサイズが決まると思うのですが、これらの値は初期値のままで、実行すると画面一杯に表示します。
これはどこでどのようにして実現しているのでしょうか？「O=オーバレイ」タイプのプログラムは、画面サイズを決めないといけないのですが、実行する端末環境に依存するため、決められないこともありますよね。
当初、ウインドウのサイズによってフォームを複数作り切り替えたらいいかなとも思ったのですが、先ず「実行中のウインドウのサイズを取得する」方法が分からなくてどうしようもありませんでした。
でも常に画面一杯に表示してくれるなら、それに越したことは無いなあと思う次第です。 -
muka さんこんにちは！
そうなんです。デフォルトだとサイズをピクセルで決めるので使いづらいんです。
そこでカスタムオーバーレイといって「通常のオーバーレイはつかいません」という仕様です。オーバーレイは
src\app\magic\Common\custom-overlay
を使うように変更しています。
そこで作ったものを
app.module.ts
から呼び出して「常にこっちのオーバーレイを使ってね！」というふうに捻じ曲げています。
そのほかアラートも通常だとWindow.Alertなのですがちょっぴりカッコよく仕上げています。
修正すべきところは
custom-overlay.html
custom-overlay.scss
custom-overlay.tsとなります＾－＾
弊社だと
custom-overlay.tsの中身を
styles["width"] = "100%";styles["height"] = "100%";と変更することも多いです。 -
竹本さん、こんにちは。
自前のプロジェクトに「Common」フォルダをコピーし、関連するファイルの定義を修正することにより、「通常のオーバーレイはつかいません」モードができました！
これはなかなか感動的ですねぇ...「捻じ曲げる」なんて神業としか思えません。
本当に有難うございます。m(__)m
（MGICもデフォルトでこちらの仕様にしてくれたらいいのに…独り言）アラートも試してみます。
またいろいろ教えて下さい。
m(__)m -
竹本さん、mukaさん、ありがとうございます。
また、貴重なご意見も頂戴し感謝いたします。
MAGIC「Web Client」ももっと簡単にオーバーレイの振る舞いを変更できると
良いのですが、現状は竹本さんからお伝え頂いている方法になります。
Web ClientはAngularに準拠（継承）する形でアーキテクチャが設計されています。
そしてAngular自体がオブジェクト指向の設計思想が強いので、その結果、
Web Clientもオブジェクト指向でデザインされている部分が多くございます。
例えば、オーバーレイに関しても、Angularのオーバーレイを継承する形で、
Magic（Web Client）用のオーバーレイのクラス（コンポーネント）が
用意されています。
BaseMagicOverlayContainerクラスがWeb Client用のオーバーレイ用のクラスとして用意されています。その結果、オーバーレイを拡張「カスタムオーバーレイと呼んでいます」する場合はこのBaseMagicOverlayContainerクラスを継承します。継承する場合には、TSファイルの中のクラス定義のときに、親クラス（BaseMagicOverlayContainer）を継承（extends）するという意味で以下のような定義になります。export class クラス名 extends BaseMagicOverlayContainerそして、拡張したコンポーネント（カスタムオーバーレイ）を作成した後に、依存性の注入 【DI】 Dependency Injectionというデザインパターンの仕組みで実行する振る舞い（コンポーネント）を差し替えます。この依存性の注入の仕組みで、拡張したカスタムオーバーレイのコンポーネントが呼ばれるように変更します。竹本さんのご説明のとおり、app.module.tsファイルに捻じ曲げる定義を加えることで拡張したカスタムオーバーレイが実行されるようになります。また現在、Web Client基礎トレーニングコースの中でも「カスタムオーバーレイ」を取り扱っている章がございますので、こちらもご検討いただけますと幸いです。説明が長くなりましたが、少しはご参考になりましたでしょうか。
サインインしてコメントを残してください。
コメント
19件のコメント