{"id":9487,"date":"2025-01-11T14:42:32","date_gmt":"2025-01-11T14:42:32","guid":{"rendered":"https:\/\/bkc-bemiddeling.nl\/?page_id=9487"},"modified":"2025-01-17T12:40:55","modified_gmt":"2025-01-17T12:40:55","slug":"je-offerte","status":"publish","type":"page","link":"https:\/\/bkc-bemiddeling.nl\/index.php\/je-offerte\/","title":{"rendered":"Je Offerte"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"9487\" class=\"elementor elementor-9487\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0aee1cf e-flex e-con-boxed e-con e-parent\" data-id=\"0aee1cf\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c37b022 elementor-widget elementor-widget-html\" data-id=\"c37b022\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"nl\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <title>Datum en Prijs<\/title>\r\n    <style>\r\n        body {\r\n            font-family: Arial, sans-serif;\r\n            line-height: 1.6;\r\n            margin: 0;\r\n            padding: 0;\r\n            background-color: #f9f9f9;\r\n        }\r\n        .container {\r\n            max-width: 800px;\r\n            margin: 20px auto;\r\n            padding: 20px;\r\n            background: #fff;\r\n            border-radius: 8px;\r\n            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);\r\n        }\r\n        h1, h2 {\r\n            color: #333;\r\n        }\r\n        .price-table {\r\n            width: 100%;\r\n            border-collapse: collapse;\r\n            margin-bottom: 20px;\r\n        }\r\n        .price-table th, .price-table td {\r\n            padding: 10px;\r\n            border: 1px solid #ddd;\r\n            text-align: left;\r\n        }\r\n        .price-table th {\r\n            background: #f4f4f4;\r\n        }\r\n        .extras {\r\n            margin-bottom: 20px;\r\n        }\r\n        .extras label {\r\n            display: block;\r\n            margin-bottom: 5px;\r\n        }\r\n        .extras input[type=\"checkbox\"] {\r\n            margin-right: 10px;\r\n        }\r\n        .form-group {\r\n            margin-bottom: 15px;\r\n        }\r\n        .form-group label {\r\n            display: block;\r\n            margin-bottom: 5px;\r\n        }\r\n        .form-group input, .form-group select {\r\n            width: 100%;\r\n            padding: 8px;\r\n            border: 1px solid #ddd;\r\n            border-radius: 4px;\r\n        }\r\n        .submit-btn {\r\n            background: #007BFF;\r\n            color: #fff;\r\n            padding: 10px 20px;\r\n            border: none;\r\n            border-radius: 4px;\r\n            cursor: pointer;\r\n        }\r\n        .submit-btn:hover {\r\n            background: #0056b3;\r\n        }\r\n        .total-price {\r\n            font-weight: bold;\r\n            font-size: 18px;\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n    <div class=\"container\">\r\n        <h1>Datum en Prijs<\/h1>\r\n        \r\n        <!-- Selecteer een pakket -->\r\n        <h2>Kies een Pakket<\/h2>\r\n        <div class=\"form-group\">\r\n            <label for=\"package\">Pakket<\/label>\r\n            <select id=\"package\" name=\"package\">\r\n                <option value=\"50\">Basis Schoonmaak (\u20ac50)<\/option>\r\n                <option value=\"100\">Diepe Schoonmaak (\u20ac100)<\/option>\r\n                <option value=\"75\">Raamreiniging (\u20ac75)<\/option>\r\n            <\/select>\r\n        <\/div>\r\n\r\n        <!-- Kies aantal kamers, ramen en badkamers -->\r\n        <h2>Opties<\/h2>\r\n        <div class=\"form-group\">\r\n            <label for=\"rooms\">Aantal Kamers<\/label>\r\n            <select id=\"rooms\" name=\"rooms\">\r\n                <option value=\"0\">0<\/option>\r\n                <option value=\"1\">1<\/option>\r\n                <option value=\"2\">2<\/option>\r\n                <option value=\"3\">3<\/option>\r\n                <option value=\"4\">4<\/option>\r\n            <\/select>\r\n        <\/div>\r\n\r\n        <div class=\"form-group\">\r\n            <label for=\"windows\">Aantal Ramen<\/label>\r\n            <select id=\"windows\" name=\"windows\">\r\n                <option value=\"0\">0<\/option>\r\n                <option value=\"1\">1<\/option>\r\n                <option value=\"2\">2<\/option>\r\n                <option value=\"3\">3<\/option>\r\n                <option value=\"4\">4<\/option>\r\n            <\/select>\r\n        <\/div>\r\n\r\n        <div class=\"form-group\">\r\n            <label for=\"bathrooms\">Aantal Badkamers<\/label>\r\n            <select id=\"bathrooms\" name=\"bathrooms\">\r\n                <option value=\"0\">0<\/option>\r\n                <option value=\"1\">1<\/option>\r\n                <option value=\"2\">2<\/option>\r\n                <option value=\"3\">3<\/option>\r\n                <option value=\"4\">4<\/option>\r\n            <\/select>\r\n        <\/div>\r\n\r\n        <!-- Optionele Extra's -->\r\n        <div class=\"extras\">\r\n            <h2>Optionele Extra's<\/h2>\r\n            <label><input type=\"checkbox\" id=\"extra-room\"> Extra kamer (+\u20ac20)<\/label>\r\n            <label><input type=\"checkbox\" id=\"balcony-cleaning\"> Balkonreiniging (+\u20ac15)<\/label>\r\n            <label><input type=\"checkbox\" id=\"carpet-cleaning\"> Tapijtreiniging (+\u20ac30)<\/label>\r\n        <\/div>\r\n\r\n        <!-- Datum en Tijd -->\r\n        <div class=\"date-picker\">\r\n            <h2>Kies een Datum<\/h2>\r\n            <div class=\"form-group\">\r\n                <label for=\"date\">Datum<\/label>\r\n                <input type=\"date\" id=\"date\" name=\"date\">\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"time-picker\">\r\n            <h2>Kies een Tijd<\/h2>\r\n            <div class=\"form-group\">\r\n                <label for=\"time\">Tijd<\/label>\r\n                <input type=\"time\" id=\"time\" name=\"time\">\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <!-- Contactgegevens -->\r\n        <div class=\"contact-details\">\r\n            <h2>Contactgegevens<\/h2>\r\n            <div class=\"form-group\">\r\n                <label for=\"name\">Naam<\/label>\r\n                <input type=\"text\" id=\"name\" name=\"name\" placeholder=\"Uw Naam\">\r\n            <\/div>\r\n            <div class=\"form-group\">\r\n                <label for=\"email\">E-mailadres<\/label>\r\n                <input type=\"email\" id=\"email\" name=\"email\" placeholder=\"Uw E-mailadres\">\r\n            <\/div>\r\n            <div class=\"form-group\">\r\n                <label for=\"phone\">Telefoonnummer<\/label>\r\n                <input type=\"tel\" id=\"phone\" name=\"phone\" placeholder=\"Uw Telefoonnummer\">\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"total-price\">\r\n            Totaal: <span id=\"total\">\u20ac50<\/span>\r\n        <\/div>\r\n\r\n        <button type=\"submit\" class=\"submit-btn\" id=\"submit\">Verzenden<\/button>\r\n    <\/div>\r\n\r\n    <script>\r\n        function calculateTotal() {\r\n            const basePrice = parseInt(document.getElementById('package').value);\r\n            const extraRoomPrice = 20;\r\n            const balconyPrice = 15;\r\n            const carpetPrice = 30;\r\n\r\n            let total = basePrice;\r\n\r\n            \/\/ Add extra costs based on selected options\r\n            const extraRoom = document.getElementById('extra-room').checked ? extraRoomPrice : 0;\r\n            const balconyCleaning = document.getElementById('balcony-cleaning').checked ? balconyPrice : 0;\r\n            const carpetCleaning = document.getElementById('carpet-cleaning').checked ? carpetPrice : 0;\r\n\r\n            const rooms = parseInt(document.getElementById('rooms').value);\r\n            const windows = parseInt(document.getElementById('windows').value);\r\n            const bathrooms = parseInt(document.getElementById('bathrooms').value);\r\n\r\n            \/\/ Calculate the total based on selected quantities\r\n            total += (rooms * 10) + (windows * 5) + (bathrooms * 15) + extraRoom + balconyCleaning + carpetCleaning;\r\n\r\n            document.getElementById('total').innerText = '\u20ac' + total;\r\n        }\r\n\r\n        \/\/ Event listeners for all inputs\r\n        document.getElementById('package').addEventListener('change', calculateTotal);\r\n        document.getElementById('extra-room').addEventListener('change', calculateTotal);\r\n        document.getElementById('balcony-cleaning').addEventListener('change', calculateTotal);\r\n        document.getElementById('carpet-cleaning').addEventListener('change', calculateTotal);\r\n        document.getElementById('rooms').addEventListener('change', calculateTotal);\r\n        document.getElementById('windows').addEventListener('change', calculateTotal);\r\n        document.getElementById('bathrooms').addEventListener('change', calculateTotal);\r\n\r\n        \/\/ Submit handler\r\n        document.getElementById('submit').addEventListener('click', function() {\r\n            const name = document.getElementById('name').value;\r\n            const email = document.getElementById('email').value;\r\n            const phone = document.getElementById('phone').value;\r\n            const total = document.getElementById('total').innerText;\r\n\r\n            if (name && email && phone) {\r\n                alert(`Uw gegevens zijn verzonden: \\nNaam: ${name}\\nE-mailadres: ${email}\\nTelefoonnummer: ${phone}\\nTotaal: ${total}`);\r\n            } else {\r\n                alert('Vul alstublieft alle gegevens in.');\r\n            }\r\n        });\r\n\r\n        calculateTotal();\r\n    <\/script>\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-cd3a32e e-flex e-con-boxed e-con e-parent\" data-id=\"cd3a32e\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-53c5441 gogrin-star-rating--align-center elementor-widget elementor-widget-witr_section_apartment\" data-id=\"53c5441\" data-element_type=\"widget\" data-widget_type=\"witr_section_apartment.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\n\t\t\t\t\t<div class=\"apartment_area\">\t\t\t\t\n\t\t\t\t\t\t<div class=\"apartment_text\">\t\t\n\t\t\t\t\t\t\t<!-- title -->\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h1>Type Your Title<\/h1>\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t<!-- content -->\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h2>Type Your Sub Title <\/h2>\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t<\/div>\t\t\n\t\t\t\t\t\t<div class=\"witr_apartment_form\">\t\t\t\t\t\n\t\t\t\t\t\t<div class=\"twr_form_no_select\">Please Select Contact Form.<\/div>\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\t\t\t\t\t\n\t\t\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Datum en Prijs Datum en Prijs Kies een Pakket Pakket Basis Schoonmaak (\u20ac50)Diepe Schoonmaak (\u20ac100)Raamreiniging (\u20ac75) Opties Aantal Kamers 01234 Aantal Ramen 01234 Aantal Badkamers 01234 Optionele Extra&#8217;s Extra kamer (+\u20ac20) Balkonreiniging (+\u20ac15) Tapijtreiniging (+\u20ac30) Kies een Datum Datum Kies een Tijd Tijd Contactgegevens Naam E-mailadres Telefoonnummer Totaal: \u20ac50 Verzenden Type Your Title Type Your [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-9487","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/bkc-bemiddeling.nl\/index.php\/wp-json\/wp\/v2\/pages\/9487","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bkc-bemiddeling.nl\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/bkc-bemiddeling.nl\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/bkc-bemiddeling.nl\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bkc-bemiddeling.nl\/index.php\/wp-json\/wp\/v2\/comments?post=9487"}],"version-history":[{"count":31,"href":"https:\/\/bkc-bemiddeling.nl\/index.php\/wp-json\/wp\/v2\/pages\/9487\/revisions"}],"predecessor-version":[{"id":9669,"href":"https:\/\/bkc-bemiddeling.nl\/index.php\/wp-json\/wp\/v2\/pages\/9487\/revisions\/9669"}],"wp:attachment":[{"href":"https:\/\/bkc-bemiddeling.nl\/index.php\/wp-json\/wp\/v2\/media?parent=9487"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}