ken_nogi/pleasanter/develop2/★建売マスターシート/js/3_5現場案内図.js

function createMapReport() {
    getMyData();

    console.log('createMapReport');
    let div = document.createElement('div');
    div.id = 'templateHTML';
    div.style.display = 'none';
    $('body').append(div);

    const req = new XMLHttpRequest();
    let url = '/pleasanter/myScripts/templateHTML3.html';
    req.onreadystatechange = function () {
        //console.log(req);
        if (req.readyState == 4) {
            if (req.status == 200) {
                //console.log(req);
                let templateHTML = req.response;
                //let data002 = JSON.parse($('#Results_Description002').val()); //施工会社
                let data002 = JSON.parse(myData.DescriptionHash.Description002); //施工会社

                //console.log(data002);
                //console.log(userList);

                //let koujimei1 = $('#Results_ClassQ').val();
                //let koujimei2 = $('#Results_ClassU').val();
                //let shubetsu = $('#Results_Class042').val();

                let koujimei1 = myData.ClassHash.ClassQ;
                let koujimei2 = myData.ClassHash.ClassU;
                let shubetsu = myData.ClassHash.Class042;

                let koujimei = koujimei1 + ' 様邸' + shubetsu + '工事';
                if (koujimei2 != '') {
                    koujimei = koujimei2 + ' 様邸' + shubetsu + '工事';
                }
                let now = new Date();
                let nowStr = now.getFullYear() + '年' + (now.getMonth() + 1) + '月' + now.getDate() + '日';

                //let sonota = $('#Results_Description050').val().replace(/\n/g, '<br>');
                let sonota = myData.DescriptionHash.Description050.replace(/\n/g, '<br>');
                let kouji_tantou = '';
                if (myData.ClassHash.ClassJ) {
                    kouji_tantou = userList[myData.ClassHash.ClassJ].name;
                }

                let template = Hogan.compile(templateHTML);
                /*
                let outputHtml = template.render({
                    kokyaku_code: $('#Results_ClassB').val(),
                    keiyaku_code: $('#Results_ClassA').val(),
                    create_date: nowStr,
                    koujimei_kana: $('#Results_ClassR').val(),
                    kouji_mei: koujimei,
                    jusyo_yubin: '〒' + $('#Results_Class028').val(),
                    jyusho: $('#Results_Class029').val(),
                    sekou_kaisya: data002.ClassHash.ClassA,
                    tel: data002.ClassHash.ClassD,
                    fax: data002.ClassHash.ClassE,
                    kouji_tantou: kouji_tantou,
                    hannyu_road: $('#Results_Class050').val(),
                    chusyajou: $('#Results_Class051').val(),
                    sho_unpan: $('#Results_Class052').val(),
                    ResultId: $p.id(),
                    sonota: sonota,
                });
                */
                let outputHtml = template.render({
                    kokyaku_code: myData.ClassHash.ClassB,
                    keiyaku_code: myData.ClassHash.ClassA,
                    create_date: nowStr,
                    koujimei_kana: myData.ClassHash.ClassR,
                    kouji_mei: koujimei,
                    jusyo_yubin: '〒' + myData.ClassHash.Class028,
                    jyusho: myData.ClassHash.Class029,
                    sekou_kaisya: data002.ClassHash.ClassA,
                    tel: data002.ClassHash.ClassD,
                    fax: data002.ClassHash.ClassE,
                    kouji_tantou: kouji_tantou,
                    hannyu_road: myData.ClassHash.Class051,
                    chusyajou: myData.ClassHash.Class050,
                    sho_unpan: myData.ClassHash.Class052,
                    ResultId: $p.id(),
                    sonota: sonota,
                });

                let newWin = window.open('', '現場案内図', 'left=10,top=10,width=1100,height=900,menubar=no,toolbar=no,location=no,status=no,resizable=yes,scrollbars=no');
                newWin.document.open();
                newWin.document.write(outputHtml);
                newWin.document.close();

                openYahooMap(newWin);
            }
        }
    };

    req.open('GET', url);
    req.setRequestHeader('Pragma', 'no-cache');
    req.setRequestHeader('Cache-Control', 'no-cache');
    req.setRequestHeader('If-Modified-Since', 'Thu, 01 Jun 1970 00:00:00 GMT');
    req.send();
}

function openYahooMap(newWin) {
    //let jyusho = $('#Results_Class029').val();
    let jyusho = myData.ClassHash.Class029;

    if (jyusho) {
        const req = new XMLHttpRequest();
        let url = 'https://msearch.gsi.go.jp/address-search/AddressSearch?q=' + encodeURI(jyusho);
        req.onreadystatechange = function () {
            if (req.readyState == 4) {
                if (req.status == 200) {
                    // 受信したデータの処理を記述する
                    let res = JSON.parse(req.response);
                    //緯度経度取得
                    let lng = res[0].geometry.coordinates[0]; //経度
                    let lat = res[0].geometry.coordinates[1]; //緯度
                    //GoogleMAPURL作成
                    let googleMap = 'https://maps.google.co.jp/maps?ll=' + lat + ',' + lng + '&q=' + lat + ',' + lng + '&z=19';
                    //QRコード作成
                    $('#googleMapQrCode').qrcode({
                        width: 90,
                        height: 90,
                        text: googleMap
                    });
                    let canvas1 = document.getElementById('googleMapQrCode').firstChild;
                    let qrData = canvas1.toDataURL('image/png');
                    //console.log(qrData);
                    //QRコードを案内図に埋め込み
                    newWin.document.getElementById('mapQr').innerHTML = '<img src=' + qrData + ' />';
                    newWin.document.getElementById('lng').innerHTML = lng;
                    newWin.document.getElementById('lat').innerHTML = lat;

                    //Yahoo地図取得
                    let yahooMap1 = 'https://map.yahoo.co.jp/embedmap/V3/?' + 'lon=' + lng + '&lat=' + lat + '&zoom=16&cond=maptype:twoTones;' + '&width=640&height=400';
                    let html1 = '<body>' + '<script type="text/javascript" src="' + yahooMap1 + '">' + '</' + 'script>' + '</body>';
                    let iframeDocument1 = newWin.document.getElementById('mapFrame1').contentWindow.document;
                    iframeDocument1.open();
                    iframeDocument1.write(html1);
                    iframeDocument1.close();

                    let yahooMap2 = 'https://map.yahoo.co.jp/embedmap/V3/?' + 'lon=' + lng + '&lat=' + lat + '&zoom=17&cond=maptype:twoTones;' + '&width=640&height=400';
                    let html2 = '<body>' + '<script type="text/javascript" src="' + yahooMap2 + '">' + '</' + 'script>' + '</body>';
                    let iframeDocument2 = newWin.document.getElementById('mapFrame2').contentWindow.document;
                    iframeDocument2.open();
                    iframeDocument2.write(html2);
                    iframeDocument2.close();
                }
            }
        };
        req.open('GET', url);
        req.send();
    }
}