Vue で lodop 印刷コントロールを使用してブラウザ互換の印刷を実現する方法

印刷(){
   LODOP = getLodop(); とします。
   LODOP.PRINT_INITA(0,0,800,1600,"印刷場所名");
   LODOP.SET_PRINT_PAGESIZE(1,700,500,"") //用紙サイズを設定 LODOP.NewPage(); //初期化 LODOP.SET_PRINT_MODE("RESELECT_PRINTER",true);
    : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : :

//==この JS は、Lodop プラグインと CLodop サービスをロードする包括的な例です。そのまま使用できます。理解した上で、独自のページ プログラムに統合することをお勧めします==

var CreatedOKLodopObject、CLodopIsLocal、CLodopJsState;


//==CLodop が必要かどうかを判断します (プラグインをサポートしていないブラウザの場合):==
エクスポート関数needCLodop() {
  試す {
    var ua = navigator.userAgent;
    if (ua.match(/Windows\sPhone/i))
      true を返します。
    ua.match(/iPhone|iPod|iPad/i) の場合
      true を返します。
    ua.match(/Android/i) の場合
      true を返します。
    （ua.match（/Edge\D?\d+/i））の場合
      true を返します。

    var verTrident = ua.match(/Trident\D?\d+/i);
    var verIE = ua.match(/MSIE\D?\d+/i);
    var verOPR = ua.match(/OPR\D?\d+/i);
    var verFF = ua.match(/Firefox\D?\d+/i);
    var x64 = ua.match(/x64/i);
    if ((!verTrident) && (!verIE) && (x64))
      true を返します。
    そうでなければ（verFF）{
      verFF = verFF[0].match(/\d+/);
      ((verFF[0] >= 41) || (x64))の場合
        true を返します。
    } そうでなければ (verOPR) {
      verOPR = verOPR[0].match(/\d+/);
      （verOPR[0] >= 32）の場合
        true を返します。
    } そうでない場合 ((!verTrident) && (!verIE)) {
      var verChrome = ua.match(/Chrome\D?\d+/i);
      if (verChrome) {
        verChrome = verChrome[0].match(/\d+/);
        (verChrome[0] >= 41)の場合
          true を返します。
      }
    }
    false を返します。
  } キャッチ (エラー) {
    true を返します。
  }
}

//==デュアルポート 8000 と 18000 を使用して CLodop のメイン JS を参照します (どちらかが使用されている場合)。==
CLodop() が必要な場合
  var head = document.head || document.getElementsByTagName("head")[0] || document.documentElement;
  
  var JS1 = document.createElement("script");
  JS1.src = "http://localhost:8000/CLodopfuncs.js?priority=1";
  head.insertBefore(JS1、head.firstChild);

  var JS2 = document.createElement("script");
  JS2.src = "http://localhost:18000/CLodopfuncs.js?priority=0";
  head.insertBefore(JS2、head.firstChild);

  CLodopIsLocal = !!((JS1.src + JS2.src).match(/\/\/localho|\/\/127.0.0./i));

  JS1.attachEventの場合{
  	CLodopJsState = "ロード中";
    var onChange = 関数(){ 
	   (window.event.srcElement.readyState == 'loaded') の場合        
	   CLodopJsState = "完了";
	};
	JS1.attachEvent('onreadystatechange',onChange);
	JS2.attachEvent('onreadystatechange',onChange);
  }
}

//==LODOP オブジェクトのメイン プロセスを取得して、インストールされているかどうか、アップグレードする必要があるかどうかを判断します:==
エクスポート関数 getLodop(oOBJECT, oEMBED) {
  var strHtmInstall = "<br><font color='#FF00FF'>印刷コントロールがインストールされていません。<a href='https://wms.warehousing.com/download/install_lodop32.exe' target='_self'>インストールを実行するにはここをクリック</a>してください。インストール後にページを更新するか、再度入力してください。</font>";
  var strHtmUpdate = "<br><font color='#FF00FF'>印刷コントロールをアップグレードする必要があります。<a href='https://wms.warehousing.com/download/install_lodop32.exe' target='_self'>アップグレードを実行するには、ここをクリック</a>してください。アップグレード後に再度入力してください。</font>";
  var strHtm64_Install = "<br><font color='#FF00FF'>印刷コントロールがインストールされていません。インストールを実行するには、ここ <a href='https://wms.warehousing.com/download/install_lodop64.exe' target='_self'> をクリックしてください</a>。ページを更新するか、インストール後に再度入力してください。</font>";
  var strHtm64_Update = "<br><font color='#FF00FF'>印刷コントロールをアップグレードする必要があります。<a href='https://wms.warehousing.com/download/install_lodop64.exe' target='_self'>アップグレードを実行するには、ここをクリック</a>してください。アップグレード後に再度入力してください。</font>";
  var strHtmFireFox = "<br><br><font color='#FF00FF'> (注意: Lodop アタッチメント npActiveXPLugin の古いバージョンがインストールされている場合は、まず [ツール] -> [アドオン] -> [拡張機能] でアンインストールしてください)</font>";
  var strHtmChrome = "<br><br><font color='#FF00FF'>(以前は正常だった場合、問題はブラウザのアップグレードまたは再インストールによってのみ発生したため、上記のインストールを再度実行する必要があります)</font>";
  var strCLodopInstall_1 = "<br><font color='#FF00FF'>Web 印刷サービス CLodop がインストールされておらず、起動していません。ここをクリックして <a href='https://wms.warehousing.com/download/CLodop_Setup_for_Win32NT.exe' target='_self'>ダウンロードしてインストール</a>してください";
  var strCLodopInstall_2 = "<br>(以前にインストールしたことがある場合は、<a href='https://wms.warehousing.com/download/CLodop.protocol:setup' target='_self'>ここをクリックしてもう一度開始</a>できます)";
  var strCLodopInstall_3 = "成功したらこのページを更新してください。</font>";
  var strCLodopUpdate = "<br><font color='#FF00FF'>Web 印刷サービス CLodop をアップグレードする必要があります。アップグレードを実行するには、ここ <a href='https://wms.warehousing.com/download/CLodop_Setup_for_Win32NT.exe' target='_self'> をクリックしてください</a>。アップグレード後にページを更新してください。</font>";
  var LODOP;
  試す {
    var ua = navigator.userAgent;
    var isIE = !!(ua.match(/MSIE/i)) || !!(ua.match(/Trident/i));
    CLodop() が必要な場合
      試す {
        LODOP は getCLodop() を返します。
      } キャッチ (エラー) {}
      if (!LODOP && (document.readyState !== "complete" || (isIE && CLodopJsState == "loading")) ) {
        alert("Web ページはまだダウンロードされていません。再度操作する前にしばらくお待ちください。");
        戻る;
      }
      もし (!LODOP) {
        document.body.innerHTML = strCLodopInstall_1 + (CLodopIsLocal ? strCLodopInstall_2 : "") + strCLodopInstall_3 + document.body.innerHTML;        
        戻る;
      } それ以外 {
        CLODOP.CVERSIONが3.0.9.3の場合
          document.body.innerHTML = strCLodopUpdate + document.body.innerHTML;
        }
        (oEMBED && oEMBED.parentNode) の場合
          oEMBED.parentNode.removeChild(oEMBED);
        (oOBJECT && oOBJECT.parentNode) の場合
          oOBJECT.parentNode.removeChild(oOBJECT);
      }
    } それ以外 {
      var is64IE = isIE && !!(ua.match(/x64/i));
      //==ページに Lodop がある場合はそれを直接使用し、ない場合は新しいものを作成します:==
      if (oOBJECT || oEMBED) {
        (IEの場合)
          LODOP = オブジェクト;
        それ以外
          LODOP = 埋め込み;
      } そうでない場合 (!CreatedOKLodopObject) {
        LODOP = document.createElement("オブジェクト");
        LODOP.setAttribute("幅", 0);
        LODOP.setAttribute("高さ", 0);
        LODOP.setAttribute("style", "位置:absolute;左:0px;上:-100px;幅:0px;高さ:0px;");
        (IEの場合)
          LODOP.setAttribute("classid", "clsid:2105C259-1E0C-4534-8141-A753534CB4CA");
        それ以外
          LODOP.setAttribute("type", "application/x-print-lodop");
        ドキュメント要素に子要素を追加します。
        作成されたOKLodopオブジェクト = LODOP;
      } それ以外
        LODOP = 作成されたOKLodopオブジェクト;
      //==Lodop プラグインがインストールされていない場合のダウンロード アドレスの入力を求める:==
      if ((!LODOP) || (!LODOP.VERSION)) {
        (ua.indexOf('Chrome') >= 0)の場合
          document.body.innerHTML = strHtmChrome + document.body.innerHTML;
        (ua.indexOf('Firefox') >= 0) の場合
          document.body.innerHTML = strHtmFireFox + document.body.innerHTML;
        document.body.innerHTML = (is64IE ? strHtm64_Install : strHtmInstall) + document.body.innerHTML;
        LODOP を返します。
      }
    }
    LODOP.VERSIONが6.2.2.6の場合
      (!CLodop() が必要)
        document.body.innerHTML = (is64IE ? strHtm64_Update : strHtmUpdate) + document.body.innerHTML;
    }
    //===次の空白位置は、統合された関数 (登録ステートメント、言語選択など) を呼び出すのに適しています:==



    //=======================================================
    LODOP を返します。
  } キャッチ (エラー) {
    alert("getLodopエラー: " + err);
  }
}