最新のMVC4+ EasyUI Web開発フレームワークでは、オンラインショッピングウェイビル処理にモジュールを統合しました。これは、顧客注文ガイド、ウェイビルの合併、到着スキャン、控除、倉庫の外出、クエリなどのさまざまなモジュールの操作を統合しています。それにはいくつかのウェイビルセットが含まれます。ただし、Lodopは以前にChromeやその他のブラウザと互換性がなかったため、かつてこのコントロールの印刷プロセスを放棄したかったのです。しかし、彼らはタイムリーに「クラウド印刷制御Cロドップ」を起動し、以前のインターフェイスとほぼ完全に互換性があります。したがって、このコントロールは、従来の印刷やウェイビル情報セットなど、関連する印刷処理のフレームワークで引き続き使用されています。
1。コントロールのインストール
このクラウドコントロールのC-Lodop(http://www.lodop.net/)は実際にローカルにインストールされており、レジデントサービスはJSサービスを提供しています。インストール後のインターフェイスは、プログラムが次のように開始された後に開始されます。
サーバーを介してJSサービスを提供するこの方法は、プラグインメソッドよりもはるかに優れています。 Chromeブラウザをテストした後、スムーズに印刷できます。元のLodopプラグインメソッドは互換性がありません。
独自のJS初期化コードを通じて、現在、コントロールが非プラグインメソッドを使用して印刷操作を処理していることを理解できます。
//他のコンピューターブラウザをローカルから印刷する(該当する例):var script = document.createelment( "script"); script.src = "/clodopfuncs.js"; var head = document.head || document.getElementsByTagname( "head")[0] || document.documentelement; head.insertbefore(script、head.firstchild); //ネイティブブラウザの印刷(より優先される):script = document.createelement( "script"); script.src = "http:// localhost:8000/clodopfuncs.js?priority = 1"; var head | || document.getElementsByTagname( "head")[0] || document.documentelement; head.insertbefore(script、head.firstchild); //ネイティブブラウザーのポストコンプレメントポート8001(このアプローチはエラーを引き起こし、それを無視する可能性があります):script = document.createelement( "script"); script.src = "http:// localhost:8001/clodopfuncs.js? document.getElementsByTagname( "head")[0] || document.documentlement; head.insertbefore(script、head.firstchild);
公式の例では、lodopfuncs.jsファイルを提供して印刷制御を構築します。ここで、getlodop関数がlodopfuncs.jsファイルで定義され、印刷制御オブジェクトを取得します。
クラウドプリントコントロールがインストールされているかどうかを確認してください。クラウドプリントコントロールがインストールされているかどうかを確認するためのJSコードは次のとおりです。
<スクリプト言語= "javascript" type = "text/javascript"> function checkisinstall(){try {var lodop = getLodop(); if(lodop.version){if(lodop.cversion)alert( "現在c-lodopクラウド印刷が利用可能です! elsealert( "Lodop Controlがこのマシンに正常にインストールされています!/nバージョン番号:"+lodop.version); };} catch(err){}}; </script>2。クラウド印刷制御Cロドップの使用
このコントロールは、元のLodopの使用と一致しています。元のコードを変更せずに、最新の印刷方法を直接使用できます。とてもいいです。このコントロールの使用に関して、私は以前に多くの関連する使用プロセスを導入しました。
たとえば、Winformでは、Webページパッケージを使用してドキュメントを作成するケース、「NVelocityに基づくいくつかのコンテンツ生成方法の要約」。
Webページでの「ドキュメント設定用のWeb印刷ソリューションの実装」、「Web印刷用のWeb印刷ソリューションの通常のレポート印刷」とともに、コントロールの使用と操作は非常に詳細な方法で導入されています。
このコントロールは、さまざまな詳細なケース(http://www.lodop.net/demo.html)を提供し、参照で使用できます。
前述のように、私はこのコントロールを使用してフレームワークでオンラインショッピング請求書処理を処理し続けました。たとえば、このようなインターフェイスコンテンツを適用する必要があります。
以下に示すように、ページのコンテンツを設計しました。
設計されたコンテンツについては、以下に示すようにページ内のJSコードに変換できます。
<script src = "/content/jquerytools/lodop/checkactivx.js"> </script> <script type = "text/javascript"> var lodop; //グローバル変数function preview(){//プレビューlodop = getlodop(); lodop.print_inita(-1、-1、824、1129、 "way bill set"); createLicensedata(); lodop.set_preview_window(2、0、 "); lodop_p.set_p.p.print(2、0、"); lodop.set_preview_window( 0、 "a4"); lodop.preview();}; function setup(){//印刷メンテナンスlodop = getlodop(); lodop.print_inita(-1、-1、824、1129、 "way bill set"); createLicensedata(); lodop.print_setup getLodop(); lodop.print_inita(-1、-1、824、1129、 "waybox set"); createelicensedata(); lodop.print_design();}; function createLicensedata(){){) $ .ajaxsettings.async = false; //最初に最初にユーザーは、メソッドを実装するために非同期リクエストを送信します$ .getJson( "/billdetail/findbyid?id =" + printid、function(info){lodop.add_print_setup_bkimg( "<img src = '/content/テンプレート/ブランクセットセットtemplate.png '// "); lodop.set_show_mode(" bkimg_in_preview "、true); //プレビューには背景lodop.set_show_mode(" bkimg_print "、true); info.fenyundanhao); lodop.add_print_barcode(684、441、262、56、 "128c"、info.fenyund_print_text(186、287、277、39、info.shou_com); 12); lodop.add_print_text(236、378、186、28、info.shou_name); lodop.set_print_stylea(0、 "fontsize"、12); lodop.add_print_text(276、283、284、67、info.shou_dizhi 12); lodop.add_print_text(362、306、254、30、info.shou_phone); lodop.set_print_stylea(0、 "fontsize"、12); 12); lodop.add_print_text(404、319、51、30、info.jianshu); lodop.set_print_stylea(0、 "fontsize"、12); lodop.add_print_text(400、476、95、31、info.zhongliana) 12); lodop.add_print_text(187、33、227、39、info.fa_gongsi); lodop.set_print_stylea(0、 "fontsize"、12); lodop.add_print_text(277、33、230、65、info.fa_dizhi(0.dizhi); 12); lodop.add_print_text(364、37、227、25、info.fa_phone); lodop.set_print_stylea(0、 "fontsize"、12); lodop.add_print_text(410、37、226、26、info.pinming); 12); lodop.add_print_text(410、37、226、26、info.pinming); lodop.set_print_stylea(0、 "fontsize"、12); lodop.add_print_text(803、34、234、39、info.fa_gongsi); lodop.set_print_stylea(0 font_stylea 12); lodop.add_print_text(895、32、238、66、info.fa_dizhi); lodop.set_print_stylea(0、 "fontsize"、12); lodop.add_print_text(979、33、234、25、info.fa_phone 12); lodop.add_print_text(1024、35、228、25、info.pinming); lodop.set_print_stylea(0、 "fontsize"、12); lodop.add_print_text(802、285、287、39、info.shoucom); 12); lodop.add_print_text(802、285、287、39、info.shou_stylea(0、 "fontsize"、12); lodop.add_print_text(849、373、198、28、info.shou_name); lodop.set_print_stylea(0 font.set_print_stylea(849、373、198、28、 12); lodop.add_print_text(894、285、287、67、info.shou_dizhi); lodop.set_print_stylea(0、 "fontsize"、12); lodop.add_print_text(980、287、281、26、info.shou_phone 12); lodop.add_print_text(1021、317、59、29、info.jianshu); lodop.set_print_stylea(0、 "fontsize"、12); lodop.add_print_text(1017、477、95、30、info.zhongliang) 12);});}} // print preview var printid; function printdetail(){var row = $( "#griddetail")。datagrid( "getSelected"); if(row){var index = $( '#gridteail')。 {$ .Messager.Alert( "TIP"、 "Recordを選択してください");} $ .MESSAGER.CONFIRM( "Batch Print Confism"、 "選択したレコードがバッチで印刷されていることを確認しますか?"、function(action){if(action){for(var i = 0; i <rows.length; i ++){lodop = getlodop(); lodop.print_init( "); lodop.set_print_pagesize(1、0、 "a4"); printid = rows [i] .id; createLicensedata(); lodop.print();}}}});} else {$ .Messager.Alert( "PRONT"、 "Batchesで印刷するデータを選択してください");}} //プリント{var row row $( "#griddetail")。datagrid( "getSelected"); if(row){var index = $( '#griddetail')。datagrid( 'getRowIndex'、row); printid = row.id; setup();}} </script>この印刷インターフェースでは、QRコード印刷操作も使用されています。これは、次のように、バーコードガンを使用して直接読むのに非常に便利です。
lodop.add_print_barcode(78、441、262、56、 "128c"、info.fenyundanhao); lodop.add_print_barcode(684、441、262、56、 "128c"、info.fenyundanhao);
次に、処理のためにメインページに印刷操作関数ボタンを設定します。以下は、EasyUIベースのWebフレームワークインターフェイス効果です。
印刷プレビューインターフェイスを以下に示します。実際に印刷するとき、背景画像を印刷しないように設定できます。
定期的な印刷の場合、以下に示すように、それらのインターフェイスは表示されるページのコンテンツに非常に近いです。
参照コードを以下に示します。
@*lodopコントロールのサポートを追加*@<スクリプトタイプ= "text/javascript"> var lodop; //グローバル変数関数として宣言Preview(){// Original Print createLicensedAdata(); lodop.set_show_mode( "preview_in_browse"、1); lodop.preview();}; function printa(){createLicensededata(); lodop.printa(); createLicensedAta(); lodop.print_setup();}; function design(){// Original Printing design createLicensedata(); lodop.print_design(); function createelicensedata(){lodop = getLodop(); lodop.print_init( "Policies and strodysteyle"); type = 'text/css' rel = 'styleSheet' href = '/content/default/style.css'/> <style> <! - bourdence-color:#cbcbcc} td {background-color:#ffffe; border:1;バックグラウンドカラー:#f1f1f3;パディング左:5px; border:1} - > </style> "; var strformhtml = strbodystyle +" <body> " + document.getElementbyid(" printcontent ")。 strformhtml); lodop.preview();} function saveas(){var id = $( '#id2')。val(); window.open( '/information/exportwordbyid?id =' + id);} </script>