diff --git a/package-lock.json b/package-lock.json
index 4066a8f0c..0cb81626a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,6 +8,7 @@
       "name": "ehr",
       "version": "0.0.0",
       "dependencies": {
+        "@arcgis/core": "^4.28.10",
         "@fullcalendar/core": "^6.0.1",
         "@fullcalendar/daygrid": "^6.0.1",
         "@fullcalendar/interaction": "^6.0.2",
@@ -18,7 +19,9 @@
         "@quasar/extras": "^1.15.8",
         "@tato30/vue-pdf": "^1.5.1",
         "@vuepic/vue-datepicker": "^3.6.3",
+        "arcgis-js-api": "^4.28.10",
         "bma-org-chart": "^0.0.8",
+        "esri-loader": "^3.7.0",
         "keycloak-js": "^20.0.2",
         "moment": "^2.29.4",
         "pinia": "^2.0.29",
@@ -80,6 +83,21 @@
         "node": ">=6.0.0"
       }
     },
+    "node_modules/@arcgis/core": {
+      "version": "4.28.10",
+      "resolved": "https://registry.npmjs.org/@arcgis/core/-/core-4.28.10.tgz",
+      "integrity": "sha512-FKvicMVDwFuKX8JKLqAfukzQU2F3AG7s3tDigTcIC4ApGRbj7Nc/F9dRfPZo+aY1Vl7Sa1FjYlo6tfV93LJ2Eg==",
+      "dependencies": {
+        "@esri/arcgis-html-sanitizer": "~3.0.1",
+        "@esri/calcite-colors": "~6.1.0",
+        "@esri/calcite-components": "^1.9.2",
+        "@popperjs/core": "~2.11.8",
+        "@zip.js/zip.js": "~2.7.29",
+        "focus-trap": "~7.5.3",
+        "luxon": "~3.4.3",
+        "sortablejs": "~1.15.0"
+      }
+    },
     "node_modules/@babel/code-frame": {
       "version": "7.22.10",
       "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.22.10.tgz",
@@ -1016,6 +1034,68 @@
         "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
       }
     },
+    "node_modules/@esri/arcgis-html-sanitizer": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/@esri/arcgis-html-sanitizer/-/arcgis-html-sanitizer-3.0.1.tgz",
+      "integrity": "sha512-cwZJwsYCJZwtBQU2AmaiIVFg5nZcVwInPYja1/OgC9iKYO+ytZRoc5h+0S9/ygbFNoS8Nd0RX9A85stLX/BgiA==",
+      "dependencies": {
+        "xss": "1.0.13"
+      }
+    },
+    "node_modules/@esri/calcite-colors": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/@esri/calcite-colors/-/calcite-colors-6.1.0.tgz",
+      "integrity": "sha512-wHQYWFtDa6c328EraXEVZvgOiaQyYr0yuaaZ0G3cB4C3lSkWefW34L/e5TLAhtuG3zJ/wR6pl5X1YYNfBc0/4Q=="
+    },
+    "node_modules/@esri/calcite-components": {
+      "version": "1.11.0",
+      "resolved": "https://registry.npmjs.org/@esri/calcite-components/-/calcite-components-1.11.0.tgz",
+      "integrity": "sha512-H0ZqX3fEv4i0JCBEZ5SarPpd1KeXvqlEpLTtforfifIYbFAQOshP5fC2tFSL7j5pECyhBuB7rRhBiFeFejpRDw==",
+      "dependencies": {
+        "@floating-ui/dom": "1.5.3",
+        "@stencil/core": "2.22.3",
+        "@types/color": "3.0.5",
+        "color": "4.2.3",
+        "composed-offset-position": "0.0.4",
+        "dayjs": "1.11.10",
+        "focus-trap": "7.5.4",
+        "lodash-es": "4.17.21",
+        "sortablejs": "1.15.0",
+        "timezone-groups": "0.8.0"
+      }
+    },
+    "node_modules/@esri/calcite-components/node_modules/sortablejs": {
+      "version": "1.15.0",
+      "resolved": "https://registry.npmjs.org/sortablejs/-/sortablejs-1.15.0.tgz",
+      "integrity": "sha512-bv9qgVMjUMf89wAvM6AxVvS/4MX3sPeN0+agqShejLU5z5GX4C75ow1O2e5k4L6XItUyAK3gH6AxSbXrOM5e8w=="
+    },
+    "node_modules/@floating-ui/core": {
+      "version": "1.5.3",
+      "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.5.3.tgz",
+      "integrity": "sha512-O0WKDOo0yhJuugCx6trZQj5jVJ9yR0ystG2JaNAemYUWce+pmM6WUEFIibnWyEJKdrDxhm75NoSRME35FNaM/Q==",
+      "dependencies": {
+        "@floating-ui/utils": "^0.2.0"
+      }
+    },
+    "node_modules/@floating-ui/core/node_modules/@floating-ui/utils": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.1.tgz",
+      "integrity": "sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q=="
+    },
+    "node_modules/@floating-ui/dom": {
+      "version": "1.5.3",
+      "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.5.3.tgz",
+      "integrity": "sha512-ClAbQnEqJAKCJOEbbLo5IUlZHkNszqhuxS4fHAVxRPXPya6Ysf2G8KypnYcOTpx6I8xcgF9bbHb6g/2KpbV8qA==",
+      "dependencies": {
+        "@floating-ui/core": "^1.4.2",
+        "@floating-ui/utils": "^0.1.3"
+      }
+    },
+    "node_modules/@floating-ui/utils": {
+      "version": "0.1.6",
+      "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.1.6.tgz",
+      "integrity": "sha512-OfX7E2oUDYxtBvsuS4e/jSn4Q9Qb6DzgeYtsAdkPZ47znpoNsMgZw0+tVijiv3uGNR6dgNlty6r9rzIzHjtd/A=="
+    },
     "node_modules/@fullcalendar/core": {
       "version": "6.1.8",
       "resolved": "https://registry.npmjs.org/@fullcalendar/core/-/core-6.1.8.tgz",
@@ -1348,6 +1428,15 @@
       "integrity": "sha512-XuySG1E38YScSJoMlqovLru4KTUNSjgVTIjyh7qMX6aNN5HY5Ct5LhRJdxO79JtTzKfzV/bnWpz+zquYrISsvw==",
       "dev": true
     },
+    "node_modules/@popperjs/core": {
+      "version": "2.11.8",
+      "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz",
+      "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==",
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/popperjs"
+      }
+    },
     "node_modules/@quasar/extras": {
       "version": "1.16.5",
       "resolved": "https://registry.npmjs.org/@quasar/extras/-/extras-1.16.5.tgz",
@@ -1403,6 +1492,18 @@
       "integrity": "sha512-RNiOoTPkptFtSVzQevY/yWtZwf/RxyVnPy/OcA9HBM3MlGDnBEYL5B41H0MTn0Uec8Hi+2qUtTfG2WWZBmMejQ==",
       "dev": true
     },
+    "node_modules/@stencil/core": {
+      "version": "2.22.3",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.22.3.tgz",
+      "integrity": "sha512-kmVA0M/HojwsfkeHsifvHVIYe4l5tin7J5+DLgtl8h6WWfiMClND5K3ifCXXI2ETDNKiEk21p6jql3Fx9o2rng==",
+      "bin": {
+        "stencil": "bin/stencil"
+      },
+      "engines": {
+        "node": ">=12.10.0",
+        "npm": ">=6.0.0"
+      }
+    },
     "node_modules/@tato30/vue-pdf": {
       "version": "1.7.2",
       "resolved": "https://registry.npmjs.org/@tato30/vue-pdf/-/vue-pdf-1.7.2.tgz",
@@ -1438,6 +1539,27 @@
         "@types/chai": "*"
       }
     },
+    "node_modules/@types/color": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/@types/color/-/color-3.0.5.tgz",
+      "integrity": "sha512-T9yHCNtd8ap9L/r8KEESu5RDMLkoWXHo7dTureNoI1dbp25NsCN054vOu09iniIjR21MXUL+LU9bkIWrbyg8gg==",
+      "dependencies": {
+        "@types/color-convert": "*"
+      }
+    },
+    "node_modules/@types/color-convert": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/@types/color-convert/-/color-convert-2.0.3.tgz",
+      "integrity": "sha512-2Q6wzrNiuEvYxVQqhh7sXM2mhIhvZR/Paq4FdsQkOMgWsCIkKvSGj8Le1/XalulrmgOzPMqNa0ix+ePY4hTrfg==",
+      "dependencies": {
+        "@types/color-name": "*"
+      }
+    },
+    "node_modules/@types/color-name": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/@types/color-name/-/color-name-1.1.3.tgz",
+      "integrity": "sha512-87W6MJCKZYDhLAx/J1ikW8niMvmGRyY+rpUxWpL1cO7F8Uu5CHuQoFv+R0/L5pgNdW4jTyda42kv60uwVIPjLw=="
+    },
     "node_modules/@types/jsdom": {
       "version": "20.0.1",
       "resolved": "https://registry.npmjs.org/@types/jsdom/-/jsdom-20.0.1.tgz",
@@ -2135,6 +2257,16 @@
         "vue": ">=3.2.0"
       }
     },
+    "node_modules/@zip.js/zip.js": {
+      "version": "2.7.32",
+      "resolved": "https://registry.npmjs.org/@zip.js/zip.js/-/zip.js-2.7.32.tgz",
+      "integrity": "sha512-9Ox1meDIvIKE23LLA7Fxd/ewJpKjj2KryH92doHRqx2406LmIzorsiMawL0qIK7dvwN9K+mfk47lauoIE0o1zQ==",
+      "engines": {
+        "bun": ">=0.7.0",
+        "deno": ">=1.0.0",
+        "node": ">=16.5.0"
+      }
+    },
     "node_modules/abab": {
       "version": "2.0.6",
       "resolved": "https://registry.npmjs.org/abab/-/abab-2.0.6.tgz",
@@ -2312,6 +2444,11 @@
       "integrity": "sha512-lYe4Gx7QT+MKGbDsA+Z+he/Wtef0BiwDOlK/XkBrdfsh9J/jPPXbX0tE9x9cl27Tmu5gg3QUbUrQYa/y+KOHPQ==",
       "devOptional": true
     },
+    "node_modules/arcgis-js-api": {
+      "version": "4.28.10",
+      "resolved": "https://registry.npmjs.org/arcgis-js-api/-/arcgis-js-api-4.28.10.tgz",
+      "integrity": "sha512-WGfTt8BZMATcbxBfU7KldeKzmEN15YZgi+7+sZ/3bSTczrVZBjlb0Jh/1fMwDvDnDQ06c1EW6dxtv0qPaS9rmA=="
+    },
     "node_modules/arch": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/arch/-/arch-2.2.0.tgz",
@@ -3089,6 +3226,18 @@
         "node": ">=12"
       }
     },
+    "node_modules/color": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/color/-/color-4.2.3.tgz",
+      "integrity": "sha512-1rXeuUUiGGrykh+CeBdu5Ie7OJwinCgQY0bc7GCRxy5xVHy+moaqkpL/jqQq0MtQOeYcrqEz4abc5f0KtU7W4A==",
+      "dependencies": {
+        "color-convert": "^2.0.1",
+        "color-string": "^1.9.0"
+      },
+      "engines": {
+        "node": ">=12.5.0"
+      }
+    },
     "node_modules/color-convert": {
       "version": "1.9.3",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
@@ -3101,8 +3250,16 @@
     "node_modules/color-name": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-      "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==",
-      "dev": true
+      "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw=="
+    },
+    "node_modules/color-string": {
+      "version": "1.9.1",
+      "resolved": "https://registry.npmjs.org/color-string/-/color-string-1.9.1.tgz",
+      "integrity": "sha512-shrVawQFojnZv6xM40anx4CkoDP+fZsw/ZerEMsW/pyzsRbElpsL/DBVW7q3ExxwusdNXI3lXpuhEZkzs8p5Eg==",
+      "dependencies": {
+        "color-name": "^1.0.0",
+        "simple-swizzle": "^0.2.2"
+      }
     },
     "node_modules/color-support": {
       "version": "1.1.3",
@@ -3113,6 +3270,22 @@
         "color-support": "bin.js"
       }
     },
+    "node_modules/color/node_modules/color-convert": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+      "dependencies": {
+        "color-name": "~1.1.4"
+      },
+      "engines": {
+        "node": ">=7.0.0"
+      }
+    },
+    "node_modules/color/node_modules/color-name": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
+    },
     "node_modules/colorette": {
       "version": "2.0.20",
       "resolved": "https://registry.npmjs.org/colorette/-/colorette-2.0.20.tgz",
@@ -3149,6 +3322,11 @@
         "node": ">=4.0.0"
       }
     },
+    "node_modules/composed-offset-position": {
+      "version": "0.0.4",
+      "resolved": "https://registry.npmjs.org/composed-offset-position/-/composed-offset-position-0.0.4.tgz",
+      "integrity": "sha512-vMlvu1RuNegVE0YsCDSV/X4X10j56mq7PCIyOKK74FxkXzGLwhOUmdkJLSdOBOMwWycobGUMgft2lp+YgTe8hw=="
+    },
     "node_modules/concat-map": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
@@ -3234,6 +3412,11 @@
         "node": ">=4"
       }
     },
+    "node_modules/cssfilter": {
+      "version": "0.0.10",
+      "resolved": "https://registry.npmjs.org/cssfilter/-/cssfilter-0.0.10.tgz",
+      "integrity": "sha512-FAaLDaplstoRsDR8XGYH51znUN0UY7nMc6Z9/fvE8EXGwvJE9hu7W2vHwx1+bd6gCYnln9nLbzxFTrcO9YQDZw=="
+    },
     "node_modules/cssom": {
       "version": "0.5.0",
       "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.5.0.tgz",
@@ -3495,10 +3678,9 @@
       }
     },
     "node_modules/dayjs": {
-      "version": "1.11.9",
-      "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.9.tgz",
-      "integrity": "sha512-QvzAURSbQ0pKdIye2txOzNaHmxtUBXerpY0FJsFXUMKbIZeFm5ht1LS/jFsrncjnmtv8HsG0W2g6c0zUjZWmpA==",
-      "dev": true
+      "version": "1.11.10",
+      "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.10.tgz",
+      "integrity": "sha512-vjAczensTgRcqDERK0SR2XMwsF/tSvnvlv6VcF2GIhg6Sx4yOIt/irsr1RDJsKiIyBzJDpCoXiWWq28MqH2cnQ=="
     },
     "node_modules/de-indent": {
       "version": "1.0.2",
@@ -4441,6 +4623,11 @@
         "node": ">=4.0"
       }
     },
+    "node_modules/esri-loader": {
+      "version": "3.7.0",
+      "resolved": "https://registry.npmjs.org/esri-loader/-/esri-loader-3.7.0.tgz",
+      "integrity": "sha512-cB1Sw9EQjtW4mtT7eFBjn/6VaaIWNTjmTd2asnnEyuZk1xVSFRMCfLZSBSjZM7ZarDcVu5WIjOP0t0MYVu4hVQ=="
+    },
     "node_modules/estraverse": {
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-4.3.0.tgz",
@@ -4704,6 +4891,14 @@
       "integrity": "sha512-5nqDSxl8nn5BSNxyR3n4I6eDmbolI6WT+QqR547RwxQapgjQBmtktdP+HTBb/a/zLsbzERTONyUB5pefh5TtjQ==",
       "dev": true
     },
+    "node_modules/focus-trap": {
+      "version": "7.5.4",
+      "resolved": "https://registry.npmjs.org/focus-trap/-/focus-trap-7.5.4.tgz",
+      "integrity": "sha512-N7kHdlgsO/v+iD/dMoJKtsSqs5Dz/dXZVebRgJw23LDk+jMi/974zyiOYDziY2JPp8xivq9BmUGwIJMiuSBi7w==",
+      "dependencies": {
+        "tabbable": "^6.2.0"
+      }
+    },
     "node_modules/follow-redirects": {
       "version": "1.15.2",
       "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.2.tgz",
@@ -6233,6 +6428,11 @@
       "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
       "dev": true
     },
+    "node_modules/lodash-es": {
+      "version": "4.17.21",
+      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
+      "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw=="
+    },
     "node_modules/lodash.merge": {
       "version": "4.6.2",
       "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
@@ -6443,6 +6643,14 @@
         "yallist": "^3.0.2"
       }
     },
+    "node_modules/luxon": {
+      "version": "3.4.4",
+      "resolved": "https://registry.npmjs.org/luxon/-/luxon-3.4.4.tgz",
+      "integrity": "sha512-zobTr7akeGHnv7eBOXcRgMeCP6+uyYsczwmeRCauvpvaAltgNyTbLH/+VaEAPUeWBT+1GuNmz4wC/6jtQzbbVA==",
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/magic-string": {
       "version": "0.30.3",
       "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.3.tgz",
@@ -9005,6 +9213,19 @@
         "simple-concat": "^1.0.0"
       }
     },
+    "node_modules/simple-swizzle": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/simple-swizzle/-/simple-swizzle-0.2.2.tgz",
+      "integrity": "sha512-JA//kQgZtbuY83m+xT+tXJkmJncGMTFT+C+g2h2R9uxkYIrE2yy9sgmcLhCnw57/WSD+Eh3J97FPEDFnbXnDUg==",
+      "dependencies": {
+        "is-arrayish": "^0.3.1"
+      }
+    },
+    "node_modules/simple-swizzle/node_modules/is-arrayish": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.3.2.tgz",
+      "integrity": "sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ=="
+    },
     "node_modules/slash": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
@@ -9099,6 +9320,11 @@
         "node": ">= 10"
       }
     },
+    "node_modules/sortablejs": {
+      "version": "1.15.2",
+      "resolved": "https://registry.npmjs.org/sortablejs/-/sortablejs-1.15.2.tgz",
+      "integrity": "sha512-FJF5jgdfvoKn1MAKSdGs33bIqLi3LmsgVTliuX6iITj834F+JRQZN90Z93yql8h0K2t0RwDPBmxwlbZfDcxNZA=="
+    },
     "node_modules/source-map": {
       "version": "0.6.1",
       "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
@@ -9554,6 +9780,11 @@
       "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==",
       "dev": true
     },
+    "node_modules/tabbable": {
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-6.2.0.tgz",
+      "integrity": "sha512-Cat63mxsVJlzYvN51JmVXIgNoUokrIaT2zLclCXjRd8boZ0004U4KCs/sToJ75C6sdlByWxpYnb5Boif1VSFew=="
+    },
     "node_modules/tar": {
       "version": "6.1.15",
       "resolved": "https://registry.npmjs.org/tar/-/tar-6.1.15.tgz",
@@ -9603,6 +9834,14 @@
       "integrity": "sha512-w89qg7PI8wAdvX60bMDP+bFoD5Dvhm9oLheFp5O4a2QF0cSBGsBX4qZmadPMvVqlLJBBci+WqGGOAPvcDeNSVg==",
       "dev": true
     },
+    "node_modules/timezone-groups": {
+      "version": "0.8.0",
+      "resolved": "https://registry.npmjs.org/timezone-groups/-/timezone-groups-0.8.0.tgz",
+      "integrity": "sha512-t7E/9sPfCU0m0ZbS7Cqw52D6CB/UyeaiIBmyJCokI1SyOyOgA/ESiQ/fbreeFaUG9QSenGlZSSk/7rEbkipbOA==",
+      "bin": {
+        "timezone-groups": "dist/cli.cjs"
+      }
+    },
     "node_modules/tinybench": {
       "version": "2.5.0",
       "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-2.5.0.tgz",
@@ -10599,6 +10838,26 @@
       "integrity": "sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==",
       "dev": true
     },
+    "node_modules/xss": {
+      "version": "1.0.13",
+      "resolved": "https://registry.npmjs.org/xss/-/xss-1.0.13.tgz",
+      "integrity": "sha512-clu7dxTm1e8Mo5fz3n/oW3UCXBfV89xZ72jM8yzo1vR/pIS0w3sgB3XV2H8Vm6zfGnHL0FzvLJPJEBhd86/z4Q==",
+      "dependencies": {
+        "commander": "^2.20.3",
+        "cssfilter": "0.0.10"
+      },
+      "bin": {
+        "xss": "bin/xss"
+      },
+      "engines": {
+        "node": ">= 0.10.0"
+      }
+    },
+    "node_modules/xss/node_modules/commander": {
+      "version": "2.20.3",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
+      "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ=="
+    },
     "node_modules/y18n": {
       "version": "5.0.8",
       "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
@@ -10690,6 +10949,21 @@
         "@jridgewell/trace-mapping": "^0.3.9"
       }
     },
+    "@arcgis/core": {
+      "version": "4.28.10",
+      "resolved": "https://registry.npmjs.org/@arcgis/core/-/core-4.28.10.tgz",
+      "integrity": "sha512-FKvicMVDwFuKX8JKLqAfukzQU2F3AG7s3tDigTcIC4ApGRbj7Nc/F9dRfPZo+aY1Vl7Sa1FjYlo6tfV93LJ2Eg==",
+      "requires": {
+        "@esri/arcgis-html-sanitizer": "~3.0.1",
+        "@esri/calcite-colors": "~6.1.0",
+        "@esri/calcite-components": "^1.9.2",
+        "@popperjs/core": "~2.11.8",
+        "@zip.js/zip.js": "~2.7.29",
+        "focus-trap": "~7.5.3",
+        "luxon": "~3.4.3",
+        "sortablejs": "~1.15.0"
+      }
+    },
     "@babel/code-frame": {
       "version": "7.22.10",
       "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.22.10.tgz",
@@ -11275,6 +11549,72 @@
       "integrity": "sha512-P6omY1zv5MItm93kLM8s2vr1HICJH8v0dvddDhysbIuZ+vcjOHg5Zbkf1mTkcmi2JA9oBG2anOkRnW8WJTS8Og==",
       "dev": true
     },
+    "@esri/arcgis-html-sanitizer": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/@esri/arcgis-html-sanitizer/-/arcgis-html-sanitizer-3.0.1.tgz",
+      "integrity": "sha512-cwZJwsYCJZwtBQU2AmaiIVFg5nZcVwInPYja1/OgC9iKYO+ytZRoc5h+0S9/ygbFNoS8Nd0RX9A85stLX/BgiA==",
+      "requires": {
+        "xss": "1.0.13"
+      }
+    },
+    "@esri/calcite-colors": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/@esri/calcite-colors/-/calcite-colors-6.1.0.tgz",
+      "integrity": "sha512-wHQYWFtDa6c328EraXEVZvgOiaQyYr0yuaaZ0G3cB4C3lSkWefW34L/e5TLAhtuG3zJ/wR6pl5X1YYNfBc0/4Q=="
+    },
+    "@esri/calcite-components": {
+      "version": "1.11.0",
+      "resolved": "https://registry.npmjs.org/@esri/calcite-components/-/calcite-components-1.11.0.tgz",
+      "integrity": "sha512-H0ZqX3fEv4i0JCBEZ5SarPpd1KeXvqlEpLTtforfifIYbFAQOshP5fC2tFSL7j5pECyhBuB7rRhBiFeFejpRDw==",
+      "requires": {
+        "@floating-ui/dom": "1.5.3",
+        "@stencil/core": "2.22.3",
+        "@types/color": "3.0.5",
+        "color": "4.2.3",
+        "composed-offset-position": "0.0.4",
+        "dayjs": "1.11.10",
+        "focus-trap": "7.5.4",
+        "lodash-es": "4.17.21",
+        "sortablejs": "1.15.0",
+        "timezone-groups": "0.8.0"
+      },
+      "dependencies": {
+        "sortablejs": {
+          "version": "1.15.0",
+          "resolved": "https://registry.npmjs.org/sortablejs/-/sortablejs-1.15.0.tgz",
+          "integrity": "sha512-bv9qgVMjUMf89wAvM6AxVvS/4MX3sPeN0+agqShejLU5z5GX4C75ow1O2e5k4L6XItUyAK3gH6AxSbXrOM5e8w=="
+        }
+      }
+    },
+    "@floating-ui/core": {
+      "version": "1.5.3",
+      "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.5.3.tgz",
+      "integrity": "sha512-O0WKDOo0yhJuugCx6trZQj5jVJ9yR0ystG2JaNAemYUWce+pmM6WUEFIibnWyEJKdrDxhm75NoSRME35FNaM/Q==",
+      "requires": {
+        "@floating-ui/utils": "^0.2.0"
+      },
+      "dependencies": {
+        "@floating-ui/utils": {
+          "version": "0.2.1",
+          "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.1.tgz",
+          "integrity": "sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q=="
+        }
+      }
+    },
+    "@floating-ui/dom": {
+      "version": "1.5.3",
+      "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.5.3.tgz",
+      "integrity": "sha512-ClAbQnEqJAKCJOEbbLo5IUlZHkNszqhuxS4fHAVxRPXPya6Ysf2G8KypnYcOTpx6I8xcgF9bbHb6g/2KpbV8qA==",
+      "requires": {
+        "@floating-ui/core": "^1.4.2",
+        "@floating-ui/utils": "^0.1.3"
+      }
+    },
+    "@floating-ui/utils": {
+      "version": "0.1.6",
+      "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.1.6.tgz",
+      "integrity": "sha512-OfX7E2oUDYxtBvsuS4e/jSn4Q9Qb6DzgeYtsAdkPZ47znpoNsMgZw0+tVijiv3uGNR6dgNlty6r9rzIzHjtd/A=="
+    },
     "@fullcalendar/core": {
       "version": "6.1.8",
       "resolved": "https://registry.npmjs.org/@fullcalendar/core/-/core-6.1.8.tgz",
@@ -11533,6 +11873,11 @@
       "integrity": "sha512-XuySG1E38YScSJoMlqovLru4KTUNSjgVTIjyh7qMX6aNN5HY5Ct5LhRJdxO79JtTzKfzV/bnWpz+zquYrISsvw==",
       "dev": true
     },
+    "@popperjs/core": {
+      "version": "2.11.8",
+      "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz",
+      "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A=="
+    },
     "@quasar/extras": {
       "version": "1.16.5",
       "resolved": "https://registry.npmjs.org/@quasar/extras/-/extras-1.16.5.tgz",
@@ -11572,6 +11917,11 @@
       "integrity": "sha512-RNiOoTPkptFtSVzQevY/yWtZwf/RxyVnPy/OcA9HBM3MlGDnBEYL5B41H0MTn0Uec8Hi+2qUtTfG2WWZBmMejQ==",
       "dev": true
     },
+    "@stencil/core": {
+      "version": "2.22.3",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.22.3.tgz",
+      "integrity": "sha512-kmVA0M/HojwsfkeHsifvHVIYe4l5tin7J5+DLgtl8h6WWfiMClND5K3ifCXXI2ETDNKiEk21p6jql3Fx9o2rng=="
+    },
     "@tato30/vue-pdf": {
       "version": "1.7.2",
       "resolved": "https://registry.npmjs.org/@tato30/vue-pdf/-/vue-pdf-1.7.2.tgz",
@@ -11601,6 +11951,27 @@
         "@types/chai": "*"
       }
     },
+    "@types/color": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/@types/color/-/color-3.0.5.tgz",
+      "integrity": "sha512-T9yHCNtd8ap9L/r8KEESu5RDMLkoWXHo7dTureNoI1dbp25NsCN054vOu09iniIjR21MXUL+LU9bkIWrbyg8gg==",
+      "requires": {
+        "@types/color-convert": "*"
+      }
+    },
+    "@types/color-convert": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/@types/color-convert/-/color-convert-2.0.3.tgz",
+      "integrity": "sha512-2Q6wzrNiuEvYxVQqhh7sXM2mhIhvZR/Paq4FdsQkOMgWsCIkKvSGj8Le1/XalulrmgOzPMqNa0ix+ePY4hTrfg==",
+      "requires": {
+        "@types/color-name": "*"
+      }
+    },
+    "@types/color-name": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/@types/color-name/-/color-name-1.1.3.tgz",
+      "integrity": "sha512-87W6MJCKZYDhLAx/J1ikW8niMvmGRyY+rpUxWpL1cO7F8Uu5CHuQoFv+R0/L5pgNdW4jTyda42kv60uwVIPjLw=="
+    },
     "@types/jsdom": {
       "version": "20.0.1",
       "resolved": "https://registry.npmjs.org/@types/jsdom/-/jsdom-20.0.1.tgz",
@@ -12118,6 +12489,11 @@
         "date-fns-tz": "^1.3.7"
       }
     },
+    "@zip.js/zip.js": {
+      "version": "2.7.32",
+      "resolved": "https://registry.npmjs.org/@zip.js/zip.js/-/zip.js-2.7.32.tgz",
+      "integrity": "sha512-9Ox1meDIvIKE23LLA7Fxd/ewJpKjj2KryH92doHRqx2406LmIzorsiMawL0qIK7dvwN9K+mfk47lauoIE0o1zQ=="
+    },
     "abab": {
       "version": "2.0.6",
       "resolved": "https://registry.npmjs.org/abab/-/abab-2.0.6.tgz",
@@ -12253,6 +12629,11 @@
       "integrity": "sha512-lYe4Gx7QT+MKGbDsA+Z+he/Wtef0BiwDOlK/XkBrdfsh9J/jPPXbX0tE9x9cl27Tmu5gg3QUbUrQYa/y+KOHPQ==",
       "devOptional": true
     },
+    "arcgis-js-api": {
+      "version": "4.28.10",
+      "resolved": "https://registry.npmjs.org/arcgis-js-api/-/arcgis-js-api-4.28.10.tgz",
+      "integrity": "sha512-WGfTt8BZMATcbxBfU7KldeKzmEN15YZgi+7+sZ/3bSTczrVZBjlb0Jh/1fMwDvDnDQ06c1EW6dxtv0qPaS9rmA=="
+    },
     "arch": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/arch/-/arch-2.2.0.tgz",
@@ -12797,6 +13178,30 @@
         "wrap-ansi": "^7.0.0"
       }
     },
+    "color": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/color/-/color-4.2.3.tgz",
+      "integrity": "sha512-1rXeuUUiGGrykh+CeBdu5Ie7OJwinCgQY0bc7GCRxy5xVHy+moaqkpL/jqQq0MtQOeYcrqEz4abc5f0KtU7W4A==",
+      "requires": {
+        "color-convert": "^2.0.1",
+        "color-string": "^1.9.0"
+      },
+      "dependencies": {
+        "color-convert": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+          "requires": {
+            "color-name": "~1.1.4"
+          }
+        },
+        "color-name": {
+          "version": "1.1.4",
+          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
+        }
+      }
+    },
     "color-convert": {
       "version": "1.9.3",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
@@ -12809,8 +13214,16 @@
     "color-name": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-      "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==",
-      "dev": true
+      "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw=="
+    },
+    "color-string": {
+      "version": "1.9.1",
+      "resolved": "https://registry.npmjs.org/color-string/-/color-string-1.9.1.tgz",
+      "integrity": "sha512-shrVawQFojnZv6xM40anx4CkoDP+fZsw/ZerEMsW/pyzsRbElpsL/DBVW7q3ExxwusdNXI3lXpuhEZkzs8p5Eg==",
+      "requires": {
+        "color-name": "^1.0.0",
+        "simple-swizzle": "^0.2.2"
+      }
     },
     "color-support": {
       "version": "1.1.3",
@@ -12845,6 +13258,11 @@
       "integrity": "sha512-gk/Z852D2Wtb//0I+kRFNKKE9dIIVirjoqPoA1wJU+XePVXZfGeBpk45+A1rKO4Q43prqWBNY/MiIeRLbPWUaA==",
       "dev": true
     },
+    "composed-offset-position": {
+      "version": "0.0.4",
+      "resolved": "https://registry.npmjs.org/composed-offset-position/-/composed-offset-position-0.0.4.tgz",
+      "integrity": "sha512-vMlvu1RuNegVE0YsCDSV/X4X10j56mq7PCIyOKK74FxkXzGLwhOUmdkJLSdOBOMwWycobGUMgft2lp+YgTe8hw=="
+    },
     "concat-map": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
@@ -12918,6 +13336,11 @@
       "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==",
       "dev": true
     },
+    "cssfilter": {
+      "version": "0.0.10",
+      "resolved": "https://registry.npmjs.org/cssfilter/-/cssfilter-0.0.10.tgz",
+      "integrity": "sha512-FAaLDaplstoRsDR8XGYH51znUN0UY7nMc6Z9/fvE8EXGwvJE9hu7W2vHwx1+bd6gCYnln9nLbzxFTrcO9YQDZw=="
+    },
     "cssom": {
       "version": "0.5.0",
       "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.5.0.tgz",
@@ -13124,10 +13547,9 @@
       "requires": {}
     },
     "dayjs": {
-      "version": "1.11.9",
-      "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.9.tgz",
-      "integrity": "sha512-QvzAURSbQ0pKdIye2txOzNaHmxtUBXerpY0FJsFXUMKbIZeFm5ht1LS/jFsrncjnmtv8HsG0W2g6c0zUjZWmpA==",
-      "dev": true
+      "version": "1.11.10",
+      "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.10.tgz",
+      "integrity": "sha512-vjAczensTgRcqDERK0SR2XMwsF/tSvnvlv6VcF2GIhg6Sx4yOIt/irsr1RDJsKiIyBzJDpCoXiWWq28MqH2cnQ=="
     },
     "de-indent": {
       "version": "1.0.2",
@@ -13824,6 +14246,11 @@
         }
       }
     },
+    "esri-loader": {
+      "version": "3.7.0",
+      "resolved": "https://registry.npmjs.org/esri-loader/-/esri-loader-3.7.0.tgz",
+      "integrity": "sha512-cB1Sw9EQjtW4mtT7eFBjn/6VaaIWNTjmTd2asnnEyuZk1xVSFRMCfLZSBSjZM7ZarDcVu5WIjOP0t0MYVu4hVQ=="
+    },
     "estraverse": {
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-4.3.0.tgz",
@@ -14036,6 +14463,14 @@
       "integrity": "sha512-5nqDSxl8nn5BSNxyR3n4I6eDmbolI6WT+QqR547RwxQapgjQBmtktdP+HTBb/a/zLsbzERTONyUB5pefh5TtjQ==",
       "dev": true
     },
+    "focus-trap": {
+      "version": "7.5.4",
+      "resolved": "https://registry.npmjs.org/focus-trap/-/focus-trap-7.5.4.tgz",
+      "integrity": "sha512-N7kHdlgsO/v+iD/dMoJKtsSqs5Dz/dXZVebRgJw23LDk+jMi/974zyiOYDziY2JPp8xivq9BmUGwIJMiuSBi7w==",
+      "requires": {
+        "tabbable": "^6.2.0"
+      }
+    },
     "follow-redirects": {
       "version": "1.15.2",
       "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.2.tgz",
@@ -15158,6 +15593,11 @@
       "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
       "dev": true
     },
+    "lodash-es": {
+      "version": "4.17.21",
+      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
+      "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw=="
+    },
     "lodash.merge": {
       "version": "4.6.2",
       "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
@@ -15318,6 +15758,11 @@
         "yallist": "^3.0.2"
       }
     },
+    "luxon": {
+      "version": "3.4.4",
+      "resolved": "https://registry.npmjs.org/luxon/-/luxon-3.4.4.tgz",
+      "integrity": "sha512-zobTr7akeGHnv7eBOXcRgMeCP6+uyYsczwmeRCauvpvaAltgNyTbLH/+VaEAPUeWBT+1GuNmz4wC/6jtQzbbVA=="
+    },
     "magic-string": {
       "version": "0.30.3",
       "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.3.tgz",
@@ -17196,6 +17641,21 @@
         "simple-concat": "^1.0.0"
       }
     },
+    "simple-swizzle": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/simple-swizzle/-/simple-swizzle-0.2.2.tgz",
+      "integrity": "sha512-JA//kQgZtbuY83m+xT+tXJkmJncGMTFT+C+g2h2R9uxkYIrE2yy9sgmcLhCnw57/WSD+Eh3J97FPEDFnbXnDUg==",
+      "requires": {
+        "is-arrayish": "^0.3.1"
+      },
+      "dependencies": {
+        "is-arrayish": {
+          "version": "0.3.2",
+          "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.3.2.tgz",
+          "integrity": "sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ=="
+        }
+      }
+    },
     "slash": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
@@ -17266,6 +17726,11 @@
         "socks": "^2.6.2"
       }
     },
+    "sortablejs": {
+      "version": "1.15.2",
+      "resolved": "https://registry.npmjs.org/sortablejs/-/sortablejs-1.15.2.tgz",
+      "integrity": "sha512-FJF5jgdfvoKn1MAKSdGs33bIqLi3LmsgVTliuX6iITj834F+JRQZN90Z93yql8h0K2t0RwDPBmxwlbZfDcxNZA=="
+    },
     "source-map": {
       "version": "0.6.1",
       "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
@@ -17624,6 +18089,11 @@
       "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==",
       "dev": true
     },
+    "tabbable": {
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-6.2.0.tgz",
+      "integrity": "sha512-Cat63mxsVJlzYvN51JmVXIgNoUokrIaT2zLclCXjRd8boZ0004U4KCs/sToJ75C6sdlByWxpYnb5Boif1VSFew=="
+    },
     "tar": {
       "version": "6.1.15",
       "resolved": "https://registry.npmjs.org/tar/-/tar-6.1.15.tgz",
@@ -17672,6 +18142,11 @@
       "integrity": "sha512-w89qg7PI8wAdvX60bMDP+bFoD5Dvhm9oLheFp5O4a2QF0cSBGsBX4qZmadPMvVqlLJBBci+WqGGOAPvcDeNSVg==",
       "dev": true
     },
+    "timezone-groups": {
+      "version": "0.8.0",
+      "resolved": "https://registry.npmjs.org/timezone-groups/-/timezone-groups-0.8.0.tgz",
+      "integrity": "sha512-t7E/9sPfCU0m0ZbS7Cqw52D6CB/UyeaiIBmyJCokI1SyOyOgA/ESiQ/fbreeFaUG9QSenGlZSSk/7rEbkipbOA=="
+    },
     "tinybench": {
       "version": "2.5.0",
       "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-2.5.0.tgz",
@@ -18352,6 +18827,22 @@
       "integrity": "sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==",
       "dev": true
     },
+    "xss": {
+      "version": "1.0.13",
+      "resolved": "https://registry.npmjs.org/xss/-/xss-1.0.13.tgz",
+      "integrity": "sha512-clu7dxTm1e8Mo5fz3n/oW3UCXBfV89xZ72jM8yzo1vR/pIS0w3sgB3XV2H8Vm6zfGnHL0FzvLJPJEBhd86/z4Q==",
+      "requires": {
+        "commander": "^2.20.3",
+        "cssfilter": "0.0.10"
+      },
+      "dependencies": {
+        "commander": {
+          "version": "2.20.3",
+          "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
+          "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ=="
+        }
+      }
+    },
     "y18n": {
       "version": "5.0.8",
       "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
diff --git a/package.json b/package.json
index 15d197813..4964772b7 100644
--- a/package.json
+++ b/package.json
@@ -14,6 +14,7 @@
     "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore"
   },
   "dependencies": {
+    "@arcgis/core": "^4.28.10",
     "@fullcalendar/core": "^6.0.1",
     "@fullcalendar/daygrid": "^6.0.1",
     "@fullcalendar/interaction": "^6.0.2",
@@ -24,7 +25,9 @@
     "@quasar/extras": "^1.15.8",
     "@tato30/vue-pdf": "^1.5.1",
     "@vuepic/vue-datepicker": "^3.6.3",
+    "arcgis-js-api": "^4.28.10",
     "bma-org-chart": "^0.0.8",
+    "esri-loader": "^3.7.0",
     "keycloak-js": "^20.0.2",
     "moment": "^2.29.4",
     "pinia": "^2.0.29",
diff --git a/src/modules/09_leave/components/1_Work/DialogDetail.vue b/src/modules/09_leave/components/1_Work/DialogDetail.vue
index e425b81b2..093a6cd64 100644
--- a/src/modules/09_leave/components/1_Work/DialogDetail.vue
+++ b/src/modules/09_leave/components/1_Work/DialogDetail.vue
@@ -7,6 +7,9 @@ import { useQuasar } from "quasar";
 /** import Type*/
 import type { FormDetail } from "@/modules/09_leave/interface/response/work";
 
+/** importComponents*/
+import Map from "@/modules/09_leave/components/1_Work/DialogMap.vue";
+
 /** importStores */
 import { useCounterMixin } from "@/stores/mixin";
 import { useWorklistDataStore } from "@/modules/09_leave/stores/WorkStore";
@@ -122,6 +125,13 @@ function closePopup() {
   props.close ? props.close() : false;
 }
 
+const modalMap = ref<boolean>(false);
+const titleMap = ref<string>("");
+function onClickMap(title: string) {
+  titleMap.value = title;
+  modalMap.value = !modalMap.value;
+}
+
 watch(
   () => props.modal,
   () => {
@@ -222,6 +232,15 @@ watch(
                       {{ formData.checkInLocation }}
                       <div class="text-grey-6" v-if="formData.checkInLat">
                         ({{ formData.checkInLat }}, {{ formData.checkInLon }})
+                        <q-btn
+                          flat
+                          round
+                          dense
+                          color="primary"
+                          icon="map"
+                          @click="onClickMap('พิกัดสถานที่เข้างาน')"
+                          ><q-tooltip>พิกัดสถานที่เข้างาน</q-tooltip>
+                        </q-btn>
                       </div>
                     </div>
                   </div>
@@ -276,7 +295,16 @@ watch(
                     <div class="col">
                       {{ formData.checkOutLocation }}
                       <div class="text-grey-6" v-if="formData.checkOutLat">
-                        ({{ formData.checkOutLat }}, {{ formData.checkOutLon }})
+                        ({{ formData.checkOutLat }},
+                        {{ formData.checkOutLon }})<q-btn
+                          flat
+                          round
+                          dense
+                          color="primary"
+                          icon="map"
+                          @click="onClickMap('พิกัดสถานที่ออกงาน')"
+                          ><q-tooltip>พิกัดสถานที่ออกงาน</q-tooltip>
+                        </q-btn>
                       </div>
                     </div>
                   </div>
@@ -319,6 +347,13 @@ watch(
       </q-card-actions>
     </q-card>
   </q-dialog>
+
+  <Map
+    :modal="modalMap"
+    :title="titleMap"
+    :close="onClickMap"
+    :data="props.detail"
+  />
 </template>
 
 <style scoped></style>
diff --git a/src/modules/09_leave/components/1_Work/DialogMap.vue b/src/modules/09_leave/components/1_Work/DialogMap.vue
new file mode 100644
index 000000000..5ce23f2e2
--- /dev/null
+++ b/src/modules/09_leave/components/1_Work/DialogMap.vue
@@ -0,0 +1,123 @@
+<script setup lang="ts">
+import { ref, watch } from "vue";
+import { loadModules } from "esri-loader";
+
+const apiKey = ref<string>(
+  "AAPK4f700a4324d04e9f8a1a134e0771ac45FXWawdCl-OotFfr52gz9XKxTDJTpDzw_YYcwbmKDDyAJswf14FoPyw0qBkN64DvP"
+);
+const props = defineProps({
+  modal: {
+    type: Boolean,
+  },
+  title: {
+    type: String,
+  },
+  close: {
+    type: Function,
+  },
+  data: {
+    type: Object,
+  },
+});
+
+const isLoadMap = ref<boolean>(false);
+async function initializeMap(lat: number, long: number) {
+  isLoadMap.value = false;
+  try {
+    // Load modules of ArcGIS
+    const [esriConfig, Map, MapView, Point, Graphic] = await loadModules([
+      "esri/config",
+      "esri/Map",
+      "esri/views/MapView",
+      "esri/geometry/Point",
+      "esri/Graphic",
+    ]);
+    // Set apiKey
+    esriConfig.apiKey = apiKey.value;
+    const map = new Map({
+      basemap: "arcgis-topographic",
+    });
+
+    const point = new Point({
+      type: "point",
+      longitude: long,
+      latitude: lat,
+    });
+
+    const mapView = new MapView({
+      container: "mapViewDisplay",
+      map: map,
+      center: {
+        latitude: lat,
+        longitude: long,
+      }, // Set the initial map center current position
+      zoom: 16,
+      ui: {
+        components: [], // Empty array to remove all default UI components
+      },
+    });
+
+    // Pin icon
+    const pinSymbol = {
+      type: "picture-marker",
+      url: "http://maps.google.com/mapfiles/ms/icons/red.png",
+      width: "32px",
+      height: "32px",
+    };
+
+    // Create a graphic using the point and symbol
+    const pointGraphic = new Graphic({
+      geometry: point,
+      symbol: pinSymbol,
+    });
+    mapView.graphics.add(pointGraphic);
+    setTimeout(() => {
+      isLoadMap.value = true;
+    }, 1500);
+  } catch (error) {
+    console.error("Error loading the map", error);
+  }
+}
+
+watch(
+  () => props.modal,
+  () => {
+    const lat =
+      props.title === "พิกัดสถานที่เข้างาน"
+        ? props.data?.checkInLat
+        : props.data?.checkOutLat;
+    const long =
+      props.title === "พิกัดสถานที่เข้างาน"
+        ? props.data?.checkInLon
+        : props.data?.checkOutLon;
+
+    props.modal && initializeMap(lat, long);
+  }
+);
+</script>
+<template>
+  <q-dialog v-model="props.modal">
+    <q-card style="width: 950px; max-width: 80vw; height: auto">
+      <q-toolbar>
+        <q-toolbar-title class="text-subtitle1 text-weight-bold">
+          <span style="margin-right: 0"> {{ props.title }}</span>
+        </q-toolbar-title>
+        <q-btn
+          for="closeDialog"
+          icon="close"
+          unelevated
+          round
+          dense
+          @click="props.close"
+          style="color: #eb0505; background-color: #ffdede"
+        />
+      </q-toolbar>
+      <q-separator />
+      <q-card flat bordered>
+        <div id="mapViewDisplay" style="height: 45vh" v-show="isLoadMap"></div>
+        <q-skeleton height="45vh" square v-if="!isLoadMap" />
+      </q-card> </q-card
+  ></q-dialog>
+</template>
+
+<style scoped></style>