Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Implement mijn-taken #32

Draft
wants to merge 11 commits into
base: master
Choose a base branch
from
7 changes: 6 additions & 1 deletion TODO.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,8 @@
# TO-DO

- Originele aanvraag.
Please please take note; the code is very nasty but serves as a POC. There is no need to clean everything up since the requirements and mijn-taken API are likely to change.

- Preprare generic form for altering the 'Taak' status
- Single page 'Taak' with form combined
- Finding applicable form is now being done by css class, create form setting instead
- Finding applicable form field which are populated on render needs to be done better and more robust
20 changes: 18 additions & 2 deletions config/container.php
Original file line number Diff line number Diff line change
Expand Up @@ -95,6 +95,12 @@
'rx.client_secret' => function (Container $container) {
return $container->make('gf.setting', ['-rx-mission-client-secret']);
},
'rx.mijn_taken_uri' => function (Container $container) {
return $container->make('gf.setting', ['-rx-mission-mijn-taken-url']);
},
'rx.mijn_taken_api_key' => function (Container $container) {
return $container->make('gf.setting', ['-rx-mission-mijn-taken-api-key']);
},
'rx.authenticator' => function (Container $container) {
return $container->get(Clients\RxMission\Authenticator::class);
},
Expand Down Expand Up @@ -122,6 +128,12 @@
'xxllnc.client_secret' => function (Container $container) {
return $container->make('gf.setting', ['-xxllnc-client-secret']);
},
'xxllnc.mijn_taken_uri' => function (Container $container) {
return $container->make('gf.setting', ['-xxllnc-mijn-taken-url']);
},
'xxllnc.mijn_taken_api_key' => function (Container $container) {
return $container->make('gf.setting', ['-xxllnc-mijn-taken-api-key']);
},
'xxllnc.authenticator' => function (Container $container) {
return $container->get(Clients\Xxllnc\Authenticator::class);
},
Expand Down Expand Up @@ -223,6 +235,7 @@
$container->get('rx.zaken_uri'),
$container->get('rx.catalogi_uri'),
$container->get('rx.documenten_uri'),
$container->get('rx.mijn_taken_uri')
);
},

Expand All @@ -235,6 +248,7 @@
$container->get('xxllnc.zaken_uri'),
$container->get('xxllnc.catalogi_uri'),
$container->get('xxllnc.documenten_uri'),
$container->get('xxllnc.mijn_taken_uri')
);
},

Expand Down Expand Up @@ -270,14 +284,16 @@
Clients\RxMission\Authenticator::class => function (Container $container) {
return new Clients\RxMission\Authenticator(
$container->get('rx.client_id'),
$container->get('rx.client_secret')
$container->get('rx.client_secret'),
$container->get('rx.mijn_taken_api_key')
);
},

Clients\Xxllnc\Authenticator::class => function (Container $container) {
return new Clients\Xxllnc\Authenticator(
$container->get('xxllnc.client_id'),
$container->get('xxllnc.client_secret')
$container->get('xxllnc.client_secret'),
$container->get('xxllnc.mijn_taken_api_key')
);
},

Expand Down
2 changes: 1 addition & 1 deletion owc-gravityforms-zaaksysteem.php
Original file line number Diff line number Diff line change
Expand Up @@ -56,6 +56,6 @@
* plugin overrides. The plugins_loaded action hook fires early, and precedes the setup_theme, after_setup_theme, init
* and wp_loaded action hooks.
*/
\add_action('plugins_loaded', function () {
add_action('plugins_loaded', function () {
Foundation\Plugin::getInstance(__DIR__)->boot();
}, 10);
447 changes: 56 additions & 391 deletions resources/dist/build/editor.js

Large diffs are not rendered by default.

1,880 changes: 78 additions & 1,802 deletions resources/dist/build/zaak-frontend.js

Large diffs are not rendered by default.

754 changes: 753 additions & 1 deletion resources/dist/build/zaak-styles.css

Large diffs are not rendered by default.

46 changes: 44 additions & 2 deletions resources/dist/build/zaak-styles.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,49 @@
/*
* ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
* This devtool is neither made for production nor for readable output files.
* It uses "eval()" calls to create a separate source file in the browser devtools.
* If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
* or disable the default devtool with "devtool: false".
* If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
*/
/******/ (() => { // webpackBootstrap
/******/ "use strict";
var __webpack_exports__ = {};
// extracted by mini-css-extract-plugin
/******/ var __webpack_modules__ = ({

/***/ "./resources/scss/style.scss":
/*!***********************************!*\
!*** ./resources/scss/style.scss ***!
\***********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extract-plugin\n\n\n//# sourceURL=webpack://owc-gravityforms-zaaksysteem/./resources/scss/style.scss?");

/***/ })

/******/ });
/************************************************************************/
/******/ // The require scope
/******/ var __webpack_require__ = {};
/******/
/************************************************************************/
/******/ /* webpack/runtime/make namespace object */
/******/ (() => {
/******/ // define __esModule on exports
/******/ __webpack_require__.r = (exports) => {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/ })();
/******/
/************************************************************************/
/******/
/******/ // startup
/******/ // Load entry module and return exports
/******/ // This entry module can't be inlined because the eval devtool is used.
/******/ var __webpack_exports__ = {};
/******/ __webpack_modules__["./resources/scss/style.scss"](0, __webpack_exports__, __webpack_require__);
/******/
/******/ })()
;
3 changes: 2 additions & 1 deletion resources/js/editor/index.js
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
import "./register-blocks";
import "./mijn-zaken";
import "./mijn-zaken";
import "./mijn-taken";
261 changes: 261 additions & 0 deletions resources/js/editor/mijn-taken.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,261 @@
const { registerBlockType } = wp.blocks;
const { serverSideRender: ServerSideRender } = wp;

const {
useBlockProps,
InspectorControls,
} = wp.blockEditor;

const {
Panel,
PanelBody,
SelectControl,
RangeControl,
} = wp.components;

const { Fragment } = wp.element;

registerBlockType( 'owc/mijn-taken', {
apiVersion: 2,
title: 'Mijn Taken',
category: 'common',
attributes: {
zaakClient: { type: 'string', default: 'openzaak' },
view: { type: 'string', default: 'default' },
numberOfItems: { type: 'number', default: 2 },
},
edit: ( { attributes, setAttributes } ) => {
const blockProps = useBlockProps();
const { zaakClient } = attributes;

return (
<div { ...blockProps }>
<InspectorControls>
<Panel>
<PanelBody title="Zaaksysteem" initialOpen={ false }>
<p>
Selecteer het zaaksysteem waaruit de taken
opgehaald moeten worden.
</p>
<SelectControl
label="Zaaksysteem"
value={ zaakClient }
options={ [
{ label: 'OpenZaak', value: 'openzaak' },
{
label: 'Decos JOIN',
value: 'decos-join',
},
{
label: 'Rx.Mission',
value: 'rx-mission',
},
{ label: 'xxllnc', value: 'xxllnc' },
{ label: 'Procura', value: 'procura' },
] }
onChange={ ( newzaakClient ) =>
setAttributes( {
zaakClient: newzaakClient,
} )
}
/>
</PanelBody>
{ attributes.view === 'current' && (
<PanelBody>
<RangeControl
min={ 1 }
max={ 20 }
label="Aantal"
help="Het aantal taken dat getoond moeten worden."
value={ attributes.numberOfItems }
onChange={ ( value ) =>
setAttributes( {
numberOfItems: value,
} )
}
/>
</PanelBody>
) }
<PanelBody title="Weergave" initialOpen={ false }>
<SelectControl
label="Selecteer de weergave van de taken"
value={ attributes.view }
options={ [
{
label: 'Standaard',
value: 'default',
},
{
label: 'Lopende Zaken',
value: 'current',
},
] }
onChange={ ( newView ) =>
setAttributes( { view: newView } )
}
/>
</PanelBody>
</Panel>
</InspectorControls>

{ attributes.view === 'default' ? (
<p>Standaardweergave</p>
) : (
<>
<ul
className="zaak-tabs | nav nav-tabs"
id="zaak-tabs"
role="tablist"
>
<li className="nav-item" role="presentation">
<button className="zaak-tabs-link | nav-link active">
Lopende taken
</button>
</li>
<li className="nav-item" role="presentation">
<button className="zaak-tabs-link | nav-link">
Afgeronde taken
</button>
</li>
</ul>

<div className="tab-content" id="myTabContent">
<div className="tab-pane fade show active">
<div className="zaak-card-wrapper">
<div className="zaak-card">
<svg
className="zaak-card-svg"
width="385"
height="200"
viewBox="0 0 385 200"
fill="#F1F1F1"
xmlns="http://www.w3.org/2000/svg"
preserveAspectRatio="none"
>
<path d="M260.532 17.39L249.736 1.32659C249.179 0.497369 248.246 0 247.246 0H3C1.34315 0 0 1.34314 0 3V197C0 198.657 1.34315 200 3.00001 200H381.485C383.142 200 384.485 198.657 384.485 197V109.358V21.7166C384.485 20.0597 383.142 18.7166 381.485 18.7166H263.022C262.023 18.7166 261.089 18.2192 260.532 17.39Z" />
</svg>
<h2 className="zaak-card-title">
Aanvragen uittreksel BRP
</h2>
<div className="zaak-card-footer">
<div className="zaak-card-date">
12 december 2023
</div>
<div className="zaak-card-tag">
Dummy content
</div>
<svg
className="zaak-card-arrow"
width="24"
height="24"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path d="M12.2929 5.29289C12.6834 4.90237 13.3166 4.90237 13.7071 5.29289L19.7071 11.2929C19.8946 11.4804 20 11.7348 20 12C20 12.2652 19.8946 12.5196 19.7071 12.7071L13.7071 18.7071C13.3166 19.0976 12.6834 19.0976 12.2929 18.7071C11.9024 18.3166 11.9024 17.6834 12.2929 17.2929L16.5858 13L5 13C4.44772 13 4 12.5523 4 12C4 11.4477 4.44772 11 5 11L16.5858 11L12.2929 6.70711C11.9024 6.31658 11.9024 5.68342 12.2929 5.29289Z" />
</svg>
</div>
</div>

<div className="zaak-card">
<svg
className="zaak-card-svg"
width="385"
height="200"
viewBox="0 0 385 200"
fill="#F1F1F1"
xmlns="http://www.w3.org/2000/svg"
preserveAspectRatio="none"
>
<path d="M260.532 17.39L249.736 1.32659C249.179 0.497369 248.246 0 247.246 0H3C1.34315 0 0 1.34314 0 3V197C0 198.657 1.34315 200 3.00001 200H381.485C383.142 200 384.485 198.657 384.485 197V109.358V21.7166C384.485 20.0597 383.142 18.7166 381.485 18.7166H263.022C262.023 18.7166 261.089 18.2192 260.532 17.39Z" />
</svg>
<h2 className="zaak-card-title">
Aanmelden straatfeest
</h2>
<div className="zaak-card-footer">
<div className="zaak-card-date">
15 oktober 2023
</div>
<svg
className="zaak-card-arrow"
width="24"
height="24"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path d="M12.2929 5.29289C12.6834 4.90237 13.3166 4.90237 13.7071 5.29289L19.7071 11.2929C19.8946 11.4804 20 11.7348 20 12C20 12.2652 19.8946 12.5196 19.7071 12.7071L13.7071 18.7071C13.3166 19.0976 12.6834 19.0976 12.2929 18.7071C11.9024 18.3166 11.9024 17.6834 12.2929 17.2929L16.5858 13L5 13C4.44772 13 4 12.5523 4 12C4 11.4477 4.44772 11 5 11L16.5858 11L12.2929 6.70711C11.9024 6.31658 11.9024 5.68342 12.2929 5.29289Z" />
</svg>
</div>
</div>
<div className="zaak-card">
<svg
className="zaak-card-svg"
width="385"
height="200"
viewBox="0 0 385 200"
fill="#F1F1F1"
xmlns="http://www.w3.org/2000/svg"
preserveAspectRatio="none"
>
<path d="M260.532 17.39L249.736 1.32659C249.179 0.497369 248.246 0 247.246 0H3C1.34315 0 0 1.34314 0 3V197C0 198.657 1.34315 200 3.00001 200H381.485C383.142 200 384.485 198.657 384.485 197V109.358V21.7166C384.485 20.0597 383.142 18.7166 381.485 18.7166H263.022C262.023 18.7166 261.089 18.2192 260.532 17.39Z" />
</svg>
<h2 className="zaak-card-title">
Aanvraag rijbewijs
</h2>
<div className="zaak-card-footer">
<div className="zaak-card-date">
20 januari 2023
</div>
<svg
className="zaak-card-arrow"
width="24"
height="24"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path d="M12.2929 5.29289C12.6834 4.90237 13.3166 4.90237 13.7071 5.29289L19.7071 11.2929C19.8946 11.4804 20 11.7348 20 12C20 12.2652 19.8946 12.5196 19.7071 12.7071L13.7071 18.7071C13.3166 19.0976 12.6834 19.0976 12.2929 18.7071C11.9024 18.3166 11.9024 17.6834 12.2929 17.2929L16.5858 13L5 13C4.44772 13 4 12.5523 4 12C4 11.4477 4.44772 11 5 11L16.5858 11L12.2929 6.70711C11.9024 6.31658 11.9024 5.68342 12.2929 5.29289Z" />
</svg>
</div>
</div>

<div className="zaak-card">
<svg
className="zaak-card-svg"
width="385"
height="200"
viewBox="0 0 385 200"
fill="#F1F1F1"
xmlns="http://www.w3.org/2000/svg"
preserveAspectRatio="none"
>
<path d="M260.532 17.39L249.736 1.32659C249.179 0.497369 248.246 0 247.246 0H3C1.34315 0 0 1.34314 0 3V197C0 198.657 1.34315 200 3.00001 200H381.485C383.142 200 384.485 198.657 384.485 197V109.358V21.7166C384.485 20.0597 383.142 18.7166 381.485 18.7166H263.022C262.023 18.7166 261.089 18.2192 260.532 17.39Z" />
</svg>
<h2 className="zaak-card-title">
Aanvragen leefbaarheidsbudget
</h2>
<div className="zaak-card-footer">
<div className="zaak-card-date">
11 januari 2023
</div>
<svg
className="zaak-card-arrow"
width="24"
height="24"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path d="M12.2929 5.29289C12.6834 4.90237 13.3166 4.90237 13.7071 5.29289L19.7071 11.2929C19.8946 11.4804 20 11.7348 20 12C20 12.2652 19.8946 12.5196 19.7071 12.7071L13.7071 18.7071C13.3166 19.0976 12.6834 19.0976 12.2929 18.7071C11.9024 18.3166 11.9024 17.6834 12.2929 17.2929L16.5858 13L5 13C4.44772 13 4 12.5523 4 12C4 11.4477 4.44772 11 5 11L16.5858 11L12.2929 6.70711C11.9024 6.31658 11.9024 5.68342 12.2929 5.29289Z" />
</svg>
</div>
</div>
</div>
</div>
</div>
</>
) }
</div>
);
},
save: ( { className } ) => {
return <section className={ className }></section>;
},
} );
Loading