var apiUrl; // the url from viewbag (appsetting)
$(document).ready(function () {
    loadProvinces();
    loadAllLand();
    loadAddressType();
    //loadTransactionNapTienHistory();
});
function reloadPage() {
    window.location.reload()
}
function updateUserInfo() {
    var req = {
        id: $('#idConsumer').val(),
        fullName: $('#fullName').val(),
        phone: $('#phone').val(),
        email: $('#email').val(),
        cmnd: $('#cmnd').val(),
        tokenId: localStorage.getItem("tokenId")
    }
    $.ajax({
        url: "/Home/Update",
        type: "POST",
        data: JSON.stringify(req),
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        success: function (result) {
            if (result.data == "true") {
                toastr.remove();
                MessageUtil.ShowMessage({ message: "Cập nhật thông tin cá nhân thành công", type: "success" });
            }
        }
    });
}
function btnChangpassHome() {
    var req = {
        oldPass: $('#passwordOld').val(),
        newPass: $('#passwordNew').val(),
        tokenId: localStorage.getItem("tokenId")
    }
    if ($('#frm_changepass_home').valid()) {
        $.ajax({
            url: "/Home/UpdatePassword",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                if (result.data == "true") {
                    toastr.remove();
                    MessageUtil.ShowMessage({ message: "Cập nhật mật khẩu thành công", type: "success" });
                }

            }
        });
    }
}
function loadProvinces() {
    $('#selectProvinceQh').empty();
    $('#selectProvinceHt').empty();
    $('#selectProvinceNh').empty();
    $('#selectProvinceTn').empty();
    $.ajax({
        url: "/Area/GetAllProvince",
        type: "GET",
        async: false,
        success: function (result) {
            if (result != null) {
                if (result.data != null) 
                    localStorage.setItem("provinceLst", JSON.stringify(result.data));
                $('#selectProvinceQh').append(
                    `<option value="">Chọn tỉnh</option>`
                );
                $('#selectProvinceHt').append(
                    `<option value="">Chọn tỉnh</option>`
                );
                $('#selectProvinceNh').append(
                    `<option value="">Chọn tỉnh</option>`
                );
                $('#selectProvinceTn').append(
                    `<option value="">Chọn tỉnh</option>`
                );
                for (const element of result.data) {
                    $('#selectProvinceQh').append(
                        `<option value="${element.maTinh}">${element.tenTinh}</option>`
                    );
                    $('#selectProvinceHt').append(
                        `<option value="${element.maTinh}">${element.tenTinh}</option>`
                    );
                    $('#selectProvinceNh').append(
                        `<option value="${element.maTinh}">${element.tenTinh}</option>`
                    );
                    $('#selectProvinceTn').append(
                        `<option value="${element.maTinh}">${element.tenTinh}</option>`
                    );
                }
            }
        }
    });
}
function loadAddressType() {
    $('#addressType').empty();
    $('#suggestPlace').empty();

    $.ajax({
        url: apiUrl + `address/type/all`,
        type: "GET",
        async: false,
        success: function (result) {
            if (result != null) {
                $('#addressType').append(
                    `<div class="suggestPlaceCpn">
                        <div class="iconSuggest left" style="display: none;"><img src="/images/chevron_left_black_24dp.png"></div>
                        <div class="suggestPlace ">
                        <div id="suggestPlace" class="suggestPlaceContainer " style="left: 0px;">
                        </div>
                        </div>
                        <div class="iconSuggest right" style="display: none;"><img src="~/images/chevron_right_black_24dp.png"></div>
                    </div>`
                );
                for (const element of result.data) {
                    $('#suggestPlace').append(
                        `<button type="button" class="ui_chip_container_3VRRd itemSuggestPlace  ui_chip_iconContainer_2zlL9"><img src=""/><span>${element.name}</span></button>`
                    );
                }
            }
        }
    });
}
$('#selectProvinceQh').change(function () {
    $('#selectDistrictQh').empty();
    var req = {
        maTinh: $('#selectProvinceQh').val(),
    }
    changeDistrict(req, '4');
});
$('#selectDistrictQh').change(function () {
    $('#selectWardQh').empty();
    var req = {
        maHuyen: $('#selectDistrictQh').val(),
    }
    changeWard(req, '4');
});
$('#selectProvinceHt').change(function () {
    $('#selectDistrictHt').empty();
    var req = {
        maTinh: $('#selectProvinceHt').val(),
    }
    changeDistrict(req, '3');
});
$('#selectProvinceNh').change(function () {
    $('#selectDistrictNh').empty();
    var req = {
        maTinh: $('#selectProvinceNh').val(),
    }
    changeDistrict(req, '2');
});
$('#selectProvinceTn').change(function () {
    $('#selectDistrictTn').empty();
    var req = {
        maTinh: $('#selectProvinceTn').val(),
    }
    changeDistrict(req, '1');
});
function changeDistrict(req, type) {
    $.ajax({
        url: "/Area/GetDistrictByMaTinh",
        type: "POST",
        async: false,
        data: JSON.stringify(req),
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        success: function (result) {
            if (result.data != null) {
                if (result.data.length == 0) {
                    if (type == '4') {
                        $('#selectDistrictQh').append(
                            `<option value="">Không có thông tin</option>`
                        );
                    }
                    if (type == '3') {
                        $('#selectDistrictHt').append(
                            `<option value="">Không có thông tin</option>`
                        );
                    }
                    if (type == '2') {
                        $('#selectDistrictNh').append(
                            `<option value="">Không có thông tin</option>`
                        );
                    }
                    if (type == '1') {
                        $('#selectDistrictTn').append(
                            `<option value="">Không có thông tin</option>`
                        );
                    }

                }
                else {
                    if (type == '4') {
                        $('#selectDistrictQh').append(
                            `<option value="">Chọn Huyện/T.phố</option>`
                        );
                    }
                    if (type == '3') {
                        $('#selectDistrictHt').append(
                            `<option value="">Chọn Huyện/T.phố</option>`
                        );
                    }
                    if (type == '2') {
                        $('#selectDistrictNh').append(
                            `<option value="">Chọn Huyện/T.phố</option>`
                        );
                    }
                    if (type == '1') {
                        $('#selectDistrictTn').append(
                            `<option value="">Chọn Huyện/T.phố</option>`
                        );
                    }

                }
                for (const element of result.data) {
                    if (type == '4') {
                        $('#selectDistrictQh').append($('<option>', {
                            value: element.maHuyen,
                            text: element.tenHuyen
                        }));

                    }
                    if (type == '3') {
                        $('#selectDistrictHt').append($('<option>', {
                            value: element.maHuyen,
                            text: element.tenHuyen
                        }));

                    }
                    if (type == '2') {
                        $('#selectDistrictNh').append($('<option>', {
                            value: element.maHuyen,
                            text: element.tenHuyen
                        }));

                    }
                    if (type == '1') {
                        $('#selectDistrictTn').append($('<option>', {
                            value: element.maHuyen,
                            text: element.tenHuyen
                        }));
                    }

                }
            }
        }
    });
}
$('#selectDistrictNh').change(function () {
    $('#selectWardNh').empty();
    var req = {
        maHuyen: $('#selectDistrictNh').val(),
    }
    changeWard(req, '2');
});
$('#selectDistrictTn').change(function () {
    $('#selectWardTn').empty();
    var req = {
        maHuyen: $('#selectDistrictTn').val(),
    }
    changeWard(req, '1');
});
function changeWard(req, type) {

    $.ajax({
        url: "/Area/GetWardByMaHuyen",
        type: "POST",
        async: false,
        data: JSON.stringify(req),
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        success: function (result) {
            if (result.data != null) {
                if (result.data.length == 0) {
                    if (type == '4') {
                        $('#selectWardQh').append(
                            `<option value="">Không có thông tin</option>`
                        );

                    }
                    if (type == '2') {
                        $('#selectWardNh').append(
                            `<option value="">Không có thông tin</option>`
                        );

                    }
                    if (type == '1') {
                        $('#selectWardTn').append(
                            `<option value="">Không có thông tin</option>`
                        );
                    }
                }
                else {
                    if (type == '4') {
                        $('#selectWardQh').append(
                            `<option value="">Chọn xã/phường/thị trấn</option>`
                        );

                    }
                    if (type == '2') {
                        $('#selectWardNh').append(
                            `<option value="">Chọn xã/phường/thị trấn</option>`
                        );

                    }
                    if (type == '1') {
                        $('#selectWardTn').append(
                            `<option value="">Chọn xã/phường/thị trấn</option>`
                        );
                    }

                }
                for (const element of result.data) {
                    if (type == '4') {
                        $('#selectWardQh').append($('<option>', {
                            value: element.maXa,
                            text: element.tenXa
                        }));

                    }
                    if (type == '2') {
                        $('#selectWardNh').append($('<option>', {
                            value: element.maXa,
                            text: element.tenXa
                        }));

                    }
                    if (type == '1') {
                        $('#selectWardTn').append($('<option>', {
                            value: element.maXa,
                            text: element.tenXa
                        }));

                    }

                }
            }
        }
    });
}
async function searchLmuQuyHoach() {
    var req = {
        maTinh: $('#selectProvinceQh').val(),
        maHuyen: $('#selectDistrictQh').val(),
        maXa: $('#selectWardQh').val(),
        type: '4',
        tokenId: localStorage.getItem("tokenId")
    }
    onClickLmu(req);
}
async function searchLmuHienTrang() {
    var req = {
        maTinh: $('#selectProvinceHt').val(),
        maHuyen: $('#selectDistrictHt').val(),
        type: '3',
        tokenId: localStorage.getItem("tokenId")
    }
    onClickLmu(req);
}
async function searchLmuNongHoa() {
    var req = {
        maTinh: $('#selectProvinceNh').val(),
        maHuyen: $('#selectDistrictNh').val(),
        maXa: $('#selectWardNh').val(),
        type: '1',
        tokenId: localStorage.getItem("tokenId")
    }
    //console.log(req);
    onClickLmu(req);
}
async function searchLmuThoNhuong() {
    var req = {
        maTinh: $('#selectProvinceTn').val(),
        maHuyen: $('#selectDistrictTn').val(),
        maXa: $('#selectWardTn').val(),
        type: '2',
        tokenId: localStorage.getItem("tokenId")
    }
    onClickLmu(req);
}
//tìm kiếm lmu theo đã xem hoặc đã lưu
async function searchLmu1(provinceCode, districtCode, wardCode, transType) {
    var req = {
        maTinh: provinceCode.toString(),
        maHuyen: districtCode.toString(),
        maXa: wardCode == null ? "" : wardCode.toString(),
        type: transType.toString(),
        tokenId: localStorage.getItem("tokenId")
    }
    console.log(req);
    onClickLmu(req);
}
//
//

async function onClickLmu(req) {
    var layerData = [];
    //layerName.push('');
    if (req.type == '4') {
        $("#clickQh").empty();

    }
    if (req.type == '3') {
        $("#clickHt").empty();

    }
    if (req.type == '2') {
        $("#clickNH").empty();

    }
    if (req.type == '1') {
        $("#clickTN").empty();
    }

    $.ajax({

        url: "/Lmu/GetLmuByType",
        type: "POST",
        data: JSON.stringify(req),
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        async: true,
        crossDomain: true,
        headers: {
            "accept": "application/json",
            "Access-Control-Allow-Origin": "*"
        },
        success: function (result) {
            $("#infor-td").addClass("hide");
            $("#hideresult").removeClass("hide");
            console.log(result);
            if (result.data.length == 0) {
                toastr.remove();
                MessageUtil.ShowMessage({ message: "Bản đồ đang được cập nhật", type: "error" });
            }
            else {
                if (req.type == '1') {
                    $("#hideresultNh").removeClass("hide");
                    if (result.data.length == 1) {
                        for (const element of result.data) {
                            $('#clickNH').append(
                                `<div class="row"><div class="col-11"> ${element.landUnit}</div><div onclick="changeDaLuu(${req.maTinh},${req.maHuyen},'',${req.type})" class="col-1 cursor-p"><img src="/images/iconnote.png"/> </div></div> `
                            );
                        }
                    }
                    else {
                        for (const element of result.data) {
                            $('#clickNH').append(
                                ` <div class="row"><div class="col-11 cursor-p green-hover" onclick="selectLmu('${element.layerName}',${element.pointX1},${element.pointY1},${element.pointX2},${element.pointY2})"> ${element.landUnit}</div><div onclick="changeDaLuu(${req.maTinh},${req.maHuyen},'',${req.type})" class="col-1 cursor-p"><img src="/images/iconnote.png"/> </div></div> `
                            );
                        }
                    }
                }
                if (req.type == '2') {
                    $("#hideresultTn").removeClass("hide");
                    if (result.data.length == 1) {
                        for (const element of result.data) {
                            $('#clickTN').append(
                                `<div class="row"><div class="col-11"> ${element.landUnit}</div><div onclick="changeDaLuu(${req.maTinh},${req.maHuyen},'',${req.type})" class="col-1 cursor-p"><img src="/images/iconnote.png"/> </div></div> `
                            );
                        }
                    }
                    else {
                        for (const element of result.data) {
                            $('#clickTN').append(
                                ` <div class="row"><div class="col-11 cursor-p green-hover" onclick="selectLmu('${element.layerName}',${element.pointX1},${element.pointY1},${element.pointX2},${element.pointY2})"> ${element.landUnit}</div><div onclick="changeDaLuu(${req.maTinh},${req.maHuyen},'',${req.type})" class="col-1 cursor-p"><img src="/images/iconnote.png"/> </div></div> `
                            );
                        }
                    }
                }
                if (req.type == '3') {
                    $("#hideresultHt").removeClass("hide");
                    if (result.data.length == 1) {
                        for (const element of result.data) {
                            $('#clickHt').append(
                                `<div class="row"><div class="col-11"> ${element.landUnit}</div><div onclick="changeDaLuu(${req.maTinh},${req.maHuyen},'',${req.type})" class="col-1 cursor-p"><img src="/images/iconnote.png"/> </div></div> `
                            );
                        }
                    }
                    else {
                        for (const element of result.data) {
                            $('#clickHt').append(
                                ` <div class="row"><div class="col-11 cursor-p green-hover" onclick="selectLmu('${element.layerName}',${element.pointX1},${element.pointY1},${element.pointX2},${element.pointY2})"> ${element.landUnit}</div><div onclick="changeDaLuu(${req.maTinh},${req.maHuyen},'',${req.type})" class="col-1 cursor-p"><img src="/images/iconnote.png"/> </div></div> `
                            );
                        }
                    }
                }
                if (req.type == '4') {
                    $("#hideresultQh").removeClass("hide");
                    if (result.data.length == 1) {
                        for (const element of result.data) {
                            $('#clickQh').append(
                                `<div class="row"><div class="col-11"> ${element.landUnit}</div><div onclick="changeDaLuu(${req.maTinh},${req.maHuyen},'',${req.type})" class="col-1 cursor-p"><img src="/images/iconnote.png"/> </div></div> `
                            );
                        }
                    }
                    else {
                        for (var element of result.data) {
                            $('#clickQh').append(
                                ` <div class="row"><div class="col-11 cursor-p green-hover" onclick="selectLmu('${element.layerName}',${element.pointX1},${element.pointY1},${element.pointX2},${element.pointY2})"> ${element.landUnit}</div><div onclick="changeDaLuu(${req.maTinh},${req.maHuyen},'',${req.type})" class="col-1 cursor-p"><img src="/images/iconnote.png"/> </div></div> `
                            );
                        }
                    }
                }
                if (result.data.length == 1) {

                    if (result.data[0].pointX1 != 0 && result.data[0].pointY1 != 0 && result.data[0].pointX2 != 0 && result.data[0].pointY2 != 0) {
                        var extent = ol.proj.transformExtent(
                            [result.data[0].pointX2, result.data[0].pointY2, result.data[0].pointX1, result.data[0].pointY1],
                            "EPSG:4326", "EPSG:3857"
                        );
                        console.log("extent:", extent);
                        map.getView().fit(extent, map.getSize());
                    } else {
                        setViewCenter();
                    }
                    // wmsSource.pus
                    layerData.push(result.data[0].layerName);
                    console.log("layer:", layerData);
                    //layerName=result.data[0].layerName;
                    // console.log(result.data[0].layerName);
                    setLayerWard(layerData);
                    //Xử lý chi tiết bản đồ nông hóa
                    const wmsSource = new TileWMS({
                        url: geoserverWmsUrl,
                        params: {
                            'LAYERS': result.data[0].layerName,
                            'TILED': true
                        },
                        serverType: 'geoserver',
                        crossOrigin: 'anonymous',
                    });
                    const wmsLayer = new TileLayer({
                        source: wmsSource,
                    });
                    map.on('singleclick', function (evt) {
                        $("#infor-td").removeClass("hide");
                        $("#infor-td").empty();
                        $("#infoDetailLandMb").removeClass("mb-hide");
                        $("#infoDetailLandMb").addClass("mb-show");
                        $("#infoDetailLandMb").empty();
                        $("#statusAndPlanMb").addClass("mb-hide");
                        $("#statusAndPlanMb").removeClass("mb-show");
                        const viewResolution = /** @type {number} */ (mapView.getResolution());
                        const url = wmsSource.getFeatureInfoUrl(evt.coordinate, viewResolution, 'EPSG:3857',
                            {
                                'INFO_FORMAT': 'application/json', 'QUERY_LAYERS': result.data[0].layer1Name

                            }
                        );
                        console.log(url);
                        $.ajax({
                            url: url,
                            type: "GET",
                            async: false,
                            crossDomains: true,
                            contentType: 'application/json',
                            headers: {
                                "Access-Control-Allow-Origin": "*",
                                "Access-Control-Allow-Methods": 'GET',
                                "Access-Control-Allow-Headers": "application/json",
                            },
                            success: function (result) {
                                console.log(result);
                                if (result.features.length == 0) {
                                    $("#map").removeClass("mb-height-layermap");
                                    $("#map").addClass("height-mb-3");
                                    $("#infoDetailLandMb").addClass("mb-hide");
                                    $("#infoDetailLandMb").removeClass("mb-show");
                                    $("#box-mobile").removeClass("mb-hide");
                                    $("#box-mobile").addClass("mb-show");
                                }
                                $('#infor-td').append(
                                    ` <div class="row-ba"><div class="row"><div class="col-md-9 s-tttd">Thông tin thửa đất</div><div onclick="closeTttd()" class="col-md-3 text-right imClose"><img src="/images/close.png" /></div></div></div>
                                <div class="row-ba1">
                                    <div class="row"><div class="col-md-8 no-pad-right">Diện tích (ha):</div><div class="col-md-4 text-right">${result.features[0].properties.Dien_tich == undefined ? '' : result.features[0].properties.Dien_tich}</div></div>
                                    <div class="row"><div class="col-md-8 no-pad-right">Loại đất</div><div class="col-md-4 text-right">${result.features[0].properties.Loai_dat == undefined ? '' : result.features[0].properties.Loai_dat}</div></div>
                                    <div class="row"><div class="col-md-8 no-pad-right">Độ chua (PH KCL):</div><div class="col-md-4 text-right"> ${(result.features[0].properties.pH_KCl == undefined && result.features[0].properties.PH == undefined) ? '' : ((result.features[0].properties.pH_KCl == null ? '' : result.features[0].properties.pH_KCl.toFixed(5)) || result.features[0].properties.PH)}</div></div>
                                    <div class="row"><div class="col-md-8 no-pad-right">Khả năng trao đổi Cation (CEC)</div><div class="col-md-4 text-right"> ${result.features[0].properties.CEC == undefined ? '' : result.features[0].properties.CEC}</div></div>
                                    <div class="row"><div class="col-md-8 no-pad-right">Đạm tổng số (N) %:</div><div class="col-md-4 text-right"> ${(result.features[0].properties.N_Ts == undefined && result.features[0].properties.N == undefined) ? '' : ((result.features[0].properties.N_Ts == null ? '' : result.features[0].properties.N_Ts.toFixed(5)) || result.features[0].properties.N)}</div></div>
                                    <div class="row"><div class="col-md-8 no-pad-right">Lân tổng số (P2O5) %:</div><div class="col-md-4 text-right"> ${(result.features[0].properties.P2O5_Ts == undefined && result.features[0].properties.P2O5Ts == undefined) ? '' : ((result.features[0].properties.P2O5_Ts == null ? '' : result.features[0].properties.P2O5_Ts.toFixed(5)) || result.features[0].properties.P2O5Ts)}</div></div>
                                    <div class="row"><div class="col-md-8 no-pad-right">Kali tổng số (K2O) %:</div><div class="col-md-4 text-right"> ${(result.features[0].properties.K2O_Ts == undefined && result.features[0].properties.K2OTs == undefined) ? '' : ((result.features[0].properties.K2O_Ts == null ? '' : result.features[0].properties.K2O_Ts.toFixed(5)) || result.features[0].properties.K2OTs)}</div></div>
                                    <div class="row"><div class="col-md-8 no-pad-right">Lân dễ tiêu (mg/100g):</div><div class="col-md-4 text-right"> ${(result.features[0].properties.P2O5_dt == undefined && result.features[0].properties.P2O5dt == undefined) ? '' : ((result.features[0].properties.P2O5_dt == null ? '' : result.features[0].properties.P2O5_dt.toFixed(5)) || result.features[0].properties.P2O5dt)}</div></div>
                                    <div class="row"><div class="col-md-8 no-pad-right">Kali dễ tiêu (mg/100g):</div><div class="col-md-4 text-right"> ${(result.features[0].properties.K2O_dt == undefined && result.features[0].properties.K2Odt == undefined) ? '' : ((result.features[0].properties.K2O_dt == null ? '' : result.features[0].properties.K2O_dt.toFixed(5)) || result.features[0].properties.K2Odt)}</div></div>
                                </div>`);
                                if (result.features.length != 0) {
                                    $("#map").addClass("mb-height-layermap");
                                    $("#map").removeClass("height-mb-3");
                                    $("#layer-map-mb").removeClass("mb-show");
                                    $("#layer-map-mb").addClass("mb-hide");
                                    $("#box-mobile").addClass("mb-hide");
                                    $("#box-mobile").removeClass("mb-show");
                                    $("#note-mb").removeClass("mb-show");
                                    $("#note-mb").addClass("mb-hide");
                                    $("#card-serach-mb").removeClass("mb-show");
                                    $("#card-serach-mb").addClass("mb-hide");
                                    $("#bookmark-mb").removeClass("mb-show");
                                    $("#bookmark-mb").addClass("mb-hide");
                                    $('#infoDetailLandMb').append(
                                        `
                            <div id="" class="card-header card-header-sea-mb" style="padding:0.5rem!important;border-radius:0!important">
                                <div class="card-title no-margin"><h3 class="card-label no-margin"> Thông tin thửa đất </h3></div>
                                <div onclick="removeInfoDetailLandMb()" class="card-toolbar no-margin">
                                    <a class="btn-hover-light-primary margin-bot8 icon-times" href="javascript:;" title="Đóng">
                                        <i class="fa fa-times icon-nm"></i>
                                    </a>
                                </div>
                            </div>
                            <div id="" class="card-body-layermap response-layer">
                                <div class="ttd1 row pad-122"><div class="col-8 input">Diện tích (ha): </div> <div class="col-4 ttd-text">${result.features[0].properties.Dien_tich == undefined ? '' : result.features[0].properties.Dien_tich}</div></div>
                                <div class="ttd1 row pad-122"><div class="col-8 input">Loại đất: </div> <div class="col-4 ttd-text">${result.features[0].properties.Loai_dat == undefined ? '' : result.features[0].properties.Loai_dat}</div></div>
                                <div class="ttd1 row pad-122"><div class="col-8 input">Độ chua (PH KCL): </div> <div class="col-4 ttd-text">${(result.features[0].properties.pH_KCl == undefined && result.features[0].properties.PH == undefined) ? '' : ((result.features[0].properties.pH_KCl == null ? '' : result.features[0].properties.pH_KCl.toFixed(5)) || result.features[0].properties.PH)}</div></div>
                                <div class="ttd1 row pad-122"><div class="col-8 input">Khả năng trao đổi Cation (CEC): </div> <div class="col-4 ttd-text">${result.features[0].properties.CEC == undefined ? '' : result.features[0].properties.CEC}</div></div>
                                <div class="ttd1 row pad-122"><div class="col-8 input">Đạm tổng số (N) %: </div> <div class="col-4 ttd-text">${(result.features[0].properties.N_Ts == undefined && result.features[0].properties.N == undefined) ? '' : ((result.features[0].properties.N_Ts == null ? '' : result.features[0].properties.N_Ts.toFixed(5)) || result.features[0].properties.N)}</div></div>
                                <div class="ttd1 row pad-122"><div class="col-8 input">Lân tổng số (P2O5) %: </div> <div class="col-4 ttd-text">${(result.features[0].properties.P2O5_Ts == undefined && result.features[0].properties.P2O5Ts == undefined) ? '' : ((result.features[0].properties.P2O5_Ts == null ? '' : result.features[0].properties.P2O5_Ts.toFixed(5)) || result.features[0].properties.P2O5Ts)}</div></div>
                                <div class="ttd1 row pad-122"><div class="col-8 input">Kali tổng số (K2O) %: </div> <div class="col-4 ttd-text">${(result.features[0].properties.K2O_Ts == undefined && result.features[0].properties.K2OTs == undefined) ? '' : ((result.features[0].properties.K2O_Ts == null ? '' : result.features[0].properties.K2O_Ts.toFixed(5)) || result.features[0].properties.K2OTs)}</div></div>
                                <div class="ttd1 row pad-122"><div class="col-8 input">Lân dễ tiêu (mg/100g): </div> <div class="col-4 ttd-text">${(result.features[0].properties.P2O5_dt == undefined && result.features[0].properties.P2O5dt == undefined) ? '' : ((result.features[0].properties.P2O5_dt == null ? '' : result.features[0].properties.P2O5_dt.toFixed(5)) || result.features[0].properties.P2O5dt)}</div></div>
                                <div class="ttd1 row pad-122"><div class="col-8 input">Kali dễ tiêu (mg/100g): </div> <div class="col-4 ttd-text">${(result.features[0].properties.K2O_dt == undefined && result.features[0].properties.K2Odt == undefined) ? '' : ((result.features[0].properties.K2O_dt == null ? '' : result.features[0].properties.K2O_dt.toFixed(5)) || result.features[0].properties.K2Odt)}</div></div>
                            </div>
                            `);
                                }
                            }
                        });
                    });
                    map.on('pointermove', function (evt) {
                        if (evt.dragging) {
                            return;
                        }
                        const data = wmsLayer.getData(evt.pixel);
                        const hit = data && data[3] > 0; // transparent pixels have zero for data[3]
                        map.getTargetElement().style.cursor = hit ? 'pointer' : '';
                    });
                }
            }
        }
    });
}

async function selectLmu(layerName, pointX1, pointY1, pointX2, pointY2) {
    //console.log(layerName);
    var layerData1 = [];
    await deleteSomeLayer();
    await deleteSomeLayer();
    await deleteSomeLayer();
    await deleteSomeLayer();
    await deleteSomeLayer();
    await deleteSomeLayer();
    if (pointX1 != 0 && pointY1 != 0 && pointX2 != 0 && pointY2 != 0) {
        var extent = ol.proj.transformExtent(
            [pointX2, pointY2, pointX1, pointY1],
            "EPSG:4326", "EPSG:3857"
        );
        map.getView().fit(extent, map.getSize());
    } else {
        setViewCenter();
    }
    // wmsSource.pus
    layerData1.push(layerName);
    setLayerWard(layerData1);
};

//

//load lại đất
function loadAllLand() {
    $('#commentLand').empty();
    //$('#commentLandMb').empty();
    $.ajax({
        url: "/Land/GetAll",
        type: "GET",
        async: false,
        success: function (result) {
            if (result != null) {
                for (const element of result.data) {
                    $('#commentLand').append(
                        `<div class="row pad-bot5"><div class="col-3 flex-center"><div class="color-line2" style="background: ${'#' + element.landColor}"></div></div>
						 <div class="col-md-9 note-text2">${element.landName}</div></div>`
                    );
                    $('#commentLandMb').append(
                        `<div class="pad-lef-13 pad-top-12 pad-bot5">
							<div class="row">
								<div class="col-sm-3 text-center">
									<div class="height-22" style="background-color: ${'#' + element.landColor}"></div>
								</div>
								<div class="col-sm-9 text-left">${element.landName}</div>
							</div>
						</div>`
                    );
                }
            }
        }
    });
}
//load giao dịch tra cứu
function loadTransactionTraCuuHistory() {
    $("#user-info-wrapper").removeClass("openUserInfoAnimate");
    $("#user-info-wrapper").addClass("closeUserInfoAnimate");
    $("#detaillichsugiaodich").addClass("openUserInfoAnimate");
    $("#detaillichsugiaodich").removeClass("closeUserInfoAnimate");
    $('#transTraCuu1').empty();
    index = 0; size = 0;
    TransactionTraCuuHistory(index, size);
}
function loadMoreTraCuu(pageIndex) {
    TransactionTraCuuHistory(pageIndex, 0);
}
function TransactionTraCuuHistory(index, size) {
    if (index == 0) {
        $('#transTraCuu1').empty();
        $('#transTraCuu2').empty();
        var index = 1;
        var size = 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            transactionType: '1',
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Transaction/GetTransactionByType",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                if (result.records != null && result.records.length > 0) {
                    for (const element of result.records) {
                        $('#transTraCuu1').append(
                            ` <div class="row canle-infrouser cantadd2">
                        <div class="col-md-2"><img src="/images/igreen.png" /></div><div class="col-md-10"><p class="no-margin tadd1">${element.content}</p><p class="no-margin tadd2">${element.transactionTime}</p><p class="no-margin tadd3">${element.amount}</p></div>
                    </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 5) {
                        $('#transTraCuu2').append(
                            ` <div class="row canle-infrouser cantadd2">
                        <div onclick="loadMoreTraCuu(${result.pageIndex})" class="col-12 cursor-p">
                            <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                        </div>
                    </div>`
                        );
                    }
                }
            }
        });
    }
    else {
        $('#transTraCuu2').empty();
        var index = index + 1;
        var size = size + 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            transactionType: '1',
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Transaction/GetTransactionByType",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                for (const element of result.records) {
                    $('#transTraCuu1').append(
                        ` <div class="row canle-infrouser cantadd2">
                        <div class="col-md-2"><img src="/images/igreen.png" /></div><div class="col-md-10"><p class="no-margin tadd1">${element.content}</p><p class="no-margin tadd2">${element.transactionTime}</p><p class="no-margin tadd3">${element.amount}</p></div>
                    </div>`
                    );
                }
                if (result.totalRecords > result.pageIndex * 5) {
                    $('#transTraCuu2').append(
                        ` <div class="row canle-infrouser cantadd2">
                        <div onclick="loadMoreTraCuu(${result.pageIndex})" class="col-12 cursor-p">
                            <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                        </div>
                    </div>`
                    );
                }
            }
        });
    }
}
//load giao dịch nạp tiền
function loadTransactionNapTienHistory() {
    $("#user-info-wrapper").removeClass("openUserInfoAnimate");
    $("#user-info-wrapper").addClass("closeUserInfoAnimate");
    $("#detaillichsunaptien").addClass("openUserInfoAnimate");
    $("#detaillichsunaptien").removeClass("closeUserInfoAnimate");
    $('#transNapTien1').empty();
    index = 0; size = 0;
    TransactionNapTienHistory(index, size);
}
function loadMoreNapTien(pageIndex) {
    TransactionNapTienHistory(pageIndex, 0);
}
function TransactionNapTienHistory(index, size) {
    if (index == 0) {
        $('#transNapTien1').empty();
        $('#transNapTien2').empty();
        var index = 1;
        var size = 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            transactionType: '2',
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Transaction/GetTransactionByType",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                if (result.records != null && result.records.length > 0) {
                    for (const element of result.records) {
                        $('#transNapTien1').append(
                            ` <div class="row canle-infrouser cantadd2">
                                <div class="col-md-2"><img src="/images/igreen.png" /></div><div class="col-md-10"><p class="no-margin tadd1">${element.content == null ? "" : element.content}</p><p class="no-margin tadd2">${element.transactionTime}</p><p class="no-margin tadd3">${element.amount}</p></div>
                              </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 5) {
                        $('#transNapTien2').append(
                            ` <div class="row canle-infrouser cantadd2">
                                <div onclick="loadMoreNapTien(${result.pageIndex})" class="col-12 cursor-p">
                                    <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                                </div>
                            </div>`
                        );
                    }
                }
            }
        });
    }
    else {
        $('#transNapTien2').empty();
        var index = index + 5;
        var size = size + 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            transactionType: '2',
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Transaction/GetTransactionByType",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                if (result.records != null && result.records.length > 0) {
                    for (const element of result.records) {
                        $('#transNapTien1').append(
                            ` <div class="row canle-infrouser cantadd2">
                                <div class="col-md-2"><img src="/images/igreen.png" /></div><div class="col-md-10"><p class="no-margin tadd1">${element.content == null ? "" : element.content}</p><p class="no-margin tadd2">${element.transactionTime}</p><p class="no-margin tadd3">${element.amount}</p></div>
                              </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 5) {
                        $('#transNapTien2').append(
                            ` <div class="row canle-infrouser cantadd2">
                                <div onclick="loadMoreNapTien(${result.pageIndex})" class="col-12 cursor-p">
                                    <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                                </div>
                            </div>`
                        );
                    }
                }
            }
        });
    }

}
//load đã lưu
function loadFavouriteHistory() {
    $("#user-info-wrapper").removeClass("openUserInfoAnimate");
    $("#user-info-wrapper").addClass("closeUserInfoAnimate");
    $("#detaillichsudaluu").addClass("openUserInfoAnimate");
    $("#detaillichsudaluu").removeClass("closeUserInfoAnimate");
    $('#transDaLuu1').empty();
    index = 0; size = 0;
    FavouriteDaLuuHistory(index, size);
}
function loadMoreDaLuu(pageIndex) {
    FavouriteDaLuuHistory(pageIndex, 0);
}
function FavouriteDaLuuHistory(index, size) {
    if (index == 0) {
        $('#transDaLuu1').empty();
        $('#transDaLuu2').empty();
        var index = 1;
        var size = 6;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Favourite/GetFavouriteDaLuu",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                //console.log(result);
                if (result.records != null && result.records.length > 0) {
                    console.log(result);
                    for (const element of result.records) {
                        $('#transDaLuu1').append(
                            ` <div class="row canle-infrouser cantadd2">
                                <div class="col-md-2"><img src="/images/igreen.png" /></div><div class="col-md-10"><p class="no-margin tadd1">${element.provinceName == null ? "" : element.provinceName} / ${element.districtName == null ? "" : element.districtName}</p>
                                <p class="no-margin tadd1"><img src="/images/location1.png">&nbsp;&nbsp;
                                    ${element.mapCategoryCode == "1" ? "Nông hóa" : (element.mapCategoryCode == "2" ? "Thổ nhưỡng" : element.mapCategoryCode == "3" ? "Hiện trạng" : element.mapCategoryCode == "4" ? "Quy hoạch" : element.mapCategoryCode == "5" ? "Địa chỉ" : element.mapCategoryCode)}
                                </p></div>
                              </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 6) {
                        $('#transDaLuu2').append(
                            ` <div class="row canle-infrouser cantadd2">
                                <div onclick="loadMoreDaLuu(${result.pageIndex})" class="col-12 cursor-p">
                                    <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                                </div>
                            </div>`
                        );
                    }
                }
            }
        });
    }
    else {
        $('#transDaLuu2').empty();
        var index = index + 1;
        var size = size + 6;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Favourite/GetFavouriteDaLuu",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {

                if (result.records != null && result.records.length > 0) {
                    console.log(result);
                    for (const element of result.records) {
                        $('#transDaLuu1').append(
                            ` <div class="row canle-infrouser cantadd2">
                                <div class="col-md-2"><img src="/images/igreen.png" /></div><div class="col-md-10"><p class="no-margin tadd1">${element.provinceName == null ? "" : element.provinceName} / ${element.districtName == null ? "" : element.districtName}</p>
                                <p class="no-margin tadd1"><img src="/images/location1.png">&nbsp;&nbsp;
                                    ${element.mapCategoryCode == "1" ? "Nông hóa" : (element.mapCategoryCode == "2" ? "Thổ nhưỡng" : element.mapCategoryCode == "3" ? "Hiện trạng" : element.mapCategoryCode == "4" ? "Quy hoạch" : element.mapCategoryCode == "5" ? "Địa chỉ" : element.mapCategoryCode)}
                                </p></div>
                              </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 6) {
                        $('#transDaLuu2').append(
                            ` <div class="row canle-infrouser cantadd2">
                                <div onclick="loadMoreDaLuu(${result.pageIndex})" class="col-12 cursor-p">
                                    <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                                </div>
                            </div>`
                        );
                    }
                }
            }
        });
    }

}
//
$("#quyHoachTab").click(function () {
    $("#idPanelLeft").addClass('panel-left-gis-2');
    $("#idPanelLeft").removeClass('panel-left-gis-1');
    $("#showInfor1").removeClass("hide");
    $("#idCaretLeft").addClass('mar-le405');
    $("#idCaretLeft").addClass('idCaretLeft1');
    $("#icon-nenbando").addClass('icon-map5');
    $("#icon-nenbando").removeClass('icon-map4');
    $("#infor-td").addClass('infor-td2');
    $("#infor-td").removeClass('infor-td1');
    $("#nongNghiep12").removeClass('border-shadow');
    $("#clickNongghiep").addClass('hide');
    // loadTransactionSeeenQh(4);
    // loadFavouriteQh(4);
});
function clickQhDl() {
    loadFavouriteQh(4);
};
function loadTransactionSeeenQh(mapCode) {
    //$('#QhDaXem2').empty();
    index = 0; size = 0;
    TransactionSeeenQh(index, size, mapCode);
}
function loadQhDaXem(pageIndex) {
    TransactionSeeenQh(pageIndex, 0, 4);
}
function TransactionSeeenQh(index, size, mapCode) {
    if (index == 0) {
        $('#clickQh').empty();
        $('#QhDaXem1').empty();
        $('#QhDaXem2').empty();
        var index = 1;
        var size = 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            mapCatCode: mapCode.toString(),
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Transaction/GetTransactionSeenByMapCode",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                //console.log(result);
                if (result.records != null && result != "") {
                    if (localStorage.getItem("tokenId")) {
                        $('#clickQh').append(
                            ` <ul class="nav nav-pills nav-pills2">
                                <li class="active"><a data-toggle="pill" href="#QhDaXem" class="active"><img src="/images/iconlock.png" /> Đã xem</a></li>
                                <li onclick=clickQhDl()><a data-toggle="pill" href="#QhDaLuu" class=""><img src="/images/iconnote.png" /> Đã lưu</a></li>
                            </ul>
                            <div class="tab-content content-dcct1">
                                <div id="QhDaXem" class="scroll-qhdx tab-pane tab-pane2 fade in active show"> 
                                    <div id="QhDaXem1">                                          
                                    </div>
                                    <div id="QhDaXem2">                                          
                                    </div>
                                </div>
                                <div id="QhDaLuu" class="scroll-qhdx tab-pane tab-pane2 fade">
                                    <div id="QhDaLuu1">                                          
                                    </div>
                                    <div id="QhDaLuu2">                                          
                                    </div>
                                </div>
                            </div>`
                        );
                    }
                    for (const element of result.records) {
                        $('#QhDaXem1').append(
                            ` <div class="row ddxq2">
                        <div class="col-2 no-pad-right">
                            <div class="radius-ct"><img src="/images/iconlock.png"></div>
                        </div>
                        <div class="col-8 no-pad-left cursor-p" onclick="searchLmu1(${element.provinceCode},${element.districtCode},${element.wardCode},4)">
                            <div class="textdd3">${element.provinceName} / ${element.districtName}</div>
                        </div>
                        <div onclick="changeDaLuu(${element.provinceCode},${element.districtCode},${element.wardCode},4)" class="col-2 text-right cursor-p">
                            <div class=""><img src="/images/iconnote.png"></div>
                        </div>
                      </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 5) {
                        $('#QhDaXem2').append(
                            `<div class="row ddxq2">
                            <div onclick="loadQhDaXem(${result.pageIndex})" class="col-12 cursor-p">
                                <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                            </div>
                         </div>`
                        );
                    }
                }
            }
        });
    }
    else {
        $('#QhDaXem2').empty();
        var index = index + 1;
        var size = size + 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            mapCatCode: mapCode.toString(),
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Transaction/GetTransactionSeenByMapCode",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                //console.log(result);
                if (result.records != null && result != "") {
                    for (const element of result.records) {
                        $('#QhDaXem1').append(
                            ` <div class="row ddxq2">
                        <div class="col-2 no-pad-right">
                            <div class="radius-ct"><img src="/images/iconlock.png"></div>
                        </div>
                        <div class="col-8 no-pad-left cursor-p" onclick="searchLmu1(${element.provinceCode},${element.districtCode},${element.wardCode},4)">
                            <div class="textdd3">${element.provinceName} / ${element.districtName}</div>
                        </div>
                        <div onclick="changeDaLuu(${element.provinceCode},${element.districtCode},${element.wardCode},4)" class="col-2 text-right cursor-p">
                            <div class=""><img src="/images/iconnote.png"></div>
                        </div>
                      </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 5) {
                        $('#QhDaXem2').append(
                            `<div class="row ddxq2">
                            <div onclick="loadQhDaXem(${result.pageIndex})" class="col-12 cursor-p">
                                <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                            </div>
                         </div>`
                        );
                    }
                }
            }
        });
    }
}
$("#hienTrangTab").click(function () {
    $("#idPanelLeft").addClass('panel-left-gis-2');
    $("#idPanelLeft").removeClass('panel-left-gis-1');
    $("#showInfor1").removeClass("hide");
    $("#idCaretLeft").addClass('mar-le405');
    $("#idCaretLeft").addClass('idCaretLeft1');
    $("#icon-nenbando").addClass('icon-map5');
    $("#icon-nenbando").removeClass('icon-map4');
    $("#infor-td").addClass('infor-td2');
    $("#infor-td").removeClass('infor-td1');
    $("#nongNghiep12").removeClass('border-shadow');
    $("#clickNongghiep").addClass('hide');
    //loadTransactionSeeenHt(3);
    //loadFavouriteHt(3);
});
function clickHtDl() {
    loadFavouriteHt(3);
};
function loadTransactionSeeenHt(mapCode) {
    //$('#HtDaXem2').empty();
    index = 0; size = 0;
    TransactionSeeenHt(index, size, mapCode);
}
function loadHtDaXem(pageIndex) {
    TransactionSeeenHt(pageIndex, 0, 3);
}
function TransactionSeeenHt(index, size, mapCode) {
    if (index == 0) {
        $('#clickHt').empty();
        $('#HtDaXem1').empty();
        $('#HtDaXem2').empty();
        var index = 1;
        var size = 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            mapCatCode: mapCode.toString(),
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Transaction/GetTransactionSeenByMapCode",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                if (result.records != null && result != "") {
                    $('#clickHt').append(
                        ` <ul class="nav nav-pills nav-pills2">
                                <li class="active"><a data-toggle="pill" href="#HtDaXem" class="active"><img src="/images/iconlock.png" /> Đã xem</a></li>
                                <li onclick=clickHtDl()><a data-toggle="pill" href="#HtDaLuu" class=""><img src="/images/iconnote.png" /> Đã lưu</a></li>
                            </ul>
                            <div class="tab-content content-dcct1">
                                <div id="HtDaXem" class="scroll-qhdx tab-pane tab-pane2 fade in active show">
                                    <div id="HtDaXem1">
                                    </div>
                                    <div id="HtDaXem2">
                                    </div>
                                </div>
                                <div id="HtDaLuu" class="scroll-qhdx tab-pane tab-pane2 fade">
                                    <div id="HtDaLuu1">
                                    </div>
                                    <div id="HtDaLuu2">
                                    </div>
                                </div>
                            </div>`
                    );
                    for (const element of result.records) {
                        $('#HtDaXem1').append(
                            ` <div class="row ddxq2">
                            <div class="col-2 no-pad-right">
                                <div class="radius-ct"><img src="/images/iconlock.png"></div>
                            </div>
                            <div class="col-8 no-pad-left cursor-p" onclick="searchLmu1(${element.provinceCode},${element.districtCode},${element.wardCode},3)">
                                <div class="textdd3">${element.provinceName} / ${element.districtName} </div>
                            </div>
                            <div onclick="changeDaLuu(${element.provinceCode},${element.districtCode},${element.wardCode},3)" class="col-2 text-right cursor-p">
                                <div class=""><img src="/images/iconnote.png"></div>
                            </div>
                        </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 5) {
                        $('#HtDaXem2').append(
                            ` <div class="row ddxq2">
                            <div onclick="loadHtDaXem(${result.pageIndex})" class="col-12 cursor-p">
                                <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                            </div>
                        </div>`
                        );
                    }
                }
            }
        });
    }
    else {
        $('#HtDaXem2').empty();
        var index = index + 1;
        var size = size + 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            mapCatCode: mapCode.toString(),
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Transaction/GetTransactionSeenByMapCode",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                if (result.records != null && result != "") {
                    for (const element of result.records) {
                        $('#HtDaXem1').append(
                            ` <div class="row ddxq2">
                            <div class="col-2 no-pad-right">
                                <div class="radius-ct"><img src="/images/iconlock.png"></div>
                            </div>
                            <div class="col-8 no-pad-left cursor-p" onclick="searchLmu1(${element.provinceCode},${element.districtCode},${element.wardCode},3)">
                                <div class="textdd3">${element.provinceName} / ${element.districtName} </div>
                            </div>
                            <div onclick="changeDaLuu(${element.provinceCode},${element.districtCode},${element.wardCode},3)" class="col-2 text-right cursor-p">
                                <div class=""><img src="/images/iconnote.png"></div>
                            </div>
                        </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 5) {
                        $('#HtDaXem2').append(
                            ` <div class="row ddxq2">
                        <div onclick="loadHtDaXem(${result.pageIndex})" class="col-12 cursor-p">
                            <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                        </div>
                    </div>`
                        );
                    }
                }
            }
        });
    }
}
$("#nongNghiepTab").click(function () {
    $("#idCaretLeft").removeClass('mar-le405');
    $("#idCaretLeft").removeClass('idCaretLeft1');
    $("#idPanelLeft").removeClass('panel-left-gis-2');
    $("#idPanelLeft").addClass('panel-left-gis-1');
    $("#timkiemmap").removeClass('search-map1');
    $("#timkiemmap").addClass(' search-map2');
    $("#positionTran").removeClass('positionTran');
    $("#positionTran").addClass('positionTran1');
    $("#icon-nenbando").removeClass('icon-map5');
    $("#icon-nenbando").addClass('icon-map4');
    $("#infor-td").removeClass('infor-td2');
    $("#infor-td").addClass('infor-td1');
    /* $("#showInfor1").removeClass('content-right-1');*/
    $("#nongNghiep12").addClass('border-shadow');
    $("#clickNongghiep").removeClass('hide');
    //loadTransactionSeeenNh(1);
    //loadFavouriteNh(1);
});
$("#nongHoaTab").click(function () {
    $("#idPanelLeft").addClass('panel-left-gis-2');
    $("#idPanelLeft").removeClass('panel-left-gis-1');
    $("#showInfor1").removeClass("hide");
    $("#idCaretLeft").addClass('mar-le405');
    $("#idCaretLeft").addClass('idCaretLeft1');
    $("#icon-nenbando").addClass('icon-map5');
    $("#icon-nenbando").removeClass('icon-map4');
    $("#infor-td").addClass('infor-td2');
    $("#infor-td").removeClass('infor-td1');
    $("#nongNghiep12").removeClass('border-shadow');
    $("#clickNongghiep").addClass('hide');
    //loadTransactionSeeenNh(1);
    //loadFavouriteNh(1);
});
function clickNhDl() {
    loadFavouriteNh(1);
};
function loadTransactionSeeenNh(mapCode) {
    //$('#NhDaXem2').empty();
    index = 0; size = 0;
    TransactionSeeenNh(index, size, mapCode);
}
function loadNhDaXem(pageIndex) {
    TransactionSeeenNh(pageIndex, 0, 1);
}
function TransactionSeeenNh(index, size, mapCode) {
    if (index == 0) {
        $('#clickNH').empty();
        $('#NhDaXem1').empty();
        $('#NhDaXem2').empty();
        var index = 1;
        var size = 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            mapCatCode: mapCode.toString(),
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Transaction/GetTransactionSeenByMapCode",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                console.log(result);
                if (result.records != null && result != "") {
                    $('#clickNH').append(
                        ` <ul class="nav nav-pills nav-pills2">
                                <li class="active"><a data-toggle="pill" href="#NhDaXem" class="active"><img src="/images/iconlock.png" /> Đã xem</a></li>
                                <li onclick=clickNhDl()><a data-toggle="pill" href="#NhDaLuu" class=""><img src="/images/iconnote.png" /> Đã lưu</a></li>
                            </ul>
                            <div class="tab-content content-dcct1">
                                <div id="NhDaXem" class="scroll-qhdx tab-pane tab-pane2 fade in active show">
                                    <div id="NhDaXem1">
                                    </div>
                                    <div id="NhDaXem2">
                                    </div>
                                </div>
                                <div id="NhDaLuu" class="scroll-qhdx tab-pane tab-pane2 fade">
                                    <div id="NhDaLuu1">
                                    </div>
                                    <div id="NhDaLuu2">
                                    </div>
                                </div>
                            </div>`
                    );
                    for (const element of result.records) {
                        $('#NhDaXem1').append(
                            ` <div class="row ddxq2">
                            <div class="col-2 no-pad-right">
                                <div class="radius-ct"><img src="/images/iconlock.png"></div>
                            </div>
                            <div class="col-8 no-pad-left cursor-p" onclick="searchLmu1(${element.provinceCode},${element.districtCode},${element.wardCode},1)">
                                <div class="textdd3">${element.provinceName} / ${element.districtName} ${element.wardName != null ? ('/ ' + element.wardName) : ''}</div>
                            </div>
                            <div onclick="changeDaLuu(${element.provinceCode},${element.districtCode},${element.wardCode},1)" class="col-2 text-right cursor-p">
                                <div class=""><img src="/images/iconnote.png"></div>
                            </div>
                        </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 5) {
                        $('#NhDaXem2').append(
                            ` <div class="row ddxq2">
                        <div onclick="loadNhDaXem(${result.pageIndex})" class="col-12 cursor-p">
                            <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                        </div>
                    </div>`
                        );
                    }
                }
            }
        });
    }
    else {
        $('#NhDaXem2').empty();
        var index = index + 1;
        var size = size + 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            mapCatCode: mapCode.toString(),
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Transaction/GetTransactionSeenByMapCode",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                if (result.records != null && result != "") {
                    for (const element of result.records) {
                        $('#NhDaXem1').append(
                            ` <div class="row ddxq2">
                            <div class="col-2 no-pad-right">
                                <div class="radius-ct"><img src="/images/iconlock.png"></div>
                            </div>
                            <div class="col-8 no-pad-left cursor-p" onclick="searchLmu1(${element.provinceCode},${element.districtCode},${element.wardCode},1)">
                                <div class="textdd3">${element.provinceName} / ${element.districtName} ${element.wardName != null ? ('/ ' + element.wardName) : ''}</div>
                            </div>
                            <div onclick="changeDaLuu(${element.provinceCode},${element.districtCode},${element.wardCode},1)" class="col-2 text-right cursor-p">
                                <div class=""><img src="/images/iconnote.png"></div>
                            </div>
                        </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 5) {
                        $('#NhDaXem2').append(
                            ` <div class="row ddxq2">
                                <div onclick="loadNhDaXem(${result.pageIndex})" class="col-12 cursor-p">
                                    <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                                </div>
                            </div>`
                        );
                    }
                }
            }
        });
    }

}
$("#thoNhuongTab").click(function () {
    $("#idPanelLeft").addClass('panel-left-gis-2');
    $("#idPanelLeft").removeClass('panel-left-gis-1');
    $("#showInfor1").removeClass("hide");
    $("#idCaretLeft").addClass('mar-le405');
    $("#idCaretLeft").addClass('idCaretLeft1');
    $("#icon-nenbando").addClass('icon-map5');
    $("#icon-nenbando").removeClass('icon-map4');
    $("#infor-td").addClass('infor-td2');
    $("#infor-td").removeClass('infor-td1');
    $("#nongNghiep12").removeClass('border-shadow');
    $("#clickNongghiep").addClass('hide');
    //loadTransactionSeeenTn(2);
    //loadFavouriteTn(2);
});
function clickTnDl() {
    loadFavouriteTn(2);
};
function loadTransactionSeeenTn(mapCode) {
    //$('#TnDaXem2').empty();
    index = 0; size = 0;
    TransactionSeeenTn(index, size, mapCode);
}
function loadTnDaXem(pageIndex) {
    TransactionSeeenTn(pageIndex, 0, 2);
}
function TransactionSeeenTn(index, size, mapCode) {
    if (index == 0) {
        $('#clickTN').empty();
        $('#TnDaXem1').empty();
        $('#TnDaXem2').empty();
        var index = 1;
        var size = 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            mapCatCode: mapCode.toString(),
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Transaction/GetTransactionSeenByMapCode",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                if (result.records != null && result != "") {
                    $('#clickTN').append(
                        ` <ul class="nav nav-pills nav-pills2">
                                <li class="active"><a data-toggle="pill" href="#TnDaXem" class="active"><img src="/images/iconlock.png" /> Đã xem</a></li>
                                <li onclick=clickTnDl()><a data-toggle="pill" href="#TnDaLuu" class=""><img src="/images/iconnote.png" /> Đã lưu</a></li>
                            </ul>
                            <div class="tab-content content-dcct1">
                                <div id="TnDaXem" class="scroll-qhdx tab-pane tab-pane2 fade in active show">
                                    <div id="TnDaXem1">
                                    </div>
                                    <div id="TnDaXem2">
                                    </div>
                                </div>
                                <div id="TnDaLuu" class="scroll-qhdx tab-pane tab-pane2 fade">
                                    <div id="TnDaLuu1">
                                    </div>
                                    <div id="TnDaLuu2">
                                    </div>
                                </div>
                            </div>`
                    );
                    for (const element of result.records) {
                        $('#TnDaXem1').append(
                            ` <div class="row ddxq2">
                            <div class="col-2 no-pad-right">
                                <div class="radius-ct"><img src="/images/iconlock.png"></div>
                            </div>
                            <div class="col-8 no-pad-left cursor-p" onclick="searchLmu1(${element.provinceCode},${element.districtCode},${element.wardCode},2)">
                                <div class="textdd3">${element.provinceName} / ${element.districtName} ${element.wardName != null ? ('/ ' + element.wardName) : ''}</div>
                            </div>
                            <div onclick="changeDaLuu(${element.provinceCode},${element.districtCode},${element.wardCode},2)" class="col-2 text-right cursor-p">
                                <div class=""><img src="/images/iconnote.png"></div>
                            </div>
                        </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 5) {
                        $('#TnDaXem2').append(
                            ` <div class="row ddxq2">
                        <div onclick="loadTnDaXem(${result.pageIndex})" class="col-12 cursor-p">
                            <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                        </div>
                    </div>`
                        );
                    }
                }
            }
        });
    }
    else {
        $('#TnDaXem2').empty();
        var index = index + 1;
        var size = size + 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            mapCatCode: mapCode.toString(),
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Transaction/GetTransactionSeenByMapCode",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                if (result.records != null && result != "") {
                    for (const element of result.records) {
                        $('#TnDaXem1').append(
                            ` <div class="row ddxq2">
                            <div class="col-2 no-pad-right">
                                <div class="radius-ct"><img src="/images/iconlock.png"></div>
                            </div>
                            <div class="col-8 no-pad-left cursor-p" onclick="searchLmu1(${element.provinceCode},${element.districtCode},${element.wardCode},2)">
                                <div class="textdd3">${element.provinceName} / ${element.districtName} ${element.wardName != null ? ('/ ' + element.wardName) : ''}</div>
                            </div>
                            <div onclick="changeDaLuu(${element.provinceCode},${element.districtCode},${element.wardCode},2)" class="col-2 text-right cursor-p">
                                <div class=""><img src="/images/iconnote.png"></div>
                            </div>
                        </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 5) {
                        $('#TnDaXem2').append(
                            ` <div class="row ddxq2">
                        <div onclick="loadTnDaXem(${result.pageIndex})" class="col-12 cursor-p">
                            <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                        </div>
                    </div>`
                        );
                    }
                }
            }
        });
    }
}
//favourite
function loadFavouriteQh(mapCode) {
    $('#QhDaLuu2').empty();
    index = 0; size = 0;
    FavouriteQh(index, size, mapCode);
}
function loadQhDaLuu(pageIndex) {
    FavouriteQh(pageIndex, 0, 4);
}
function FavouriteQh(index, size, mapCode) {
    if (index == 0) {
        $('#QhDaLuu1').empty();
        $('#QhDaLuu2').empty();
        var index = 1;
        var size = 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            mapCatCode: mapCode.toString(),
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Favourite/GetFavourite",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                console.log(result);
                if (result.records != null && result != "") {
                    for (const element of result.records) {
                        $('#QhDaLuu1').append(
                            ` <div class="row ddxq2">
                            <div class="col-2 no-pad-right">
                                <div class="radius-ct"><img src="/images/iconlock.png"></div>
                            </div>
                            <div class="col-8 no-pad-left">
                                <div class="textdd3">${element.provinceName} / ${element.districtName}</div>
                            </div>
                            <div onclick="deleteDaLuu(${element.id})" class="col-2 text-right cursor-p">
                                <div class=""><img src="/images/iconnotegreen.png"></div>
                            </div>
                        </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 5) {
                        $('#QhDaLuu2').append(
                            ` <div class="row ddxq2">
                        <div onclick="loadQhDaLuu(${result.pageIndex})" class="col-12 cursor-p">
                            <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                        </div>
                    </div>`
                        );
                    }
                }
            }
        });
    }
    else {
        $('#QhDaLuu2').empty();
        var index = index + 1;
        var size = size + 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            mapCatCode: mapCode.toString(),
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Favourite/GetFavourite",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                console.log(result);
                if (result.records != null && result != "") {
                    for (const element of result.records) {
                        $('#QhDaLuu1').append(
                            ` <div class="row ddxq2">
                            <div class="col-2 no-pad-right">
                                <div class="radius-ct"><img src="/images/iconlock.png"></div>
                            </div>
                            <div class="col-8 no-pad-left">
                                <div class="textdd3">${element.provinceName} / ${element.districtName}</div>
                            </div>
                            <div onclick="deleteDaLuu(${element.id})" class="col-2 text-right cursor-p">
                                <div class=""><img src="/images/iconnotegreen.png"></div>
                            </div>
                        </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 5) {
                        $('#QhDaLuu2').append(
                            ` <div class="row ddxq2">
                        <div onclick="loadQhDaLuu(${result.pageIndex})" class="col-12 cursor-p">
                            <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                        </div>
                    </div>`
                        );
                    }
                }
            }
        });
    }
}
//
function loadFavouriteHt(mapCode) {
    $('#HtDaLuu2').empty();
    index = 0; size = 0;
    FavouriteHt(index, size, mapCode);
}
function loadHtDaLuu(pageIndex) {
    FavouriteHt(pageIndex, 0, 3);
}
function FavouriteHt(index, size, mapCode) {
    if (index == 0) {
        $('#HtDaLuu1').empty();
        $('#HtDaLuu2').empty();
        var index = 1;
        var size = 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            mapCatCode: mapCode.toString(),
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Favourite/GetFavourite",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                if (result.records != null && result != "") {
                    for (const element of result.records) {
                        $('#HtDaLuu1').append(
                            ` <div class="row ddxq2">
                            <div class="col-2 no-pad-right">
                                <div class="radius-ct"><img src="/images/iconlock.png"></div>
                            </div>
                            <div class="col-8 no-pad-left">
                                <div class="textdd3">${element.provinceName} / ${element.districtName} </div>
                            </div>
                            <div onclick="deleteDaLuu(${element.id})" class="col-2 text-right cursor-p">
                                <div class=""><img src="/images/iconnotegreen.png"></div>
                            </div>
                        </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 5) {
                        $('#HtDaLuu2').append(
                            ` <div class="row ddxq2">
                        <div onclick="loadHtDaLuu(${result.pageIndex})" class="col-12 cursor-p">
                            <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                        </div>
                    </div>`
                        );
                    }
                }
            }
        });
    }
    else {
        $('#HtDaLuu2').empty();
        var index = index + 1;
        var size = size + 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            mapCatCode: mapCode.toString(),
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Favourite/GetFavourite",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                if (result.records != null && result != "") {
                    for (const element of result.records) {
                        $('#HtDaLuu1').append(
                            ` <div class="row ddxq2">
                            <div class="col-2 no-pad-right">
                                <div class="radius-ct"><img src="/images/iconlock.png"></div>
                            </div>
                            <div class="col-8 no-pad-left">
                                <div class="textdd3">${element.provinceName} / ${element.districtName} </div>
                            </div>
                            <div onclick="deleteDaLuu(${element.id})" class="col-2 text-right cursor-p">
                                <div class=""><img src="/images/iconnotegreen.png"></div>
                            </div>
                        </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 5) {
                        $('#HtDaLuu2').append(
                            ` <div class="row ddxq2">
                        <div onclick="loadHtDaLuu(${result.pageIndex})" class="col-12 cursor-p">
                            <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                        </div>
                    </div>`
                        );
                    }
                }
            }
        });
    }

}
//
function loadFavouriteNh(mapCode) {
    $('#NhDaLuu2').empty();
    index = 0; size = 0;
    FavouriteNh(index, size, mapCode);
}
function loadNhDaLuu(pageIndex) {
    FavouriteNh(pageIndex, 0, 1);
}
function FavouriteNh(index, size, mapCode) {
    if (index == 0) {
        $('#NhDaLuu1').empty();
        $('#NhDaLuu2').empty();
        var index = 1;
        var size = 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            mapCatCode: mapCode.toString(),
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Favourite/GetFavourite",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                if (result.records != null && result != "") {
                    for (const element of result.records) {
                        $('#NhDaLuu1').append(
                            ` <div class="row ddxq2">
                            <div class="col-2 no-pad-right">
                                <div class="radius-ct"><img src="/images/iconlock.png"></div>
                            </div>
                            <div class="col-8 no-pad-left">
                                <div class="textdd3">${element.provinceName} / ${element.districtName} ${element.wardName != null ? ('/ ' + element.wardName) : ''}</div>
                            </div>
                            <div onclick="deleteDaLuu(${element.id})" class="col-2 text-right cursor-p">
                                <div class=""><img src="/images/iconnotegreen.png"></div>
                            </div>
                        </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 5) {
                        $('#NhDaLuu2').append(
                            ` <div class="row ddxq2">
                        <div onclick="loadNhDaLuu(${result.pageIndex})" class="col-12 cursor-p">
                            <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                        </div>
                    </div>`
                        );
                    }
                }
            }
        });
    }
    else {
        $('#NhDaLuu2').empty();
        var index = index + 1;
        var size = size + 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            mapCatCode: mapCode.toString(),
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Favourite/GetFavourite",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                if (result.records != null && result != "") {
                    for (const element of result.records) {
                        $('#NhDaLuu1').append(
                            ` <div class="row ddxq2">
                            <div class="col-2 no-pad-right">
                                <div class="radius-ct"><img src="/images/iconlock.png"></div>
                            </div>
                            <div class="col-8 no-pad-left">
                                <div class="textdd3">${element.provinceName} / ${element.districtName} ${element.wardName != null ? ('/ ' + element.wardName) : ''}</div>
                            </div>
                            <div onclick="deleteDaLuu(${element.id})" class="col-2 text-right cursor-p">
                                <div class=""><img src="/images/iconnotegreen.png"></div>
                            </div>
                        </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 5) {
                        $('#NhDaLuu2').append(
                            ` <div class="row ddxq2">
                        <div onclick="loadNhDaLuu(${result.pageIndex})" class="col-12 cursor-p">
                            <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                        </div>
                    </div>`
                        );
                    }
                }
            }
        });
    }

}
//
function loadFavouriteTn(mapCode) {
    $('#TnDaLuu2').empty();
    index = 0; size = 0;
    FavouriteTn(index, size, mapCode);
}
function loadTnDaLuu(pageIndex) {
    FavouriteTn(pageIndex, 0, 2);
}
function FavouriteTn(index, size, mapCode) {
    if (index == 0) {
        $('#TnDaLuu1').empty();
        $('#TnDaLuu2').empty();
        var index = 1;
        var size = 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            mapCatCode: mapCode.toString(),
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Favourite/GetFavourite",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                if (result.records != null && result != "") {
                    for (const element of result.records) {
                        $('#TnDaLuu1').append(
                            ` <div class="row ddxq2">
                            <div class="col-2 no-pad-right">
                                <div class="radius-ct"><img src="/images/iconlock.png"></div>
                            </div>
                            <div class="col-8 no-pad-left">
                                <div class="textdd3">${element.provinceName} / ${element.districtName} ${element.wardName != null ? ('/ ' + element.wardName) : ''}</div>
                            </div>
                            <div onclick="deleteDaLuu(${element.id})" class="col-2 text-right cursor-p">
                                <div class=""><img src="/images/iconnotegreen.png"></div>
                            </div>
                        </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 5) {
                        $('#TnDaLuu2').append(
                            ` <div class="row ddxq2">
                        <div onclick="loadTnDaLuu(${result.pageIndex})" class="col-12 cursor-p">
                            <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                        </div>
                    </div>`
                        );
                    }
                }
            }
        });
    }
    else {
        $('#TnDaLuu2').empty();
        var index = index + 1;
        var size = size + 5;
        var req = {
            pageIndex: index.toString(),
            pageSize: size.toString(),
            mapCatCode: mapCode.toString(),
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Favourite/GetFavourite",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                if (result.records != null && result != "") {
                    for (const element of result.records) {
                        $('#TnDaLuu1').append(
                            ` <div class="row ddxq2">
                            <div class="col-2 no-pad-right">
                                <div class="radius-ct"><img src="/images/iconlock.png"></div>
                            </div>
                            <div class="col-8 no-pad-left">
                                <div class="textdd3">${element.provinceName} / ${element.districtName} ${element.wardName != null ? ('/ ' + element.wardName) : ''}</div>
                            </div>
                            <div onclick="deleteDaLuu(${element.id})" class="col-2 text-right cursor-p">
                                <div class=""><img src="/images/iconnotegreen.png"></div>
                            </div>
                        </div>`
                        );
                    }
                    if (result.totalRecords > result.pageIndex * 5) {
                        $('#TnDaLuu2').append(
                            ` <div class="row ddxq2">
                        <div onclick="loadTnDaLuu(${result.pageIndex})" class="col-12 cursor-p">
                            <div class="xemthem1">Xem thêm &nbsp;<img src="/images/Icondownload.png"></div>
                        </div>
                    </div>`
                        );
                    }
                }
            }
        });
    }

}
// đã lưu
function changeDaLuu(provinceCode, districtCode, wardCode, mapCategoryCode) {
    if (localStorage.getItem("tokenId") == "" || localStorage.getItem("tokenId") == null) {
        toastr.remove();
        MessageUtil.ShowMessage({ message: "Chưa đăng nhập!", type: "error" });
    }
    if (mapCategoryCode == '1' || mapCategoryCode == '2') {
        if (wardCode == null) {
            var req = {
                provinceCode: provinceCode.toString(),
                districtCode: districtCode.toString(),
                mapCategoryCode: mapCategoryCode.toString(),
                tokenId: localStorage.getItem("tokenId")
            }
        }
        else {
            var req = {
                provinceCode: provinceCode.toString(),
                districtCode: districtCode.toString(),
                wardCode: wardCode.toString(),
                mapCategoryCode: mapCategoryCode.toString(),
                tokenId: localStorage.getItem("tokenId")
            }
        }
    }
    else {
        var req = {
            provinceCode: provinceCode.toString(),
            districtCode: districtCode.toString(),
            mapCategoryCode: mapCategoryCode.toString(),
            tokenId: localStorage.getItem("tokenId")
        }
    }

    //console.log(req);
    $.ajax({
        url: "/Favourite/CreateFavourite",
        type: "POST",
        data: JSON.stringify(req),
        dataType: "json",
        async: false,
        contentType: "application/json; charset=utf-8",
        success: function (result) {
            if (result.message == "SUCCESS") {
                toastr.remove();
                MessageUtil.ShowMessage({ message: "Cập nhật danh sách đã lưu", type: "success" });
            }
            else {
                toastr.remove();
                MessageUtil.ShowMessage({ message: "Đã tồn tại trong danh sách đã lưu!", type: "error" });
            }
        }
    });
}
function deleteDaLuu(id) {
    var req = {
        id: id.toString(),
        tokenId: localStorage.getItem("tokenId")
    }
    $.ajax({
        url: "/Favourite/DeleteFavourite",
        type: "POST",
        data: JSON.stringify(req),
        dataType: "json",
        async: false,
        contentType: "application/json; charset=utf-8",
        success: function (result) {
            if (result.message == "SUCCESS") {
                toastr.remove();
                MessageUtil.ShowMessage({ message: "xóa khỏi danh sách đã lưu", type: "success" });
            }
        }
    });
}
//tìm kiếm nhanh
function clickTranSearch() {
    var req = document.getElementById("textvnmap");
    if (req.value == '' && (localStorage.getItem("tokenId") != '' && localStorage.getItem("tokenId") != null)) {
        $('#positionTran').removeClass("hide");
        $('#positionTran').empty();
        $('#searchTransaction').empty();
        var req = {
            pageIndex: '1',
            pageSize: '5',
            mapCategoryCode: '5',
            transactionType: '1',
            tokenId: localStorage.getItem("tokenId")
        }
        $.ajax({
            url: "/Transaction/GetTransactionByFilter",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            async: false,
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                $('#timkiemmap1').addClass("noborder-rabot");
                $('#timkiemmap').addClass("z-index1");
                //console.log(result);
                if ($("#idPanelLeft").hasClass('minusleft400')) {
                    $('#searchTransaction').append(
                        ` <div id="positionTran" class="positionTran "> </div>`
                    );
                }
                else {
                    $('#searchTransaction').append(
                        ` <div id="positionTran" class="positionTran1 "> </div>`
                    );
                }
                for (const element of result) {
                    $('#positionTran').append(
                        ` <div class="row ddxq2 cursor-p">
                            <div class="col-2 no-pad-right padlef18">
                                    <div class="radius-ct"><img src="/images/iconlock.png"></div>
                            </div>
                              <div class="col-10 no-pad-left">
                                      <div class="textdd3">${element.addressName}</div>
                                      <div class="textdd2">${element.addressDetail}</div>
                            </div>
            
                        </div>`
                    );
                }
            }
        });
    }
}
function onKeyUpTranSearch() {
    var addressName = document.getElementById("textvnmap");
    //console.log(addressName.value);
    if (addressName.value != '') {
        $('#positionTran').removeClass("hide");
        $('#positionTran').empty();
        $('#searchTransaction').empty();
        var req = {
            addressName: addressName.value,
        }
        $.ajax({
            url: "/AddressDigital/FindByTypeAndName",
            type: "POST",
            data: JSON.stringify(req),
            dataType: "json",
            async: false,
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                console.log(result);
                if (result.data.length != 0) {
                    $('#timkiemmap1').addClass("noborder-rabot");
                    $('#timkiemmap').addClass("z-index1");
                    if (result.data.length >= 4) {
                        if ($("#idPanelLeft").hasClass('minusleft400')) {
                            $('#searchTransaction').append(
                                ` <div id="positionTran" class="positionTran  scroll-y1"> </div>`
                            );
                        }
                        else {
                            $('#searchTransaction').append(
                                ` <div id="positionTran" class="positionTran1  scroll-y1"> </div>`
                            );
                        }
                        for (const element of result.data) {
                            $('#positionTran').append(
                                ` <div class="row ddxq2">
                            <div class="col-2 no-pad-right padlef18">
                                    <div class="radius-ct"><img src="/images/iconlock.png"></div>
                            </div>
                              <div class="col-10 no-pad-left">
                                      <div class="textdd3 cursor-p" onclick="searchPointDetail(${element.id})">${element.addressName}</div>
                                      <div class="textdd2">${element.addressDetail}</div>
                                      <div class="textdd2">${element.addressTypeName}</div>
                                      <div>
                                        <section class="col-md-12 scroll-pos">
                                         <a class="btn btn-success position-2 no-margin" onclick="SaveAddressFavourite(${element.provinceCode},${element.districtCode},${element.wardCode},${element.id})"><img src="/images/luudiachi.png">&nbsp; Lưu</a>
                                         <button data-toggle="modal" data-target="#modalChiaSe" class="btn btn-outline-success position-2"><img src="/images/chiase.png">&nbsp;Chia sẻ</button>
                                         <button onclick="clickModalGph(${element.id})" data-toggle="modal" data-target="#modalGuiPhanHoi" class="btn btn-outline-success position-2"><img src="/images/guiphanhoi.png">&nbsp;Gửi phản hồi</button>
                                        </section>
                                </div>
                            </div>
                        </div>`
                            );
                        }
                    }
                    else {
                        if ($("#idPanelLeft").hasClass('minusleft400')) {
                            $('#searchTransaction').append(
                                ` <div id="positionTran" class="positionTran "> </div>`
                            );
                        }
                        else {
                            $('#searchTransaction').append(
                                ` <div id="positionTran" class="positionTran1 "> </div>`
                            );
                        }
                        for (const element of result.data) {
                            $('#positionTran').append(
                                ` <div class="row ddxq2 cursor-p">
                            <div class="col-2 no-pad-right padlef18">
                                    <div class="radius-ct"><img src="/images/iconlock.png"></div>
                            </div>
                              <div class="col-10 no-pad-left">
                                      <div class="textdd3">${element.addressName}</div>
                                      <div class="textdd2">${element.addressDetail}</div>
                                      <div class="textdd2">${element.addressTypeName}</div>
                                      <div>
                                        <section class="col-md-12 scroll-pos">
                                         <a class="btn btn-success position-2 no-margin" onclick="SaveAddressFavourite(${element.provinceCode},${element.districtCode},${element.wardCode},${element.id})"><img src="/images/luudiachi.png">&nbsp; Lưu</a>
                                         <button data-toggle="modal" data-target="#modalChiaSe" class="btn btn-outline-success position-2"><img src="/images/chiase.png">&nbsp;Chia sẻ</button>
                                         <button onclick="clickModalGph(${element.id})" data-toggle="modal" data-target="#modalGuiPhanHoi" class="btn btn-outline-success position-2"><img src="/images/guiphanhoi.png">&nbsp;Gửi phản hồi</button>
                                        </section>
                                </div>
                            </div>
                        </div>`
                            );
                        }
                    }
                }
                else {
                    $('#timkiemmap1').removeClass("noborder-rabot");
                    $('#timkiemmap').removeClass("z-index1");
                }
            }
        });
    }

}
//lưu địa chỉ yêu thích
function SaveAddressFavourite(provinceCode, districtCode, wardCode, addressId) {
    var req = {
        provinceCode: provinceCode.toString(),
        districtCode: districtCode.toString(),
        wardCode: wardCode.toString(),
        addressId: addressId.toString(),
        mapCategoryCode: '',
        tokenId: localStorage.getItem("tokenId")
    }
    //console.log(req);
    $.ajax({
        url: "/Favourite/CreateFavouriteForSearch",
        type: "POST",
        data: JSON.stringify(req),
        dataType: "json",
        async: false,
        contentType: "application/json; charset=utf-8",
        success: function (result) {
            if (result.message == "SUCCESS") {
                toastr.remove();
                MessageUtil.ShowMessage({ message: "Lưu địa chỉ yêu thích thành công", type: "success" });
            }
            else {
                toastr.remove();
                MessageUtil.ShowMessage({ message: "Địa chỉ yêu thích này đã tồn tại!", type: "error" });
            }
        }
    });
}
//tải ảnh lên
var fileuploads = [];
//console.log(fileuploads);
$(function () {
    // DropzoneJS Demo Code Start
    Dropzone.autoDiscover = false

    // Get the template HTML and remove it from the doumenthe template HTML and remove it from the doument
    var previewNode = document.querySelector("#template")
    previewNode.id = ""
    var previewTemplate = previewNode.parentNode.innerHTML
    previewNode.parentNode.removeChild(previewNode)

    var myDropzone = new Dropzone(document.body, { // Make the whole body a dropzone
        url: "/target-url", // Set the url
        maxFiles: 3,
        maxFilesize: 3, // MB
        acceptedFiles: ".jpeg,.jpg,.png",
        thumbnailWidth: 80,
        thumbnailHeight: 80,
        parallelUploads: 20,
        //uploadMultiple: true,
        //paramName: "formFiles",
        previewTemplate: previewTemplate,
        autoQueue: false, // Make sure the files aren't queued until manually added
        previewsContainer: "#previews", // Define the container to display the previews
        clickable: ".fileinput-button", // Define the element that should be used as click trigger to select files.
        //init: function () {
        //    this.on("addedfile", function (file) {
        //        var _this = this;
        //        if ($.inArray(file.type, ['image/jpeg', 'image/jpg', 'image/png']) == -1) {
        //            _this.removeFile(file);
        //        }
        //    });
        //}
        maxfilesexceeded: function (file) {
            alert('Không chọn quá 3 files!');
            this.removeAllFiles();
            this.addFile(file);
        },
        init: function () {

            var drop = this; // Closure

            this.on('error', function (file, errorMessage) {
                //alert(maxFilesize);
                //this.removeAllFiles();
                if (errorMessage.indexOf('Error 404') !== -1) {
                    var errorDisplay = document.querySelectorAll('[data-dz-errormessage]');
                    errorDisplay[errorDisplay.length - 1].innerHTML = 'Error 404: The upload page was not found on the server';
                }
                if (errorMessage.indexOf('File is too big') !== -1) {
                    alert('File chọn không quá 3MB. Hãy chọn lại!');
                    // i remove current file
                    drop.removeFile(file);
                }
            });
        }
    })
    myDropzone.on("addedfile", function (file) {
        // Hookup the start button
        //file.previewElement.querySelector(".start").onclick = function() { myDropzone.enqueueFile(file) }
        fileuploads.push(file);
    })
    myDropzone.on("maxfilesexceeded", function (file) {
        this.removeFile(file);
    });
    document.querySelector("#actions .cancel").onclick = function () {
        myDropzone.removeAllFiles(true)
    }

});
function clickModalGph(addressId) {
    $('#adressIdGph').val(addressId);
    //console.log($('#adressIdGph').val());
}
function SendFeedback() {
    if ($('#problemContent').val() == "") {
        MessageUtil.ShowMessage({ message: "Nhập vấn đề!", type: "error" });
    }
    if (fileuploads.length == 0) {
        MessageUtil.ShowMessage({ message: "Chọn ảnh!", type: "error" });
    }
    var formData = new FormData();
    formData.append('problem', $('#problemContent').val());
    formData.append('addressId', $('#adressIdGph').val());
    //formData.append('tokenId', localStorage.getItem("tokenId"));
    if (fileuploads.length > 0) {
        for (i = 0; i < fileuploads.length; i++) {
            formData.append('fileList', fileuploads[i]);
        }
    }
    console.log(formData);
    $.ajax({
        method: 'post',
        processData: false,
        contentType: false,
        cache: false,
        data: formData,
        dataType: 'json',
        headers: { "Authorization": "Bearer " + localStorage.getItem('tokenId') },
        enctype: 'multipart/form-data',
        url: apiUrl + "feedback/create",
        success: function (result) {
            //console.log(result);
            if (result.message == "SUCCESS") {
                $('#modalGuiPhanHoi').modal('hide');
                $('#modalCamOnPhanHoi').modal('show');
                toastr.remove();
                MessageUtil.ShowMessage({ message: "Gửi phản hồi thành công", type: "success" });
            }
            else {
                toastr.remove();
                MessageUtil.ShowMessage({ message: "Gửi phản hồi không thành công!", type: "error" });
            }
        }
    });

}