{"id":29786,"date":"2025-02-11T19:32:14","date_gmt":"2025-02-11T19:32:14","guid":{"rendered":"https:\/\/staging-schaffenburg.nl\/offertes\/"},"modified":"2025-02-11T19:32:14","modified_gmt":"2025-02-11T19:32:14","slug":"offertes","status":"publish","type":"page","link":"https:\/\/portal.schaffenburg.nl\/de\/offertes\/","title":{"rendered":"Offertes"},"content":{"rendered":"\n  <!-- Bovenste blok met breadcrumb en pagina-title -->\n  <div class=\"product_page_head_content\">\n    <div class=\"sofp_breadcrumb_cats\">\n      <h1 onclick=\"window.location.href = 'https:\/\/portal.schaffenburg.nl\/de\/portaal'\">Armaturenbrett<\/h1>\n      <a>Angebote<\/a>\n    <\/div>\n    <!-- Dynamische titel op basis van $mode -->\n    <h1 onclick=\"window.location.href = '\/portaal'\">Angebote<\/h1>\n    \t\t<div class=\"sof_divider\" style=\"background-color: var(--secondary);\"><\/div>\n\t\t<script>\n\t\t\t\/\/get the width of the parent\n\t\t\tconsole.log(\"halo\");\n\t\t\tvar me = document.currentScript;\n\t\t\t\/\/traverse to parent\n\t\t\tvar parent = jQuery(me).closest(\".et_pb_text_inner\");\n\t\t\t\/\/get the h2 or h3\n\t\t\tvar sibling = parent.find(\"h2,h3\");\n\t\t\t\/\/align items flex start on parent\n\t\t\tparent.css(\"align-items\", \"flex-start\");\n\t\t\t\/\/ get hte width of the h2 OR h3\n\t\t\tvar text_length = sibling.width();\n\t\t\tvar ratio = .5;\n\t\t\t\/\/set the width of the divider\n\t\t\tjQuery(parent).find(\".sof_divider\").css(\"width\", text_length * ratio + \"px\");\n\t\t\t\/\/place parent again in the center\n\t\t\tparent.css(\"align-items\", \"stretch\");\n\n\t\t\tconsole.log(sibling);\n\t\t<\/script>\n\t\t  <\/div>\n\n  \n  <!-- Hier houden we je Vue-component in stand, maar vervang je de \u201cOffertes\u201d-teksten door je dynamische labels -->\n  <div class=\"product_page_content sofp_offerte_editor sofp_application_headerspace\" id=\"sofp_offerte_add\" style=\"width:100%; margin-top: 20px;\">\n    <div class=\"product_tabs\">\n      <div class=\"product_tab\">\n                  <!-- Indien je geen product wilt toevoegen -->\n          <h2>Angebote<\/h2>\n              <\/div>\n      <input type=\"text\" v-model=\"searchQ\" placeholder=\"Suchen\">\n    <\/div>\n\n    <div class=\"product_page_desc sof_application_tiles\">\n      <div class=\"sof_loader\" v-if=\"loading\">\n        <div class=\"loader\"><\/div>\n        <p>Angebote laden<\/p>\n      <\/div>\n      <transition name=\"fade\">\n        <div class=\"sofp_item_editor\" v-if=\"!loading\">\n          <table class=\"sofp_offerte_items\" v-if=\"quotes.length > 0 && filtered_quotes.length > 0\">\n            <thead>\n              <tr>\n                <th>Name<\/th>\n                <th class=\"sof_hom\">Erstellt am<\/th>\n                <th class=\"sof_hom\">Kundenname<\/th>\n                <th class=\"sof_hom\">Erstellt von<\/th>\n                <th><\/th>\n              <\/tr>\n            <\/thead>\n            <tbody class=\"editor_table_body\">\n              <!-- LET OP: Vue-code niet aangepast -->\n              <tr v-for=\"offerte in filtered_quotes\" :key=\"offerte.id\" v-bind:class=\"{'sof_search_trhighlight': searchQ != ''}\">\n                <td><span v-html=\"higlight_match(offerte.titel)\"><\/span><\/td>\n                <td class=\"sof_hom\"><span v-html=\"higlight_match(offerte.datum)\"><\/span><\/td>\n                <td class=\"sof_hom\"><span v-html=\"higlight_match(offerte?.klantnaam)\"><\/span><\/td>\n                <td class=\"sof_hom\"><span v-html=\"higlight_match(offerte.maker)\"><\/span><\/td>\n                                  <td>\n                    <button class=\"sofp_offerteform_action\" @click=\"edit_offerte(offerte)\">Bearbeiten<\/button>\n                  <\/td>\n                                              <\/tr>\n            <\/tbody>\n          <\/table>\n\n          <!-- Geen offertes\/bestellingen gevonden -->\n          <div class=\"sofp_fullill\" v-if=\"!loading && quotes.length == 0\">\n            <div class=\"sofp_ill\">\n              <img decoding=\"async\" src=\"https:\/\/portal.schaffenburg.nl\/wp-content\/themes\/1-1-0-schaffenburg-portal\/icons\/sof-geenoffertes.svg\">\n              <p style=\"font-size: 20px; font-weight: 600; margin-top:20px!important;\">\n                Keine Angebote gefunden              <\/p>\n                          <\/div>\n          <\/div>\n          <!-- Geen offertes\/bestellingen gevonden -->\n          <div class=\"sofp_fullill\" v-if=\"!loading && filtered_quotes.length == 0 && quotes.length != 0\">\n            <div class=\"sofp_ill\">\n              <img decoding=\"async\" src=\"https:\/\/portal.schaffenburg.nl\/wp-content\/themes\/1-1-0-schaffenburg-portal\/icons\/sof-geenoffertes.svg\">\n              <p style=\"font-size: 16px;font-weight: 400;margin-top: -10px !important;max-width: 360px;text-align: center;\">\n                Keine Angebote gefunden              <\/p>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/transition>\n\n      <!-- Totaaloverzicht onder de tabel -->\n      <div class=\"sof_subtotal\" style=\"align-items:center;\" v-if=\"!loading\">\n        <p v-if=\"quotes.length > 1\">\n          Angebote: <strong>{{ quotes.length }}<\/strong>\n        <\/p>\n        <p v-if=\"quotes.length == 0\">\n          Noch keine Angebote erstellt        <\/p>\n        <p v-if=\"quotes.length == 1\">\n          Ein Angebot erstellt        <\/p>\n                  <button class=\"sof_btn sof_btn_primary\" @click=\"init_modal\">\n            Angebot hinzuf\u00fcgen          <\/button>\n              <\/div>\n    <\/div>\n\n    <\/transition>\n\n    <transition name=\"modal_wrapper_animation\">\n      <div class=\"sof_productadd_modal\" v-show=\"modalMode !== 'innactive'\">\n        <transition name=\"modal_animation\">\n          <div class=\"sof_productadd_modal_inner sof_offertemaker_inner\" v-if=\"modalMode !== 'innactive'\">\n            <div class=\"sof_productmodal_header\">\n              <h2>Neues Angebot<\/h2>\n            <\/div>\n            <div class=\"sof_productmodal_content sof_col1\" v-if=\"modalMode === 'load'\">\n              <div class=\"sof_loader\">\n                <div class=\"loader\"><\/div>\n                <p>Angebot erstellen...<\/p>\n              <\/div>\n            <\/div>\n            <div class=\"sof_productmodal_content sof_col1\" v-if=\"modalMode === 'success'\">\n              <p>Angebot erfolgreich erstellt.<\/p>\n            <\/div>\n            <div class=\"sof_productmodal_content sof_col1\" v-if=\"modalMode === 'fields'\">\n              <p>W\u00e4hlen Sie einen Titel f\u00fcr das neue Angebot<\/p>\n              <input  type=\"text\" placeholder=\"Offerte titel\" id=\"sof_focusOnLoad\" @keyup.enter='checkandmake()' v-model=\"title\">\n              <button v-if=\"title != ''\" class=\"sof_btn sof_btn_primary sofo_btn_inline\" @click=\"add_offerte\">Hinzuf\u00fcgen<\/button>\n              <button v-if=\"title == ''\" class=\"sof_btn sof_btn_primary sofo_btn_inline\" style=\"opacity: 0.5;\">Hinzuf\u00fcgen<\/button>\n            <\/div>\n            <div class=\"sof_modal_actions\" v-if=\"modalMode === 'success'\">\n              <button class=\"sof_btn sof_btn_secondary\" @click=\"modalMode = 'inactive'\">Schlie\u00dfen<\/button>\n            <\/div>\n          <\/div>\n        <\/transition>\n      <\/div>\n    <\/transition>\n  <\/div>\n  <\/div>\n\n\n  <\/div>\n\n  <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/vue@2.7.13\/dist\/vue.js\"><\/script>\n  <script>\n    var sofp_offerte_add = new Vue({\n      el: \"#sofp_offerte_add\",\n      data: {\n        quotes: [],\n        loading: true,\n        title: \"\",\n        supplement: \"\",\n        modalMode: \"innactive\",\n        searchQ: \"\",\n      },\n      computed: {\n        filtered_quotes: function() {\n          if (this.searchQ == \"\") {\n            return this.quotes;\n          } else {\n            return this.quotes.filter(quote => {\n              return (quote.titel || '').toLowerCase().includes(this.searchQ.toLowerCase()) ||\n                (quote.datum || '').toLowerCase().includes(this.searchQ.toLowerCase()) ||\n                (quote.maker || '').toLowerCase().includes(this.searchQ.toLowerCase()) ||\n                (quote.status || '').toLowerCase().includes(this.searchQ.toLowerCase()) ||\n                (quote.klantnaam || '').toLowerCase().includes(this.searchQ.toLowerCase());\n            });\n          }\n        }\n      },\n      methods: {\n        higlight_match: function(text) {\n          if (this.searchQ == \"\") {\n            return text;\n          } else {\n            var regex = new RegExp(this.searchQ, \"gi\");\n            return `<span class='not-highlight'>` + text.replace(regex, function(match) {\n              return `<span class='highlight'>${match}<\/span>`;\n            }) + `<\/span>`;\n          }\n        },\n        edit_offerte: function(offerte) {\n          console.log(offerte);\n          \/\/ Keep the language path intact\n          var lang = window.location.pathname.split('\/')[1];\n          var langPrefix = '';\n          if (lang === 'nl' || lang === 'de' || lang === 'en') {\n            langPrefix = '\/' + lang;\n          } else {\n            langPrefix = '';\n          }\n          var url = langPrefix + '\/offertes\/bewerken?id=' + offerte.id + this.supplement;\n          window.location.href = url;\n        },\n        init: function() {\n          this.loading = true;\n          this.title = \"\";\n          this.supplement = \"\";\n          this.modalMode = \"innactive\";\n          \/\/fetch offertes\n          const status = 'offerte';\n          fetch(`\/wp-json\/sofp\/v1\/offertes?bedrijf=&status=${status}`, {\n              method: 'GET',\n              headers: {\n                'X-WP-Nonce': '1f033da585'\n              }\n            })\n            .then(res => {\n              if (!res.ok) {\n                throw new Error('Offertes laden mislukt (HTTP ' + res.status + ')');\n              }\n              return res.json();\n            })\n            .then(data => {\n              console.log(data);\n              this.quotes = data;\n              this.loading = false;\n            })\n            .catch(err => {\n              this.error = err.message;\n            })\n            .finally(() => {\n              this.loading = false;\n            });\n\n          \/\/check if param $action is set to new, if so, add a new offerte\n          const urlParams = new URLSearchParams(window.location.search);\n          const action = urlParams.get('addproduct');\n          \/\/if it is set\n          if (action) {\n            console.log(\"offerte editor\");\n            console.log(\"add product\");\n            this.modalMode = \"fields\";\n            this.supplement = '&addproduct=' + action;\n          }\n        },\n        init_modal: function() {\n          console.log(\"init modal\");\n          this.modalMode = \"fields\";\n          this.title = \"\";\n        },\n        checkandmake() {\n          if (this.title != '') {\n            this.add_offerte();\n          }\n        },\n        add_offerte() {\n          this.modalMode = \"load\";\n          fetch('\/wp-json\/sof\/v1\/offerte', {\n              method: 'POST',\n              headers: {\n                'Content-Type': 'application\/json',\n                'X-WP-Nonce': '1f033da585'\n              },\n              body: JSON.stringify({\n                title: this.title,\n                status: 'publish'\n              })\n            })\n            .then(res => {\n              if (!res.ok) {\n                throw new Error('Offerte toevoegen mislukt (HTTP ' + res.status + ')');\n              }\n              return res.json();\n            })\n            .then(data => {\n              this.message = 'Angebot hinzugef\u00fcgt!';\n              this.title = '';\n              console.log(\"DATA: \", data);\n              var url = '\/offertes\/bewerken?id=' + data.id + this.supplement;\n              window.location.href = url;\n              console.log(url);\n            })\n            .catch(err => {\n              this.message = err.message;\n            });\n        }\n      }\n    });\n\n    sofp_offerte_add.init();\n  <\/script>\n  <style>\n    .sof_offertemaker_inner>div.sof_productmodal_content {\n      padding: 20px;\n      display: flex;\n      flex-direction: column;\n      align-items: start;\n      justify-content: start;\n    }\n\n    .sof_offertemaker_inner input {\n      width: 100%;\n      padding: 10px;\n      margin: 10px 0;\n      border: 1px solid var(--secondary);\n      border-radius: 4px;\n    }\n\n    .sof_offertemaker_inner button {\n      width: 100% !important;\n    }\n\n    .not-highlight {\n      color: grey !important;\n      font-weight: 400;\n    }\n\n    .highlight {\n      color: var(--primary);\n      font-weight: 600;\n    }\n  <\/style>\n\n  <link rel=\"stylesheet\" href=\"https:\/\/portal.schaffenburg.nl\/wp-content\/themes\/1-1-0-schaffenburg-portal\/css\/sof-dashboard.css\">\n  <link rel=\"stylesheet\" href=\"https:\/\/portal.schaffenburg.nl\/wp-content\/themes\/1-1-0-schaffenburg-portal\/css\/sof-offerte.css\">\n\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":575,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-29786","page","type-page","status-publish","hentry"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.7 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Offertes - Schaffenburg<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/portal.schaffenburg.nl\/de\/offertes\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Offertes - Schaffenburg\" \/>\n<meta property=\"og:url\" content=\"https:\/\/portal.schaffenburg.nl\/de\/offertes\/\" \/>\n<meta property=\"og:site_name\" content=\"Schaffenburg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/portal.schaffenburg.nl\/de\/offertes\/\",\"url\":\"https:\/\/portal.schaffenburg.nl\/de\/offertes\/\",\"name\":\"Offertes - Schaffenburg\",\"isPartOf\":{\"@id\":\"https:\/\/portal.schaffenburg.nl\/de\/#website\"},\"datePublished\":\"2025-02-11T19:32:14+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/portal.schaffenburg.nl\/de\/offertes\/#breadcrumb\"},\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/portal.schaffenburg.nl\/de\/offertes\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/portal.schaffenburg.nl\/de\/offertes\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/portal.schaffenburg.nl\/de\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Offertes\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/portal.schaffenburg.nl\/de\/#website\",\"url\":\"https:\/\/portal.schaffenburg.nl\/de\/\",\"name\":\"Schaffenburg\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/portal.schaffenburg.nl\/de\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Offertes - Schaffenburg","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/portal.schaffenburg.nl\/de\/offertes\/","og_locale":"de_DE","og_type":"article","og_title":"Offertes - Schaffenburg","og_url":"https:\/\/portal.schaffenburg.nl\/de\/offertes\/","og_site_name":"Schaffenburg","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/portal.schaffenburg.nl\/de\/offertes\/","url":"https:\/\/portal.schaffenburg.nl\/de\/offertes\/","name":"Offertes - Schaffenburg","isPartOf":{"@id":"https:\/\/portal.schaffenburg.nl\/de\/#website"},"datePublished":"2025-02-11T19:32:14+00:00","breadcrumb":{"@id":"https:\/\/portal.schaffenburg.nl\/de\/offertes\/#breadcrumb"},"inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/portal.schaffenburg.nl\/de\/offertes\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/portal.schaffenburg.nl\/de\/offertes\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/portal.schaffenburg.nl\/de\/"},{"@type":"ListItem","position":2,"name":"Offertes"}]},{"@type":"WebSite","@id":"https:\/\/portal.schaffenburg.nl\/de\/#website","url":"https:\/\/portal.schaffenburg.nl\/de\/","name":"Schaffenburg","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/portal.schaffenburg.nl\/de\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de"}]}},"_links":{"self":[{"href":"https:\/\/portal.schaffenburg.nl\/de\/wp-json\/wp\/v2\/pages\/29786","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/portal.schaffenburg.nl\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/portal.schaffenburg.nl\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/portal.schaffenburg.nl\/de\/wp-json\/wp\/v2\/users\/575"}],"replies":[{"embeddable":true,"href":"https:\/\/portal.schaffenburg.nl\/de\/wp-json\/wp\/v2\/comments?post=29786"}],"version-history":[{"count":0,"href":"https:\/\/portal.schaffenburg.nl\/de\/wp-json\/wp\/v2\/pages\/29786\/revisions"}],"wp:attachment":[{"href":"https:\/\/portal.schaffenburg.nl\/de\/wp-json\/wp\/v2\/media?parent=29786"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}