ウェブ|デザイン

デザイン

----------------------------------------------- -- ----------------------------------



はじめに

この記事ではWEBレポートのデザインを紹介しますツール アイデアやソリューションを?qū)g裝するために、このツールをデータベースに接続して、ユーザーが獨(dú)自のレポートをデザインできるようにします。レポート データはデータベースから取得され、ユーザーが変更したデータはデータベースに保存できます。このツールは、定期的または不定期的な任意の形式でレポートのデザインを?qū)g現(xiàn)でき、最終製品としてユーザーに提出できるだけでなく、開(kāi)発者が獨(dú)自の製品を開(kāi)発するためのレポートおよびデータベースのデザイン ツールとしても使用できます。目的の 1 つは、開(kāi)発者 (少なくとも私) が「大変な作業(yè)を報(bào)告する」ことをやめさせることです。

前置きと質(zhì)問(wèn)

C/S構(gòu)造とB/S構(gòu)造のソフトウェア開(kāi)発プロセスでは、レポートを設(shè)計(jì)するという多くの作業(yè)に遭遇しました。ユーザーには、実裝する必要があるさまざまなレポートが多數(shù)あり、システムが受け入れられた後、ユーザーは実裝する必要があるレポートもいくつか持つことになります。 C/S構(gòu)造レポートを作成する際は、PB、EXCEL、FORMULA ONEなどを使用して表を作成し、B/S組織レポートを作成する場(chǎng)合は、ASP、XML/XSLなどを使用して表を作成しました。 1 つ目は、レポートのデザインを完了するのに長(zhǎng)い時(shí)間がかかったので、一息つくことができると思ったのですが、まだデータベースを設(shè)計(jì)し、レポートを生成するためのメソッドと関數(shù)を設(shè)計(jì)する必要があります。レポートを変更するためのインターフェイスとデータを保存するための機(jī)能。各レポートは開(kāi)発者が個(gè)人的に作成する必要があります。ユーザー テストに提出するのは簡(jiǎn)単ですが、ユーザーは「これこれのテーブルの形式が間違っています」と言いました。 、これこれのテーブルの式が間違っています、これこれのテーブルのサイズが間違っています、新しいテーブルをいくつか追加するのを手伝ってください... 目まいがするほどです、今だけの達(dá)成感と安堵感がありましたため息やうめき聲に流されていく…そんな面倒なこともユーザーが自分でできるようになればいいですね！

たまたま金融系のWEBオフィスシステムの案件を受注したのですが、導(dǎo)入するレポートが多かったので、今後の業(yè)務(wù)を解放したいと考えて「レポートデザインツール」を簡(jiǎn)単に設(shè)計(jì)しました。 . レポート作業(yè)はもちろんWEB上で実施。

レポートデザインツールの作り方は、以前C/S構(gòu)造システムを開(kāi)発していた時(shí)にやったことがあり、実裝(PB6を使用)したことがありますが、ユーザーにとっては非常に良いものです。しかし、これには欠點(diǎn)があります。第一に、Web に移植して使用するのは簡(jiǎn)単ではありません。第二に、レポートを表示することしかできませんが、レポート內(nèi)のデータを変更することはできず、當(dāng)然データを追加することもできません。 WEB上でどうやって実裝するのか？

実裝方法

WEBレポートデザインツールを使用するには、まずレポートについて何を知っておく必要がありますか?それはどのように生み出され、実現(xiàn)されたのでしょうか？まず考えてみましょう。

レポートとは何ですか?これは簡(jiǎn)単に言うと、いくつかのデータを固定形式で固定位置に配置した表です。これはテーブルなので、「テーブル」と「グリッド」があります。まず、「行」または「列」を形成するために 1 つの「グリッド」を「グリッド」ごとに「綴る」必要があります。 「行（列）」が必要 「表」は「行（列）」を一つ一つ「綴って」いきます。

これらもグリッドから「綴られ」ていますが、以下の図 1 と図 2 に示すように、表の中には描きやすいものと描きにくいものがあります。明らかに、マップ 1 に示すレポートは、図 2 に示すレポートよりも作成しやすいです。図 1 の表を「定期レポート」と呼び、図 2 のレポートを「不定期レポート」と呼びます。

長(zhǎng)い間くだらない話をしてきましたが、レポートはどのように生成され、実裝されているのでしょうか?方法は「描く」と「埋める」の2つしかないと思います。

「表を描く」とは、グリッドを生成すると同時(shí)に、フォーマットに従ってデータをグリッドに配置することを意味します。つまり、フォーマットデータも同時(shí)に生成されます。このようにして、表全體が描畫(huà)されます。 、テーブル內(nèi)のデータも利用でき、レポートが生成されます。この方法は、レポートを行ごとまたは列ごとに描畫(huà)できるように、きちんとしたレポートを生成するのに適しています。この方法の利點(diǎn)は、レポートの生成が速い (データがバッチで処理される) こと、および処理プログラムが単純である (ループ文で十分である) ことです。

「表に記入する」は「表を描く」とは全く異なります。まず表のフォーマットを作成し、次に指定された表の位置に指定されたデータを記入する必要があります。この方法は、定期的なレポートだけでなく、不定期なレポートの作成にも適しています。この方法の利點(diǎn)は、応用範(fàn)囲が広いことはもちろんですが、最初にテーブルのサンプルを取得し、次にデータを 1 つずつ取り出して埋めていく必要があるため、時(shí)間がかかるという欠點(diǎn)もあります。細(xì)胞を一つ一つ。

それでは、どの実裝方法を採(cǎi)用すべきでしょうか?解決策は 2 つあります:

1.個(gè)別の処理: レポートを設(shè)計(jì)するときに、レポートが定期的であるかどうかをユーザーが決定できるようにします (これは非常に簡(jiǎn)単です)。定期的である場(chǎng)合、レポートは「テーブル描畫(huà)」メソッドを使用して生成されます。それ以外の場(chǎng)合、レポートは「テーブル描畫(huà)」メソッドを使用して生成されます。 「テーブルフィル」方式。

2．統(tǒng)合処理: すべては「フォームへの入力」によって生成されます。

コンピュータの速度は依然として急速に向上していると感じていますが、主にソフトウェアの設(shè)計(jì)と処理を簡(jiǎn)素化するために、ハードウェアの「速さ」が採(cǎi)用されています。それは、フォームへの入力です。 。

実裝方法を決定し、詳細(xì)と技術(shù)的な事項(xiàng)の検討を開(kāi)始しました。この WEB レポート デザイン ツールを?qū)g裝するには、どのような點(diǎn)を考慮する必要があり、どのような問(wèn)題を解決する必要がありますか?

解決する必要がある問(wèn)題

今度はそれを?qū)g裝する方法を考えます。最初に、簡(jiǎn)単に考えた後、次の問(wèn)題を解決するだけではないでしょうか:

1.表の描き方、つまり表サンプルの生成方法とは？ブラウザに実裝する必要があります。

——シンプル: DHTML を XML/XSL と組み合わせて使用??するだけです。

2．テーブルサンプルを保存するにはどうすればよいですか?

——簡(jiǎn)単: それらはすべてデータベースの TEXT フィールドに保存されます

3。データベースとの接続方法は？

——簡(jiǎn)単:

4 を表す屬性を具體的に定義します。データを表示するにはどうすればよいですか?

——シンプル: DHTML テクノロジーを使用し、XML/XSL

5 と組み合わせることで実現(xiàn)できます。データを変更するにはどうすればよいですか?

——シンプル: イベントを検出するだけです。

6．データを保存するにはどうすればよいですか?

——簡(jiǎn)単: データベースに書(shū)き込むだけです。

よく考えてみると、ここには多くの問(wèn)題があることに気付きました:

7.時(shí)計(jì)の描き方は？何で描くの？特に、ブラウザ內(nèi)に実裝する必要があります。

8．テーブルのスタイルを設(shè)定するにはどうすればよいですか?太字、下線、斜體、10 進(jìn)數(shù)、テーブルの結(jié)合、テーブルの削除、その他のスタイル設(shè)計(jì)操作など。

9.テーブルサンプルを保存するにはどうすればよいですか?どのような形式ですか?どこに存在するのでしょうか？

10．データが表示される場(chǎng)所はどのように定義されますか?定義方法は?定義した結(jié)果を保存するにはどうすればよいですか?どこに存在するのでしょうか？データを記入するにはどうすればよいですか?

11.個(gè)々のデータの表示形式を定義するにはどうすればよいですか?定義方法は?定義した結(jié)果を保存するにはどうすればよいですか?どこに存在するのでしょうか？

12.レポートはどのようにしてデータベースに接続しますか?レポートデータを取得するにはどうすればよいですか?データを取得するための條件はどのように定義すればよいですか?定義方法は?定義した結(jié)果を保存するにはどうすればよいですか?どこに存在するのでしょうか？

13.ユーザーはレポートを追加したいと考えていますが、それに対応する既製のデータベース テーブルがありません。ユーザーはどのようにデータベースを設(shè)計(jì)すればよいでしょうか?データベースはどのように設(shè)計(jì)すべきでしょうか?

14.ユーザーはデータベース定義の意味をどのようにして知るのでしょうか?データベーステーブルのどのフィールドとレコードを特定のグリッドから取得する必要があるかを知るにはどうすればよいでしょうか?

15.ユーザーがレポート データを変更 (追加) したことを確認(rèn)するにはどうすればよいですか?このデータはデータベース テーブルのフィールドにどのように対応するのでしょうか?どのセルを合計(jì)するとデータベース テーブル內(nèi)の完全なレコードになるのかをどのようにして知ることができるのでしょうか?ユーザーが入力したデータが完全な記録を形成するのに十分であることをどのようにして確認(rèn)するのでしょうか?この変更（増加）したデータを保存するにはどうすればよいですか？

16．別のデータベーステーブルを保存する必要がないデータを保存するにはどうすればよいですか?

17.レポートのデータ バランス関係の設(shè)計(jì)?どのように定義すればよいでしょうか?定義した結(jié)果を保存するにはどうすればよいですか?どこに存在するのでしょうか？

18.自動(dòng)計(jì)算式を?qū)g裝するにはどうすればよいですか?どのように定義すればよいでしょうか?定義した結(jié)果を保存するにはどうすればよいですか?どこに存在するのでしょうか？

19.他のレポートからデータを抽出して新しいレポートを生成するにはどうすればよいですか?定義方法は?定義した結(jié)果を保存するにはどうすればよいですか?どこに存在するのでしょうか？

20.レポートの概要をどのように定義するか（支店のデータから本社のデータを生成）?定義した結(jié)果を保存するにはどうすればよいですか?どこに存在するのでしょうか？

21.データレポート、つまりデータ形式の変換を?qū)g裝するにはどうすればよいでしょうか?変換プログラムはどのように設(shè)計(jì)されていますか?保存方法は？どこに存在するのでしょうか？

...

考えれば考えるほど面倒になるので、諦めたほうがいいかもしれません。私のような遅い人間にとっては、おそらく時(shí)間がかかるでしょう。このツールを設(shè)計(jì)したのはずっと前です。

このレポートツールを設(shè)計(jì)するために書(shū)いたメモと収集したデータを振り返って、不満を感じました。それから、レポートの重さを量ってみました。いつも大変な仕事をしていますか？いいえ！あなたの將來(lái)のために、今苦労する価値はあります！しかし、解決しなければならない問(wèn)題が多すぎて、どうやって始めればよいでしょうか?重要な質(zhì)問(wèn)は何ですか?

問(wèn)題の鍵

窓の外の景色を見(jiàn)て、落ち著くまで待ってから、リストされた問(wèn)題を一つ一つ測(cè)定し、比較してみると、最初に解決すべき問(wèn)題が見(jiàn)つかります。それを?qū)g現(xiàn)するのが「表面サンプル設(shè)計(jì)ツール」です。レポートのデザイン、表示、変更、保存などのすべての操作はツール環(huán)境で実裝されるため、データベース接続、テーブル サンプルの保存などは、ツールのプレゼンテーション フォームやインターフェイス フォームを中心に実裝および調(diào)整する必要があります。

仕事のアイデアが見(jiàn)つかったら、デザインを始めましょう!忙しくしないでください、「ツール」のデザイン計(jì)畫(huà)はまだ決まっていません。

いくつかのオプションの比較

WEB 上でテーブルのようなデザインを?qū)g裝するには、多くのオプションから選択できます:

1. XML/XSL/DHTML/HTML テクノロジーを使用して

2.

3 を?qū)g現(xiàn)するには、IE の WebBrowser ActiveX コントロールを使用します。獨(dú)自の ActiveX コントロールを作成します

4.獨(dú)自の Java アプレットを作成して実裝します

5．既製のサードパーティ製コントロールを借用して実裝する

それでは、どのソリューションが私にとってより良いのでしょうか?

まず各プランの特徴を理解しましょう。結(jié)果は次のとおりです:



無(wú)料のサードパーティ ソフトウェアを入手できる場(chǎng)合は、間違いなく 5 番目のプランが最適です。探してみてください。本當(dāng)に見(jiàn)つけたのは、Microsoft Office Web Components の SheetSpace コントロールです。無(wú)料ではありませんが (MS Office2000 以降でサポートされている必要があります)、開(kāi)発コストが削減されるだけでなく、ユーザーの操作性も向上します。私もこれに慣れていたので、Microsoft Office Web コンポーネントの SheetSpace コントロールを選択しました。

解決策

主要な問(wèn)題が解決されたので、その他のことはすべて簡(jiǎn)単に対処できるようになります。 以下は、関連する問(wèn)題の解決策のリストです。

1.表の描き方、つまり表サンプルの生成方法とは？ブラウザに実裝する必要があります。

——Microsoft Office Web コンポーネントの SheetSpace コントロールでテーブル サンプルをデザインするか、MS EXCEL でテーブル サンプルをデザインし、それを Microsoft Office Web コンポーネントの SheetSpace コントロールにインポートして表示します。MS にインポートされたテーブル サンプルをデザインします。のEXCELプログラム。データの表示形式、ページング、固定ヘッダー、フォントサイズ、色などはすべてテーブルサンプルで設(shè)計(jì)されています。

2．テーブルサンプルを保存するにはどうすればよいですか?どのような形式ですか?どこに存在するのでしょうか？

- Microsoft Office Web コンポーネントの SheetSpace コントロールの結(jié)果をデータベースの TEXT フィールドに保存します。テーブル サンプルの形式は MS EXCEL の HTML 形式であり、Microsoft Office Web コンポーネントの SheetSpace コントロールから直接取得できます。

3.データベースとの接続方法は？

——レポートに対応するデータベーステーブルを表すフィールド屬性を特別に定義します

4。データを表示するにはどうすればよいですか?

——データベースからレポート データを抽出し、XML 形式でクライアントに保存し、Microsoft Office Web コンポーネントの SheetSpace コントロールに表示し、取得したレポート データを指定されたセルに入力します。

5.ユーザーがレポート データを変更 (追加) したことを確認(rèn)するにはどうすればよいですか?このデータはデータベース テーブルのフィールドにどのように対応するのでしょうか?どのセルを合計(jì)するとデータベース テーブル內(nèi)の完全なレコードになるのかをどのようにして知ることができるのでしょうか?ユーザーが入力したデータが完全な記録を形成するのに十分であることをどのようにして確認(rèn)するのでしょうか?

——Microsoft Office Web コンポーネントの SheetSpace コントロールの変更イベントを検出し、現(xiàn)在のセルの値と元のデータを比較し、同じでない場(chǎng)合は元のデータを変更し、変更フラグを設(shè)定します。データとデータベースフィールドの対応関係を式に基づいて説明します。このようにして、グリッド內(nèi)のどのデータを合計(jì)するとデータベース テーブル內(nèi)の完全なレコードになるかを知ることもできます。追加されたデータについては、入力ツールが特別に設(shè)計(jì)されており、完了するためにどのデータを入力する必要があるかをユーザーに指示します。

6．データを保存するにはどうすればよいですか?

——XML の変更 (追加) フラグを含むデータをサーバーに送信すると、サーバーはデータを処理して、データベース內(nèi)の対応するデータを変更します。

7.テーブルのスタイルを設(shè)定するにはどうすればよいですか?太字、下線、斜體、10 進(jìn)數(shù)、テーブルの結(jié)合、テーブルの削除、その他のスタイル設(shè)計(jì)操作など。個(gè)々のデータの表示形式を定義するにはどうすればよいですか?定義方法は?定義した結(jié)果を保存するにはどうすればよいですか?どこに存在するのでしょうか？

——Microsoft Office Web コンポーネントの SheetSpace コントロールは、これらの操作機(jī)能を提供し、ページ上にメニュー形式で表示され、ユーザーの操作を提供します。ユーザー操作によって生成された結(jié)果はテーブル サンプルに保存され、テーブル サンプルの保存時(shí)にデータベースに保存されます。

8．データが表示される場(chǎng)所はどのように定義されますか?定義方法は?定義した結(jié)果を保存するにはどうすればよいですか?どこに存在するのでしょうか？データを記入するにはどうすればよいですか?

——數(shù)式デザインとインタプリタを設(shè)計(jì)し、數(shù)式の形式で表示するデータをテーブル サンプルに保存します。數(shù)式の場(chǎng)所は、データが表示される場(chǎng)所と形式です。數(shù)式が配置されているセルは、データの表示形式 (フォント、色など) です。式はテーブルとともに保存されます。データを表示する場(chǎng)合は、計(jì)算式に従ってデータを取得し、セルに入力します。

9.レポートデータを取得するにはどうすればよいですか?データを取得するための條件はどのように定義すればよいですか?定義方法は?定義した結(jié)果を保存するにはどうすればよいですか?どこに存在するのでしょうか？

——各レポートは、完全なレポート データ コンテンツを取得するために使用できる「クエリ條件」屬性を定義します。このクエリ條件はデータベースのフィールドに直接対応し、この屬性はレポート フォームとともにデータベースに保存されます。

10．ユーザーはレポートを追加したいと考えていますが、それに対応する既製のデータベース テーブルがありません。ユーザーはどのようにデータベースを設(shè)計(jì)すればよいでしょうか?データベースはどのように設(shè)計(jì)すべきでしょうか?

——Web ページ上でデータベースを設(shè)計(jì)するためのツールを設(shè)計(jì)し、ユーザーが実際のニーズに応じてデータベース構(gòu)造を設(shè)計(jì)できるようにします。

11.ユーザーはデータベース定義の意味をどのようにして知るのでしょうか?データベーステーブルのどのフィールドとレコードを特定のグリッドから取得する必要があるかを知るにはどうすればよいでしょうか?

——データベース設(shè)計(jì)ツールが提供されているため、このツールで設(shè)計(jì)されたデータベース構(gòu)造では、ユーザーが式を定義するときに、フィールドのタイトル、つまりフィールドの意味を入力する必要があります。フィールド名は表示されませんが、ユーザーが理解しやすいようにフィールドのタイトルが表示されます。

12.別のデータベーステーブルを保存する必要がないデータを保存するにはどうすればよいですか?

——個(gè)別のデータベースを必要としないレポートを區(qū)別し、それらをすべて共通のテーブルに保存します。テーブル內(nèi)のデータには、レポート スタイルとレポート データの両方が含まれます。

13.レポートのデータ バランス関係の設(shè)計(jì)?どのように定義すればよいでしょうか?定義した結(jié)果を保存するにはどうすればよいですか?どこに存在するのでしょうか？

——レポートのデータバランス関係はEXCELの計(jì)算式を用いて完全に実現(xiàn)されています。式はテーブルとともに保存されます。 Microsoft Office Web コンポーネントの SheetSpace コントロールは、ほとんどの MS EXCEL 數(shù)式をサポートできます。數(shù)式の使用法と構(gòu)文は MS EXCEL とまったく同じです。

14．自動(dòng)計(jì)算式を?qū)g裝するにはどうすればよいですか?どのように定義すればよいでしょうか?定義した結(jié)果を保存するにはどうすればよいですか?どこに存在するのでしょうか？

——合計(jì)、平均などのMS EXCELの計(jì)算式を使用し、計(jì)算式は表と一緒に保存されます。

15.他のレポートからデータを抽出して新しいレポートを生成するにはどうすればよいですか?定義方法は?定義した結(jié)果を保存するにはどうすればよいですか?どこに存在するのでしょうか？

——レポートには「番號(hào)検索プログラム」と呼ばれる屬性があり、他のデータベーステーブル（テーブル）からデータを抽出し、このレポートに対応するデータベーステーブル（テーブル）に挿入するために使用されます。

16.レポートの概要をどのように定義するか（支店のデータから本社のデータを生成）?定義した結(jié)果を保存するにはどうすればよいですか?どこに存在するのでしょうか？

——レポートには「要約プログラム」と呼ばれる屬性があり、下位組織のレポートのデータを要約して、この組織のレポートデータを生成するために使用されます。

17.データレポート、つまりデータ形式の変換を?qū)g裝するにはどうすればよいでしょうか?変換プログラムはどのように設(shè)計(jì)されていますか?保存方法は？どこに存在するのでしょうか？

——レポート データは実際にはデータ形式の変換ですが、XSL を使用すると非常に便利に設(shè)計(jì)できます。 XSL 変換プログラムは、指定したディレクトリにテキスト ファイルとして保存され、ファイル名はレポートと 1 対 1 に対応します。レポート データを生成する場(chǎng)合、レポート データはテキスト ファイルに変換され、クライアント マシン上のユーザー指定の場(chǎng)所に保存されます。

レポートの完全な定義はデータに保存されます。 データベース テーブルの構(gòu)造は次のとおりです。




表 2: レポート定義の構(gòu)造

操作の便宜のために、バッチ処理機(jī)能が追加されました。ユーザーはデータの抽出、データの要約をバッチ処理し、ユーザー操作を簡(jiǎn)素化できます。

レポート処理プロセス全體は次のようになります:

1.データベース定義を設(shè)計(jì)する

2.レポートスタイルをデザインする

3.數(shù)式を挿入します

4.クエリ條件を設(shè)定します

5.デザイン概要プログラム

6.番號(hào)検索プログラムを設(shè)計(jì)する

7.クエリレポート

8.まとめレポート

9.バッチ概要レポート

10.レポートデータを抽出する

11.レポートデータをバッチで抽出します

12.レポート ファイルの生成

デザイン効果

さて、一人で 1 か月以上の苦労を経て、ようやくコーディング作業(yè)が完了しました。デザイン データベースのインターフェイスを図 3 に示し、デザイン レポートのインターフェイスを図に示します。図4.



図 3: データベース設(shè)計(jì)インターフェイス



図 4: レポート設(shè)計(jì)インターフェイス

は、ユーザーが試してみるためのもので、數(shù)十のさまざまなレポートを簡(jiǎn)単に解決できます。黃天は「苦難」に耐える。この方法に従って、さらに 1 週??間かけてチャート デザイン ツールを設(shè)計(jì)しましたが、ユーザーの反応も非常に良好でした。チャート設(shè)計(jì)インターフェイスを図 4 に示します。



図 4: チャート デザイン インターフェイス

概要

この記事では、効果的な WEB レポート デザイン ツールの実裝アイデアについて説明し、それを?qū)g裝します。大量のレポートをデザインする必要があるユーザー、特にレポートの形式や量が頻繁に変更されるユーザーにとっては非常に便利です。開(kāi)発者にとっても、多くの作業(yè)を節(jié)約できます。