Merge branch 'dev' of https://git.codelfi.com/TelemedPro/hgh_admin into dev

fixes
fix
2024-06-08 05:50:07 +05:00 · 2024-06-08 05:42:42 +05:00 · 2024-06-08 04:20:24 +05:00 · 2024-06-08 03:54:45 +05:00 · 2024-06-07 20:14:42 +05:00 · 2024-06-07 20:14:35 +05:00
55 changed files with 8317 additions and 544 deletions
--- a/.eslintrc-auto-import.json
+++ b/.eslintrc-auto-import.json
@@ -352,6 +352,15 @@
    "watchThrottled": true,
    "watchTriggerable": true,
    "watchWithFilter": true,
-    "whenever": true
+    "whenever": true,
+    "validUSAPhone": true,
+    "requiredPhone": true,
+    "requiredFirstName": true,
+    "requiredLastName": true,
+    "requiredEmail": true,
+    "requiredExcelValidator": true,
+    "requiredImageValidator": true,
+    "requiredName": true,
+    "requiredAmountFloat": true
  }
 }
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -91,5 +91,7 @@
        "borderStyle": "solid"
      }
    ]
-  }
+  },
+  "editor.autoIndent": "advanced",
+  "editor.bracketPairColorization.independentColorPoolPerBracketType": true
 }
--- a/auto-imports.d.ts
+++ b/auto-imports.d.ts
@@ -121,6 +121,14 @@ declare global {
  const refWithControl: typeof import('@vueuse/core')['refWithControl']
  const regexValidator: typeof import('./resources/js/@core/utils/validators.js')['regexValidator']
  const registerPlugins: typeof import('./resources/js/@core/utils/plugins.js')['registerPlugins']
+  const requiredAmountFloat: typeof import('./resources/js/@core/utils/validators.js')['requiredAmountFloat']
+  const requiredEmail: typeof import('./resources/js/@core/utils/validators.js')['requiredEmail']
+  const requiredExcelValidator: typeof import('./resources/js/@core/utils/validators.js')['requiredExcelValidator']
+  const requiredFirstName: typeof import('./resources/js/@core/utils/validators.js')['requiredFirstName']
+  const requiredImageValidator: typeof import('./resources/js/@core/utils/validators.js')['requiredImageValidator']
+  const requiredLastName: typeof import('./resources/js/@core/utils/validators.js')['requiredLastName']
+  const requiredName: typeof import('./resources/js/@core/utils/validators.js')['requiredName']
+  const requiredPhone: typeof import('./resources/js/@core/utils/validators.js')['requiredPhone']
  const requiredValidator: typeof import('./resources/js/@core/utils/validators.js')['requiredValidator']
  const resolveComponent: typeof import('vue')['resolveComponent']
  const resolveRef: typeof import('@vueuse/core')['resolveRef']
@@ -331,6 +339,7 @@ declare global {
  const useWindowFocus: typeof import('@vueuse/core')['useWindowFocus']
  const useWindowScroll: typeof import('@vueuse/core')['useWindowScroll']
  const useWindowSize: typeof import('@vueuse/core')['useWindowSize']
+  const validUSAPhone: typeof import('./resources/js/@core/utils/validators.js')['validUSAPhone']
  const watch: typeof import('vue')['watch']
  const watchArray: typeof import('@vueuse/core')['watchArray']
  const watchAtMost: typeof import('@vueuse/core')['watchAtMost']
@@ -475,6 +484,14 @@ declare module 'vue' {
    readonly refWithControl: UnwrapRef<typeof import('@vueuse/core')['refWithControl']>
    readonly regexValidator: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['regexValidator']>
    readonly registerPlugins: UnwrapRef<typeof import('./resources/js/@core/utils/plugins.js')['registerPlugins']>
+    readonly requiredAmountFloat: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['requiredAmountFloat']>
+    readonly requiredEmail: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['requiredEmail']>
+    readonly requiredExcelValidator: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['requiredExcelValidator']>
+    readonly requiredFirstName: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['requiredFirstName']>
+    readonly requiredImageValidator: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['requiredImageValidator']>
+    readonly requiredLastName: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['requiredLastName']>
+    readonly requiredName: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['requiredName']>
+    readonly requiredPhone: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['requiredPhone']>
    readonly requiredValidator: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['requiredValidator']>
    readonly resolveComponent: UnwrapRef<typeof import('vue')['resolveComponent']>
    readonly resolveRef: UnwrapRef<typeof import('@vueuse/core')['resolveRef']>
@@ -685,6 +702,7 @@ declare module 'vue' {
    readonly useWindowFocus: UnwrapRef<typeof import('@vueuse/core')['useWindowFocus']>
    readonly useWindowScroll: UnwrapRef<typeof import('@vueuse/core')['useWindowScroll']>
    readonly useWindowSize: UnwrapRef<typeof import('@vueuse/core')['useWindowSize']>
+    readonly validUSAPhone: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['validUSAPhone']>
    readonly watch: UnwrapRef<typeof import('vue')['watch']>
    readonly watchArray: UnwrapRef<typeof import('@vueuse/core')['watchArray']>
    readonly watchAtMost: UnwrapRef<typeof import('@vueuse/core')['watchAtMost']>
@@ -822,6 +840,14 @@ declare module '@vue/runtime-core' {
    readonly refWithControl: UnwrapRef<typeof import('@vueuse/core')['refWithControl']>
    readonly regexValidator: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['regexValidator']>
    readonly registerPlugins: UnwrapRef<typeof import('./resources/js/@core/utils/plugins.js')['registerPlugins']>
+    readonly requiredAmountFloat: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['requiredAmountFloat']>
+    readonly requiredEmail: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['requiredEmail']>
+    readonly requiredExcelValidator: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['requiredExcelValidator']>
+    readonly requiredFirstName: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['requiredFirstName']>
+    readonly requiredImageValidator: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['requiredImageValidator']>
+    readonly requiredLastName: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['requiredLastName']>
+    readonly requiredName: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['requiredName']>
+    readonly requiredPhone: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['requiredPhone']>
    readonly requiredValidator: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['requiredValidator']>
    readonly resolveComponent: UnwrapRef<typeof import('vue')['resolveComponent']>
    readonly resolveRef: UnwrapRef<typeof import('@vueuse/core')['resolveRef']>
@@ -1032,6 +1058,7 @@ declare module '@vue/runtime-core' {
    readonly useWindowFocus: UnwrapRef<typeof import('@vueuse/core')['useWindowFocus']>
    readonly useWindowScroll: UnwrapRef<typeof import('@vueuse/core')['useWindowScroll']>
    readonly useWindowSize: UnwrapRef<typeof import('@vueuse/core')['useWindowSize']>
+    readonly validUSAPhone: UnwrapRef<typeof import('./resources/js/@core/utils/validators.js')['validUSAPhone']>
    readonly watch: UnwrapRef<typeof import('vue')['watch']>
    readonly watchArray: UnwrapRef<typeof import('@vueuse/core')['watchArray']>
    readonly watchAtMost: UnwrapRef<typeof import('@vueuse/core')['watchAtMost']>
--- a/package-lock.json
+++ b/package-lock.json
@@ -24,11 +24,15 @@
        "@vueuse/core": "^10.5.0",
        "@vueuse/math": "^10.5.0",
        "apexcharts": "3.37.0",
+        "axios": "^1.7.2",
+        "axios-mock-adapter": "^1.21.4",
+        "axois": "^0.0.1-security",
        "chart.js": "^4.4.0",
        "cookie-es": "^1.0.0",
        "eslint-import-resolver-custom-alias": "^1.3.2",
        "jwt-decode": "^4.0.0",
        "mapbox-gl": "3.0.1",
+        "moment": "^2.30.1",
        "ofetch": "^1.3.3",
        "pinia": "^2.1.7",
        "prismjs": "^1.29.0",
@@ -46,6 +50,7 @@
        "vue3-apexcharts": "^1.4.4",
        "vue3-perfect-scrollbar": "^1.6.1",
        "vuetify": "3.4.4",
+        "vuex": "^4.0.2",
        "webfontloader": "^1.6.28"
      },
      "devDependencies": {
@@ -981,7 +986,6 @@
      "cpu": [
        "ppc64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "aix"
@@ -997,7 +1001,6 @@
      "cpu": [
        "arm"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "android"
@@ -1013,7 +1016,6 @@
      "cpu": [
        "arm64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "android"
@@ -1029,7 +1031,6 @@
      "cpu": [
        "x64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "android"
@@ -1045,7 +1046,6 @@
      "cpu": [
        "arm64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "darwin"
@@ -1061,7 +1061,6 @@
      "cpu": [
        "x64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "darwin"
@@ -1077,7 +1076,6 @@
      "cpu": [
        "arm64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "freebsd"
@@ -1093,7 +1091,6 @@
      "cpu": [
        "x64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "freebsd"
@@ -1109,7 +1106,6 @@
      "cpu": [
        "arm"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "linux"
@@ -1125,7 +1121,6 @@
      "cpu": [
        "arm64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "linux"
@@ -1141,7 +1136,6 @@
      "cpu": [
        "ia32"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "linux"
@@ -1157,7 +1151,6 @@
      "cpu": [
        "loong64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "linux"
@@ -1173,7 +1166,6 @@
      "cpu": [
        "mips64el"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "linux"
@@ -1189,7 +1181,6 @@
      "cpu": [
        "ppc64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "linux"
@@ -1205,7 +1196,6 @@
      "cpu": [
        "riscv64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "linux"
@@ -1221,7 +1211,6 @@
      "cpu": [
        "s390x"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "linux"
@@ -1237,7 +1226,6 @@
      "cpu": [
        "x64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "linux"
@@ -1253,7 +1241,6 @@
      "cpu": [
        "x64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "netbsd"
@@ -1269,7 +1256,6 @@
      "cpu": [
        "x64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "openbsd"
@@ -1285,7 +1271,6 @@
      "cpu": [
        "x64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "sunos"
@@ -1301,7 +1286,6 @@
      "cpu": [
        "arm64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "win32"
@@ -1317,7 +1301,6 @@
      "cpu": [
        "ia32"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "win32"
@@ -1333,7 +1316,6 @@
      "cpu": [
        "x64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "win32"
@@ -2025,7 +2007,6 @@
      "cpu": [
        "arm"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "android"
@@ -2038,7 +2019,6 @@
      "cpu": [
        "arm64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "android"
@@ -2051,7 +2031,6 @@
      "cpu": [
        "arm64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "darwin"
@@ -2064,7 +2043,6 @@
      "cpu": [
        "x64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "darwin"
@@ -2077,7 +2055,6 @@
      "cpu": [
        "arm"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "linux"
@@ -2090,7 +2067,6 @@
      "cpu": [
        "arm"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "linux"
@@ -2103,7 +2079,6 @@
      "cpu": [
        "arm64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "linux"
@@ -2116,7 +2091,6 @@
      "cpu": [
        "arm64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "linux"
@@ -2129,7 +2103,6 @@
      "cpu": [
        "ppc64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "linux"
@@ -2142,7 +2115,6 @@
      "cpu": [
        "riscv64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "linux"
@@ -2155,7 +2127,6 @@
      "cpu": [
        "s390x"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "linux"
@@ -2168,7 +2139,6 @@
      "cpu": [
        "x64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "linux"
@@ -2181,7 +2151,6 @@
      "cpu": [
        "x64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "linux"
@@ -2194,7 +2163,6 @@
      "cpu": [
        "arm64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "win32"
@@ -2207,7 +2175,6 @@
      "cpu": [
        "ia32"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "win32"
@@ -2220,7 +2187,6 @@
      "cpu": [
        "x64"
      ],
-      "dev": true,
      "optional": true,
      "os": [
        "win32"
@@ -2808,7 +2774,7 @@
      "version": "20.12.12",
      "resolved": "https://registry.npmjs.org/@types/node/-/node-20.12.12.tgz",
      "integrity": "sha512-eWLDGF/FOSPtAvEqeRAQ4C8LSA7M1I7i0ky1I8U7kD1J5ITyW3AsRhQrKVoWf5pFKZ2kILsEGJhsI9r93PYnOw==",
-      "dev": true,
+      "devOptional": true,
      "dependencies": {
        "undici-types": "~5.26.4"
      }
@@ -3899,6 +3865,11 @@
        "node": ">=8"
      }
    },
+    "node_modules/asynckit": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+      "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="
+    },
    "node_modules/available-typed-arrays": {
      "version": "1.0.7",
      "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz",
@@ -3913,6 +3884,33 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
+    "node_modules/axios": {
+      "version": "1.7.2",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-1.7.2.tgz",
+      "integrity": "sha512-2A8QhOMrbomlDuiLeK9XibIBzuHeRcqqNOHp0Cyp5EoJ1IFDh+XZH3A6BkXtv0K4gFGCI0Y4BM7B1wOEi0Rmgw==",
+      "dependencies": {
+        "follow-redirects": "^1.15.6",
+        "form-data": "^4.0.0",
+        "proxy-from-env": "^1.1.0"
+      }
+    },
+    "node_modules/axios-mock-adapter": {
+      "version": "1.22.0",
+      "resolved": "https://registry.npmjs.org/axios-mock-adapter/-/axios-mock-adapter-1.22.0.tgz",
+      "integrity": "sha512-dmI0KbkyAhntUR05YY96qg2H6gg0XMl2+qTW0xmYg6Up+BFBAJYRLROMXRdDEL06/Wqwa0TJThAYvFtSFdRCZw==",
+      "dependencies": {
+        "fast-deep-equal": "^3.1.3",
+        "is-buffer": "^2.0.5"
+      },
+      "peerDependencies": {
+        "axios": ">= 0.17.0"
+      }
+    },
+    "node_modules/axois": {
+      "version": "0.0.1-security",
+      "resolved": "https://registry.npmjs.org/axois/-/axois-0.0.1-security.tgz",
+      "integrity": "sha512-8Nui4fwwyxHfjAfpDlg3Jt66EJA4i1D1eJch3D+wM/Oe+qhpyp7yfiszko/O5/adYu20wc37RG9/Eg8QIJHcvA=="
+    },
    "node_modules/babel-walk": {
      "version": "3.0.0-canary-5",
      "resolved": "https://registry.npmjs.org/babel-walk/-/babel-walk-3.0.0-canary-5.tgz",
@@ -4566,6 +4564,17 @@
      "resolved": "https://registry.npmjs.org/colord/-/colord-2.9.3.tgz",
      "integrity": "sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw=="
    },
+    "node_modules/combined-stream": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
+      "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
+      "dependencies": {
+        "delayed-stream": "~1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
    "node_modules/commander": {
      "version": "7.2.0",
      "resolved": "https://registry.npmjs.org/commander/-/commander-7.2.0.tgz",
@@ -5211,6 +5220,14 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
+    "node_modules/delayed-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+      "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
+      "engines": {
+        "node": ">=0.4.0"
+      }
+    },
    "node_modules/destr": {
      "version": "2.0.3",
      "resolved": "https://registry.npmjs.org/destr/-/destr-2.0.3.tgz",
@@ -6962,6 +6979,25 @@
      "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.3.1.tgz",
      "integrity": "sha512-X8cqMLLie7KsNUDSdzeN8FYK9rEt4Dt67OsG/DNGnYTSDBG4uFAJFBnUeiV+zCVAvwFy56IjM9sH51jVaEhNxw=="
    },
+    "node_modules/follow-redirects": {
+      "version": "1.15.6",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz",
+      "integrity": "sha512-wWN62YITEaOpSK584EZXJafH1AGpO8RVgElfkuXbTOrPX4fIfOyEpW/CsiNd8JdYrAoOvafRTOEnvsO++qCqFA==",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://github.com/sponsors/RubenVerborgh"
+        }
+      ],
+      "engines": {
+        "node": ">=4.0"
+      },
+      "peerDependenciesMeta": {
+        "debug": {
+          "optional": true
+        }
+      }
+    },
    "node_modules/for-each": {
      "version": "0.3.3",
      "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz",
@@ -6970,6 +7006,19 @@
        "is-callable": "^1.1.3"
      }
    },
+    "node_modules/form-data": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
+      "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
+      "dependencies": {
+        "asynckit": "^0.4.0",
+        "combined-stream": "^1.0.8",
+        "mime-types": "^2.1.12"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
    "node_modules/fs-extra": {
      "version": "11.2.0",
      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.2.0.tgz",
@@ -7523,7 +7572,7 @@
      "version": "4.3.6",
      "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.6.tgz",
      "integrity": "sha512-Ju0+lEMyzMVZarkTn/gqRpdqd5dOPaz1mCZ0SH3JV6iFw81PldE/PEB1hWVEA288HPt4WXW8O7AWxB10M+03QQ==",
-      "dev": true
+      "devOptional": true
    },
    "node_modules/import-fresh": {
      "version": "3.3.0",
@@ -7800,6 +7849,28 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
+    "node_modules/is-buffer": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-2.0.5.tgz",
+      "integrity": "sha512-i2R6zNFDwgEHJyQUtJEk0XFi1i0dPFn/oqjK3/vPCcDeJvW5NQ83V8QbicfF1SupOaB0h8ntgBC2YiE7dfyctQ==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "engines": {
+        "node": ">=4"
+      }
+    },
    "node_modules/is-builtin-module": {
      "version": "3.2.1",
      "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-3.2.1.tgz",
@@ -8914,6 +8985,25 @@
        "node": ">=8.6"
      }
    },
+    "node_modules/mime-db": {
+      "version": "1.52.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
+      "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/mime-types": {
+      "version": "2.1.35",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
+      "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
+      "dependencies": {
+        "mime-db": "1.52.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
    "node_modules/mimic-fn": {
      "version": "2.1.0",
      "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-2.1.0.tgz",
@@ -9041,6 +9131,14 @@
        "ufo": "^1.5.3"
      }
    },
+    "node_modules/moment": {
+      "version": "2.30.1",
+      "resolved": "https://registry.npmjs.org/moment/-/moment-2.30.1.tgz",
+      "integrity": "sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==",
+      "engines": {
+        "node": "*"
+      }
+    },
    "node_modules/mpd-parser": {
      "version": "1.3.0",
      "resolved": "https://registry.npmjs.org/mpd-parser/-/mpd-parser-1.3.0.tgz",
@@ -10773,6 +10871,11 @@
      "resolved": "https://registry.npmjs.org/protocol-buffers-schema/-/protocol-buffers-schema-3.6.0.tgz",
      "integrity": "sha512-TdDRD+/QNdrCGCE7v8340QyuXd4kIWIgapsE2+n/SaGiSSbomYl4TjHlvIoCWRpE7wFt02EpB35VVA2ImcBVqw=="
    },
+    "node_modules/proxy-from-env": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
+      "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="
+    },
    "node_modules/pug": {
      "version": "3.0.3",
      "resolved": "https://registry.npmjs.org/pug/-/pug-3.0.3.tgz",
@@ -11484,7 +11587,7 @@
      "version": "1.77.2",
      "resolved": "https://registry.npmjs.org/sass/-/sass-1.77.2.tgz",
      "integrity": "sha512-eb4GZt1C3avsX3heBNlrc7I09nyT00IUuo4eFhAbeXWU2fvA7oXI53SxODVAA+zgZCk9aunAZgO+losjR3fAwA==",
-      "dev": true,
+      "devOptional": true,
      "dependencies": {
        "chokidar": ">=3.0.0 <4.0.0",
        "immutable": "^4.0.0",
@@ -12747,7 +12850,7 @@
      "version": "5.26.5",
      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
      "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==",
-      "dev": true
+      "devOptional": true
    },
    "node_modules/unimport": {
      "version": "3.7.2",
@@ -13694,6 +13797,17 @@
        }
      }
    },
+    "node_modules/vuex": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/vuex/-/vuex-4.0.2.tgz",
+      "integrity": "sha512-M6r8uxELjZIK8kTKDGgZTYX/ahzblnzC4isU1tpmEuOIIKmV+TRdc+H4s8ds2NuZ7wpUTdGRzJRtoj+lI+pc0Q==",
+      "dependencies": {
+        "@vue/devtools-api": "^6.0.0-beta.11"
+      },
+      "peerDependencies": {
+        "vue": "^3.0.2"
+      }
+    },
    "node_modules/w3c-keyname": {
      "version": "2.2.8",
      "resolved": "https://registry.npmjs.org/w3c-keyname/-/w3c-keyname-2.2.8.tgz",
--- a/package.json
+++ b/package.json
@@ -27,11 +27,15 @@
    "@vueuse/core": "^10.5.0",
    "@vueuse/math": "^10.5.0",
    "apexcharts": "3.37.0",
+    "axios": "^1.7.2",
+    "axios-mock-adapter": "^1.21.4",
+    "axois": "^0.0.1-security",
    "chart.js": "^4.4.0",
    "cookie-es": "^1.0.0",
    "eslint-import-resolver-custom-alias": "^1.3.2",
    "jwt-decode": "^4.0.0",
    "mapbox-gl": "3.0.1",
+    "moment": "^2.30.1",
    "ofetch": "^1.3.3",
    "pinia": "^2.1.7",
    "prismjs": "^1.29.0",
@@ -49,6 +53,7 @@
    "vue3-apexcharts": "^1.4.4",
    "vue3-perfect-scrollbar": "^1.6.1",
    "vuetify": "3.4.4",
+    "vuex": "^4.0.2",
    "webfontloader": "^1.6.28"
  },
  "devDependencies": {
@@ -84,6 +89,7 @@
    "eslint-plugin-sonarjs": "^0.23.0",
    "eslint-plugin-unicorn": "^50.0.1",
    "eslint-plugin-vue": "^9.19.2",
+    "laravel-vite-plugin": "^1.0.0",
    "msw": "^1.3.2",
    "postcss-html": "^1.5.0",
    "postcss-scss": "^4.0.9",
@@ -103,8 +109,7 @@
    "vite-plugin-vue-layouts": "^0.10.0",
    "vite-plugin-vuetify": "2.0.1",
    "vite-svg-loader": "^5.1.0",
-    "vue-shepherd": "^3.0.0",
-    "laravel-vite-plugin": "^1.0.0"
+    "vue-shepherd": "^3.0.0"
  },
  "resolutions": {
    "postcss": "^8",
--- a/public/images/favicon.webp
+++ b/public/images/favicon.webp
--- a/resources/images/favicon.webp
+++ b/resources/images/favicon.webp
--- a/resources/images/logo-peptied-web.webp
+++ b/resources/images/logo-peptied-web.webp
--- a/resources/js/@core/utils/validators.js
+++ b/resources/js/@core/utils/validators.js
@@ -93,3 +93,80 @@ export const alphaDashValidator = value => {
  
  return /^[0-9A-Z_-]*$/i.test(valueAsString) || 'All Character are not valid'
 }
+export const validUSAPhone = value => {
+  if (isEmpty(value))
+    return true
+  const valueAsString = String(value)
+  
+  return /^\(\d{3}\)\s\d{3}-\d{4}$/i.test(valueAsString) || 'Phone are not valid'
+}
+export const requiredPhone = value => {
+  if (isNullOrUndefined(value) || isEmptyArray(value) || value === false)
+    return 'Phone is required'
+  
+  return !!String(value).trim().length || ' Phone  is required'
+}
+export const requiredFirstName = value => {
+  if (isNullOrUndefined(value) || isEmptyArray(value) || value === false)
+    return 'First Name field is required'
+  
+  return !!String(value).trim().length || 'Name is required'
+}
+export const requiredName = value => {
+if (isNullOrUndefined(value) || isEmptyArray(value) || value === false)
+  return 'Name field is required'
+
+return !!String(value).trim().length || 'Name is required'
+}
+export const requiredLastName = value => {
+if (isNullOrUndefined(value) || isEmptyArray(value) || value === false)
+  return 'Last Name field is required'
+
+return !!String(value).trim().length || ' Last Name is required'
+}
+export const requiredEmail = value => {
+  if (isNullOrUndefined(value) || isEmptyArray(value) || value === false)
+    return 'Email field is required'
+  
+  return !!String(value).trim().length || 'Email is required'
+}
+export const requiredImageValidator = value => {
+  if (isNullOrUndefined(value) || isEmptyArray(value) || value === false)
+    return 'Image field is required'
+  
+  return !!String(value).trim().length || 'Email is required'
+}
+export const requiredExcelValidator = value => {
+  if (isNullOrUndefined(value) || isEmptyArray(value) || value === false)
+    return 'Excel field is required'
+  
+  return !!String(value).trim().length || 'Email is required'
+}
+export const requiredAmountFloat = (value) => {
+  // Check if the value is null, undefined, an empty array, or false
+  if (isNullOrUndefined(value) || isEmptyArray(value) || value === false) {
+    return 'Amount field is required';
+  }
+
+  // Check if the value is a valid float number
+  if (!isFloat(value)) {
+    return 'Please enter a valid amount';
+  }
+
+  // Additional checks as needed...
+
+  // Return true if the value passes validation
+  return true;
+};
+
+
+
+
+// Check if a value is a valid float number
+const isFloat = (value) => {
+  if (typeof value !== 'number' && typeof value !== 'string') {
+    return false;
+  }
+  // Use regex to match a valid float number (including negatives and decimals)
+  return /^-?\d*\.?\d+$/.test(value);
+};
--- a/resources/js/@layouts/components/VerticalNav.vue
+++ b/resources/js/@layouts/components/VerticalNav.vue
@@ -1,15 +1,20 @@
 <script setup>
-import { PerfectScrollbar } from 'vue3-perfect-scrollbar'
-import { VNodeRenderer } from './VNodeRenderer'
 import { layoutConfig } from '@layouts'
 import {
-  VerticalNavGroup,
-  VerticalNavLink,
-  VerticalNavSectionTitle,
+VerticalNavGroup,
+VerticalNavLink,
+VerticalNavSectionTitle,
 } from '@layouts/components'
+import VerticalNavDropdown from '@layouts/components/VerticalNavDropdown.vue'
 import { useLayoutConfigStore } from '@layouts/stores/config'
 import { injectionKeyIsVerticalNavHovered } from '@layouts/symbols'
-
+import { PerfectScrollbar } from 'vue3-perfect-scrollbar'
+import { useStore } from 'vuex'
+import { VNodeRenderer } from './VNodeRenderer'
+const store = useStore();
+const router = useRouter()
+const ability = useAbility()
+const userData = useCookie('userData')
 const props = defineProps({
  tag: {
    type: null,
@@ -40,9 +45,10 @@ const configStore = useLayoutConfigStore()
 const resolveNavItemComponent = item => {
  if ('heading' in item)
    return VerticalNavSectionTitle
+  if ('children' in item && item.isDropdownButton)
+    return VerticalNavDropdown
  if ('children' in item)
    return VerticalNavGroup
-  
  return VerticalNavLink
 }

@@ -51,7 +57,26 @@ Close overlay vertical nav when link is clicked
 */
 const route = useRoute()

-watch(() => route.name, () => {
+watch(() => route.name, async () => {
+ 
+ 
+    await store.dispatch('checkLogin')
+    const isLoggedIn = await store.getters.getCheckLoginExpire
+    console.log('check login', isLoggedIn)
+
+    // Add additional logic or redirection based on login status if needed
+  if (isLoggedIn) {
+     await store.dispatch('updateCheckToken',false)
+      
+      // Redirect to login page or perform any other action
+      useCookie('accessToken').value = null
+       
+      localStorage.removeItem('admin_access_token');
+      useCookie('userAbilityRules').value = null
+        ability.update([])
+      router.push({ name: 'login' })
+    }
+  
  props.toggleIsOverlayNavActive(false)
 })

@@ -148,6 +173,7 @@ const hideTitleAndIcon = configStore.isVerticalNavMini(isHovered)

    <slot name="after-nav-items" />
  </Component>
+    
 </template>

 <style lang="scss" scoped>
@@ -243,4 +269,10 @@ const hideTitleAndIcon = configStore.isVerticalNavMini(isHovered)
    transition: transform 0.25s ease-in-out;
  }
 }
+.v-icon {
+  margin-right: 8px; /* Adds space between the icon and the text */
+}
+.list-item-reset a {
+    color: rgb(46,38,61) !important;
+}
 </style>
--- a/resources/js/@layouts/components/VerticalNavDropdown.vue
+++ b/resources/js/@layouts/components/VerticalNavDropdown.vue
@@ -0,0 +1,97 @@
+<template>
+  <li class="nav-item" :class="item.class?item.class:''">
+   
+<div class="demo-space-x">
+    <VMenu transition="scale-transition">
+      <template #activator="{ props }">
+        <Component
+          :is="itemIcon(item)"
+          v-if="!hideTitleAndIcon && item.icon"
+          :class="itemIconClass(item)"
+        />
+        <VBtn v-bind="props" block    variant="text"
+      color="rgb(46,38,61)">
+          <VIcon v-if="item.icon" :icon="item.icon.icon" class="mr-2" size="20"/>{{ item.title }}
+        </VBtn>
+      </template>
+
+      <VList class="list-reset">
+        <VListItem
+          v-for="(child, index) in item.children"
+          :key="index"
+          class="list-item-reset"
+        >
+        
+          <VerticalNavLink :item="child" :hideTitleAndIcon="hideTitleAndIcon"  />
+        </VListItem>
+      </VList>
+    </VMenu>
+</div>
+  </li>
+</template>
+
+
+<script setup>
+import VerticalNavLink from './VerticalNavLink.vue';
+
+const props = defineProps({
+  item: {
+    type: Object,
+    required: true,
+  },
+  hideTitleAndIcon: {
+    type: Boolean,
+    default: false,
+  },
+  hideMarker: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+const itemIcon = (item) => {
+  return item.icon.icon ? item.icon.icon  : ''
+}
+
+const itemIconClass = (item) => {
+  return item.icon ? item.icon.class : ''
+}
+</script>
+
+<style scoped>
+.nav-item {
+  list-style-type: none; /* Removes default list styling */
+  padding: 0; /* Removes default padding */
+}
+
+.list-reset {
+  list-style: none; /* Removes bullets or numbers from the list */
+  padding: 0; /* Removes default padding */
+  margin: 0; /* Removes default margin */
+}
+
+.list-item-reset {
+  list-style: none; /* Ensures each list item has no bullets or numbers */
+  padding: 0; /* Removes default padding */
+  margin: 0; /* Removes default margin */
+}
+
+.nav-item > .v-menu {
+  width: 100%; /* Ensures the menu takes the full width */
+}
+
+.v-btn {
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+}
+
+.bottom-end {
+    position: fixed;
+    width: 100%;
+    bottom: 20px;
+   padding-inline: 18px;
+
+}
+
+</style>
--- a/resources/js/App.vue
+++ b/resources/js/App.vue
@@ -1,13 +1,14 @@
 <script setup>
-import { useTheme } from 'vuetify'
 import ScrollToTop from '@core/components/ScrollToTop.vue'
 import initCore from '@core/initCore'
 import {
-  initConfigStore,
-  useConfigStore,
+initConfigStore,
+useConfigStore,
 } from '@core/stores/config'
 import { hexToRgb } from '@layouts/utils'
-
+import { useTheme } from 'vuetify'
+import { useStore } from 'vuex'
+const store = useStore()
 const { global } = useTheme()

 // ℹ️ Sync current theme with initial loader theme
@@ -18,6 +19,27 @@ const configStore = useConfigStore()
 </script>

 <template>
+  <VOverlay
+          v-model="store.getters.getIsLoading"
+          contained
+          persistent
+          scroll-strategy="none"
+          class="align-center justify-center"
+        >
+          <VProgressCircular indeterminate />
+        </VOverlay>
+        <VSnackbar v-model="store.getters.getSuccessMsg" :timeout="5000" location="top end" variant="flat"
+              color="success">
+              <VIcon
+                    class="ri-success-line success-icon"
+                  /> {{ store.getters.getShowMsg }}
+            </VSnackbar>
+            <VSnackbar v-model="store.getters.getErrorMsg" :timeout="5000" location="top end" variant="flat"
+              color="error">
+              <VIcon
+                    class="ri-success-line success-icon"
+                  /> {{ store.getters.getShowMsg }}
+            </VSnackbar>
  <VLocaleProvider :rtl="configStore.isAppRTL">
    <!-- ℹ️ This is required to set the background color of active nav link based on currently active global theme's primary -->
    <VApp :style="`--v-global-theme-primary: ${hexToRgb(global.current.value.colors.primary)}`">
--- a/resources/js/constants.js
+++ b/resources/js/constants.js
@@ -0,0 +1,55 @@
+export const GET_BASE_PATH = ""
+let MAIN_DOMAIN = "http://127.0.0.1:8000";
+//let MAIN_DOMAIN = "http://telemedpro.test";
+export const ADMIN_LOGIN_API = MAIN_DOMAIN + "/api/admin/login"
+
+export const PATIENT_FILTER_LIST_API =  MAIN_DOMAIN + "/api/admin/patient-list/"
+export const PATIENT_LIST_API =  MAIN_DOMAIN + "/api/admin/patient-list"
+export const PATIENT_INFO_API =  MAIN_DOMAIN + "/api/admin/patient/"
+export const PATIENT_MEETING_LIST_API =  MAIN_DOMAIN + "/api/admin/get-meeting-history/"
+export const PATIENT_UPDATE_API =  MAIN_DOMAIN + "/api/admin/patient-update/"
+export const PATIENT_DELETE_API =  MAIN_DOMAIN + "/api/admin/patient-delete/"
+
+
+export const PATIENT_LABKIT_LIST_API =  MAIN_DOMAIN + "/api/admin/patient-labkit-list/"
+export const PATIENT_LABKIT_STATUS_UPDATE_API =  MAIN_DOMAIN + "/api/admin/labkit-status-update/"
+export const PATIENT_PRESCRIPTION_STATUS_UPDATE_API =  MAIN_DOMAIN + "/api/admin/patient-prescription-status-update/"
+
+export const SUBCRIPTIONS_LIST_API =  MAIN_DOMAIN + "/api/plans/"
+
+
+export const PROVIDER_LIST_API =  MAIN_DOMAIN + "/api/admin/telemed-pro-list"
+export const PROVIDER_INFO_API =  MAIN_DOMAIN + "/api/admin/telemed-pro/"
+export const PROVIDER_UPDATE_API =  MAIN_DOMAIN + "/api/admin/telemed-pro-update/"
+export const PROVIDER_DELETE_API =  MAIN_DOMAIN + "/api/admin/telemed-pro-delete/"
+
+export const LABS_LIST_API =  MAIN_DOMAIN + "/api/admin/labs-list"
+export const LABS_INFO_API =  MAIN_DOMAIN + "/api/admin/labs/"
+export const LABS_UPDATE_API =  MAIN_DOMAIN + "/api/admin/labs-update/"
+export const LABS_DELETE_API =  MAIN_DOMAIN + "/api/admin/labs-delete/"
+
+export const MEETING_PRESCREPTIONS_API =  MAIN_DOMAIN + "/api/admin/get-patient-prescriptions/"
+export const MEETING_NOTES_API =  MAIN_DOMAIN + "/api/admin/get-note/"
+export const APPOINTMENT_DETAILS_API = MAIN_DOMAIN + "/api/admin/get-appointment/"
+
+
+export const MEDICINE_LIST_API = MAIN_DOMAIN + "/api/admin/get-med-list"
+export const MEDICINE_ADD_QUESTIONERIES_EXCEL_API = MAIN_DOMAIN + "/api/admin/questions-files"
+
+export const MEDICINE_SAVE_API = MAIN_DOMAIN + "/api/admin/save-med"
+export const MEDICINE_UPDATE_API = MAIN_DOMAIN + "/api/admin/update-med/"
+export const MEDICINE_DELETE_API = MAIN_DOMAIN + "/api/admin/delete-med/"
+export const PROVIDER_MEETING_LIST_API = MAIN_DOMAIN + "/api/admin/get-meeting-history-with-agent/"
+
+export const ADMIN_LOGIN_DETAIL = MAIN_DOMAIN + "/api/admin/admin-details"
+export const ADMIN_GET_SITE_SETTING = MAIN_DOMAIN + "/api/admin/site-settings"
+export const ADMIN_UPDATE_SITE_SETTING = MAIN_DOMAIN + "/api/admin/update-settings/"
+export const ADMIN_UPDATE_PASSWORD = MAIN_DOMAIN + "/api/admin/password-update"
+export const PROFILE_UPDATE_API = MAIN_DOMAIN + "/api/admin/admin-update-profile"
+
+export const ADMIN_LAB_KIT_LIST_API = MAIN_DOMAIN + "/api/admin/labkit-list"
+export const ADMIN_LAB_KIT_UPDATE_API = MAIN_DOMAIN + "/api/admin/labkit-update/"
+export const ADMIN_LAB_KIT_ADD_API = MAIN_DOMAIN + "/api/admin/labkit-list-create"
+export const ADMIN_LAB_KIT_DELETE_API = MAIN_DOMAIN + "/api/admin/labkit-delete/"
+
+export const ADMIN_PATIENT_DETAIL_API = MAIN_DOMAIN + "/api/admin/patient-full-detail/"
--- a/resources/js/layouts/components/DefaultLayoutWithHorizontalNav.vue
+++ b/resources/js/layouts/components/DefaultLayoutWithHorizontalNav.vue
@@ -4,12 +4,12 @@ import { themeConfig } from '@themeConfig'

 // Components
 import Footer from '@/layouts/components/Footer.vue'
-import NavBarNotifications from '@/layouts/components/NavBarNotifications.vue'
-import NavSearchBar from '@/layouts/components/NavSearchBar.vue'
-import NavbarShortcuts from '@/layouts/components/NavbarShortcuts.vue'
+// import NavBarNotifications from '@/layouts/components/NavBarNotifications.vue'
+// import NavSearchBar from '@/layouts/components/NavSearchBar.vue'
+// import NavbarShortcuts from '@/layouts/components/NavbarShortcuts.vue'
 import NavbarThemeSwitcher from '@/layouts/components/NavbarThemeSwitcher.vue'
 import UserProfile from '@/layouts/components/UserProfile.vue'
-import NavBarI18n from '@core/components/I18n.vue'
+// import NavBarI18n from '@core/components/I18n.vue'
 import { HorizontalNavLayout } from '@layouts'
 import { VNodeRenderer } from '@layouts/components/VNodeRenderer'

@@ -45,16 +45,16 @@ watch([
      </RouterLink>
      <VSpacer />

-      <NavSearchBar />
+      <!-- <NavSearchBar /> -->

-      <NavBarI18n
+      <!-- <NavBarI18n
        v-if="themeConfig.app.i18n.enable && themeConfig.app.i18n.langConfig?.length"
        :languages="themeConfig.app.i18n.langConfig"
-      />
+      /> -->

      <NavbarThemeSwitcher />
-      <NavbarShortcuts />
-      <NavBarNotifications class="me-2" />
+      <!-- <NavbarShortcuts /> -->
+      <!-- <NavBarNotifications class="me-2" /> -->
      <UserProfile />
    </template>

@@ -77,6 +77,6 @@ watch([
    </template>

    <!-- 👉 Customizer -->
-    <TheCustomizer />
+    <!-- <TheCustomizer /> -->
  </HorizontalNavLayout>
 </template>
--- a/resources/js/layouts/components/DefaultLayoutWithVerticalNav.vue
+++ b/resources/js/layouts/components/DefaultLayoutWithVerticalNav.vue
@@ -1,18 +1,18 @@
 <script setup>
-import navItems from '@/navigation/vertical'
-import { themeConfig } from '@themeConfig'
-
+import navItems from '@/navigation/vertical';
+import { useStore } from 'vuex';
+const store = useStore()
 // Components
-import Footer from '@/layouts/components/Footer.vue'
-import NavBarNotifications from '@/layouts/components/NavBarNotifications.vue'
-import NavSearchBar from '@/layouts/components/NavSearchBar.vue'
-import NavbarShortcuts from '@/layouts/components/NavbarShortcuts.vue'
-import NavbarThemeSwitcher from '@/layouts/components/NavbarThemeSwitcher.vue'
-import UserProfile from '@/layouts/components/UserProfile.vue'
-import NavBarI18n from '@core/components/I18n.vue'
+import Footer from '@/layouts/components/Footer.vue';
+// import NavBarNotifications from '@/layouts/components/NavBarNotifications.vue';
+// import NavSearchBar from '@/layouts/components/NavSearchBar.vue';
+// import NavbarShortcuts from '@/layouts/components/NavbarShortcuts.vue';
+import NavbarThemeSwitcher from '@/layouts/components/NavbarThemeSwitcher.vue';
+import UserProfile from '@/layouts/components/UserProfile.vue';
+// import NavBarI18n from '@core/components/I18n.vue';

 // @layouts plugin
-import { VerticalNavLayout } from '@layouts'
+import { VerticalNavLayout } from '@layouts';

 // SECTION: Loading Indicator
 const isFallbackStateActive = ref(false)
@@ -31,6 +31,7 @@ watch([
 </script>

 <template>
+  
  <VerticalNavLayout :nav-items="navItems">
    <!-- 👉 navbar -->
    <template #navbar="{ toggleVerticalOverlayNavActive }">
@@ -43,17 +44,17 @@ watch([
          <VIcon icon="ri-menu-line" />
        </IconBtn>

-        <NavSearchBar class="ms-lg-n2" />
+        <!-- <NavSearchBar class="ms-lg-n2" /> -->

        <VSpacer />

-        <NavBarI18n
+        <!-- <NavBarI18n
          v-if="themeConfig.app.i18n.enable && themeConfig.app.i18n.langConfig?.length"
          :languages="themeConfig.app.i18n.langConfig"
-        />
+        /> -->
        <NavbarThemeSwitcher />
-        <NavbarShortcuts />
-        <NavBarNotifications class="me-2" />
+        <!-- <NavbarShortcuts /> -->
+        <!-- <NavBarNotifications class="me-2" /> -->
        <UserProfile />
      </div>
    </template>
@@ -77,6 +78,6 @@ watch([
    </template>

    <!-- 👉 Customizer -->
-    <TheCustomizer />
+    <!-- <TheCustomizer /> -->
  </VerticalNavLayout>
 </template>
--- a/resources/js/layouts/components/Footer.vue
+++ b/resources/js/layouts/components/Footer.vue
@@ -2,10 +2,10 @@
  <div class="h-100 d-flex align-center justify-space-between text-medium-emphasis">
    <!-- 👉 Footer: left content -->
    <span class="d-flex align-center">
-      &copy;
+      &copy; Copyright
      {{ new Date().getFullYear() }}
-      Made With
-      <VIcon
+      , All Rights Reserved.
+      <!-- <VIcon
        icon="ri-heart-line"
        color="error"
        size="1.25rem"
@@ -16,10 +16,10 @@
        target="_blank"
        rel="noopener noreferrer"
        class="text-primary ms-1"
-      >ThemeSelection</a>
+      >ThemeSelection</a> -->
    </span>
    <!-- 👉 Footer: right content -->
-    <span class="d-md-flex gap-x-4 text-primary d-none">
+    <!-- <span class="d-md-flex gap-x-4 text-primary d-none">
      <a
        href="https://themeselection.com/license/"
        target="noopener noreferrer"
@@ -32,6 +32,6 @@
        href="https://demos.themeselection.com/materio-vuetify-vuejs-admin-template/documentation/guide/laravel-integration/folder-structure.html"
        target="noopener noreferrer"
      >Documentation</a>
-    </span>
+    </span> -->
  </div>
 </template>
--- a/resources/js/layouts/components/NavSearchBar.vue
+++ b/resources/js/layouts/components/NavSearchBar.vue
@@ -1,7 +1,7 @@
 <script setup>
-import Shepherd from 'shepherd.js'
-import { withQuery } from 'ufo'
-import { useConfigStore } from '@core/stores/config'
+import { useConfigStore } from '@core/stores/config';
+import Shepherd from 'shepherd.js';
+import { withQuery } from 'ufo';

 defineOptions({
  // 👉 Is App Search Bar Visible
@@ -133,11 +133,11 @@ const noDataSuggestions = [
      params: { tab: 'account' },
    },
  },
-  {
-    title: 'Pricing Page',
-    icon: 'ri-cash-line',
-    url: { name: 'pages-pricing' },
-  },
+  // {
+  //   title: 'Pricing Page',
+  //   icon: 'ri-cash-line',
+  //   url: { name: 'pages-pricing' },
+  // },
 ]

 const searchQuery = ref('')
--- a/resources/js/layouts/components/UserProfile.vue
+++ b/resources/js/layouts/components/UserProfile.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { PerfectScrollbar } from 'vue3-perfect-scrollbar'
+import { PerfectScrollbar } from 'vue3-perfect-scrollbar';

 const router = useRouter()
 const ability = useAbility()
@@ -11,6 +11,7 @@ const logout = async () => {

  // Remove "accessToken" from cookie
  useCookie('accessToken').value = null
+  localStorage.removeItem('admin_access_token');

  // Remove "userData" from cookie
  userData.value = null
@@ -29,15 +30,15 @@ const logout = async () => {

 const userProfileList = [
  { type: 'divider' },
-  {
-    type: 'navItem',
-    icon: 'ri-user-line',
-    title: 'Profile',
-    to: {
-      name: 'apps-user-view-id',
-      params: { id: 21 },
-    },
-  },
+  // {
+  //   type: 'navItem',
+  //   icon: 'ri-user-line',
+  //   title: 'Profile',
+  //   to: {
+  //     name: 'apps-user-view-id',
+  //     params: { id: 21 },
+  //   },
+  // },
  {
    type: 'navItem',
    icon: 'ri-settings-4-line',
@@ -47,32 +48,32 @@ const userProfileList = [
      params: { tab: 'account' },
    },
  },
-  {
-    type: 'navItem',
-    icon: 'ri-file-text-line',
-    title: 'Billing Plan',
-    to: {
-      name: 'pages-account-settings-tab',
-      params: { tab: 'billing-plans' },
-    },
-    badgeProps: {
-      color: 'error',
-      content: '4',
-    },
-  },
-  { type: 'divider' },
-  {
-    type: 'navItem',
-    icon: 'ri-money-dollar-circle-line',
-    title: 'Pricing',
-    to: { name: 'pages-pricing' },
-  },
-  {
-    type: 'navItem',
-    icon: 'ri-question-line',
-    title: 'FAQ',
-    to: { name: 'pages-faq' },
-  },
+  // {
+  //   type: 'navItem',
+  //   icon: 'ri-file-text-line',
+  //   title: 'Billing Plan',
+  //   to: {
+  //     name: 'pages-account-settings-tab',
+  //     params: { tab: 'billing-plans' },
+  //   },
+  //   badgeProps: {
+  //     color: 'error',
+  //     content: '5',
+  //   },
+  // },
+  // { type: 'divider' },
+  // {
+  //   type: 'navItem',
+  //   icon: 'ri-money-dollar-circle-line',
+  //   title: 'Pricing',
+  //   to: { name: 'pages-pricing' },
+  // },
+  // {
+  //   type: 'navItem',
+  //   icon: 'ri-question-line',
+  //   title: 'FAQ',
+  //   to: { name: 'pages-faq' },
+  // },
  { type: 'divider' },
 ]
 </script>
--- a/resources/js/main.js
+++ b/resources/js/main.js
@@ -1,14 +1,15 @@
-import { createApp } from 'vue'
 import App from '@/App.vue'
 import { registerPlugins } from '@core/utils/plugins'
+import { createApp } from 'vue'

 // Styles
 import '@core-scss/template/index.scss'
 import '@styles/styles.scss'
+import store from './store'

 // Create vue app
 const app = createApp(App)
-
+app.use(store)

 // Register plugins
 registerPlugins(app)
--- a/resources/js/navigation/vertical/dashboard.js
+++ b/resources/js/navigation/vertical/dashboard.js
@@ -1,61 +1,122 @@
+
 export default [
  {
-    title: 'Dashboards',
+    title: 'Dashboard',
    icon: { icon: 'ri-home-smile-line' },
-    children: [
-      {
-        title: 'CRM',
-        to: 'dashboards-crm',
-      },
-      {
-        title: 'Analytics',
-        to: 'dashboards-analytics',
-      },
-      {
-        title: 'eCommerce',
-        to: 'dashboards-ecommerce',
-      },
-      {
-        title: 'Academy',
-        to: 'dashboards-academy',
-      },
-      {
-        title: 'Logistics',
-        to: 'dashboards-logistics',
-      },
-    ],
-    badgeContent: '5',
-    badgeClass: 'bg-error',
+    to: 'admin-dashboard',
+    // children: [
+    //   {
+    //     title: 'CRM',
+    //     to: 'dashboards-crm',
+    //   },
+    //   {
+    //     title: 'Analytics',
+    //     to: 'dashboards-analytics',
+    //   },
+    //   {
+    //     title: 'eCommerce',
+    //     to: 'dashboards-ecommerce',
+    //   },
+    //   {
+    //     title: 'Academy',
+    //     to: 'dashboards-academy',
+    //   },
+    //   {
+    //     title: 'Logistics',
+    //     to: 'dashboards-logistics',
+    //   },
+    // ],
+    // badgeContent: '5',
+    // badgeClass: 'bg-error',
  },
  {
-    title: 'Front Pages',
-    icon: { icon: 'ri-file-copy-line' },
+    title: 'Patients',
+    icon: { icon: 'ri-user-line' },
+    to: 'admin-patients',
+  },
+
+  {
+    title: 'Providers',
+    icon: { icon: 'ri-stethoscope-line' },
+    to: 'admin-providers',
+  },
+  {
+    title: 'Lab Kites',
+    icon: { icon: 'ri-test-tube-line' },
+    to: 'admin-lab-kites',
+  },
+  
+  {
+    title: 'Medicines',
+    icon: { icon: 'ri-medicine-bottle-line' },
+    to: 'admin-medicines',
+  },
+
+{
+    title: 'Settings',
+    icon: { icon: 'ri-settings-4-line' },
+    class: 'bottom-end',
+    isDropdownButton: true,
    children: [
      {
-        title: 'Landing',
-        to: 'front-pages-landing-page',
-        target: '_blank',
+        title: 'Profile',
+        to: 'admin-profile',
+        icon: {
+        icon: 'ri-group-line',
+        },
+     
+        
      },
      {
-        title: 'Pricing',
-        to: 'front-pages-pricing',
-        target: '_blank',
+        title: 'Security',
+        to: 'admin-change-password',
+        icon: {
+        icon: 'ri-shield-keyhole-line',
+      },
      },
      {
-        title: 'Payment',
-        to: 'front-pages-payment',
-        target: '_blank',
+        title: 'Site Setting',
+        to: 'admin-site-setting',
+        icon: {
+        icon: 'ri-settings-4-line',
      },
-      {
-        title: 'Checkout',
-        to: 'front-pages-checkout',
-        target: '_blank',
      },
-      {
-        title: 'Help Center',
-        to: 'front-pages-help-center',
-        target: '_blank',
-      },
-    ],
-  },
+    ]  
+    
+  }
+  
+   
+  // {
+  //   title: 'Front Pages',
+  //   icon: { icon: 'ri-file-copy-line' },
+  //   children: [
+  //     {
+  //       title: 'Landing',
+  //       to: 'front-pages-landing-page',
+  //       target: '_blank',
+  //     },
+  //     {
+  //       title: 'Pricing',
+  //       to: 'front-pages-pricing',
+  //       target: '_blank',
+  //     },
+  //     {
+  //       title: 'Payment',
+  //       to: 'front-pages-payment',
+  //       target: '_blank',
+  //     },
+  //     {
+  //       title: 'Checkout',
+  //       to: 'front-pages-checkout',
+  //       target: '_blank',
+  //     },
+  //     {
+  //       title: 'Help Center',
+  //       to: 'front-pages-help-center',
+  //       target: '_blank',
+  //     },
+  //   ],
+  // },
 ]
+
+
--- a/resources/js/navigation/vertical/index.js
+++ b/resources/js/navigation/vertical/index.js
@@ -1,8 +1,8 @@
-import appsAndPages from './apps-and-pages'
-import charts from './charts'
+// import appsAndPages from './apps-and-pages'
+// import charts from './charts'
 import dashboard from './dashboard'
-import forms from './forms'
-import others from './others'
-import uiElements from './ui-elements'
+// import forms from './forms'
+// import others from './others'
+// import uiElements from './ui-elements'

-export default [...dashboard, ...appsAndPages, ...uiElements, ...forms, ...charts, ...others]
+export default [...dashboard]
--- a/resources/js/pages/apps/logistics/dashboard.vue
+++ b/resources/js/pages/apps/logistics/dashboard.vue
@@ -1,55 +1,131 @@
 <script setup>
-import LogisticsCardStatistics from '@/views/apps/logistics/LogisticsCardStatistics.vue'
-import LogisticsDeliveryExpectations from '@/views/apps/logistics/LogisticsDeliveryExpectations.vue'
-import LogisticsDeliveryPerformance from '@/views/apps/logistics/LogisticsDeliveryPerformance.vue'
-import LogisticsOrderByCountries from '@/views/apps/logistics/LogisticsOrderByCountries.vue'
-import LogisticsOverviewTable from '@/views/apps/logistics/LogisticsOverviewTable.vue'
-import LogisticsShipmentStatistics from '@/views/apps/logistics/LogisticsShipmentStatistics.vue'
-import LogisticsVehicleOverview from '@/views/apps/logistics/LogisticsVehicleOverview.vue'
+import AnalyticsAward from '@/views/dashboards/analytics/AnalyticsAward.vue'
+import AnalyticsDepositWithdraw from '@/views/dashboards/analytics/AnalyticsDepositWithdraw.vue'
+import AnalyticsPerformance from '@/views/dashboards/analytics/AnalyticsPerformance.vue'
+import AnalyticsSalesByCountries from '@/views/dashboards/analytics/AnalyticsSalesByCountries.vue'
+import AnalyticsSessionBarCharts from '@/views/dashboards/analytics/AnalyticsSessionsBarCharts.vue'
+import AnalyticsTotalEarning from '@/views/dashboards/analytics/AnalyticsTotalEarning.vue'
+import AnalyticsTotalProfit from '@/views/dashboards/analytics/AnalyticsTotalProfit.vue'
+import AnalyticsTransactions from '@/views/dashboards/analytics/AnalyticsTransactions.vue'
+import AnalyticsUserTable from '@/views/dashboards/analytics/AnalyticsUserTable.vue'
+import AnalyticsWeeklyOverview from '@/views/dashboards/analytics/AnalyticsWeeklyOverview.vue'
+
+const totalProfit = {
+  title: 'Total Profit',
+  color: 'secondary',
+  icon: 'ri-pie-chart-2-line',
+  stats: '$25.6k',
+  change: 42,
+  subtitle: 'Weekly Project',
+}
+
+const newProject = {
+  title: 'New Project',
+  color: 'primary',
+  icon: 'ri-file-word-2-line',
+  stats: '862',
+  change: -18,
+  subtitle: 'Yearly Project',
+}
 </script>

 <template>
  <VRow class="match-height">
-    <VCol cols="12">
-      <LogisticsCardStatistics />
-    </VCol>
    <VCol
      cols="12"
-      md="6"
+      md="4"
    >
-      <LogisticsVehicleOverview />
+      <AnalyticsAward />
    </VCol>

    <VCol
      cols="12"
-      md="6"
+      md="8"
    >
-      <LogisticsShipmentStatistics />
+      <AnalyticsTransactions />
+    </VCol>
+
+    <VCol
+      cols="12"
+      md="4"
+      sm="6"
+    >
+      <AnalyticsWeeklyOverview />
+    </VCol>
+
+    <VCol
+      cols="12"
+      md="4"
+      sm="6"
+    >
+      <AnalyticsTotalEarning />
    </VCol>

    <VCol
      cols="12"
      md="4"
    >
-      <LogisticsDeliveryPerformance />
+      <VRow class="match-height">
+        <VCol
+          cols="12"
+          sm="6"
+        >
+          <AnalyticsTotalProfit />
+        </VCol>
+
+        <VCol
+          cols="12"
+          sm="6"
+        >
+          <CardStatisticsVertical v-bind="totalProfit" />
+        </VCol>
+
+        <VCol
+          cols="12"
+          sm="6"
+        >
+          <CardStatisticsVertical v-bind="newProject" />
+        </VCol>
+
+        <VCol
+          cols="12"
+          sm="6"
+        >
+          <AnalyticsSessionBarCharts />
+        </VCol>
+      </VRow>
    </VCol>

    <VCol
      cols="12"
      md="4"
    >
-      <LogisticsDeliveryExpectations />
+      <AnalyticsPerformance />
+    </VCol>
+
+    <VCol
+      cols="12"
+      md="8"
+    >
+      <AnalyticsDepositWithdraw />
    </VCol>

    <VCol
      cols="12"
      md="4"
    >
-      <LogisticsOrderByCountries />
+      <AnalyticsSalesByCountries />
    </VCol>

-    <VCol cols="12">
-      <LogisticsOverviewTable />
+    <VCol
+      cols="12"
+      md="8"
+    >
+      <AnalyticsUserTable />
    </VCol>
  </VRow>
 </template>
+
+<style lang="scss">
+@use "@core-scss/template/libs/apex-chart.scss";
+</style>
--- a/resources/js/pages/dashboards/crm.vue
+++ b/resources/js/pages/dashboards/crm.vue
@@ -11,34 +11,54 @@ import CrmUpgradeYourPlan from '@/views/dashboards/crm/CrmUpgradeYourPlan.vue'
 import CrmWeeklySales from '@/views/dashboards/crm/CrmWeeklySales.vue'
 import illustration1 from '@images/cards/illustration-1.png'
 import illustration2 from '@images/cards/illustration-2.png'
-
+import { useStore } from 'vuex'
+const store = useStore()
 const cardStatisticsWithImages = [
  {
-    title: 'Ratings',
+    title: 'Total Meetings',
    subtitle: 'Year of 2021',
    stats: '13k',
    change: 15.6,
-    image: illustration1,
+    // image: illustration1,
    color: 'primary',
  },
  {
-    title: 'Sessions',
+    title: 'Orders',
+    subtitle: 'Year of 2021',
+    stats: '13k',
+    change: 15.6,
+    // image: illustration1,
+    color: 'primary',
+  },
+  {
+    title: 'New Patients',
+    subtitle: 'Year of 2021',
+    stats: '13k',
+    change: 15.6,
+    // image: illustration1,
+    color: 'primary',
+  },
+  {
+    title: 'New Providers',
    subtitle: 'Last Week',
    stats: '24.5k',
    change: -20,
-    image: illustration2,
+    // image: illustration2,
    color: 'secondary',
  },
 ]

-const statistic = {
-  title: 'New Project',
-  color: 'primary',
-  icon: 'ri-file-word-2-line',
-  stats: '862',
-  change: -18,
-  subtitle: 'Yearly Project',
-}
+// const statistic = {
+//   title: 'New Project',
+//   color: 'primary',
+//   icon: 'ri-file-word-2-line',
+//   stats: '862',
+//   change: -18,
+//   subtitle: 'Yearly Project'
+// }
+// onMounted(() => {
+//   store.dispatch('updateIsLoading', false)
+// })
 </script>

 <template>
@@ -51,97 +71,32 @@ const statistic = {
        cols="12"
        md="3"
        sm="6"
+      
      >
        <CardStatisticsWithImages v-bind="statistics" />
      </VCol>
-
-      <VCol
-        cols="12"
-        md="6"
-      >
-        <CrmTransactions />
-      </VCol>
-
-      <VCol
-        cols="12"
-        sm="6"
-        md="3"
-      >
-        <CrmTotalSales />
-      </VCol>
-
-      <VCol
-        cols="12"
-        sm="6"
-        md="3"
-      >
-        <CrmRevenueReport />
-      </VCol>
-
-      <VCol
-        cols="12"
-        md="6"
-      >
-        <CrmSalesOverview />
-      </VCol>
-
-      <VCol
-        cols="12"
-        md="6"
-      >
-        <CrmActivityTimeline />
-      </VCol>
-
      <VCol
        cols="12"
        sm="8"
-        md="4"
+        md="12"
      >
        <CrmWeeklySales />
      </VCol>
+   

      <VCol
        cols="12"
-        md="2"
-        sm="4"
+        md="6"
+        style="display: none;"
      >
-        <VRow class="match-height">
-          <VCol
-            cols="6"
-            sm="12"
-          >
-            <CrmTotalGrowthCharts />
-          </VCol>
-
-          <VCol
-            cols="6"
-            sm="12"
-          >
-            <CardStatisticsVertical v-bind="statistic" />
-          </VCol>
-        </VRow>
+        <CrmActivityTimeline />
      </VCol>
-
      <VCol
        cols="12"
-        md="4"
-      >
-        <CrmUpgradeYourPlan />
-      </VCol>
-
-      <VCol
-        cols="12"
-        md="4"
+        md="6"
      >
        <CrmMeetingSchedule />
      </VCol>
-
-      <VCol
-        cols="12"
-        md="4"
-      >
-        <CrmDeveloperMeetup />
-      </VCol>
    </VRow>
  </section>
 </template>
--- a/resources/js/pages/labs/labs-kit.vue
+++ b/resources/js/pages/labs/labs-kit.vue
@@ -0,0 +1,444 @@
+<script setup>
+
+
+
+import { useStore } from 'vuex';
+const store = useStore()
+const editDialog = ref(false)
+const deleteDialog = ref(false)
+const search = ref('')
+const defaultItem = ref({
+  id: -1,
+  name: '',
+  amount: '',
+
+})
+const addDialog = ref(false)
+const editedItem = ref(defaultItem.value)
+const editedIndex = ref(-1)
+const labsKitList = ref([])
+const isLoading=ref(false)
+// status options
+const selectedOptions = [
+  {
+    text: 'Active',
+    value: 1,
+  },
+  {
+    text: 'InActive',
+    value: 2,
+  },
+  
+]
+
+    const refVForm = ref(null)
+
+
+const formatPhoneNumber = () => {
+  console.log(editedItem.value)
+  // Remove non-numeric characters from the input
+  const numericValue = editedItem.value.contact_no.replace(/\D/g, '');
+
+  // Apply formatting logic
+  if (numericValue.length <= 10) {
+    editedItem.value.contact_no = numericValue.replace(/(\d{3})(\d{3})(\d{4})/, '($1) $2-$3');
+  } else {
+    // Limit the input to a maximum of 14 characters
+    const truncatedValue = numericValue.slice(0, 10);
+    editedItem.value.contact_no = truncatedValue.replace(/(\d{3})(\d{3})(\d{4})/, '($1) $2-$3');
+  }
+};
+// headers
+const headers = [
+{
+    title: 'ID',
+    key: 'id',
+  },
+  {
+    title: 'NAME',
+    key: 'name',
+  },
+  {
+    title: 'Amount',
+    key: 'amount',
+  },
+
+ 
+  {
+    title: 'ACTIONS',
+    key: 'actions',
+  },
+]
+
+const resolveStatusVariant = status => {
+  if (status === 1)
+    return {
+      color: 'primary',
+      text: 'Current',
+    }
+  else if (status === 2)
+    return {
+      color: 'success',
+      text: 'Professional',
+    }
+  else if (status === 3)
+    return {
+      color: 'error',
+      text: 'Rejected',
+    }
+  else if (status === 4)
+    return {
+      color: 'warning',
+      text: 'Resigned',
+    }
+  else
+    return {
+      color: 'info',
+      text: 'Applied',
+    }
+}
+
+const editItem = item => {
+  editedIndex.value = labsKitList.value.indexOf(item)
+  editedItem.value = { ...item }
+  editDialog.value = true
+}
+
+const deleteItem = item => {
+  editedIndex.value = labsKitList.value.indexOf(item)
+  editedItem.value = { ...item }
+  deleteDialog.value = true
+}
+
+const close = () => {
+  editDialog.value = false
+  editedIndex.value = -1
+  editedItem.value = { ...defaultItem.value }
+}
+const closeAdd = () => {
+  addDialog.value = false
+}
+const closeDelete = () => {
+  deleteDialog.value = false
+  editedIndex.value = -1
+  editedItem.value = { ...defaultItem.value }
+}
+
+const update = async () => {
+  const { valid } = await refVForm.value.validate()
+  console.log(valid)
+  if (valid) {
+    if (editedIndex.value > -1){
+      await store.dispatch('labKitUpdate',{
+        id: editedItem.value.id,
+        name: editedItem.value.name,
+        amount: editedItem.value.amount,
+      })
+      Object.assign(labsKitList.value[editedIndex.value], editedItem.value)
+        close()
+    } else {
+      await store.dispatch('labKitAdd',{
+        name: defaultItem.value.name,
+        amount: defaultItem.value.amount,
+      })
+      
+      defaultItem.value.name = null
+      defaultItem.value.amount=null
+      closeAdd()
+    }
+    await store.dispatch('labsKitList')
+      console.log('getLabsList',store.getters.getLabKitList)
+        let list = store.getters.getLabKitList
+        
+        labsKitList.value = list
+  }
+
+  
+}
+
+const deleteItemConfirm = async() => {
+  console.log('editedIndex.value',editedIndex.value,editedItem.value.id)
+  await store.dispatch('labKitDelete',{
+    id: editedItem.value.id
+  })
+  labsKitList.value.splice(editedIndex.value, 1)
+  closeDelete()
+}
+const getlabsKitList = computed(async () => {
+  store.dispatch('updateIsLoading', true)
+  await store.dispatch('labsKitList')
+  console.log('getLabsList',store.getters.getLabKitList)
+    let list = store.getters.getLabKitList
+    store.dispatch('updateIsLoading', false)
+  labsKitList.value = list
+    return labsKitList.value
+});
+
+onMounted(() => {
+ 
+
+})
+</script>
+
+<template>
+  <v-row>
+    <v-col cols="12" md="12" v-if="getlabsKitList">
+    <VCard title="Lab Kit">
+      <VCardText >
+          <VRow>
+       
+          <VCol cols="12" md="8" class="d-flex align-center">
+          <VBtn color="primary" prepend-icon="ri-add-line" @click="addDialog = true">
+            New Lab Kit
+          </VBtn>
+          </VCol>
+        <VCol cols="12" md="4" class="d-flex justify-end">
+          <VTextField
+            v-model="search"
+            label="Search"
+            placeholder="Search ..."
+            append-inner-icon="ri-search-line"
+            single-line
+            hide-details
+            dense
+            outlined
+          />
+        </VCol>
+       </VRow>
+        </VCardText>
+      <VDataTable
+        :headers="headers"
+        :items="labsKitList"
+        :search="search"
+        :items-per-page="5"
+        class="text-no-wrap"
+      >
+        <!-- full name -->
+        <template #item.name="{ item }">
+          <div class="d-flex align-center">
+            <!-- avatar -->
+            <VAvatar
+              size="32"
+              :color="item.avatar ? '' : 'primary'"
+              :class="item.avatar ? '' : 'v-avatar-light-bg primary--text'"
+              :variant="!item.avatar ? 'tonal' : undefined"
+            >
+              <VImg
+                v-if="item.avatar"
+                :src="item.avatar"
+              />
+              <span
+                v-else
+                class="text-sm"
+              >{{ avatarText(item.name) }}</span>
+            </VAvatar>
+
+            <div class="d-flex flex-column ms-3">
+              <span class="d-block font-weight-medium text-high-emphasis text-truncate">{{ item.name }}</span>
+              <small>{{ item.post }}</small>
+            </div>
+          </div>
+        </template>
+
+        <!-- status -->
+        <template #item.status="{ item }">
+          <VChip
+            :color="resolveStatusVariant(item.status).color"
+            density="comfortable"
+          >
+            {{ resolveStatusVariant(item.status).text }}
+          </VChip>
+        </template>
+
+        <!-- Actions -->
+        <template #item.actions="{ item }">
+          <div class="d-flex gap-1">
+            <IconBtn
+              size="small"
+              @click="editItem(item)"
+            >
+              <VIcon icon="ri-pencil-line" />
+            </IconBtn>
+            <IconBtn
+              size="small"
+              @click="deleteItem(item)"
+            >
+              <VIcon icon="ri-delete-bin-line" />
+            </IconBtn>
+          </div>
+        </template>
+      </VDataTable>
+    </VCard>
+
+    </v-col>
+  </v-row>
+  <!-- 👉 Edit Dialog  -->
+  <VDialog
+    v-model="editDialog"
+    max-width="600px"
+  >
+  <VForm ref="refVForm" >
+    <VCard>
+      <VCardTitle>
+        <span class="headline">Edit Lab Kit</span>
+      </VCardTitle>
+
+      <VCardText>
+        <VContainer >
+         
+          <VRow>
+            <!-- fullName -->
+            <VCol cols="12" md="12">
+              <VTextField
+                v-model="editedItem.name"
+                label="Name"
+                :rules="[requiredValidator]"
+              />
+            </VCol>
+
+            <!-- email -->
+            <VCol cols="12" sm="12" md="12">
+              <VTextField
+                v-model="editedItem.amount"
+                label="Amount"
+                :rules="[requiredValidator]"
+              />
+            </VCol>
+
+         
+           
+            
+
+      
+            <!-- status -->
+            
+          </VRow>
+        </VContainer>
+      </VCardText>
+
+      <VCardActions>
+        <VSpacer />
+
+        <VBtn
+          color="error"
+          variant="outlined"
+          @click="close"
+        >
+          Cancel
+        </VBtn>
+
+        <VBtn
+          color="success"
+          variant="elevated"
+          @click="update"
+        >
+          Save
+        </VBtn>
+        
+      </VCardActions>
+    </VCard>
+  </VForm>
+  </VDialog>
+
+  <!-- 👉 Delete Dialog  -->
+  <VDialog
+    v-model="deleteDialog"
+    max-width="500px"
+  >
+    <VCard>
+      <VCardTitle>
+        Are you sure you want to delete this item?
+      </VCardTitle>
+
+      <VCardActions>
+        <VSpacer />
+
+        <VBtn
+          color="error"
+          variant="outlined"
+          @click="closeDelete"
+        >
+          Cancel
+        </VBtn>
+
+        <VBtn
+          color="success"
+          variant="elevated"
+          @click="deleteItemConfirm"
+        >
+          OK
+        </VBtn>
+
+        <VSpacer />
+      </VCardActions>
+    </VCard>
+  </VDialog>
+
+    <!-- 👉 Add Dialog  -->
+  <VDialog
+    v-model="addDialog"
+    max-width="600px"
+  >
+    <VForm ref="refVForm" >
+    <VCard>
+      <VCardTitle>
+        <span class="headline">Add Lab Kit</span>
+      </VCardTitle>
+
+      <VCardText>
+        <VContainer >
+         
+          <VRow>
+            <!-- fullName -->
+            <VCol cols="12" md="12">
+              <VTextField
+                v-model="defaultItem.name"
+                label="Name"
+                :rules="[requiredValidator]"
+              />
+            </VCol>
+
+            <!-- email -->
+            <VCol cols="12" sm="12" md="12">
+              <VTextField
+                v-model="defaultItem.amount"
+                label="Amount"
+                :rules="[requiredValidator,requiredAmountFloat]"
+              />
+            </VCol>
+
+         
+           
+            
+
+      
+            <!-- status -->
+            
+          </VRow>
+        </VContainer>
+      </VCardText>
+
+      <VCardActions>
+        <VSpacer />
+
+        <VBtn
+          color="error"
+          variant="outlined"
+          @click="closeAdd"
+        >
+          Cancel
+        </VBtn>
+
+        <VBtn
+          color="success"
+          variant="elevated"
+          @click="update"
+        >
+          Save
+        </VBtn>
+        
+      </VCardActions>
+    </VCard>
+  </VForm>
+  </VDialog>
+</template>
--- a/resources/js/pages/labs/labs.vue
+++ b/resources/js/pages/labs/labs.vue
@@ -0,0 +1,395 @@
+<script setup>
+
+
+
+import { useStore } from 'vuex';
+const store = useStore()
+const editDialog = ref(false)
+const deleteDialog = ref(false)
+const search = ref('')
+const defaultItem = ref({
+  id: -1,
+  avatar: '',
+  name: '',
+  email: '',
+  // dob: '',
+  phone_no: '',
+
+})
+
+const editedItem = ref(defaultItem.value)
+const editedIndex = ref(-1)
+const labsList = ref([])
+const isLoading=ref(false)
+// status options
+const selectedOptions = [
+  {
+    text: 'Active',
+    value: 1,
+  },
+  {
+    text: 'InActive',
+    value: 2,
+  },
+  
+]
+
+    const refVForm = ref(null)
+
+
+const formatPhoneNumber = () => {
+  console.log(editedItem.value)
+  // Remove non-numeric characters from the input
+  const numericValue = editedItem.value.contact_no.replace(/\D/g, '');
+
+  // Apply formatting logic
+  if (numericValue.length <= 10) {
+    editedItem.value.contact_no = numericValue.replace(/(\d{3})(\d{3})(\d{4})/, '($1) $2-$3');
+  } else {
+    // Limit the input to a maximum of 14 characters
+    const truncatedValue = numericValue.slice(0, 10);
+    editedItem.value.contact_no = truncatedValue.replace(/(\d{3})(\d{3})(\d{4})/, '($1) $2-$3');
+  }
+};
+// headers
+const headers = [
+{
+    title: 'ID',
+    key: 'id',
+  },
+  {
+    title: 'NAME',
+    key: 'name',
+  },
+  {
+    title: 'ADDRESS',
+    key: 'address',
+  },
+  // {
+  //   title: 'Date Of Birth',
+  //   key: 'dob',
+  // },
+  {
+    title: 'CONTACT',
+    key: 'contact_no',
+  },
+ 
+  {
+    title: 'ACTIONS',
+    key: 'actions',
+  },
+]
+
+const resolveStatusVariant = status => {
+  if (status === 1)
+    return {
+      color: 'primary',
+      text: 'Current',
+    }
+  else if (status === 2)
+    return {
+      color: 'success',
+      text: 'Professional',
+    }
+  else if (status === 3)
+    return {
+      color: 'error',
+      text: 'Rejected',
+    }
+  else if (status === 4)
+    return {
+      color: 'warning',
+      text: 'Resigned',
+    }
+  else
+    return {
+      color: 'info',
+      text: 'Applied',
+    }
+}
+
+const editItem = item => {
+  editedIndex.value = labsList.value.indexOf(item)
+  editedItem.value = { ...item }
+  editDialog.value = true
+}
+
+const deleteItem = item => {
+  editedIndex.value = labsList.value.indexOf(item)
+  editedItem.value = { ...item }
+  deleteDialog.value = true
+}
+
+const close = () => {
+  editDialog.value = false
+  editedIndex.value = -1
+  editedItem.value = { ...defaultItem.value }
+}
+
+const closeDelete = () => {
+  deleteDialog.value = false
+  editedIndex.value = -1
+  editedItem.value = { ...defaultItem.value }
+}
+
+const save = async () => {
+  const { valid } = await refVForm.value.validate()
+  console.log(valid)
+  if (valid) {
+    if (editedIndex.value > -1){
+      await store.dispatch('labUpdate',{
+        id: editedItem.value.id,
+        name: editedItem.value.name,
+        address: editedItem.value.address,
+        contact_no: editedItem.value.contact_no,
+      })
+      Object.assign(labsList.value[editedIndex.value], editedItem.value)
+    }else{
+      labsList.value.push(editedItem.value)
+    }
+  close()
+  }
+ 
+  
+}
+
+const deleteItemConfirm = async() => {
+  console.log('editedIndex.value',editedIndex.value,editedItem.value.id)
+  await store.dispatch('labDelete',{
+    id: editedItem.value.id
+  })
+  labsList.value.splice(editedIndex.value, 1)
+  closeDelete()
+}
+const getlabsList = computed(async () => {
+  store.dispatch('updateIsLoading', true)
+  await store.dispatch('labsList')
+  console.log('getLabsList',store.getters.getLabsList)
+    let list = store.getters.getLabsList
+    store.dispatch('updateIsLoading', false)
+  labsList.value = list
+    return labsList.value
+});
+
+onMounted(() => {
+ 
+
+})
+</script>
+
+<template>
+  <v-row>
+    <v-col cols="12" md="12" v-if="getlabsList">
+    <VCard title="Labs">
+      <VCardText >
+          <VRow>
+            <VCol
+              cols="12"
+              offset-md="8"
+              md="4"
+            >
+              <VTextField
+                v-model="search"
+                label="Search"
+                placeholder="Search ..."
+                append-inner-icon="ri-search-line"
+                single-line
+                hide-details
+                dense
+                outlined
+              />
+            </VCol>
+          </VRow>
+        </VCardText>
+      <VDataTable
+        :headers="headers"
+        :items="labsList"
+        :search="search"
+        :items-per-page="5"
+        class="text-no-wrap"
+      >
+        <!-- full name -->
+        <template #item.name="{ item }">
+          <div class="d-flex align-center">
+            <!-- avatar -->
+            <VAvatar
+              size="32"
+              :color="item.avatar ? '' : 'primary'"
+              :class="item.avatar ? '' : 'v-avatar-light-bg primary--text'"
+              :variant="!item.avatar ? 'tonal' : undefined"
+            >
+              <VImg
+                v-if="item.avatar"
+                :src="item.avatar"
+              />
+              <span
+                v-else
+                class="text-sm"
+              >{{ avatarText(item.name) }}</span>
+            </VAvatar>
+
+            <div class="d-flex flex-column ms-3">
+              <span class="d-block font-weight-medium text-high-emphasis text-truncate">{{ item.name }}</span>
+              <small>{{ item.post }}</small>
+            </div>
+          </div>
+        </template>
+
+        <!-- status -->
+        <template #item.status="{ item }">
+          <VChip
+            :color="resolveStatusVariant(item.status).color"
+            density="comfortable"
+          >
+            {{ resolveStatusVariant(item.status).text }}
+          </VChip>
+        </template>
+
+        <!-- Actions -->
+        <template #item.actions="{ item }">
+          <div class="d-flex gap-1">
+            <IconBtn
+              size="small"
+              @click="editItem(item)"
+            >
+              <VIcon icon="ri-pencil-line" />
+            </IconBtn>
+            <IconBtn
+              size="small"
+              @click="deleteItem(item)"
+            >
+              <VIcon icon="ri-delete-bin-line" />
+            </IconBtn>
+          </div>
+        </template>
+      </VDataTable>
+    </VCard>
+
+    </v-col>
+  </v-row>
+  <!-- 👉 Edit Dialog  -->
+  <VDialog
+    v-model="editDialog"
+    max-width="600px"
+  >
+  <VForm ref="refVForm" >
+    <VCard>
+      <VCardTitle>
+        <span class="headline">Edit Lab</span>
+      </VCardTitle>
+
+      <VCardText>
+        <VContainer >
+         
+          <VRow>
+            <!-- fullName -->
+            <VCol cols="12" md="12">
+              <VTextField
+                v-model="editedItem.name"
+                label="Name"
+                :rules="[requiredValidator]"
+              />
+            </VCol>
+
+            <!-- email -->
+            <VCol cols="12" sm="12" md="12">
+              <VTextField
+                v-model="editedItem.address"
+                label="Address"
+                :rules="[requiredValidator]"
+              />
+            </VCol>
+
+         
+            <!-- <VCol cols="12" sm="6" md="12">
+              <VTextField
+                v-model="editedItem.dob"
+                label="Date Of Birth"
+              />
+            </VCol> -->
+            <VCol cols="12" sm="6" md="12">
+              <VTextField v-model="editedItem.contact_no" label="Phone Number" pattern="^\(\d{3}\) \d{3}-\d{4}$"
+                :rules="[requiredPhone, validUSAPhone]" placeholder="i.e. (000) 000-0000"
+                @input="formatPhoneNumber" max="14" density="comfortable" />
+            </VCol>
+            
+
+         
+
+            <!-- status -->
+            <VCol
+              cols="12"
+
+              md="12"
+            >
+              <VSelect
+                v-model="editedItem.status"
+                :items="selectedOptions"
+                item-title="text"
+                item-value="value"
+                label="Status"
+                variant="outlined"
+              />
+            </VCol>
+          </VRow>
+        </VContainer>
+      </VCardText>
+
+      <VCardActions>
+        <VSpacer />
+
+        <VBtn
+          color="error"
+          variant="outlined"
+          @click="close"
+        >
+          Cancel
+        </VBtn>
+
+        <VBtn
+          color="success"
+          variant="elevated"
+          @click="save"
+        >
+          Save
+        </VBtn>
+        
+      </VCardActions>
+    </VCard>
+    </VForm>
+  </VDialog>
+
+  <!-- 👉 Delete Dialog  -->
+  <VDialog
+    v-model="deleteDialog"
+    max-width="500px"
+  >
+    <VCard>
+      <VCardTitle>
+        Are you sure you want to delete this item?
+      </VCardTitle>
+
+      <VCardActions>
+        <VSpacer />
+
+        <VBtn
+          color="error"
+          variant="outlined"
+          @click="closeDelete"
+        >
+          Cancel
+        </VBtn>
+
+        <VBtn
+          color="success"
+          variant="elevated"
+          @click="deleteItemConfirm"
+        >
+          OK
+        </VBtn>
+
+        <VSpacer />
+      </VCardActions>
+    </VCard>
+  </VDialog>
+</template>
--- a/resources/js/pages/login.vue
+++ b/resources/js/pages/login.vue
@@ -1,14 +1,18 @@
 <script setup>
-import tree1 from '@images/misc/tree1.png'
-import authV2LoginIllustrationBorderedDark from '@images/pages/auth-v2-login-illustration-bordered-dark.png'
-import authV2LoginIllustrationBorderedLight from '@images/pages/auth-v2-login-illustration-bordered-light.png'
-import authV2LoginIllustrationDark from '@images/pages/auth-v2-login-illustration-dark.png'
-import authV2LoginIllustrationLight from '@images/pages/auth-v2-login-illustration-light.png'
-import authV2MaskDark from '@images/pages/mask-v2-dark.png'
-import authV2MaskLight from '@images/pages/mask-v2-light.png'
-import { VNodeRenderer } from '@layouts/components/VNodeRenderer'
-import { themeConfig } from '@themeConfig'
-import { VForm } from 'vuetify/components/VForm'
+import tree1 from '@images/misc/tree1.png';
+import authV2LoginIllustrationBorderedDark from '@images/pages/auth-v2-login-illustration-bordered-dark.png';
+import authV2LoginIllustrationBorderedLight from '@images/pages/auth-v2-login-illustration-bordered-light.png';
+import authV2LoginIllustrationDark from '@images/pages/auth-v2-login-illustration-dark.png';
+import authV2LoginIllustrationLight from '@images/pages/auth-v2-login-illustration-light.png';
+import authV2MaskDark from '@images/pages/mask-v2-dark.png';
+import authV2MaskLight from '@images/pages/mask-v2-light.png';
+import { VNodeRenderer } from '@layouts/components/VNodeRenderer';
+import { themeConfig } from '@themeConfig';
+import axios from 'axios';
+import { VForm } from 'vuetify/components/VForm';
+import { useStore } from 'vuex';
+import { ADMIN_LOGIN_API } from '../constants';
+const store = useStore()

 const authThemeImg = useGenerateImageVariant(authV2LoginIllustrationLight, authV2LoginIllustrationDark, authV2LoginIllustrationBorderedLight, authV2LoginIllustrationBorderedDark, true)
 const authThemeMask = useGenerateImageVariant(authV2MaskLight, authV2MaskDark)
@@ -33,37 +37,68 @@ const errors = ref({
 const refVForm = ref()

 const credentials = ref({
-  email: 'admin@demo.com',
-  password: 'admin',
+  email: '',
+  password: '',
 })

+const isLoading = ref(false)
 const rememberMe = ref(false)

 const login = async () => {
+  
  try {
-    const res = await $api('/auth/login', {
-      method: 'POST',
-      body: {
-        email: credentials.value.email,
-        password: credentials.value.password,
-      },
-      onResponseError({ response }) {
-        errors.value = response._data.errors
-      },
-    })
+    store.dispatch('updateIsLoading', true)
+    // isLoading.value = true
+    const response = await axios.post(ADMIN_LOGIN_API, {
+      email: credentials.value.email,
+      password: credentials.value.password,
+    });

-    const { accessToken, userData, userAbilityRules } = res
+    console.log("Response", response.data);
+    response.data.userData.avatar = "/images/avatars/avatar-1.png";
+    console.log("Response 2", response.data);

-    useCookie('userAbilityRules').value = userAbilityRules
-    ability.update(userAbilityRules)
-    useCookie('userData').value = userData
-    useCookie('accessToken').value = accessToken
+    const { accessToken, userData, userAbilityRules } = response.data;
+    useCookie('userAbilityRules').value = userAbilityRules;
+    ability.update(userAbilityRules);
+    useCookie('userData').value = userData;
+    useCookie('accessToken').value = accessToken;
+    localStorage.setItem('admin_access_token',accessToken)
+    
    await nextTick(() => {
-      router.replace(route.query.to ? String(route.query.to) : '/')
-    })
-  } catch (err) {
-    console.error(err)
+      router.replace(route.query.to ? String(route.query.to) : '/');
+    });
+    store.dispatch('updateIsLoading', false)
+  } catch (error) {
+    store.dispatch('updateIsLoading', false)
+    errors.value.email = error.response.data.error
+    // isLoading.value = false
+    console.error(error);
  }
+  // try {
+  //   const res = await $api('/auth/login', {
+  //     method: 'POST',
+  //     body: {
+  //       email: credentials.value.email,
+  //       password: credentials.value.password,
+  //     },
+  //     onResponseError({ response }) {
+  //       errors.value = response._data.errors
+  //     },
+  //   })
+
+  //   const { accessToken, userData, userAbilityRules } = res
+
+  //   useCookie('userAbilityRules').value = userAbilityRules
+  //   ability.update(userAbilityRules)
+  //   useCookie('userData').value = userData
+  //   useCookie('accessToken').value = accessToken
+  //   await nextTick(() => {
+  //     router.replace(route.query.to ? String(route.query.to) : '/')
+  //   })
+  // } catch (err) {
+  //   console.error(err)
+  // }
 }

 const onSubmit = () => {
@@ -75,6 +110,13 @@ const onSubmit = () => {
 </script>

 <template>
+  <VDialog v-model="isLoading" width="110" height="150" color="primary">
+        <VCardText class="" style="color: white !important;">
+          <div class="demo-space-x">
+            <VProgressCircular :size="40" color="primary" indeterminate />
+          </div>
+        </VCardText>
+      </VDialog>
  <RouterLink to="/">
    <div class="auth-logo d-flex align-center gap-x-3">
      <VNodeRenderer :nodes="themeConfig.app.logo" />
@@ -128,13 +170,13 @@ const onSubmit = () => {
      >
        <VCardText>
          <h4 class="text-h4 mb-1">
-            Welcome to <span class="text-capitalize">{{ themeConfig.app.title }}!</span> 👋🏻
+            Welcome to <span class="text-capitalize">{{ themeConfig.app.title }}!</span> 
          </h4>
          <p class="mb-0">
            Please sign-in to your account and start the adventure
          </p>
        </VCardText>
-        <VCardText>
+        <!-- <VCardText>
          <VAlert
            color="primary"
            variant="tonal"
@@ -146,7 +188,7 @@ const onSubmit = () => {
              Client Email: <strong>client@demo.com</strong> / Pass: <strong>client</strong>
            </p>
          </VAlert>
-        </VCardText>
+        </VCardText> -->

        <VCardText>
          <VForm
--- a/resources/js/pages/medicines/medicines.vue
+++ b/resources/js/pages/medicines/medicines.vue
@@ -0,0 +1,817 @@
+<script setup>
+import { useStore } from 'vuex';
+const store = useStore()
+const editDialog = ref(false)
+const addDialog = ref(false)
+const deleteDialog = ref(false)
+const search = ref('')
+const refVForm = ref(null)
+const refVFormAdd = ref(null)
+const selectDropdown = ref(false)
+const selectdataList = ref(null)
+const defaultItem = ref({
+  id: -1,
+  title: '',
+  slug: '',
+  list_one_title: '',
+  list_sub_title: '',
+  list_two_title: '',
+  price: '',
+  currency:""
+})
+const requiredImageValidator = (value) => !!value || 'Please select an image file.'
+    const requiredExcelValidator = (value) => !!value || 'Please select an Excel file.'
+const imageFile = ref(null)
+    const excelFile = ref(null)
+const editedItem = ref(defaultItem.value)
+const editedIndex = ref(-1)
+const medicineList = ref([])
+const isLoading = ref(false)
+const currencySign = ref('$');
+const imageBase64 = ref(null)
+    const excelBase64 = ref(null)
+const currencies = ref([
+  { code: 'USD', name: 'US Dollar', sign: '$' },
+  { code: 'EUR', name: 'Euro', sign: '€' },
+  { code: 'GBP', name: 'British Pound', sign: '£' },
+  { code: 'JPY', name: 'Japanese Yen', sign: '¥' },
+])
+const setCurrency = (code, sign) => {
+      currencySign.value = sign;
+      // You can perform additional operations with the selected currency code if needed
+    };
+// status options
+const selectedOptions = [
+  {
+    text: 'Current',
+    value: 1,
+  },
+  {
+    text: 'Professional',
+    value: 2,
+  },
+  {
+    text: 'Rejected',
+    value: 3,
+  },
+  {
+    text: 'Resigned',
+    value: 4,
+  },
+  {
+    text: 'Applied',
+    value: 5,
+  },
+]
+
+// headers
+const headers = [
+{
+    title: 'ID',
+    key: 'id',
+  },
+  {
+    title: 'Title',
+    key: 'title',
+  },
+  {
+    title: 'Slug',
+    key: 'slug',
+  },
+  {
+    title: 'Price',
+    key: 'price',
+  },
+  {
+    title: 'Short Detail',
+    key: 'list_one_title',
+  },
+  {
+    title: 'Short Description',
+    key: 'list_sub_title',
+  },
+ 
+  // {
+  //   title: 'ACTIONS',
+  //   key: 'actions',
+  // },
+]
+
+const resolveStatusVariant = status => {
+  if (status === 1)
+    return {
+      color: 'primary',
+      text: 'Current',
+    }
+  else if (status === 2)
+    return {
+      color: 'success',
+      text: 'Professional',
+    }
+  else if (status === 3)
+    return {
+      color: 'error',
+      text: 'Rejected',
+    }
+  else if (status === 4)
+    return {
+      color: 'warning',
+      text: 'Resigned',
+    }
+  else
+    return {
+      color: 'info',
+      text: 'Applied',
+    }
+}
+
+const editItem = item => {
+  editedIndex.value = medicineList.value.indexOf(item)
+  editedItem.value = { ...item }
+  editDialog.value = true
+}
+const addItem = item => {
+  addDialog.value = true
+}
+const deleteItem = item => {
+  editedIndex.value = medicineList.value.indexOf(item)
+  editedItem.value = { ...item }
+  deleteDialog.value = true
+}
+
+const selectfile = (data) => {
+  if (data == 'dropdown') {
+    selectDropdown.value = true
+  } else {
+    selectDropdown.value = false
+  }
+  
+}
+const close = () => {
+  editDialog.value = false
+  editedIndex.value = -1
+  editedItem.value = { ...defaultItem.value }
+}
+const closeAdd = () => {
+  addDialog.value = false
+}
+const closeDelete = () => {
+  deleteDialog.value = false
+  editedIndex.value = -1
+  editedItem.value = { ...defaultItem.value }
+}
+const getmedicineList = computed(async () => {
+  store.dispatch('updateIsLoading', true)
+  await store.dispatch('medicineList')
+  console.log('medicineList',store.getters.getMedcineList)
+  let list = store.getters.getMedcineList
+  await store.dispatch('questioneriesListExcel')
+  store.dispatch('updateIsLoading', false)
+  let getQuestioneriesList = store.getters.getQuestioneriesList
+    medicineList.value = list
+    return medicineList.value
+});
+const convertImageToBase64 = (event) => {
+      const file = event.target.files[0]
+      const reader = new FileReader()
+      reader.readAsDataURL(file)
+      reader.onload = () => {
+        imageBase64.value = reader.result.split(',')[1]
+      }
+    }
+
+    const convertExcelToBase64 = (event) => {
+      const file = event.target.files[0]
+      const reader = new FileReader()
+      reader.readAsDataURL(file)
+      reader.onload = () => {
+        excelBase64.value = reader.result.split(',')[1]
+      }
+    }
+
+const save = async () => {
+  const { valid } = await refVFormAdd.value.validate()
+  console.log(valid)
+  if (valid) {
+    try {
+          
+          if (editedIndex.value > -1) {
+            Object.assign(medicineList.value[editedIndex.value], editedItem.value)
+           
+
+            
+          } else {
+         
+            medicineList.value.push(editedItem.value)
+            console.log(imageFile.value)
+            //const formData = new FormData()
+            //formData.append('image', imageBase64.value)
+           
+          
+            // formData.append('title', defaultItem.value.title)
+            // formData.append('slug', defaultItem.value.slug)
+            // formData.append('list_one_title', defaultItem.value.list_one_title)
+            // formData.append('list_sub_title', defaultItem.value.list_sub_title)
+            // formData.append('list_two_title', defaultItem.value.list_two_title)
+            // formData.append('price', defaultItem.value.price)
+            // formData.append('currency', currencySign.value)
+            let ecelData=''
+            if (selectDropdown.value) {
+              let datexcel = {
+                type: 'string',
+                data:selectdataList.value
+              }
+              console.log(datexcel)
+              ecelData=datexcel
+              //formData.append('excel', datexcel)
+            } else {
+             
+              let datexcel = {
+                type: 'file',
+                data:excelBase64.value
+              }
+              ecelData = datexcel
+              // formData.append('excel', datexcel)
+            }
+            await store.dispatch('medicineAdd',{
+              title: defaultItem.value.title,
+              slug: defaultItem.value.slug,
+              list_one_title: defaultItem.value.list_one_title,
+              list_sub_title: defaultItem.value.list_sub_title,
+              list_two_title: defaultItem.value.list_two_title,
+              price: defaultItem.value.price,
+              currency: currencySign.value,
+              excel:'',//ecelData,
+              image:imageBase64.value
+            })
+           
+          }
+
+
+
+          // Handle the API response
+          console.log(response.data)
+        } catch (error) {
+          console.error(error)
+        }
+    addDialog.value = false
+    await store.dispatch('medicineList')
+    let list = store.getters.getMedcineList
+    medicineList.value = list
+    closeAdd()
+  }
+}
+const update = async () => {
+  const { valid } = await refVForm.value.validate()
+  console.log(valid)
+  if (valid) {
+    try {
+          
+          if (editedIndex.value > -1) {
+            Object.assign(medicineList.value[editedIndex.value], editedItem.value)
+           
+            console.log(imageFile.value)
+           
+            let ecelData=''
+            if (selectDropdown.value) {
+              let datexcel = {
+                type: 'string',
+                data:selectdataList.value
+              }
+              console.log(datexcel)
+              ecelData=datexcel
+              //formData.append('excel', datexcel)
+            } else {
+             
+              let datexcel = {
+                type: 'file',
+                data:excelBase64.value
+              }
+              ecelData = datexcel
+              // formData.append('excel', datexcel)
+            }
+            await store.dispatch('medicineUpdate', {
+              id:editedItem.value.id,
+              title: editedItem.value.title,
+              slug: editedItem.value.slug,
+              list_one_title: editedItem.value.list_one_title,
+              list_sub_title: editedItem.value.list_sub_title,
+              list_two_title: editedItem.value.list_two_title,
+              price: editedItem.value.price,
+              currency: currencySign.value,
+              excel:'',//ecelData,
+              image:imageBase64.value
+            })
+           
+          }
+
+
+
+          // Handle the API response
+          console.log(response.data)
+        } catch (error) {
+          console.error(error)
+        }
+    addDialog.value = false
+    await store.dispatch('medicineList')
+    let list = store.getters.getMedcineList
+    medicineList.value = list
+    close()
+  }
+}
+const deleteItemConfirm = async () => {
+  
+  await store.dispatch('medicineDelete',{
+    id: editedItem.value.id
+  })
+  medicineList.value.splice(editedIndex.value, 1)
+  closeDelete()
+
+  defaultItem.value.id= null
+  defaultItem.value.title= null
+  defaultItem.value.slug= null
+  defaultItem.value.list_one_title= null
+  defaultItem.value.list_sub_title= null
+  defaultItem.value.list_two_title= null
+ defaultItem.value.price =null
+  defaultItem.value.currency=null
+
+}
+const generateSlug = () => {
+  console.log(editedItem.title)
+      if (editedItem.value.title) {
+        editedItem.value.slug = editedItem.value.title
+          .toString()
+          .trim()
+          .toLowerCase()
+          .replace(/\s+/g, '-')
+          .replace(/[^\w-]+/g, '')
+          .replace(/--+/g, '-')
+          .replace(/^-+/, '')
+          .replace(/-+$/, '')
+      } else if (defaultItem.value.title) { 
+        defaultItem.value.slug = defaultItem.value.title 
+          .toString()
+          .trim()
+          .toLowerCase()
+          .replace(/\s+/g, '-')
+          .replace(/[^\w-]+/g, '')
+          .replace(/--+/g, '-')
+          .replace(/^-+/, '')
+          .replace(/-+$/, '')
+      } else {
+        editedItem.slug = ''
+      }
+    }
+onMounted(() => {
+
+})
+</script>
+
+<template>
+  <v-row>
+    <v-col cols="12" md="12" v-if="getmedicineList">
+    <VCard title="Medicines">
+
+      <VCardText >
+        <VRow>
+       
+          <VCol cols="12" md="8" class="d-flex align-center">
+          <VBtn color="primary" prepend-icon="ri-add-line" @click="addDialog = true" style="display: none;">
+            New Medicine
+          </VBtn>
+          </VCol>
+        <VCol cols="12" md="4" class="d-flex justify-end">
+          <VTextField
+            v-model="search"
+            label="Search"
+            placeholder="Search ..."
+            append-inner-icon="ri-search-line"
+            single-line
+            hide-details
+            dense
+            outlined
+          />
+        </VCol>
+       </VRow>
+        </VCardText>
+      <VDataTable
+        :headers="headers"
+        :items="medicineList"
+        :search="search"
+        :items-per-page="5"
+        class="text-no-wrap"
+      >
+        <!-- full name -->
+        <template #item.title="{ item }">
+          <div class="d-flex align-center">
+            <!-- avatar -->
+            <VAvatar
+              size="32"
+              :color="item.image_url ? '' : 'primary'"
+              :class="item.image_url ? '' : 'v-avatar-light-bg primary--text'"
+              :variant="!item.image_url ? 'tonal' : undefined"
+            >
+              <VImg
+                v-if="item.image_url"
+                :src="item.image_url"
+              />
+              <span
+                v-else
+                class="text-sm"
+              >{{ avatarText(item.name) }}</span>
+            </VAvatar>
+
+            <div class="d-flex flex-column ms-3">
+              <span class="d-block font-weight-medium text-high-emphasis text-truncate">{{ item.title }}</span>
+          
+            </div>
+          </div>
+        </template>
+
+        <!-- status -->
+        <template #item.status="{ item }">
+          <VChip
+            :color="resolveStatusVariant(item.status).color"
+            density="comfortable"
+          >
+            {{ resolveStatusVariant(item.status).text }}
+          </VChip>
+        </template>
+
+        <!-- Actions -->
+        <template #item.actions="{ item }">
+          <div class="d-flex gap-1">
+            <IconBtn
+              size="small"
+              @click="editItem(item)"
+            >
+              <VIcon icon="ri-pencil-line" />
+            </IconBtn>
+            <IconBtn
+              size="small"
+              @click="deleteItem(item)"
+            >
+              <VIcon icon="ri-delete-bin-line" />
+            </IconBtn>
+          </div>
+        </template>
+      </VDataTable>
+    </VCard>
+    </v-col>
+  </v-row>
+  <!-- 👉 Edit Dialog  -->
+  <VDialog
+    v-model="editDialog"
+    max-width="600px"
+  >
+     <VForm ref="refVForm" >
+      <VCard>
+        <VCardTitle>
+          <span class="headline">Edit Medicine</span>
+        </VCardTitle>
+
+        <VCardText>
+          <VContainer >
+          
+            <VRow>
+              <!-- fullName -->
+              <VCol cols="12" md="12">
+                <VTextField
+                  v-model="editedItem.title"
+                  label="Title"
+                  :rules="[requiredValidator]"
+                  @input="generateSlug"
+                />
+              </VCol>
+              <VCol cols="12" md="12">
+                <VTextField
+                  v-model="editedItem.slug"
+                  label="Slug"
+                  :rules="[requiredValidator]"
+                />
+              </VCol>
+
+              <VCol cols="12" sm="6" md="12">
+              <VTextField
+                v-model="editedItem.price"
+                label="Price"
+                :rules="[requiredValidator]"
+                prepend-inner-icon
+              >
+                <template v-slot:prepend-inner>
+                  <VMenu
+                    offset-y
+                    transition="slide-y-transition"
+                    :close-on-content-click="false"
+                  >
+                    <template v-slot:activator="{ props }">
+                      <span v-bind="props">{{ currencySign  || '$money' }}</span>
+                    </template>
+                    <VList>
+                      <VListItem
+                        v-for="currency in currencies"
+                        :key="currency.code"
+                        @click.prevent="setCurrency(currency.code, currency.sign)"
+                      >
+                        <VListItemTitle>{{ currency.name }}</VListItemTitle>
+                      </VListItem>
+                    </VList>
+                  </VMenu>
+                </template>
+              </VTextField>
+            </VCol>
+
+              <VCol cols="12" sm="6" md="12">
+                <VTextField
+                  v-model="editedItem.list_one_title"
+                  label="Short Detail"
+                  :rules="[requiredValidator]"
+                />
+              </VCol>
+              <VCol cols="12" sm="6" md="12">
+                <VTextField
+                  v-model="editedItem.list_sub_title"
+                  label="Short Description"
+                  :rules="[requiredValidator]"
+                />
+              </VCol>
+            
+              <VCol cols="12" sm="6" md="12">
+              <VTextarea
+                v-model="editedItem.list_two_title"
+                label="Full Description"
+                :rules="[requiredValidator]"
+              />
+            </VCol>
+
+            <VCol cols="12" md="8">
+                <div v-if="selectDropdown==false">
+                
+                  <VFileInput
+                    v-model="excelFile"
+                    accept=".xlsx,.xls"
+                    show-size
+                    counter
+                    label="Select an Excel file to upload"
+                    @change="convertExcelToBase64"
+
+                  />
+                </div>
+                <div v-if="selectDropdown==true">
+                <VSelect
+                    v-model="selectdataList"
+                    :items="store.getters.getQuestioneriesList"
+                    item-title="product_file_path"
+                    item-value="product_file_path"
+                    label="Select File"
+                    prepend-icon="ri-file-line"
+                    variant="outlined"
+                  />
+                </div>
+            </VCol>
+            <VCol cols="12" md="4">
+              <VBtn color="success" variant="outlined" @click="selectfile('dropdown')"     class="custom-button" v-if="selectDropdown==false">Select File</VBtn>
+              <VBtn color="success" variant="outlined" @click="selectfile('upload')"      class="custom-button" v-if="selectDropdown==true">Upload File</VBtn>
+            </VCol>
+            <VCol cols="12" md="12">
+              <div>
+            
+                <VFileInput
+                  v-model="imageFile"
+                  accept="image/*"
+                  show-size
+                  counter
+                  label="Select an image to upload"
+                  @change="convertImageToBase64"
+                />
+              </div>
+            </VCol> 
+          
+            </VRow>
+          </VContainer>
+        </VCardText>
+
+        <VCardActions>
+          <VSpacer />
+
+          <VBtn
+            color="error"
+            variant="outlined"
+            @click="close"
+          >
+            Cancel
+          </VBtn>
+
+          <VBtn
+            color="success"
+            variant="elevated"
+            @click="update"
+          >
+            Save
+          </VBtn>
+          
+        </VCardActions>
+      </VCard>
+    </VForm>
+  </VDialog>
+
+    <!-- 👉 Delete Dialog  -->
+    <VDialog
+      v-model="deleteDialog"
+      max-width="500px"
+    >
+      <VCard>
+        <VCardTitle>
+          Are you sure you want to delete this item?
+        </VCardTitle>
+
+        <VCardActions>
+          <VSpacer />
+
+          <VBtn
+            color="error"
+            variant="outlined"
+            @click="closeDelete"
+          >
+            Cancel
+          </VBtn>
+
+          <VBtn
+            color="success"
+            variant="elevated"
+            @click="deleteItemConfirm"
+          >
+            OK
+          </VBtn>
+
+          <VSpacer />
+        </VCardActions>
+      </VCard>
+    </VDialog>
+
+
+  <!-- 👉 Add Dialog  -->
+  <VDialog
+    v-model="addDialog"
+    max-width="600px"
+  >
+    <VForm ref="refVFormAdd" >
+      <VCard>
+        <VCardTitle>
+          <span class="headline">Add Medicine</span>
+        </VCardTitle>
+
+        <VCardText>
+          <VContainer >
+          
+            <VRow>
+              <!-- fullName -->
+              <VCol cols="12" md="12">
+                <VTextField
+                  v-model="defaultItem.title"
+                  label="Title"
+                  :rules="[requiredValidator]"
+                  @input="generateSlug"
+                />
+              </VCol>
+              <VCol cols="12" md="12">
+                <VTextField
+                  v-model="defaultItem.slug"
+                  label="Slug"
+                  :rules="[requiredValidator]"
+                />
+              </VCol>
+
+              <VCol cols="12" sm="6" md="12">
+              <VTextField
+                v-model="defaultItem.price"
+                label="Price"
+                :rules="[requiredValidator]"
+                prepend-inner-icon
+              >
+                <template v-slot:prepend-inner>
+                  <VMenu
+                    offset-y
+                    transition="slide-y-transition"
+                    :close-on-content-click="false"
+                  >
+                    <template v-slot:activator="{ props }">
+                      <span v-bind="props">{{ currencySign  || '$money' }}</span>
+                    </template>
+                    <VList>
+                      <VListItem
+                        v-for="currency in currencies"
+                        :key="currency.code"
+                        @click.prevent="setCurrency(currency.code, currency.sign)"
+                      >
+                        <VListItemTitle>{{ currency.name }}</VListItemTitle>
+                      </VListItem>
+                    </VList>
+                  </VMenu>
+                </template>
+              </VTextField>
+            </VCol>
+
+              <VCol cols="12" sm="6" md="12">
+                <VTextField
+                  v-model="defaultItem.list_one_title"
+                  label="Short Detail"
+                  :rules="[requiredValidator]"
+                />
+              </VCol>
+              <VCol cols="12" sm="6" md="12">
+                <VTextField
+                  v-model="defaultItem.list_sub_title"
+                  label="Short Description"
+                  :rules="[requiredValidator]"
+                />
+              </VCol>
+            
+              <VCol cols="12" sm="6" md="12">
+              <VTextarea
+                v-model="defaultItem.list_two_title"
+                label="Full Description"
+                :rules="[requiredValidator]"
+              />
+            </VCol>
+
+            <VCol cols="12" md="8">
+                <div v-if="selectDropdown==false">
+                
+                  <VFileInput
+                    v-model="excelFile"
+                    accept=".xlsx,.xls"
+                    :rules="[requiredExcelValidator]"
+                    show-size
+                    counter
+                    label="Select an Excel file to upload"
+                    @change="convertExcelToBase64"
+
+                  />
+                </div>
+                <div v-if="selectDropdown==true">
+                <VSelect
+                    v-model="selectdataList"
+                    :items="store.getters.getQuestioneriesList"
+                    item-title="product_file_path"
+                    item-value="product_file_path"
+                    label="Select File"
+                    prepend-icon="ri-file-line"
+                    variant="outlined"
+                  />
+                </div>
+            </VCol>
+            <VCol cols="12" md="4">
+              <VBtn color="success" variant="outlined" @click="selectfile('dropdown')"     class="custom-button" v-if="selectDropdown==false">Select File</VBtn>
+              <VBtn color="success" variant="outlined" @click="selectfile('upload')"      class="custom-button" v-if="selectDropdown==true">Upload File</VBtn>
+            </VCol>
+            <VCol cols="12" md="12">
+              <div>
+            
+                <VFileInput
+                  v-model="imageFile"
+                  accept="image/*"
+                  :rules="[requiredImageValidator]"
+                  show-size
+                  counter
+                  label="Select an image to upload"
+                  @change="convertImageToBase64"
+                />
+              </div>
+            </VCol> 
+          
+            </VRow>
+          </VContainer>
+        </VCardText>
+
+        <VCardActions>
+          <VSpacer />
+
+          <VBtn
+            color="error"
+            variant="outlined"
+            @click="closeAdd"
+          >
+            Cancel
+          </VBtn>
+
+          <VBtn
+            color="success"
+            variant="elevated"
+            @click="save"
+          >
+            Save
+          </VBtn>
+          
+        </VCardActions>
+      </VCard>
+    </VForm>
+  </VDialog>
+</template>
+<style scoped>
+.custom-button {
+  width: 100%;
+  height: 48px; /* This value should match the height of your input fields */
+}
+</style>
--- a/resources/js/pages/pages/account-settings/[tab].vue
+++ b/resources/js/pages/pages/account-settings/[tab].vue
@@ -4,7 +4,7 @@ import AccountSettingsBillingAndPlans from '@/views/pages/account-settings/Accou
 import AccountSettingsConnections from '@/views/pages/account-settings/AccountSettingsConnections.vue'
 import AccountSettingsNotification from '@/views/pages/account-settings/AccountSettingsNotification.vue'
 import AccountSettingsSecurity from '@/views/pages/account-settings/AccountSettingsSecurity.vue'
-
+import WebsiteSettings from '@/views/pages/account-settings/WebsiteSettings.vue'
 const route = useRoute('pages-account-settings-tab')

 const activeTab = computed({
@@ -24,21 +24,13 @@ const tabs = [
    icon: 'ri-lock-line',
    tab: 'security',
  },
-  {
-    title: 'Billing & Plans',
-    icon: 'ri-bookmark-line',
-    tab: 'billing-plans',
-  },
-  {
-    title: 'Notifications',
-    icon: 'ri-notification-3-line',
-    tab: 'notification',
-  },
-  {
-    title: 'Connections',
+   {
+    title: 'Site Setting',
    icon: 'ri-link',
-    tab: 'connection',
+    tab: 'site-settings',
  },
+ 
+  
 ]

 definePage({ meta: { navActiveLink: 'pages-account-settings-tab' } })
@@ -78,7 +70,10 @@ definePage({ meta: { navActiveLink: 'pages-account-settings-tab' } })
      <VWindowItem value="security">
        <AccountSettingsSecurity />
      </VWindowItem>
-
+      <!-- site setting -->
+      <VWindowItem value="site-settings">
+        <WebsiteSettings />
+      </VWindowItem>
      <!-- Billing -->
      <VWindowItem value="billing-plans">
        <AccountSettingsBillingAndPlans />
--- a/resources/js/pages/pages/patient-labkits/labkit.vue
+++ b/resources/js/pages/pages/patient-labkits/labkit.vue
@@ -0,0 +1,199 @@
+<script setup>
+import { onBeforeMount, onMounted, onUnmounted } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import { useStore } from 'vuex';
+const store = useStore()
+const route = useRoute()
+const router = useRouter()
+const patientId = route.params.patient_id;
+const search = ref('')
+const getSelectedCart = ref('');
+const patientLabKitList = ref([])
+const getIsTonalSnackbarVisible = ref(false);
+const labkitStatus = ref('');
+
+
+
+onBeforeMount(async () => {});
+onMounted(async () => {
+  store.dispatch('updateIsLoading', true)
+  await store.dispatch('patientLabKitList', {
+    patient_id : patientId
+  })
+  console.log('patientLabKitList',store.getters.getPatientLabKitList.cart)
+  store.dispatch('updateIsLoading', false)
+ 
+});
+const getPatientLabKitList = computed(async () => {
+  patientLabKitList.value =  store.getters.getPatientLabKitList.cart;
+    
+  return patientLabKitList.value;  
+    
+});
+
+const onChange = (id)=> {
+  getSelectedCart.value = id;
+  
+}
+const onStatusChange = async(status) => {
+  console.log('Selected status:', status, getSelectedCart.value);
+  store.dispatch('updateIsLoading', true)
+  await store.dispatch('updateLabkitListStatus', {
+    cart_id : getSelectedCart.value,
+    status: status
+  })
+  labkitStatus.value =   store.getters.getPatientLabKitStatus.status;
+  getIsTonalSnackbarVisible.value = true;
+};
+
+onUnmounted(async () => {});
+const headers = [
+  {
+    title: 'NAME',
+    key: 'first_name',
+  },
+  {
+    title: 'Address',
+    key: 'shipping_address1',
+  },
+  {
+    title: 'Amount',
+    key: 'shipping_amount',
+  },
+  {
+    title: 'Status',
+    key: 'status',
+  },
+]
+const breadcrums = [
+    {
+        title: 'Patient',
+        disabled: false,
+        to: '/admin/patients',
+    },
+    {
+        title: 'Labkit',
+        disabled: false,
+    }
+    
+];
+
+
+</script>
+
+<template>
+  <v-breadcrumbs :items="breadcrums" class="text-primary pt-0 pb-0 mb-5">
+        <template v-slot:divider style="padding-top:0px; padding-bottom:0px">
+            >
+        </template>
+    </v-breadcrumbs>
+  <v-row>
+    <VSnackbar class="pl-0"  v-model="getIsTonalSnackbarVisible" :timeout="50000" location="top end" variant="flat"
+              color="success">
+              <VIcon
+                    class="ri-success-line success-icon pl-0"
+                  /> {{labkitStatus }}
+            </VSnackbar>
+    <v-col cols="12" md="12" v-if="getPatientLabKitList">
+      <v-card title="LabKits">
+      <VCardText >
+          <VRow>
+            <VCol
+              cols="12"
+              offset-md="8"
+              md="4"
+            >
+              <VTextField
+                v-model="search"
+                label="Search"
+                placeholder="Search ..."
+                append-inner-icon="ri-search-line"
+                single-line
+                hide-details
+                dense
+                outlined
+              />
+            </VCol>
+          </VRow>
+        </VCardText>
+      <VDataTable
+        :headers="headers"
+        :items="patientLabKitList"
+        :search="search"
+        :items-per-page="5"
+        class="text-no-wrap"
+      >
+      <template #item.id="{ item }">
+    {{ item.id }}
+  </template>
+        <!-- full name -->
+        <template #item.first_name="{ item }">
+          <div class="d-flex align-center">
+            <!-- avatar -->
+            <VAvatar
+              size="32"
+              :color="item.avatar ? '' : 'primary'"
+              :class="item.avatar ? '' : 'v-avatar-light-bg primary--text'"
+              :variant="!item.avatar ? 'tonal' : undefined"
+            >
+              <VImg
+                v-if="item.avatar"
+                :src="item.avatar"
+              />
+              <span
+                v-else
+                class="text-sm"
+              >{{ avatarText(item.first_name) }}</span>
+            </VAvatar>
+
+            <div class="d-flex flex-column ms-3">
+              <span class="d-block font-weight-medium text-high-emphasis text-truncate">{{ item.first_name }} {{ item.last_name }}</span>
+              <!-- <small>{{ item.post }}</small> -->
+            </div>
+          </div>
+        </template>
+        <!-- <template #item.first_name="{ item }">
+          <div class="d-flex align-center">
+            <span>{{ item.first_name }} {{ item.last_name }}</span>
+          </div>
+        </template> -->
+        <template #item.shipping_address1="{ item }">
+          <div class="d-flex align-center">
+            
+                
+            <span>{{ item.shipping_address1 }},
+               {{ item.shipping_address2 }},
+              {{ item.shipping_city }},
+              {{item.shipping_state}},
+              {{ item.shipping_zipcode}},
+              {{ item.shipping_country }}
+              </span>
+            
+          </div>
+        </template>
+        
+
+        
+
+        <!-- status -->
+        <template #item.status="{ item }">
+          <VSelect
+                  v-model="item.status"
+                  placeholder="Status"
+                  density="comfortable"
+                  :items="['Pending', 'Shipped', 'Delivered', 'Transit', 'Recevied', 'Result']"
+                  @update:model-value="onStatusChange"
+                  @click="onChange(item.id)"
+                  
+          />
+        </template>
+      </VDataTable>
+      </v-card>
+    </v-col>
+  </v-row>
+</template>
+<style scoped>
+.v-snackbar__content{
+  padding: 0px !important;
+}
+</style>
--- a/resources/js/pages/pages/patient-meetings/notes.vue
+++ b/resources/js/pages/pages/patient-meetings/notes.vue
@@ -0,0 +1,150 @@
+<script setup>
+import { onMounted, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import { useStore } from 'vuex';
+const store = useStore();
+const router = useRouter();
+const route = useRoute();
+const patientId = route.params.patient_id;
+const appointmentId = route.params.id;
+const notes = ref([]);
+
+const loadHistoryNotes = async () => {
+    console.log('Calling loadHistoryNotes');
+    store.dispatch('updateIsLoading', true);
+    console.log('Dispatching getHistoryPatientNotes action with', { patient_id: patientId, appointment_id: appointmentId });
+    // try {
+        // console.log('Dispatching getHistoryPatientNotes action with', { patient_id: patientId, appointment_id: appointmentId });
+        await store.dispatch('getHistoryPatientNotes', {
+            patient_id: patientId,
+            appointment_id: appointmentId,
+        });
+        let notesData = store.getters.getPatientNotes;
+        if (Array.isArray(notesData)) {
+            console.log('Fetched notesData:', notesData);
+            const formattedNotes = notesData
+                .filter(data => data.note_type === 'Notes')
+                .map(data => ({
+                    file_url: data.file_url,
+                    note: data.note,
+                    doctor: data.telemedPro.name,
+                    date: formatDateDate(data.created_at),
+                    id: data.id,
+                }))
+                .sort((a, b) => b.id - a.id);
+            notes.value = formattedNotes;
+        } else {
+            console.error("getPatientNotes did not return an array", notesData);
+        }
+    // } catch (error) {
+    //     console.error("Error loading patient notes:", error);
+    // } finally {
+    //     store.dispatch('updateIsLoading', false);
+    // }
+};
+
+onMounted(() => {
+    loadHistoryNotes();
+});
+
+const formatDateDate = (date) => {
+    const messageDate = new Date(date);
+    const options = {
+        year: 'numeric',
+        month: 'long',
+        day: 'numeric',
+        hour: '2-digit',
+        minute: '2-digit',
+    };
+    return messageDate.toLocaleDateString('en-US', options).replace(/\//g, '-');
+};
+const breadcrums = [
+    {
+        title: 'Meeting',
+        disabled: false,
+        to: '/admin/patient/meetings/'+patientId,
+    },
+    {
+        title: 'Notes',
+        disabled: false,
+    }
+    
+];
+const downloadFile = (fileUrl) => {
+    const link = document.createElement('a');
+    link.href = fileUrl;
+    link.download = 'noteFile.png';
+    document.body.appendChild(link);
+    link.click();
+    document.body.removeChild(link);
+};
+</script>
+
+<template>
+     <v-breadcrumbs :items="breadcrums" class="text-primary pt-0 pb-0 mb-5">
+        <template v-slot:divider style="padding-top:0px; padding-bottom:0px">
+            >
+        </template>
+    </v-breadcrumbs>
+
+  <VCard title="Notes">
+    <VCardText>
+      <VTimeline
+        side="end"
+        align="start"
+        line-inset="8"
+        truncate-line="both"
+        density="compact"
+      >
+
+        <!-- SECTION Timeline Item: Flight -->
+        <template v-for="(p_note, index) in notes" :key="index">
+            <VTimelineItem
+          dot-color="primary"
+          size="x-small"
+        >
+          <!-- 👉 Header -->
+          <div class="d-flex justify-space-between align-center gap-2 flex-wrap">
+            <span class="app-timeline-title">
+              {{p_note.note}}
+            </span>
+            <span class="app-timeline-meta">{{ p_note.date }}</span>
+            <!-- <span></span> -->
+          </div>
+
+          <!-- 👉 Content -->
+          <div class="app-timeline-text mb-1">
+            <span>{{ p_note.doctor }}</span>
+            <VIcon
+              size="20"
+              icon="tabler-arrow-right"
+              class="mx-2 flip-in-rtl"
+            />
+            <!-- <span>Heathrow Airport, London</span> -->
+          </div>
+
+          <!-- <p class="app-timeline-meta mb-2">
+            6:30 AM
+          </p> -->
+
+          <!-- <div class="app-timeline-text d-flex align-center gap-2">
+            <div>
+              <VImg
+                :src="pdf"
+                :width="22"
+              />
+            </div>
+
+            <span>booking-card.pdf</span>
+          </div> -->
+        </VTimelineItem>
+        </template>
+        
+        
+        <!-- !SECTION -->
+
+        <!-- !SECTION -->
+      </VTimeline>
+    </VCardText>
+  </VCard>
+</template>
--- a/resources/js/pages/pages/patient-meetings/prescription.vue
+++ b/resources/js/pages/pages/patient-meetings/prescription.vue
@@ -0,0 +1,421 @@
+<script setup>
+import { useRoute, useRouter } from 'vue-router';
+import { useStore } from 'vuex';
+const store = useStore();
+const router = useRouter()
+const route = useRoute()
+const itemsPrescriptions = ref([]);
+const patientId = route.params.patient_id;
+const appointmentId = route.params.id;
+const prescription = computed(async () => {
+    // console.log('computed=====')
+    await getprescriptionList()
+    // await store.dispatch('getHistoryPrescription')
+    // notes.value = store.getters.getHistoryPrescription;
+    // console.log("getHistoryPrescription", notes.value);
+    // store.dispatch('updateIsLoading', false)
+});
+
+const getprescriptionList = async () => {
+    await store.dispatch('getPrescriptions', {
+        patient_id: patientId,
+        appointment_id: appointmentId,
+    })
+    let prescriptions = store.getters.getPrescriptionList
+    // console.log("BeforeOverviewItem", prescriptions);
+    // itemsPrescriptions.value = store.getters.getPrescriptionList
+    for (let data of prescriptions) {
+        let dataObject = {}
+        dataObject.brand = data.brand
+        dataObject.direction_one = data.direction_one
+        dataObject.direction_quantity = data.direction_quantity
+        dataObject.direction_two = data.direction_two
+        dataObject.date = formatDateDate(data.date)
+        dataObject.dosage = data.dosage
+        dataObject.from = data.from
+        dataObject.name = data.name
+        dataObject.quantity = data.quantity
+        dataObject.id = data.id
+        dataObject.doctor = data.doctor.name
+        dataObject.refill_quantity = data.refill_quantity
+        dataObject.status = data.status
+        dataObject.comments = data.comments
+        itemsPrescriptions.value.push(dataObject)
+    }
+    itemsPrescriptions.value.sort((a, b) => {
+        return b.id - a.id;
+    });
+    console.log("OverviewItem", itemsPrescriptions.value);
+};
+const formatDateDate = (date) => {
+    const messageDate = new Date(date);
+    const options = {
+        year: 'numeric',
+        month: 'long',
+        day: 'numeric',
+        hour: '2-digit',
+        minute: '2-digit'
+    };
+    return messageDate.toLocaleDateString('en-US', options).replace(/\//g, '-');
+};
+const getStatusColor = (status) => {
+    switch (status) {
+        case 'pending':
+            return 'warning'; // Use Vuetify's warning color (typically yellow)
+        case 'shipped':
+            return '#45B8AC'; // Use Vuetify's primary color (typically blue)
+        case 'delivered':
+            return 'success';
+        case 'returned':
+            return 'red';
+        case 'results':
+            return 'blue';
+        default:
+            return 'grey'; // Use Vuetify's grey color for any other status
+    }
+};
+const resolveStatusVariant = status => {
+  if (status === 1)
+    return {
+      color: 'primary',
+      text: 'Current',
+    }
+  else if (status === 2)
+    return {
+      color: 'success',
+      text: 'Professional',
+    }
+  else if (status === 3)
+    return {
+      color: 'error',
+      text: 'Rejected',
+    }
+  else if (status === 4)
+    return {
+      color: 'warning',
+      text: 'Resigned',
+    }
+  else
+    return {
+      color: 'info',
+      text: 'Applied',
+    }
+}
+const headers = [
+  {
+    title: '',
+    key: 'id',
+    sortable: false,
+  },
+  {
+    title: 'Name',
+    key: 'name',
+  },
+  {
+    title: 'Date',
+    key: 'date',
+  },
+  {
+    title: 'Status',
+    key: 'status',
+  },
+]
+const prescriptionIndex = ref([]);
+const prescriptionItem = ref(-1)
+const prescriptionDialog = ref(false)
+const getSelectedCart = ref('');
+const getIsTonalSnackbarVisible = ref(false);
+const prescriptionStatus = ref('');
+const selectedItem = ref(null);
+const showDetail = item => {
+    // console.log("id",item);
+  prescriptionIndex.value = item
+  selectedItem.value = item;
+//   console.log("index",prescriptionIndex.value);
+//   prescriptionItem.value = { ...item }
+  prescriptionDialog.value = true
+}
+const close = () => {
+  prescriptionDialog.value = false
+  prescriptionIndex.value = -1
+  prescriptionItem.value = { ...defaultItem.value }
+}
+const breadcrums = [
+    {
+        title: 'Meeting',
+        disabled: false,
+        to: '/admin/patient/meetings/'+patientId,
+    },
+    {
+        title: 'Prescription',
+        disabled: false,
+    }
+    
+];
+
+const onChange = (id)=> {
+  getSelectedCart.value = id;
+  
+}
+const onStatusChange = async(status) => {
+  console.log('Selected status:', status, getSelectedCart.value);
+   store.dispatch('updateIsLoading', true)
+   await store.dispatch('updatePrescriptionStatus', {
+      prescription_id : getSelectedCart.value,
+      status: status
+  })
+  console.log('Selected:', store.getters.getPatientPrescriptionStatus);
+  prescriptionStatus.value =   store.getters.getPatientPrescriptionStatus.status;
+  getIsTonalSnackbarVisible.value = true;
+};
+
+</script>
+<template>
+    <v-breadcrumbs :items="breadcrums" class="text-primary pt-0 pb-0 mb-5">
+        <template v-slot:divider style=" padding-block:0 0">
+            >
+        </template>
+    </v-breadcrumbs>
+    <VSnackbar class="pl-0"  v-model="getIsTonalSnackbarVisible" :timeout="50000" location="top end" variant="flat"
+              color="success">
+              <VIcon
+                    class="ri-success-line success-icon pl-0"
+                  /> {{prescriptionStatus }}
+            </VSnackbar>
+    <v-row>
+    <v-col cols="12" md="12" v-if="itemsPrescriptions">
+      <v-card title="Prescriptions" v-if="prescription">
+      <VCardText >
+          <VRow>
+            <VCol
+              cols="12"
+              offset-md="8"
+              md="4"
+            >
+              <VTextField
+                v-model="search"
+                label="Search"
+                placeholder="Search ..."
+                append-inner-icon="ri-search-line"
+                single-line
+                hide-details
+                dense
+                outlined
+              />
+            </VCol>
+          </VRow>
+        </VCardText>
+      <VDataTable
+        :headers="headers"
+        :items="itemsPrescriptions"
+        :search="search"
+        :items-per-page="5"
+        class="text-no-wrap"
+      >
+            <!-- <template #item.id="{ item }">
+            {{ item.id }}
+            </template> -->
+        <!-- full name -->
+        <!-- status -->
+        <template #item.status="{ item }">
+          <VSelect
+              v-model="item.status"
+              placeholder="Status"
+              density="comfortable"
+              :items="['Pending', 'Shipped', 'Delivered', 'Transit', 'Recevied', 'Result']"
+              @update:model-value="onStatusChange"
+              @click="onChange(item.id)"
+          />
+         </template>
+
+        <!-- <template #item.status="{ item }">
+          <VChip
+            :color="getStatusColor(item.status)"
+            density="comfortable"
+          >
+            {{ getStatusColor(item.status) }}
+          </VChip>
+        </template> -->
+
+        <!-- Actions -->
+        <template #item.id="{ item }">
+          <div class="gap-1 details cursor-pointer" @click=showDetail(item)> +
+             
+          </div>
+        </template>
+      </VDataTable>
+      </v-card>
+    </v-col>
+  </v-row>
+    <VDialog
+    v-model="prescriptionDialog"
+    max-width="600px"
+  >
+    <VCard :title=prescriptionIndex.name>
+    <DialogCloseBtn
+        variant="text"
+        size="default"
+        @click="[prescriptionDialog = false,selectedItem = '']"
+      />
+      <VCardText>
+            <v-row class='mt-0'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>Brand:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="4" sm="6">
+                            <p>{{ prescriptionIndex.brand }}</p>
+                        </v-col>
+                    </v-row>
+                     <VDivider></VDivider>
+                    <v-row class='mt-1'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>From:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="4" sm="6">
+                            <p>{{ prescriptionIndex.from }}</p>
+                        </v-col>
+                    </v-row>
+                     <VDivider></VDivider>
+                    <v-row class='mt-1'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>Dosage:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="4" sm="6">
+                            <p>{{ prescriptionIndex.dosage }}</p>
+                        </v-col>
+                    </v-row>
+                     <VDivider></VDivider>
+                    <v-row class='mt-1'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>Quantity:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="4" sm="6">
+                            <p>{{ prescriptionIndex.quantity }}</p>
+                        </v-col>
+                    </v-row>
+                     <VDivider></VDivider>
+                    <v-row class='mt-1'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>Direction Quantity:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="8" sm="6">
+                            <p>{{ prescriptionIndex.direction_quantity }}</p>
+                        </v-col>
+                    </v-row>
+                     <VDivider></VDivider>
+                    <v-row class='mt-1'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>Direction One:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="8" sm="6">
+                            <p>{{ prescriptionIndex.direction_one }} </p>
+                        </v-col>
+                    </v-row>
+                     <VDivider></VDivider>
+                    <v-row class='mt-1'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>Direction Two:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="8" sm="6">
+                            <p>{{ prescriptionIndex.direction_two }} </p>
+                        </v-col>
+                    </v-row>
+                     <VDivider></VDivider>
+                    <v-row class='mt-1'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>Refill Quantity:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="8" sm="6">
+                            <p>{{ prescriptionIndex.refill_quantity }}</p>
+                        </v-col>
+
+                    </v-row>
+                     <VDivider></VDivider>
+                    <v-row class='mt-1'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>Status:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="8" sm="6">
+                            <p v-if="prescriptionIndex.status == null" class="text-warning">Pending</p>
+                            <p v-else>{{ prescriptionIndex.status }}</p>
+                        </v-col>
+                    </v-row>
+                     <VDivider></VDivider>
+                    <v-row class='mt-1 pb-0'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>Comments:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="8" sm="8">
+                            <p>{{ prescriptionIndex.comments }} </p>
+                        </v-col>
+
+                    </v-row>
+                    
+      </VCardText>
+    </VCard>
+    
+  </VDialog>
+</template>
+
+<style lang="scss">
+button.v-expansion-panel-title {
+  background-color: #003152 !important;
+  color: #fff;
+}
+
+button.v-expansion-panel-title.bg-secondary {
+  background-color: #003152 !important;
+  color: #fff;
+}
+
+button.v-expansion-panel-title {
+  background-color: #003152 !important;
+  color: #fff;
+}
+
+span.v-expansion-panel-title__icon {
+  color: #fff
+}
+
+// button.v-expansion-panel-title.bg-secondary {
+//     background-color: rgba(var(--v-theme-primary), var(--v-activated-opacity)) !important;
+// }
+
+// button.v-expansion-panel-title {
+//     background-color: rgba(var(--v-theme-primary), var(--v-activated-opacity)) !important;
+// }
+
+// button.v-expansion-panel-title.v-expansion-panel-title--active {
+//     background-color: rgba(var(--v-theme-primary), var(--v-activated-opacity)) !important;
+// }
+
+.v-expansion-panel {
+  overflow: hidden;
+  border-radius: 16px;
+  background-color: #fff;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 10%);
+  margin-block-end: 10px;
+  transition: box-shadow 0.3s ease;
+}
+
+.details {
+  position: relative;
+  box-sizing: content-box;
+  border: 2px solid #fff;
+  border-radius: 1em;
+  background-color: #696cff;
+  block-size: 0.85em;
+  box-shadow: 0 0 3px rgba(67, 89, 113, 80%);
+  color: #fff;
+  content: "+";
+  font-family: "Courier New", Courier, monospace;
+  font-weight: 500;
+  inline-size: 0.85em;
+  inset-block-start: 50%;
+  inset-block-start: 0.7em;
+  inset-inline-start: 50%;
+  line-height: 0.9em;
+  text-align: center;
+  transform: translate(-50%, -50%);
+}
+</style>
--- a/resources/js/pages/patients/NotesPanel.vue
+++ b/resources/js/pages/patients/NotesPanel.vue
@@ -0,0 +1,108 @@
+<script setup>
+import { ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import { useStore } from 'vuex';
+const store = useStore();
+const router = useRouter();
+const route = useRoute();
+const patientId = route.params.patient_id;
+const appointmentId = route.params.id;
+const notes = ref([]);
+const props = defineProps({
+  notesData: {
+    type: Object,
+    required: true,
+  },
+})
+
+
+
+const formatDateDate = (date) => {
+    const messageDate = new Date(date);
+    const options = {
+        year: 'numeric',
+        month: 'long',
+        day: 'numeric',
+        hour: '2-digit',
+        minute: '2-digit',
+    };
+    return messageDate.toLocaleDateString('en-US', options).replace(/\//g, '-');
+};
+
+const downloadFile = (fileUrl) => {
+    const link = document.createElement('a');
+    link.href = fileUrl;
+    link.download = 'noteFile.png';
+    document.body.appendChild(link);
+    link.click();
+    document.body.removeChild(link);
+};
+</script>
+
+<template>
+     
+
+  <VCard title="Notes">
+    <VCardText>
+      <VTimeline
+        side="end"
+        align="start"
+        line-inset="8"
+        truncate-line="both"
+        density="compact"
+      >
+
+        <!-- SECTION Timeline Item: Flight -->
+        
+        <template v-for="(p_note, index) in props.notesData.patientNotes" :key="index" v-if="props.notesData.patientNotes.length>0">
+            <VTimelineItem
+          dot-color="primary"
+          size="x-small"
+        >
+          <!-- 👉 Header -->
+          <div class="d-flex justify-space-between align-center gap-2 flex-wrap">
+            <span class="app-timeline-title">
+              {{p_note.note}}
+            </span>
+          
+            <span class="app-timeline-meta">{{ formatDateDate(p_note.created_at) }}</span>
+            <!-- <span></span> -->
+          </div>
+
+          <!-- 👉 Content -->
+          <div class="app-timeline-text mb-1">
+            <span>{{ p_note.telemedPro.name }}</span>
+            <VIcon
+              size="20"
+              icon="tabler-arrow-right"
+              class="mx-2 flip-in-rtl"
+            />
+            <!-- <span>Heathrow Airport, London</span> -->
+          </div>
+
+          <!-- <p class="app-timeline-meta mb-2">
+            6:30 AM
+          </p> -->
+
+          <!-- <div class="app-timeline-text d-flex align-center gap-2">
+            <div>
+              <VImg
+                :src="pdf"
+                :width="22"
+              />
+            </div>
+
+            <span>booking-card.pdf</span>
+          </div> -->
+        </VTimelineItem>
+        </template>
+
+
+     
+        <!-- !SECTION -->
+
+        <!-- !SECTION -->
+      </VTimeline>
+    </VCardText>
+  </VCard>
+</template>
--- a/resources/js/pages/patients/PatienTabOverview.vue
+++ b/resources/js/pages/patients/PatienTabOverview.vue
@@ -0,0 +1,202 @@
+<script setup>
+import moment from 'moment';
+import { onBeforeMount, onMounted, onUnmounted, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import { useStore } from 'vuex';
+
+const store = useStore();
+const router = useRouter();
+const route = useRoute();
+const editDialog = ref(false);
+const deleteDialog = ref(false);
+const search = ref('');
+const appointmentId = ref('');
+const defaultItem = ref({
+  id: -1,
+  avatar: '',
+  name: '',
+  email: '',
+  dob: '',
+  phone_no: '',
+});
+
+const editedItem = ref({ ...defaultItem.value });
+const editedIndex = ref(-1);
+const patientMeetingList = ref([]);
+const isLoading = ref(false);
+
+// Status options
+const selectedOptions = [
+  { text: 'Active', value: 1 },
+  { text: 'InActive', value: 2 },
+];
+
+const refVForm = ref(null);
+
+// Headers
+const headers = [
+  // { title: 'Appointment Id', key: 'id' },
+  { title: 'Patient', key: 'patient_name' },
+  // { key: 'appointment_date', sortable: false, title: 'Date' },
+  { key: 'start_time', title: 'Start Time' },
+  { key: 'end_time', title: 'End Time' },
+  { key: 'duration', title: 'Duration' },
+  { title: 'ACTIONS', key: 'actions' },
+];
+
+// Utility functions
+function changeDateFormat(dateFormat) {
+  if (dateFormat) {
+    const [datePart, timePart] = dateFormat.split(' ');
+    const [year, month, day] = datePart.split('-');
+    const formattedDate = `${parseInt(month)}-${parseInt(day)}-${year}`;
+    return `${formattedDate} ${timePart}`;
+  }
+  return dateFormat;
+}
+
+function changeFormat(dateFormat) {
+  const [year, month, day] = dateFormat.split('-');
+  return `${parseInt(month)}-${parseInt(day)}-${year}`;
+}
+
+function totalCallDuration(start_time, end_time) {
+  const startMoment = moment(start_time);
+  const endMoment = moment(end_time);
+  const duration = moment.duration(endMoment.diff(startMoment));
+  const hours = String(duration.hours()).padStart(2, '0');
+  const minutes = String(duration.minutes()).padStart(2, '0');
+  const seconds = String(duration.seconds()).padStart(2, '0');
+  
+  if (hours === '00' && minutes === '00') {
+    return `00:00:${seconds}`;
+  } else if (hours === '00') {
+    return `00:${minutes}:${seconds}`;
+  } else {
+    return `${hours}:${minutes}:${seconds}`;
+  }
+}
+
+// Fetch and process the patient meeting list
+const getPatientMeetingList = async () => {
+  store.dispatch('updateIsLoading', true);
+  await store.dispatch('patientMeetingList', { id: route.params.id });
+  store.dispatch('updateIsLoading', false);
+
+  let list = store.getters.getPatientMeetingList;
+  patientMeetingList.value = list.map(history => ({
+    ...history,
+    appointment_date: changeFormat(history.appointment_date),
+    start_time: changeDateFormat(history.start_time),
+    end_time: changeDateFormat(history.end_time),
+    duration: totalCallDuration(history.start_time, history.end_time),
+  }));
+  console.log(list);
+};
+
+// Lifecycle hooks
+onBeforeMount(() => {});
+onMounted(async () => {
+  await getPatientMeetingList();
+  
+});
+onUnmounted(() => {});
+const historyDetail = (item, value) => {
+    console.log('item',item.id ,value)
+    if(value == 'notes')
+    router.push('/admin/patient/meeting/notes/' + route.params.id + '/' + item.id);
+    if(value == 'prescription')
+    router.push('/admin/patient/meeting/prescription/' + route.params.id + '/' + item.id);
+}
+const menusVariant = [
+  'primary'
+];
+const options = [
+  {
+    title: 'Notes',
+    key: 'notes',
+  },
+  {
+    title: 'Prescription',
+    key: 'prescription',
+  },
+  
+]
+const breadcrums = [
+    {
+        title: 'Patient',
+        disabled: false,
+        to: '/admin/patients',
+    },
+    {
+        title: 'Meetings',
+        disabled: false,
+    }
+    
+];
+</script>
+
+<template>
+
+  <v-row>
+    <v-col cols="12" md="12">
+      <v-card title="Meetings">
+        <v-card-text>
+          <v-row>
+            <v-col cols="12" offset-md="8" md="4">
+              <v-text-field
+                v-model="search"
+                label="Search"
+                placeholder="Search ..."
+                append-inner-icon="ri-search-line"
+                single-line
+                hide-details
+                dense
+                outlined
+              />
+            </v-col>
+          </v-row>
+        </v-card-text>
+        <v-data-table
+          :headers="headers"
+          :items="patientMeetingList"
+          :search="search"
+          :items-per-page="5"
+          class="text-no-wrap"
+        >
+          <template #item.id="{ item }">{{ item.id }}</template>
+          <template #item.duration="{ item }">{{ item.duration }}</template>
+          <!-- Actions -->
+          <template #item.actions="{ item }">
+          <div class="demo-space-x">
+          <VMenu
+            v-for="menu in menusVariant"
+            :key="menu"
+          >
+            <template #activator="{ props }">
+              
+                <i class="ri-more-2-line cursor-pointer" style="font-size: 32px;" v-bind="props"></i>
+              
+            </template>
+
+            <v-list>
+            <v-list-item
+              v-for="opt in options"
+              :key="opt.value"
+              @click="historyDetail(item, opt.key)"
+            >
+              {{ opt.title }}
+            </v-list-item>
+          </v-list>
+          </VMenu>
+        </div>
+            <!-- <div class="d-flex gap-1">
+              <VBtn class="text-capitalize text-white" @click="historyDetail(item)"> Detail
+                            </VBtn>
+            </div> -->
+          </template>
+        </v-data-table>
+      </v-card>  
+    </v-col>
+  </v-row>
+</template>
--- a/resources/js/pages/patients/PatientBioPanel.vue
+++ b/resources/js/pages/patients/PatientBioPanel.vue
@@ -0,0 +1,361 @@
+<script setup>
+const props = defineProps({
+  userData: {
+    type: Object,
+    required: true,
+  },
+})
+
+const standardPlan = {
+  plan: 'Standard',
+  price: 99,
+  benefits: [
+    '10 Users',
+    'Up to 10GB storage',
+    'Basic Support',
+  ],
+}
+
+const isUserInfoEditDialogVisible = ref(false)
+const isUpgradePlanDialogVisible = ref(false)
+
+const resolveUserStatusVariant = stat => {
+  if (stat === 'pending')
+    return 'warning'
+  if (stat === 'active')
+    return 'success'
+  if (stat === 'inactive')
+    return 'secondary'
+  
+  return 'primary'
+}
+
+const resolveUserRoleVariant = role => {
+  if (role === 'subscriber')
+    return {
+      color: 'primary',
+      icon: 'ri-user-line',
+    }
+  if (role === 'author')
+    return {
+      color: 'warning',
+      icon: 'ri-settings-2-line',
+    }
+  if (role === 'maintainer')
+    return {
+      color: 'success',
+      icon: 'ri-database-2-line',
+    }
+  if (role === 'editor')
+    return {
+      color: 'info',
+      icon: 'ri-pencil-line',
+    }
+  if (role === 'admin')
+    return {
+      color: 'error',
+      icon: 'ri-server-line',
+    }
+  
+  return {
+    color: 'primary',
+    icon: 'ri-user-line',
+  }
+}
+</script>
+
+<template>
+  <VRow>
+    <!-- SECTION User Details -->
+    <VCol cols="12">
+      <VCard v-if="props.userData">
+        <VCardText class="text-center pt-12 pb-6">
+          <!-- 👉 Avatar -->
+          <VAvatar
+            rounded
+            :size="120"
+            :color="!props.userData.patient.avatar ? 'primary' : undefined"
+            :variant="!props.userData.patient.avatar ? 'tonal' : undefined"
+          >
+            <VImg
+              v-if="props.userData.patient.avatar"
+              :src="props.userData.patient.avatar"
+            />
+            <span
+              v-else
+              class="text-5xl font-weight-medium"
+            >
+              {{ avatarText(props.userData.patient.first_name) }}
+            </span>
+          </VAvatar>
+
+          <!-- 👉 User fullName -->
+          <h5 class="text-h5 mt-4">
+            {{ props.userData.patient.first_name }}  {{ props.userData.patient.last_name }}
+          </h5>
+
+          <!-- 👉 Role chip -->
+          <VChip
+            :color="resolveUserRoleVariant('Patient').color"
+            size="small"
+            class="text-capitalize mt-4"
+          >
+            Patient
+          </VChip>
+        </VCardText>
+
+      
+
+        <!-- 👉 Details -->
+        <VCardText class="pb-6">
+          <h5 class="text-h5">
+            Details
+          </h5>
+
+          <VDivider class="my-4" />
+
+          <!-- 👉 User Details list -->
+          <VList class="card-list">
+             <VListItem>
+              <VListItemTitle class="text-sm">
+                <span class="font-weight-medium">
+                  Email:
+                </span>
+                <span class="text-body-1">{{ props.userData.patient.email }}</span>
+              </VListItemTitle>
+            </VListItem>
+
+            <VListItem>
+              <VListItemTitle class="text-sm">
+                <span class="font-weight-medium">
+                  Address:
+                </span>
+                <span class="text-body-1">{{ props.userData.patient.address }}</span>
+              </VListItemTitle>
+            </VListItem>
+            <VListItem>
+              <VListItemTitle class="text-sm">
+                <span class="font-weight-medium">
+                  City:
+                </span>
+                <span class="text-body-1">{{ props.userData.patient.city }}</span>
+              </VListItemTitle>
+            </VListItem>
+            <VListItem>
+              <VListItemTitle class="text-sm">
+                <span class="font-weight-medium">
+                  State:
+                </span>
+                <span class="text-body-1">{{ props.userData.patient.state }}</span>
+              </VListItemTitle>
+            </VListItem>
+            <VListItem>
+              <VListItemTitle class="text-sm">
+                <span class="font-weight-medium">
+                  Zip:
+                </span>
+                <span class="text-body-1">{{ props.userData.patient.zip_code }}</span>
+              </VListItemTitle>
+            </VListItem>
+            <VListItem>
+              <VListItemTitle class="text-sm">
+                <span class="font-weight-medium">
+                  Status:
+                </span>
+                <VChip
+                  size="small"
+                  :color="resolveUserStatusVariant('Active')"
+                  class="text-capitalize"
+                >
+                  Active
+                </VChip>
+              </VListItemTitle>
+            </VListItem>
+
+            <VListItem>
+              <VListItemTitle class="text-sm">
+                <span class="font-weight-medium">Role: </span>
+                <span class="text-capitalize text-body-1">Patient</span>
+              </VListItemTitle>
+            </VListItem>
+
+           
+
+            <VListItem>
+              <VListItemTitle class="text-sm">
+                <span class="font-weight-medium">
+                  Contact:
+                </span>
+                <span class="text-body-1">{{ props.userData.patient.phone_no }}</span>
+              </VListItemTitle>
+            </VListItem>
+
+
+            <VListItem>
+              <VListItemTitle class="text-sm">
+                <span class="font-weight-medium">
+                  Country:
+                </span>
+                <span class="text-body-1">{{ props.userData.patient.country }}</span>
+              </VListItemTitle>
+            </VListItem>
+          </VList>
+        </VCardText>
+
+        <!-- 👉 Edit and Suspend button -->
+        <VCardText class="d-flex justify-center">
+          <VBtn
+            variant="elevated"
+            class="me-4"
+            @click="isUserInfoEditDialogVisible = true"
+          >
+            Edit
+          </VBtn>
+          <VBtn
+            variant="outlined"
+            color="error"
+          >
+            Suspend
+          </VBtn>
+        </VCardText>
+      </VCard>
+    </VCol>
+    <!-- !SECTION -->
+
+    <!-- SECTION Current Plan -->
+    <VCol cols="12"    v-if="props.userData.plans[0]">
+      <VCard
+        flat
+        class="current-plan"
+     
+      >
+        <VCardText class="d-flex">
+          <!-- 👉 Standard Chip -->
+          <VChip
+            color="primary"
+            size="small"
+          >
+            {{ props.userData.plans[0].title }}
+          </VChip>
+
+          <VSpacer />
+
+          <!-- 👉 Current Price  -->
+          <div class="d-flex align-center">
+            <sup class="text-primary text-lg font-weight-medium">  {{ props.userData.plans[0].currency }}</sup>
+            <h1 class="text-h1 text-primary">
+              {{ props.userData.plans[0].price }}
+            </h1>
+            <sub class="mt-3"><h6 class="text-h6 font-weight-regular">month</h6></sub>
+          </div>
+        </VCardText>
+
+        <VCardText>
+          <!-- 👉 Price Benefits -->
+          <VList class="card-list">
+            <VListItem
+            >
+              <div class="d-flex align-center">
+                <VIcon
+                  size="10"
+                  color="medium-emphasis"
+                  class="me-2"
+                  icon="ri-circle-fill"
+                />
+                <div class="text-medium-emphasis">
+                  {{ props.userData.plans[0].list_one_title }}
+                </div>
+              </div>
+            </VListItem>
+             <VListItem
+            >
+              <div class="d-flex align-center">
+                <VIcon
+                  size="10"
+                  color="medium-emphasis"
+                  class="me-2"
+                  icon="ri-circle-fill"
+                />
+                <div class="text-medium-emphasis">
+                  {{ props.userData.plans[0].list_sub_title }}
+                </div>
+              </div>
+            </VListItem>
+         
+             <VListItem
+            >
+              <div class="d-flex align-center">
+                <VIcon
+                  size="10"
+                  color="medium-emphasis"
+                  class="me-2"
+                  icon="ri-circle-fill"
+                />
+                <div class="text-medium-emphasis">
+                  {{ props.userData.plans[0].list_two_title }}
+                </div>
+              </div>
+            </VListItem>
+          </VList>
+
+          <!-- 👉 Days -->
+          <div class="my-6">
+            <div class="d-flex mt-3 mb-2">
+              <h6 class="text-h6 font-weight-medium">
+                Days
+              </h6>
+              <VSpacer />
+              <h6 class="text-h6 font-weight-medium">
+                26 of 30 Days
+              </h6>
+            </div>
+
+            <!-- 👉 Progress -->
+            <VProgressLinear
+              rounded
+              :model-value="86"
+              height="8"
+              color="primary"
+            />
+
+            <p class="text-sm mt-1">
+              4 days remaining
+            </p>
+          </div>
+
+          <!-- 👉 Upgrade Plan -->
+          <VBtn
+            block
+            @click="isUpgradePlanDialogVisible = true"
+          >
+            Upgrade Plan
+          </VBtn>
+        </VCardText>
+      </VCard>
+    </VCol>
+    <!-- !SECTION -->
+  </VRow>
+
+  <!-- 👉 Edit user info dialog -->
+  <UserInfoEditDialog
+    v-model:isDialogVisible="isUserInfoEditDialogVisible"
+    :user-data="props.userData"
+  />
+
+  <!-- 👉 Upgrade plan dialog -->
+  <UserUpgradePlanDialog v-model:isDialogVisible="isUpgradePlanDialogVisible" />
+</template>
+
+<style lang="scss" scoped>
+.card-list {
+  --v-card-list-gap: .5rem;
+}
+
+.current-plan {
+  border: 2px solid rgb(var(--v-theme-primary));
+}
+
+.text-capitalize {
+  text-transform: capitalize !important;
+}
+</style>
--- a/resources/js/pages/patients/PrescriptionPanel.vue
+++ b/resources/js/pages/patients/PrescriptionPanel.vue
@@ -0,0 +1,352 @@
+<script setup>
+import { useRoute, useRouter } from 'vue-router';
+import { useStore } from 'vuex';
+const store = useStore();
+const router = useRouter()
+const route = useRoute()
+const itemsPrescriptions = ref([]);
+const patientId = route.params.patient_id;
+const props = defineProps({
+  prescriptionData: {
+    type: Object,
+    required: true,
+  },
+})
+const prescription = computed(async () => {
+    console.log('computed=====')
+    await getprescriptionList()
+   
+});
+
+const getprescriptionList = async () => {
+ 
+    let prescriptions = props.prescriptionData.prescriptionData
+    console.log("BeforeOverviewItem", prescriptions);
+    // itemsPrescriptions.value = store.getters.getPrescriptionList
+    for (let data of prescriptions) {
+      let dataObject = {}
+         dataObject.name = data.prescription.name
+          dataObject.brand = data.prescription.brand
+          dataObject.from = data.prescription.from
+          dataObject.direction_quantity = data.prescription.direction_quantity
+          dataObject.dosage = data.prescription.dosage
+          dataObject.quantity = data.prescription.quantity
+          dataObject.refill_quantity = data.prescription.refill_quantity
+          dataObject.actions = ''
+          dataObject.id = data.prescription.id
+          dataObject.comments = data.comments
+          dataObject.direction_one = data.direction_one
+          dataObject.direction_two= data.direction_two
+          dataObject.status = data.status
+  
+        dataObject.date = formatDateDate(data.created_at)
+        
+        itemsPrescriptions.value.push(dataObject)
+    }
+    console.log(itemsPrescriptions.value)
+    itemsPrescriptions.value.sort((a, b) => {
+        return b.id - a.id;
+    });
+    console.log("OverviewItem", itemsPrescriptions.value);
+};
+const formatDateDate = (date) => {
+    const messageDate = new Date(date);
+    const options = {
+        year: 'numeric',
+        month: 'long',
+        day: 'numeric',
+        hour: '2-digit',
+        minute: '2-digit'
+    };
+    return messageDate.toLocaleDateString('en-US', options).replace(/\//g, '-');
+};
+const getStatusColor = (status) => {
+    switch (status) {
+        case 'pending':
+            return 'warning'; // Use Vuetify's warning color (typically yellow)
+        case 'shipped':
+            return '#45B8AC'; // Use Vuetify's primary color (typically blue)
+        case 'delivered':
+            return 'success';
+        case 'returned':
+            return 'red';
+        case 'results':
+            return 'blue';
+        default:
+            return 'grey'; // Use Vuetify's grey color for any other status
+    }
+};
+const resolveStatusVariant = status => {
+  if (status === 1)
+    return {
+      color: 'primary',
+      text: 'Current',
+    }
+  else if (status === 2)
+    return {
+      color: 'success',
+      text: 'Professional',
+    }
+  else if (status === 3)
+    return {
+      color: 'error',
+      text: 'Rejected',
+    }
+  else if (status === 4)
+    return {
+      color: 'warning',
+      text: 'Resigned',
+    }
+  else
+    return {
+      color: 'info',
+      text: 'Applied',
+    }
+}
+const headers = [
+ 
+  {
+    title: 'Name',
+    key: 'name',
+  },
+  {
+    title: 'Date',
+    key: 'date',
+  },
+  {
+    title: 'Status',
+    key: 'status',
+  },
+]
+const prescriptionIndex = ref([]);
+const prescriptionItem = ref(-1)
+const prescriptionDialog = ref(false)
+const selectedItem = ref(null);
+const showDetail = item => {
+    // console.log("id",item);
+  prescriptionIndex.value = item
+  selectedItem.value = item;
+//   console.log("index",prescriptionIndex.value);
+//   prescriptionItem.value = { ...item }
+  prescriptionDialog.value = true
+}
+const close = () => {
+  prescriptionDialog.value = false
+  prescriptionIndex.value = -1
+  prescriptionItem.value = { ...defaultItem.value }
+}
+
+</script>
+<template>
+  
+    <v-row>
+    <v-col cols="12" md="12" v-if="itemsPrescriptions">
+      <v-card title="Prescriptions" v-if="prescription">
+      <VCardText >
+          
+        </VCardText>
+      <VDataTable
+        :headers="headers"
+        :items="itemsPrescriptions"
+        :items-per-page="5"
+        class="text-no-wrap"
+      >
+            
+        <!-- full name -->
+        <!-- status -->
+        <template #item.status="{ item }">
+          <VChip
+            :color="getStatusColor(item.status)"
+            density="comfortable"
+          >
+            {{ getStatusColor(item.status) }}
+          </VChip>
+        </template>
+
+        <!-- Actions -->
+        <template #item.name="{ item }">
+        <router-link
+                  :to="{ name: 'admin-patient-profile', params: { id: item.id } }"
+                  class="text-high-emphasis  "
+                  @click.prevent=showDetail(item)
+                >
+                {{ item.name }} 
+                </router-link>
+       
+        </template>
+      </VDataTable>
+      </v-card>
+    </v-col>
+  </v-row>
+    <VDialog
+    v-model="prescriptionDialog"
+    max-width="600px"
+  >
+    <VCard :title=prescriptionIndex.name>
+    <DialogCloseBtn
+        variant="text"
+        size="default"
+        @click="[prescriptionDialog = false,selectedItem = '']"
+      />
+      <VCardText>
+            <v-row class='mt-0'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>Brand:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="4" sm="6">
+                            <p>{{ prescriptionIndex.brand }}</p>
+                        </v-col>
+                    </v-row>
+                     <VDivider></VDivider>
+                    <v-row class='mt-1'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>From:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="4" sm="6">
+                            <p>{{ prescriptionIndex.from }}</p>
+                        </v-col>
+                    </v-row>
+                     <VDivider></VDivider>
+                    <v-row class='mt-1'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>Dosage:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="4" sm="6">
+                            <p>{{ prescriptionIndex.dosage }}</p>
+                        </v-col>
+                    </v-row>
+                     <VDivider></VDivider>
+                    <v-row class='mt-1'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>Quantity:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="4" sm="6">
+                            <p>{{ prescriptionIndex.quantity }}</p>
+                        </v-col>
+                    </v-row>
+                     <VDivider></VDivider>
+                    <v-row class='mt-1'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>Direction Quantity:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="8" sm="6">
+                            <p>{{ prescriptionIndex.direction_quantity }}</p>
+                        </v-col>
+                    </v-row>
+                     <VDivider></VDivider>
+                    <v-row class='mt-1'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>Direction One:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="8" sm="6">
+                            <p>{{ prescriptionIndex.direction_one }} </p>
+                        </v-col>
+                    </v-row>
+                     <VDivider></VDivider>
+                    <v-row class='mt-1'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>Direction Two:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="8" sm="6">
+                            <p>{{ prescriptionIndex.direction_two }} </p>
+                        </v-col>
+                    </v-row>
+                     <VDivider></VDivider>
+                    <v-row class='mt-1'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>Refill Quantity:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="8" sm="6">
+                            <p>{{ prescriptionIndex.refill_quantity }}</p>
+                        </v-col>
+
+                    </v-row>
+                     <VDivider></VDivider>
+                    <v-row class='mt-1'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>Status:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="8" sm="6">
+                            <p v-if="prescriptionIndex.status == null" class="text-warning">Pending</p>
+                            <p v-else>{{ prescriptionIndex.status }}</p>
+                        </v-col>
+                    </v-row>
+                     <VDivider></VDivider>
+                    <v-row class='mt-1 pb-0'>
+                        <v-col cols="12" md="4" sm="6">
+                            <p class='heading mb-0 text-right'><b>Comments:</b></p>
+                        </v-col>
+                        <v-col cols="12" md="8" sm="8">
+                            <p>{{ prescriptionIndex.comments }} </p>
+                        </v-col>
+
+                    </v-row>
+                    
+      </VCardText>
+    </VCard>
+    
+  </VDialog>
+</template>
+
+<style lang="scss">
+button.v-expansion-panel-title {
+  background-color: #003152 !important;
+  color: #fff;
+}
+
+button.v-expansion-panel-title.bg-secondary {
+  background-color: #003152 !important;
+  color: #fff;
+}
+
+button.v-expansion-panel-title {
+  background-color: #003152 !important;
+  color: #fff;
+}
+
+span.v-expansion-panel-title__icon {
+  color: #fff
+}
+
+// button.v-expansion-panel-title.bg-secondary {
+//     background-color: rgba(var(--v-theme-primary), var(--v-activated-opacity)) !important;
+// }
+
+// button.v-expansion-panel-title {
+//     background-color: rgba(var(--v-theme-primary), var(--v-activated-opacity)) !important;
+// }
+
+// button.v-expansion-panel-title.v-expansion-panel-title--active {
+//     background-color: rgba(var(--v-theme-primary), var(--v-activated-opacity)) !important;
+// }
+
+.v-expansion-panel {
+  overflow: hidden;
+  border-radius: 16px;
+  background-color: #fff;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 10%);
+  margin-block-end: 10px;
+  transition: box-shadow 0.3s ease;
+}
+
+.details {
+  position: relative;
+  box-sizing: content-box;
+  border: 2px solid #fff;
+  border-radius: 1em;
+  background-color: #696cff;
+  block-size: 0.85em;
+  box-shadow: 0 0 3px rgba(67, 89, 113, 80%);
+  color: #fff;
+  content: "+";
+  font-family: "Courier New", Courier, monospace;
+  font-weight: 500;
+  inline-size: 0.85em;
+  inset-block-start: 50%;
+  inset-block-start: 0.7em;
+  inset-inline-start: 50%;
+  line-height: 0.9em;
+  text-align: center;
+  transform: translate(-50%, -50%);
+}
+</style>
--- a/resources/js/pages/patients/UserTabOverview.vue
+++ b/resources/js/pages/patients/UserTabOverview.vue
@@ -0,0 +1,286 @@
+<script setup>
+import { useTheme } from 'vuetify'
+import UserInvoiceTable from './UserInvoiceTable.vue'
+import pdf from '@images/icons/project-icons/pdf.png'
+import avatar2 from '@images/avatars/avatar-2.png'
+import avatar3 from '@images/avatars/avatar-3.png'
+import avatar4 from '@images/avatars/avatar-4.png'
+import avatar5 from '@images/avatars/avatar-5.png'
+import figma from '@images/icons/project-icons/figma.png'
+import html5 from '@images/icons/project-icons/html5.png'
+import python from '@images/icons/project-icons/python.png'
+import react from '@images/icons/project-icons/react.png'
+import sketch from '@images/icons/project-icons/sketch.png'
+import vue from '@images/icons/project-icons/vue.png'
+import xamarin from '@images/icons/project-icons/xamarin.png'
+
+const projectTableHeaders = [
+  {
+    title: 'PROJECT',
+    key: 'name',
+  },
+  {
+    title: 'TOTAL TASK',
+    key: 'totalTask',
+  },
+  {
+    title: 'PROGRESS',
+    key: 'progress',
+  },
+  {
+    title: 'HOURS',
+    key: 'hours',
+  },
+]
+
+const { name } = useTheme()
+
+const projects = [
+  {
+    logo: react,
+    name: 'BGC eCommerce App',
+    project: 'React Project',
+    totalTask: '122/240',
+    progress: 78,
+    hours: '18:42',
+  },
+  {
+    logo: figma,
+    name: 'Falcon Logo Design',
+    project: 'Figma Project',
+    totalTask: '09/56',
+    progress: 18,
+    hours: '20:42',
+  },
+  {
+    logo: vue,
+    name: 'Dashboard Design',
+    project: 'Vuejs Project',
+    totalTask: '290/320',
+    progress: 62,
+    hours: '120:87',
+  },
+  {
+    logo: xamarin,
+    name: 'Foodista mobile app',
+    project: 'Xamarin Project',
+    totalTask: '290/320',
+    progress: 8,
+    hours: '120:87',
+  },
+  {
+    logo: python,
+    name: 'Dojo Email App',
+    project: 'Python Project',
+    totalTask: '120/186',
+    progress: 49,
+    hours: '230:10',
+  },
+  {
+    logo: sketch,
+    name: 'Blockchain Website',
+    project: 'Sketch Project',
+    totalTask: '99/109',
+    progress: 92,
+    hours: '342:41',
+  },
+  {
+    logo: html5,
+    name: 'Hoffman Website',
+    project: 'HTML Project',
+    totalTask: '98/110',
+    progress: 88,
+    hours: '12:45',
+  },
+]
+
+const resolveUserProgressVariant = progress => {
+  if (progress <= 25)
+    return 'error'
+  if (progress > 25 && progress <= 50)
+    return 'warning'
+  if (progress > 50 && progress <= 75)
+    return 'primary'
+  if (progress > 75 && progress <= 100)
+    return 'success'
+  
+  return 'secondary'
+}
+
+const search = ref('')
+</script>
+
+<template>
+  <VRow>
+    <VCol cols="12">
+      <VCard title="Project List">
+        <template #append>
+          <VTextField
+            v-model="search"
+            placeholder="Search Project"
+            density="compact"
+            style="inline-size: 10rem;"
+          />
+        </template>
+        <!-- 👉 User Project List Table -->
+
+        <!-- SECTION Datatable -->
+        <VDataTable
+          :search="search"
+          :headers="projectTableHeaders"
+          :items="projects"
+          item-value="name"
+          class="text-no-wrap rounded-0"
+        >
+          <!-- projects -->
+          <template #item.name="{ item }">
+            <div class="d-flex align-center">
+              <VAvatar
+                :size="34"
+                class="me-3"
+                :image="item.logo"
+              />
+              <div>
+                <h6 class="text-h6 mb-0">
+                  {{ item.name }}
+                </h6>
+                <p class="text-sm text-medium-emphasis mb-0">
+                  {{ item.project }}
+                </p>
+              </div>
+            </div>
+          </template>
+
+          <!-- total task -->
+          <template #item.totalTask="{ item }">
+            <div class="text-high-emphasis">
+              {{ item.totalTask }}
+            </div>
+          </template>
+
+          <!-- Progress -->
+          <template #item.progress="{ item }">
+            <div class="text-high-emphasis">
+              {{ item.progress }}%
+            </div>
+            <VProgressLinear
+              :height="6"
+              :model-value="item.progress"
+              rounded
+              :color="resolveUserProgressVariant(item.progress)"
+            />
+          </template>
+
+          <!-- remove footer -->
+          <!-- TODO refactor this after vuetify community gives answer -->
+          <template #bottom />
+        </VDataTable>
+        <!-- !SECTION -->
+      </VCard>
+    </VCol>
+
+    <VCol cols="12">
+      <!-- 👉 Activity timeline -->
+      <VCard title="User Activity Timeline">
+        <VCardText>
+          <VTimeline
+            density="compact"
+            align="start"
+            truncate-line="both"
+            :line-inset="8"
+            class="v-timeline-density-compact"
+          >
+            <VTimelineItem
+              dot-color="error"
+              size="x-small"
+            >
+              <div class="d-flex justify-space-between align-center flex-wrap gap-2 mb-3">
+                <span class="app-timeline-title">
+                  12 Invoices have been paid
+                </span>
+                <span class="app-timeline-meta">12 min ago</span>
+              </div>
+
+              <p class="app-timeline-text mb-2">
+                Invoices have been paid to the company
+              </p>
+              <div class="d-inline-flex align-center timeline-chip">
+                <img
+                  :src="pdf"
+                  height="20"
+                  class="me-2"
+                  alt="img"
+                >
+
+                <span class="app-timeline-text font-weight-medium">
+                  invoice.pdf
+                </span>
+              </div>
+            </VTimelineItem>
+
+            <VTimelineItem
+              dot-color="primary"
+              size="x-small"
+            >
+              <div class="d-flex justify-space-between align-center flex-wrap gap-2 mb-3">
+                <span class="app-timeline-title">
+                  Client Meeting
+                </span>
+                <span class="app-timeline-meta">45 min ago</span>
+              </div>
+
+              <p class="app-timeline-text mb-2">
+                React Project meeting with john @10:15am
+              </p>
+
+              <div class="d-flex align-center mt-3">
+                <VAvatar
+                  size="32"
+                  class="me-2"
+                  :image="avatar2"
+                />
+                <div>
+                  <p class="text-sm font-weight-medium mb-0">
+                    Lester McCarthy (Client)
+                  </p>
+                  <span class="text-sm">CEO of Kelly Group</span>
+                </div>
+              </div>
+            </VTimelineItem>
+
+            <VTimelineItem
+              dot-color="info"
+              size="x-small"
+            >
+              <div class="d-flex justify-space-between align-center flex-wrap gap-2 mb-3">
+                <span class="app-timeline-title">
+                  Create a new project for client
+                </span>
+                <span class="app-timeline-meta">2 day ago</span>
+              </div>
+
+              <p class="app-timeline-text mb-2">
+                6 team members in a project
+              </p>
+
+              <div class="v-avatar-group">
+                <VAvatar
+                  v-for="avatar in [avatar2, avatar3, avatar4, avatar5]"
+                  :key="avatar"
+                  :image="avatar"
+                />
+                <VAvatar :color="name === 'light' ? '#F0EFF0' : '#3F3B59'">
+                  <span class="text-high-emphasis">+3</span>
+                </VAvatar>
+              </div>
+            </VTimelineItem>
+          </VTimeline>
+        </VCardText>
+      </VCard>
+    </VCol>
+
+    <VCol cols="12">
+      <UserInvoiceTable />
+    </VCol>
+  </VRow>
+</template>
--- a/resources/js/pages/patients/meeting-details.vue
+++ b/resources/js/pages/patients/meeting-details.vue
@@ -0,0 +1,79 @@
+<script setup>
+import Notes from '@/pages/pages/patient-meetings/notes.vue';
+import Prescription from '@/pages/pages/patient-meetings/prescription.vue';
+import moment from 'moment';
+import { onMounted, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import { useStore } from 'vuex';
+const store = useStore();
+const router = useRouter();
+const route = useRoute();
+const patientId = route.params.patient_id;
+const appointmentId = route.params.id;
+const currentTab = ref(0);
+const appointmentID = ref();
+const doctorName = ref();
+const startTime = ref();
+const endTime = ref();
+const duration = ref();
+const appointmentData = ref(null);
+
+onMounted(async () => {
+    store.dispatch('updateIsLoading', true);
+    await store.dispatch('getAppointmentByIdAgent', {
+        patient_id: patientId,
+        appointment_id: appointmentId,
+    });
+    appointmentData.value = store.getters.getSinglePatientAppointment;
+    appointmentID.value = appointmentId;
+    doctorName.value = appointmentData.value.agent_name;
+    startTime.value = appointmentData.value.start_time;
+    endTime.value = appointmentData.value.end_time;
+    duration.value = totalCallDuration(startTime.value, endTime.value);
+    localStorage.setItem('meetingPatientAppointmentId', appointmentID.value);
+    store.dispatch('updateIsLoading', false);
+});
+
+const totalCallDuration = (start_time, end_time) => {
+    const startMoment = moment(start_time);
+    const endMoment = moment(end_time);
+    const duration = moment.duration(endMoment.diff(startMoment));
+    const hours = duration.hours();
+    const minutes = duration.minutes();
+    const seconds = duration.seconds();
+    return `${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}`;
+};
+</script>
+
+<template>
+    <VCard>
+        <VCardText>
+            <h3 v-if="appointmentID"> #{{ appointmentID }} By {{ doctorName }} </h3>
+            <span> Meeting duration: <b>{{ duration }}</b></span>
+        </VCardText>
+        <div class="d-flex">
+            <div>
+                <VTabs v-model="currentTab" direction="vertical">
+                    <VTab>
+                        <VIcon start icon="tabler-edit" />
+                        Notes
+                    </VTab>
+                    <VTab>
+                        <VIcon start icon="tabler-lock" />
+                        Prescriptions
+                    </VTab>
+                </VTabs>
+            </div>
+            <VCardText>
+                <VWindow v-model="currentTab" class="ms-3">
+                    <VWindowItem>
+                        <Notes />
+                    </VWindowItem>
+                    <VWindowItem>
+                        <Prescription />
+                    </VWindowItem>
+                </VWindow>
+            </VCardText>
+        </div>
+    </VCard>
+</template>
--- a/resources/js/pages/patients/meetings.vue
+++ b/resources/js/pages/patients/meetings.vue
@@ -0,0 +1,206 @@
+<script setup>
+import moment from 'moment';
+import { onBeforeMount, onMounted, onUnmounted, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import { useStore } from 'vuex';
+
+const store = useStore();
+const router = useRouter();
+const route = useRoute();
+const editDialog = ref(false);
+const deleteDialog = ref(false);
+const search = ref('');
+const appointmentId = ref('');
+const defaultItem = ref({
+  id: -1,
+  avatar: '',
+  name: '',
+  email: '',
+  dob: '',
+  phone_no: '',
+});
+
+const editedItem = ref({ ...defaultItem.value });
+const editedIndex = ref(-1);
+const patientMeetingList = ref([]);
+const isLoading = ref(false);
+
+// Status options
+const selectedOptions = [
+  { text: 'Active', value: 1 },
+  { text: 'InActive', value: 2 },
+];
+
+const refVForm = ref(null);
+
+// Headers
+const headers = [
+  // { title: 'Appointment Id', key: 'id' },
+  { title: 'Patient', key: 'patient_name' },
+  // { key: 'appointment_date', sortable: false, title: 'Date' },
+  { key: 'start_time', title: 'Start Time' },
+  { key: 'end_time', title: 'End Time' },
+  { key: 'duration', title: 'Duration' },
+  { title: 'ACTIONS', key: 'actions' },
+];
+
+// Utility functions
+function changeDateFormat(dateFormat) {
+  if (dateFormat) {
+    const [datePart, timePart] = dateFormat.split(' ');
+    const [year, month, day] = datePart.split('-');
+    // const formattedDate = `${parseInt(month)}-${parseInt(day)}-${year}`;
+    return `${formattedDate} ${timePart}`;
+  }
+  return dateFormat;
+}
+
+function changeFormat(dateFormat) {
+  const [year, month, day] = dateFormat.split('-');
+  return `${parseInt(month)}-${parseInt(day)}-${year}`;
+}
+
+function totalCallDuration(start_time, end_time) {
+  const startMoment = moment(start_time);
+  const endMoment = moment(end_time);
+  const duration = moment.duration(endMoment.diff(startMoment));
+  const hours = String(duration.hours()).padStart(2, '0');
+  const minutes = String(duration.minutes()).padStart(2, '0');
+  const seconds = String(duration.seconds()).padStart(2, '0');
+  
+  if (hours === '00' && minutes === '00') {
+    return `00:00:${seconds}`;
+  } else if (hours === '00') {
+    return `00:${minutes}:${seconds}`;
+  } else {
+    return `${hours}:${minutes}:${seconds}`;
+  }
+}
+
+// Fetch and process the patient meeting list
+const getPatientMeetingList = async () => {
+  store.dispatch('updateIsLoading', true);
+  await store.dispatch('patientMeetingList', { id: route.params.id });
+  store.dispatch('updateIsLoading', false);
+
+  let list = store.getters.getPatientMeetingList;
+  patientMeetingList.value = list.map(history => ({
+    ...history,
+    appointment_date: changeFormat(history.appointment_date),
+    start_time: changeDateFormat(history.start_time),
+    end_time: changeDateFormat(history.end_time),
+    duration: totalCallDuration(history.start_time, history.end_time),
+  }));
+  console.log(list);
+};
+
+// Lifecycle hooks
+onBeforeMount(() => {});
+onMounted(async () => {
+  await getPatientMeetingList();
+  
+});
+onUnmounted(() => {});
+const historyDetail = (item, value) => {
+    console.log('item',item.id ,value)
+    if(value == 'notes')
+    router.push('/admin/patient/meeting/notes/' + route.params.id + '/' + item.id);
+    if(value == 'prescription')
+    router.push('/admin/patient/meeting/prescription/' + route.params.id + '/' + item.id);
+}
+const menusVariant = [
+  'primary'
+];
+const options = [
+  {
+    title: 'Notes',
+    key: 'notes',
+  },
+  {
+    title: 'Prescription',
+    key: 'prescription',
+  },
+  
+]
+const breadcrums = [
+    {
+        title: 'Patient',
+        disabled: false,
+        to: '/admin/patients',
+    },
+    {
+        title: 'Meetings',
+        disabled: false,
+    }
+    
+];
+</script>
+
+<template>
+  <v-breadcrumbs :items="breadcrums" class="text-primary pt-0 pb-0 mb-5">
+        <template v-slot:divider style="padding-top:0px; padding-bottom:0px">
+            >
+        </template>
+    </v-breadcrumbs>
+  <v-row>
+    <v-col cols="12" md="12">
+      <v-card title="Meetings">
+        <v-card-text>
+          <v-row>
+            <v-col cols="12" offset-md="8" md="4">
+              <v-text-field
+                v-model="search"
+                label="Search"
+                placeholder="Search ..."
+                append-inner-icon="ri-search-line"
+                single-line
+                hide-details
+                dense
+                outlined
+              />
+            </v-col>
+          </v-row>
+        </v-card-text>
+        <v-data-table
+          :headers="headers"
+          :items="patientMeetingList"
+          :search="search"
+          :items-per-page="5"
+          class="text-no-wrap"
+        >
+          <template #item.id="{ item }">{{ item.id }}</template>
+          <template #item.duration="{ item }">{{ item.duration }}</template>
+          <!-- Actions -->
+          <template #item.actions="{ item }">
+          <div class="demo-space-x">
+          <VMenu
+            v-for="menu in menusVariant"
+            :key="menu"
+          >
+            <template #activator="{ props }">
+              
+                <i class="ri-more-2-line cursor-pointer" style="font-size: 32px;" v-bind="props"></i>
+              
+            </template>
+
+            <v-list>
+            <v-list-item
+              v-for="opt in options"
+              :key="opt.value"
+              @click="historyDetail(item, opt.key)"
+            >
+              {{ opt.title }}
+            </v-list-item>
+          </v-list>
+          </VMenu>
+        </div>
+            <!-- <div class="d-flex gap-1">
+              <VBtn class="text-capitalize text-white" @click="historyDetail(item)"> Detail
+                            </VBtn>
+            </div> -->
+          </template>
+        </v-data-table>
+      </v-card>  
+    </v-col>
+  </v-row>
+</template>
--- a/resources/js/pages/patients/patient-profile.vue
+++ b/resources/js/pages/patients/patient-profile.vue
@@ -0,0 +1,114 @@
+<script setup>
+import NotesPanel from '@/pages/patients/NotesPanel.vue'
+import PatienTabOverview from '@/pages/patients/PatienTabOverview.vue'
+import PatientBioPanel from '@/pages/patients/PatientBioPanel.vue'
+import PrescriptionPanel from '@/pages/patients/PrescriptionPanel.vue'
+
+import UserTabNotifications from '@/views/apps/user/view/UserTabNotifications.vue'
+import { useStore } from 'vuex'
+const patientDtail = ref(null);
+
+const store = useStore();
+const route = useRoute('apps-user-view-id')
+const userTab = ref(null)
+
+const tabs = [
+  {
+    icon: 'ri-group-line',
+    title: 'Overview',
+  },
+  {
+    icon: 'ri-lock-2-line',
+    title: 'Notes',
+  },
+  {
+    icon: 'ri-bookmark-line',
+    title: 'Prescriptions',
+  },
+  // {
+  //   icon: 'ri-notification-4-line',
+  //   title: 'Notifications',
+  // },
+  // {
+  //   icon: 'ri-link-m',
+  //   title: 'Connections',
+  // },
+]
+const getPatientDeatail = async () => {
+  store.dispatch('updateIsLoading', true);
+  await store.dispatch('patientDetial', { id: route.params.id });
+  store.dispatch('updateIsLoading', false);
+
+  let list = store.getters.getPatientDetail;
+  patientDtail.value=list
+  console.log(list.patient);
+};
+onMounted(async () => {
+  await getPatientDeatail();
+  
+});
+//const { data: userData } = await useApi(`/apps/users/${ route.params.id }`)
+</script>
+
+<template>
+  <VRow v-if="patientDtail">
+    <VCol
+      cols="12"
+      md="5"
+      lg="4"
+    >
+      <PatientBioPanel :user-data="patientDtail" />
+    </VCol>
+
+    <VCol
+      cols="12"
+      md="7"
+      lg="8"
+    >
+      <VTabs
+        v-model="userTab"
+        class="v-tabs-pill"
+      >
+        <VTab
+          v-for="tab in tabs"
+          :key="tab.icon"
+        >
+          <VIcon
+            start
+            :icon="tab.icon"
+          />
+          <span>{{ tab.title }}</span>
+        </VTab>
+      </VTabs>
+
+      <VWindow
+        v-model="userTab"
+        class="mt-6 disable-tab-transition"
+        :touch="false"
+      >
+        <VWindowItem>
+          <PatienTabOverview :notes-data="patientDtail"/>
+        </VWindowItem>
+
+        <VWindowItem>
+          <NotesPanel :notes-data="patientDtail"/>
+        </VWindowItem>
+
+        <VWindowItem>
+          <PrescriptionPanel :prescription-data="patientDtail"/>
+        </VWindowItem>
+
+        <VWindowItem>
+          <UserTabNotifications />
+        </VWindowItem>
+
+       
+      </VWindow>
+    </VCol>
+  </VRow>
+  <VCard v-else>
+    <VCardTitle class="text-center">
+      No User Found
+    </VCardTitle>
+  </VCard>
+</template>
--- a/resources/js/pages/patients/patients.vue
+++ b/resources/js/pages/patients/patients.vue
@@ -0,0 +1,636 @@
+<script setup>
+import { onBeforeMount, onMounted, onUnmounted } from 'vue';
+import { useRouter } from 'vue-router';
+import { useStore } from 'vuex';
+const store = useStore()
+// const route = useRoute()
+const router = useRouter()
+const editDialog = ref(false)
+const deleteDialog = ref(false)
+const search = ref('')
+const defaultItem = ref({
+  id: -1,
+  avatar: '',
+  name: '',
+  email: '',
+  dob: '',
+  phone_no: '',
+
+})
+
+const editedItem = ref(defaultItem.value)
+const editedIndex = ref(-1)
+const patientList = ref([])
+const subcriptionLists = ref([])
+const isLoading=ref(false)
+
+const filter = ref({
+    gender: '',
+    state: '',
+    plan: '',
+})
+// const gender =ref();
+// const city =ref();
+// const plan =ref();
+// status options
+const selectedOptions = [
+  {
+    text: 'Active',
+    value: 1,
+  },
+  {
+    text: 'InActive',
+    value: 2,
+  },
+  
+]
+
+const refVForm = ref(null)
+
+onBeforeMount(async () => {});
+onMounted(async () => {
+  store.dispatch('updateIsLoading', true)
+  await store.dispatch('getSubcriptions')
+  await store.dispatch('patientList')
+  // console.log('patientList',store.getters.getPatientList)
+  // patientList.value = store.getters.getPatientList
+  store.dispatch('updateIsLoading', false)
+ 
+});
+
+const getPatientFilter = async() => {
+ console.log("filter", filter.value.plan, filter.value.gender, filter.value.state);
+  
+  await store.dispatch('PatientFilter', {
+    plan: filter.value.plan,
+    gender: filter.value.gender,
+    state: filter.value.state,
+  })
+  store.dispatch('updateIsLoading', false)
+}
+
+const getPatientList = computed(async () => {
+  subcriptionLists.value = store.getters.getSubcriptions;
+  console.log("subcriptin",subcriptionLists.value);
+  patientList.value =  store.getters.getPatientList.map(history => ({
+    ...history,
+    dob: changeFormat(history.dob),
+    }));
+  return patientList.value  
+    
+});
+
+onUnmounted(async () => {});
+const formatPhoneNumber = () => {
+  console.log(editedItem.value)
+  // Remove non-numeric characters from the input
+  const numericValue = editedItem.value.phone_no.replace(/\D/g, '');
+
+  // Apply formatting logic
+  if (numericValue.length <= 10) {
+    editedItem.value.phone_no = numericValue.replace(/(\d{3})(\d{3})(\d{4})/, '($1) $2-$3');
+  } else {
+    // Limit the input to a maximum of 14 characters
+    const truncatedValue = numericValue.slice(0, 10);
+    editedItem.value.phone_no = truncatedValue.replace(/(\d{3})(\d{3})(\d{4})/, '($1) $2-$3');
+  }
+};
+// headers
+const headers = [
+  // {
+  //   title: 'ID',
+  //   key: 'id',
+  // },
+  {
+    title: 'NAME',
+    key: 'name',
+  },
+  {
+    title: 'EMAIL',
+    key: 'email',
+  },
+  {
+    key: 'dob',
+    title: 'Date Of Birth'
+    
+  },
+  {
+    title: 'Phone',
+    key: 'phone_no',
+  },
+
+  // {
+  //   title: 'Lab Kit',
+  //   key: 'labkit',
+  // },
+  
+  
+ 
+  // {
+  //   title: 'ACTIONS',
+  //   key: 'actions',
+  // },
+]
+
+const resolveStatusVariant = status => {
+  if (status === 1)
+    return {
+      color: 'primary',
+      text: 'Current',
+    }
+  else if (status === 2)
+    return {
+      color: 'success',
+      text: 'Professional',
+    }
+  else if (status === 3)
+    return {
+      color: 'error',
+      text: 'Rejected',
+    }
+  else if (status === 4)
+    return {
+      color: 'warning',
+      text: 'Resigned',
+    }
+  else
+    return {
+      color: 'info',
+      text: 'Applied',
+    }
+}
+
+const editItem = item => {
+  editedIndex.value = patientList.value.indexOf(item)
+  editedItem.value = { ...item }
+  editDialog.value = true
+}
+
+const deleteItem = item => {
+  console.log('del',item)
+  editedIndex.value = patientList.value.indexOf(item)
+  editedItem.value = { ...item }
+  deleteDialog.value = true
+}
+
+const close = () => {
+  editDialog.value = false
+  editedIndex.value = -1
+  editedItem.value = { ...defaultItem.value }
+}
+
+const closeDelete = () => {
+  deleteDialog.value = false
+  editedIndex.value = -1
+  editedItem.value = { ...defaultItem.value }
+}
+
+const getMettings = (Item) => {
+  router.push('/admin/patient/meetings/'+Item.id);
+}
+
+const save = async () => {
+  const { valid } = await refVForm.value.validate()
+  console.log(valid)
+  if (valid) {
+    console.log('editedItem.value',editedItem.value);
+    if (editedIndex.value > -1)
+    {
+      await store.dispatch('patientUpdate',{
+        id: editedItem.value.id,
+        first_name: editedItem.value.first_name,
+        last_name: editedItem.value.last_name,
+        email: editedItem.value.email,
+        phone_no: editedItem.value.phone_no,
+        dob: editedItem.value.dob,
+      })
+      Object.assign(patientList.value[editedIndex.value], editedItem.value)
+    }else{
+      patientList.value.push(editedItem.value)
+    }
+  close()
+  }
+ 
+  
+}
+
+const states = ref([
+    { name: 'Alabama', abbreviation: 'AL' },
+    { name: 'Alaska', abbreviation: 'AK' },
+    { name: 'Arizona', abbreviation: 'AZ' },
+    { name: 'Arkansas', abbreviation: 'AR' },
+    { name: 'Howland Island', abbreviation: 'UM-84' },
+    { name: 'Delaware', abbreviation: 'DE' },
+    { name: 'Maryland', abbreviation: 'MD' },
+    { name: 'Baker Island', abbreviation: 'UM-81' },
+    { name: 'Kingman Reef', abbreviation: 'UM-89' },
+    { name: 'New Hampshire', abbreviation: 'NH' },
+    { name: 'Wake Island', abbreviation: 'UM-79' },
+    { name: 'Kansas', abbreviation: 'KS' },
+    { name: 'Texas', abbreviation: 'TX' },
+    { name: 'Nebraska', abbreviation: 'NE' },
+    { name: 'Vermont', abbreviation: 'VT' },
+    { name: 'Jarvis Island', abbreviation: 'UM-86' },
+    { name: 'Hawaii', abbreviation: 'HI' },
+    { name: 'Guam', abbreviation: 'GU' },
+    { name: 'United States Virgin Islands', abbreviation: 'VI' },
+    { name: 'Utah', abbreviation: 'UT' },
+    { name: 'Oregon', abbreviation: 'OR' },
+    { name: 'California', abbreviation: 'CA' },
+    { name: 'New Jersey', abbreviation: 'NJ' },
+    { name: 'North Dakota', abbreviation: 'ND' },
+    { name: 'Kentucky', abbreviation: 'KY' },
+    { name: 'Minnesota', abbreviation: 'MN' },
+    { name: 'Oklahoma', abbreviation: 'OK' },
+    { name: 'Pennsylvania', abbreviation: 'PA' },
+    { name: 'New Mexico', abbreviation: 'NM' },
+    { name: 'American Samoa', abbreviation: 'AS' },
+    { name: 'Illinois', abbreviation: 'IL' },
+    { name: 'Michigan', abbreviation: 'MI' },
+    { name: 'Virginia', abbreviation: 'VA' },
+    { name: 'Johnston Atoll', abbreviation: 'UM-67' },
+    { name: 'West Virginia', abbreviation: 'WV' },
+    { name: 'Mississippi', abbreviation: 'MS' },
+    { name: 'Northern Mariana Islands', abbreviation: 'MP' },
+    { name: 'United States Minor Outlying Islands', abbreviation: 'UM' },
+    { name: 'Massachusetts', abbreviation: 'MA' },
+    { name: 'Connecticut', abbreviation: 'CT' },
+    { name: 'Florida', abbreviation: 'FL' },
+    { name: 'District of Columbia', abbreviation: 'DC' },
+    { name: 'Midway Atoll', abbreviation: 'UM-71' },
+    { name: 'Navassa Island', abbreviation: 'UM-76' },
+    { name: 'Indiana', abbreviation: 'IN' },
+    { name: 'Wisconsin', abbreviation: 'WI' },
+    { name: 'Wyoming', abbreviation: 'WY' },
+    { name: 'South Carolina', abbreviation: 'SC' },
+    { name: 'Arkansas', abbreviation: 'AR' },
+    { name: 'South Dakota', abbreviation: 'SD' },
+    { name: 'Montana', abbreviation: 'MT' },
+    { name: 'North Carolina', abbreviation: 'NC' },
+    { name: 'Palmyra Atoll', abbreviation: 'UM-95' },
+    { name: 'Puerto Rico', abbreviation: 'PR' },
+    { name: 'Colorado', abbreviation: 'CO' },
+    { name: 'Missouri', abbreviation: 'MO' },
+    { name: 'New York', abbreviation: 'NY' },
+    { name: 'Maine', abbreviation: 'ME' },
+    { name: 'Tennessee', abbreviation: 'TN' },
+    { name: 'Georgia', abbreviation: 'GA' },
+    { name: 'Louisiana', abbreviation: 'LA' },
+    { name: 'Nevada', abbreviation: 'NV' },
+    { name: 'Iowa', abbreviation: 'IA' },
+    { name: 'Idaho', abbreviation: 'ID' },
+    { name: 'Rhode Island', abbreviation: 'RI' },
+    { name: 'Washington', abbreviation: 'WA' },
+    { name: 'Ohio', abbreviation: 'OH' },
+    // ... (add the rest of the states)
+]);
+
+const sortedStates = computed(() => {
+    return states.value.slice().sort((a, b) => {
+        return a.name.localeCompare(b.name);
+    });
+});
+
+const deleteItemConfirm = async () => {
+  console.log('editedIndex.value',editedIndex.value,editedItem.value.id)
+  await store.dispatch('patientDelete',{
+    id: editedItem.value.id
+  })
+  patientList.value.splice(editedIndex.value, 1)
+  closeDelete()
+}
+
+
+function changeFormat(dateFormat) {
+    const dateParts = dateFormat.split('-'); // Assuming date is in yyyy-mm-dd format
+    const year = parseInt(dateParts[0]);
+    const month = parseInt(dateParts[1]); // No need for padding
+    const day = parseInt(dateParts[2]); // No need for padding
+
+    // Create a new Date object with the parsed values
+    const date = new Date(year, month - 1, day); // Month is zero-based in JavaScript Date object
+
+    // Format the date as mm-dd-yyyy
+    const formattedDate = month + '-' + day + '-' + date.getFullYear();
+    // console.log("formattedDate",formattedDate)
+    return formattedDate;
+}
+const LabKit = (item)=> {
+    router.push('/admin/patients/labkit/'+item.id);
+}
+
+const onSubcriptionChange = async(newvalue)=> {
+  filter.value.plan = newvalue;
+  console.log("Plan",filter.value.plan );
+  await getPatientFilter();
+
+}
+const onGenderChange = async(newvalue)=> {
+  filter.value.gender = newvalue;
+  console.log("gender",filter.value.gender);
+  await getPatientFilter();
+
+}
+const onStateChange = async(newvalue)=> {
+  filter.value.state = newvalue;
+  console.log("state",filter.value.state);
+  await getPatientFilter();
+
+}
+
+
+</script>
+
+<template>
+  <v-row>
+    <v-col cols="12" md="12" v-if="getPatientList">
+      <v-card title="Patients">
+      <VCardText >
+          <VRow>
+             <VCol
+              cols="12"
+              
+              md="4"
+            >
+            <VSelect
+                 v-model="filter.plan"
+                 label="Subcription"
+                  placeholder="Subcription"
+                  density="comfortable"
+                  :items="subcriptionLists"
+                  item-title="title"
+                  item-value="slug"
+                  @update:model-value="onSubcriptionChange"
+          />
+          
+          
+          </VCol>
+            <VCol
+              cols="12"
+              
+              md="4"
+            >
+            
+          <VSelect
+                  v-model="filter.gender"
+                  label="Gender"
+                  placeholder="Gender"
+                  density="comfortable"
+                  :items="['Male', 'Female']"
+                  @update:model-value="onGenderChange"
+                  
+          />
+          
+          </VCol>
+          <VCol
+              cols="12"
+              
+              md="4"
+            >
+            <VSelect
+                  v-model="filter.state"
+                  label="State"
+                  density="comfortable"
+                  :items="sortedStates"
+                  item-title="name"
+                  item-value="abbreviation"
+                  @update:model-value="onStateChange"
+                  
+          />
+          
+           </VCol>
+            <!-- <VCol
+              cols="12"
+              
+              md="4"
+            >
+              <VTextField
+                v-model="search"
+                label="Search"
+                placeholder="Search ..."
+                append-inner-icon="ri-search-line"
+                single-line
+                hide-details
+                dense
+                outlined
+              />
+            </VCol> -->
+          </VRow>
+        </VCardText>
+      <VDataTable
+        :headers="headers"
+        :items="patientList"
+        :search="search"
+        :items-per-page="5"
+        class="text-no-wrap"
+      >
+      <template #item.id="{ item }">
+    {{ item.id }}
+  </template>
+        <!-- full name -->
+        <template #item.name="{ item }">
+          <div class="d-flex align-center">
+            <!-- avatar -->
+            <VAvatar
+              size="32"
+              :color="item.avatar ? '' : 'primary'"
+              :class="item.avatar ? '' : 'v-avatar-light-bg primary--text'"
+              :variant="!item.avatar ? 'tonal' : undefined"
+            >
+              <VImg
+                v-if="item.avatar"
+                :src="item.avatar"
+              />
+              <span
+                v-else
+                class="text-sm"
+              >{{ avatarText(item.name) }}</span>
+            </VAvatar>
+            
+            <div class="d-flex flex-column ms-3">
+                <router-link
+                  :to="{ name: 'admin-patient-profile', params: { id: item.id } }"
+                  class="text-high-emphasis  "
+                >
+              <span class="d-block font-weight-medium text-high-emphasis text-truncate">{{ item.name }}</span>
+               </router-link>
+              <small>{{ item.post }}</small>
+            </div>
+          </div>
+        </template>
+
+        
+
+        <!-- status -->
+        <template #item.status="{ item }">
+          <VChip
+            :color="resolveStatusVariant(item.status).color"
+            density="comfortable"
+          >
+            {{ resolveStatusVariant(item.status).text }}
+          </VChip>
+        </template>
+        <template #item.labkit="{ item }">
+          <div class="text-primary cursor-pointer" @click="LabKit(item)"> LabKits</div>
+        </template>
+
+        <!-- Actions -->
+        <template #item.actions="{ item }">
+          <div class="d-flex gap-1">
+            <IconBtn
+              size="small"
+              @click="editItem(item)"
+            >
+              <VIcon icon="ri-pencil-line" />
+            </IconBtn>
+            <IconBtn
+              size="small"
+              @click="deleteItem(item)"
+            >
+              <VIcon icon="ri-delete-bin-line" />
+            </IconBtn>
+            <IconBtn
+                size="small"
+                @click="getMettings(item)"
+              >
+              <VIcon icon="ri-time-line" />
+            </IconBtn>
+          </div>
+        </template>
+      </VDataTable>
+      </v-card>
+    </v-col>
+  </v-row>
+  <!-- 👉 Edit Dialog  -->
+  <VDialog
+    v-model="editDialog"
+    max-width="600px"
+  >
+  <VForm ref="refVForm" >
+    <VCard>
+      <VCardTitle>
+        <span class="headline">Edit Patient</span>
+      </VCardTitle>
+
+      <VCardText>
+        <VContainer >
+         
+          <VRow>
+            <!-- fullName -->
+            <VCol cols="12" md="6">
+              <VTextField
+                v-model="editedItem.first_name"
+                label="First Name"
+                :rules="[requiredFirstName]"
+              />
+            </VCol>
+            <VCol cols="12" md="6">
+              <VTextField
+                v-model="editedItem.last_name"
+                label="Last Name"
+                :rules="[requiredLastName]"
+              />
+            </VCol>
+
+            <!-- email -->
+            <VCol cols="12" sm="6" md="12">
+              <VTextField
+                v-model="editedItem.email"
+                label="Email"
+                :rules="[requiredEmail, emailValidator]"
+              />
+            </VCol>
+
+         
+            <VCol cols="12" sm="6" md="12">
+              <VTextField
+                v-model="editedItem.dob" type="date" 
+                label="Date Of Birth"
+              />
+            </VCol>
+            <VCol cols="12" sm="6" md="12">
+              <VTextField v-model="editedItem.phone_no" label="Phone Number" pattern="^\(\d{3}\) \d{3}-\d{4}$"
+                :rules="[requiredPhone, validUSAPhone]" placeholder="i.e. (000) 000-0000"
+                @input="formatPhoneNumber" max="14" density="comfortable" />
+            </VCol>
+            
+
+         
+
+            <!-- status -->
+            <VCol
+              cols="12"
+
+              md="12"
+            >
+              <VSelect
+                v-model="editedItem.status"
+                :items="selectedOptions"
+                item-title="text"
+                item-value="value"
+                label="Status"
+                variant="outlined"
+              />
+            </VCol>
+          </VRow>
+        </VContainer>
+      </VCardText>
+
+      <VCardActions>
+        <VSpacer />
+
+        <VBtn
+          color="error"
+          variant="outlined"
+          @click="close"
+        >
+          Cancel
+        </VBtn>
+
+        <VBtn
+          color="success"
+          variant="elevated"
+          @click="save"
+        >
+          Save
+        </VBtn>
+        
+      </VCardActions>
+    </VCard>
+    </VForm>
+  </VDialog>
+
+  <!-- 👉 Delete Dialog  -->
+  <VDialog
+    v-model="deleteDialog"
+    max-width="500px"
+  >
+    <VCard>
+      <VCardTitle>
+        Are you sure you want to delete this item?
+      </VCardTitle>
+
+      <VCardActions>
+        <VSpacer />
+
+        <VBtn
+          color="error"
+          variant="outlined"
+          @click="closeDelete"
+        >
+          Cancel
+        </VBtn>
+
+        <VBtn
+          color="success"
+          variant="elevated"
+          @click="deleteItemConfirm"
+        >
+          OK
+        </VBtn>
+
+        <VSpacer />
+      </VCardActions>
+    </VCard>
+  </VDialog>
+</template>
--- a/resources/js/pages/providers/meeting-details.vue
+++ b/resources/js/pages/providers/meeting-details.vue
@@ -0,0 +1,79 @@
+<script setup>
+import Notes from '@/pages/pages/patient-meetings/notes.vue';
+import Prescription from '@/pages/pages/patient-meetings/prescription.vue';
+import moment from 'moment';
+import { onMounted, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import { useStore } from 'vuex';
+const store = useStore();
+const router = useRouter();
+const route = useRoute();
+const patientId = route.params.patient_id;
+const appointmentId = route.params.id;
+const currentTab = ref(0);
+const appointmentID = ref();
+const doctorName = ref();
+const startTime = ref();
+const endTime = ref();
+const duration = ref();
+const appointmentData = ref(null);
+
+onMounted(async () => {
+    store.dispatch('updateIsLoading', true);
+    await store.dispatch('getAppointmentByIdAgent', {
+        patient_id: patientId,
+        appointment_id: appointmentId,
+    });
+    appointmentData.value = store.getters.getSinglePatientAppointment;
+    appointmentID.value = appointmentId;
+    doctorName.value = appointmentData.value.agent_name;
+    startTime.value = appointmentData.value.start_time;
+    endTime.value = appointmentData.value.end_time;
+    duration.value = totalCallDuration(startTime.value, endTime.value);
+    localStorage.setItem('meetingPatientAppointmentId', appointmentID.value);
+    store.dispatch('updateIsLoading', false);
+});
+
+const totalCallDuration = (start_time, end_time) => {
+    const startMoment = moment(start_time);
+    const endMoment = moment(end_time);
+    const duration = moment.duration(endMoment.diff(startMoment));
+    const hours = duration.hours();
+    const minutes = duration.minutes();
+    const seconds = duration.seconds();
+    return `${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}`;
+};
+</script>
+
+<template>
+    <VCard>
+        <VCardText>
+            <h3 v-if="appointmentID"> #{{ appointmentID }} By {{ doctorName }} </h3>
+            <span> Meeting duration: <b>{{ duration }}</b></span>
+        </VCardText>
+        <div class="d-flex">
+            <div>
+                <VTabs v-model="currentTab" direction="vertical">
+                    <VTab>
+                        <VIcon start icon="tabler-edit" />
+                        Notes
+                    </VTab>
+                    <VTab>
+                        <VIcon start icon="tabler-lock" />
+                        Prescriptions
+                    </VTab>
+                </VTabs>
+            </div>
+            <VCardText>
+                <VWindow v-model="currentTab" class="ms-3">
+                    <VWindowItem>
+                        <Notes />
+                    </VWindowItem>
+                    <VWindowItem>
+                        <Prescription />
+                    </VWindowItem>
+                </VWindow>
+            </VCardText>
+        </div>
+    </VCard>
+</template>
--- a/resources/js/pages/providers/meetings.vue
+++ b/resources/js/pages/providers/meetings.vue
@@ -0,0 +1,189 @@
+<script setup>
+import moment from 'moment';
+import { onBeforeMount, onMounted, onUnmounted, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import { useStore } from 'vuex';
+
+const store = useStore();
+const router = useRouter();
+const route = useRoute();
+const editDialog = ref(false);
+const deleteDialog = ref(false);
+const search = ref('');
+const appointmentId = ref('');
+const defaultItem = ref({
+  id: -1,
+  avatar: '',
+  name: '',
+  email: '',
+  dob: '',
+  phone_no: '',
+});
+
+const editedItem = ref({ ...defaultItem.value });
+const editedIndex = ref(-1);
+const providerMeetingList = ref([]);
+const isLoading = ref(false);
+
+// Status options
+const selectedOptions = [
+  { text: 'Active', value: 1 },
+  { text: 'InActive', value: 2 },
+];
+
+const refVForm = ref(null);
+
+// Headers
+const headers = [
+  // { title: 'Appointment Id', key: 'id' },
+  { title: 'Patient', key: 'patient_name' },
+  // { key: 'appointment_date', sortable: false, title: 'Date' },
+  { key: 'start_time', title: 'Start Time' },
+  { key: 'end_time', title: 'End Time' },
+  { key: 'duration', title: 'Duration' },
+  { title: 'ACTIONS', key: 'actions' },
+];
+
+// Utility functions
+function changeDateFormat(dateFormat) {
+  if (dateFormat) {
+    const [datePart, timePart] = dateFormat.split(' ');
+    const [year, month, day] = datePart.split('-');
+    // const formattedDate = `${parseInt(month)}-${parseInt(day)}-${year}`;
+    return `${formattedDate} ${timePart}`;
+  }
+  return dateFormat;
+}
+
+function changeFormat(dateFormat) {
+  const [year, month, day] = dateFormat.split('-');
+  return `${parseInt(month)}-${parseInt(day)}-${year}`;
+}
+
+function totalCallDuration(start_time, end_time) {
+  const startMoment = moment(start_time);
+  const endMoment = moment(end_time);
+  const duration = moment.duration(endMoment.diff(startMoment));
+  const hours = String(duration.hours()).padStart(2, '0');
+  const minutes = String(duration.minutes()).padStart(2, '0');
+  const seconds = String(duration.seconds()).padStart(2, '0');
+  
+  if (hours === '00' && minutes === '00') {
+    return `00:00:${seconds}`;
+  } else if (hours === '00') {
+    return `00:${minutes}:${seconds}`;
+  } else {
+    return `${hours}:${minutes}:${seconds}`;
+  }
+}
+
+// Fetch and process the patient meeting list
+const getPatientMeetingList = async () => {
+  store.dispatch('updateIsLoading', true);
+  await store.dispatch('providerMeetingList', { id: route.params.id });
+  store.dispatch('updateIsLoading', false);
+
+  let list = store.getters.getProviderMeetingList;
+  providerMeetingList.value = list.map(history => ({
+    ...history,
+    appointment_date: changeFormat(history.appointment_date),
+    start_time: changeDateFormat(history.start_time),
+    end_time: changeDateFormat(history.end_time),
+    duration: totalCallDuration(history.start_time, history.end_time),
+  }));
+  console.log(list);
+};
+
+// Lifecycle hooks
+onBeforeMount(() => {});
+onMounted(async () => {
+  await getPatientMeetingList();
+  
+});
+onUnmounted(() => {});
+const historyDetail = (item, value) => {
+    console.log('item',item.id ,value)
+    if(value == 'notes')
+    router.push('/admin/patient/meeting/notes/' + item.patient_id + '/' + item.id);
+    if(value == 'prescription')
+    router.push('/admin/patient/meeting/prescription/' + item.patient_id + '/' + item.id);
+}
+const menusVariant = [
+  'primary'
+];
+const options = [
+  {
+    title: 'Notes',
+    key: 'notes',
+  },
+  {
+    title: 'Prescription',
+    key: 'prescription',
+  },
+  
+]
+</script>
+
+<template>
+  <v-row>
+    <v-col cols="12" md="12">
+      <v-card title="Meetings">
+        <v-card-text>
+          <v-row>
+            <v-col cols="12" offset-md="8" md="4">
+              <v-text-field
+                v-model="search"
+                label="Search"
+                placeholder="Search ..."
+                append-inner-icon="ri-search-line"
+                single-line
+                hide-details
+                dense
+                outlined
+              />
+            </v-col>
+          </v-row>
+        </v-card-text>
+        <v-data-table
+          :headers="headers"
+          :items="providerMeetingList"
+          :search="search"
+          :items-per-page="5"
+          class="text-no-wrap"
+        >
+          <template #item.id="{ item }">{{ item.id }}</template>
+          <template #item.duration="{ item }">{{ item.duration }}</template>
+          <!-- Actions -->
+          <template #item.actions="{ item }">
+          <div class="demo-space-x">
+          <VMenu
+            v-for="menu in menusVariant"
+            :key="menu"
+          >
+            <template #activator="{ props }">
+              
+                <i class="ri-more-2-line cursor-pointer"  v-bind="props"></i>
+              
+            </template>
+
+            <v-list>
+            <v-list-item
+              v-for="opt in options"
+              :key="opt.value"
+              @click="historyDetail(item, opt.key)"
+            >
+              {{ opt.title }}
+            </v-list-item>
+          </v-list>
+          </VMenu>
+        </div>
+            <!-- <div class="d-flex gap-1">
+              <VBtn class="text-capitalize text-white" @click="historyDetail(item)"> Detail
+                            </VBtn>
+            </div> -->
+          </template>
+        </v-data-table>
+      </v-card>  
+    </v-col>
+  </v-row>
+</template>
--- a/resources/js/pages/providers/provider-profile.vue
+++ b/resources/js/pages/providers/provider-profile.vue
@@ -0,0 +1,101 @@
+<script setup>
+import UserBioPanel from '@/views/apps/user/view/UserBioPanel.vue'
+import UserTabBillingsPlans from '@/views/apps/user/view/UserTabBillingsPlans.vue'
+import UserTabConnections from '@/views/apps/user/view/UserTabConnections.vue'
+import UserTabNotifications from '@/views/apps/user/view/UserTabNotifications.vue'
+import UserTabOverview from '@/views/apps/user/view/UserTabOverview.vue'
+import UserTabSecurity from '@/views/apps/user/view/UserTabSecurity.vue'
+
+const route = useRoute('apps-user-view-id')
+const userTab = ref(null)
+
+const tabs = [
+  {
+    icon: 'ri-group-line',
+    title: 'Overview',
+  },
+  {
+    icon: 'ri-lock-2-line',
+    title: 'Security',
+  },
+  {
+    icon: 'ri-bookmark-line',
+    title: 'Billing & Plan',
+  },
+  {
+    icon: 'ri-notification-4-line',
+    title: 'Notifications',
+  },
+  {
+    icon: 'ri-link-m',
+    title: 'Connections',
+  },
+]
+
+const { data: userData } = await useApi(`/apps/users/${ route.params.id }`)
+</script>
+
+<template>
+  <VRow v-if="userData">
+    <VCol
+      cols="12"
+      md="5"
+      lg="4"
+    >
+      <UserBioPanel :user-data="userData" />
+    </VCol>
+
+    <VCol
+      cols="12"
+      md="7"
+      lg="8"
+    >
+      <VTabs
+        v-model="userTab"
+        class="v-tabs-pill"
+      >
+        <VTab
+          v-for="tab in tabs"
+          :key="tab.icon"
+        >
+          <VIcon
+            start
+            :icon="tab.icon"
+          />
+          <span>{{ tab.title }}</span>
+        </VTab>
+      </VTabs>
+
+      <VWindow
+        v-model="userTab"
+        class="mt-6 disable-tab-transition"
+        :touch="false"
+      >
+        <VWindowItem>
+          <UserTabOverview />
+        </VWindowItem>
+
+        <VWindowItem>
+          <UserTabSecurity />
+        </VWindowItem>
+
+        <VWindowItem>
+          <UserTabBillingsPlans />
+        </VWindowItem>
+
+        <VWindowItem>
+          <UserTabNotifications />
+        </VWindowItem>
+
+        <VWindowItem>
+          <UserTabConnections />
+        </VWindowItem>
+      </VWindow>
+    </VCol>
+  </VRow>
+  <VCard v-else>
+    <VCardTitle class="text-center">
+      No User Found
+    </VCardTitle>
+  </VCard>
+</template>
--- a/resources/js/pages/providers/providers.vue
+++ b/resources/js/pages/providers/providers.vue
@@ -0,0 +1,411 @@
+<script setup>
+
+
+
+import { useStore } from 'vuex';
+const store = useStore()
+const editDialog = ref(false)
+const deleteDialog = ref(false)
+const search = ref('')
+const defaultItem = ref({
+  id: -1,
+  avatar: '',
+  name: '',
+  email: '',
+  // dob: '',
+  phone_no: '',
+
+})
+const router = useRouter()
+const editedItem = ref(defaultItem.value)
+const editedIndex = ref(-1)
+const providersList = ref([])
+const isLoading=ref(false)
+// status options
+const selectedOptions = [
+  {
+    text: 'Active',
+    value: 1,
+  },
+  {
+    text: 'InActive',
+    value: 2,
+  },
+  
+]
+
+    const refVForm = ref(null)
+
+
+const formatPhoneNumber = () => {
+  console.log(editedItem.value)
+  // Remove non-numeric characters from the input
+  const numericValue = editedItem.value.phone_no.replace(/\D/g, '');
+
+  // Apply formatting logic
+  if (numericValue.length <= 10) {
+    editedItem.value.phone_no = numericValue.replace(/(\d{3})(\d{3})(\d{4})/, '($1) $2-$3');
+  } else {
+    // Limit the input to a maximum of 14 characters
+    const truncatedValue = numericValue.slice(0, 10);
+    editedItem.value.phone_no = truncatedValue.replace(/(\d{3})(\d{3})(\d{4})/, '($1) $2-$3');
+  }
+};
+// headers
+const headers = [
+{
+    title: 'ID',
+    key: 'id',
+  },
+  {
+    title: 'NAME',
+    key: 'name',
+  },
+  {
+    title: 'EMAIL',
+    key: 'email',
+  },
+  // {
+  //   title: 'Date Of Birth',
+  //   key: 'dob',
+  // },
+  {
+    title: 'Phone',
+    key: 'phone_no',
+  },
+ 
+  // {
+  //   title: 'ACTIONS',
+  //   key: 'actions',
+  // },
+]
+
+const resolveStatusVariant = status => {
+  if (status === 1)
+    return {
+      color: 'primary',
+      text: 'Current',
+    }
+  else if (status === 2)
+    return {
+      color: 'success',
+      text: 'Professional',
+    }
+  else if (status === 3)
+    return {
+      color: 'error',
+      text: 'Rejected',
+    }
+  else if (status === 4)
+    return {
+      color: 'warning',
+      text: 'Resigned',
+    }
+  else
+    return {
+      color: 'info',
+      text: 'Applied',
+    }
+}
+
+const editItem = item => {
+  editedIndex.value = providersList.value.indexOf(item)
+  editedItem.value = { ...item }
+  editDialog.value = true
+}
+
+const deleteItem = item => {
+  editedIndex.value = providersList.value.indexOf(item)
+  editedItem.value = { ...item }
+  deleteDialog.value = true
+}
+
+const close = () => {
+  editDialog.value = false
+  editedIndex.value = -1
+  editedItem.value = { ...defaultItem.value }
+}
+
+const closeDelete = () => {
+  deleteDialog.value = false
+  editedIndex.value = -1
+  editedItem.value = { ...defaultItem.value }
+}
+
+const save = async () => {
+  const { valid } = await refVForm.value.validate()
+  console.log(valid)
+  if (valid) {
+    if (editedIndex.value > -1){
+      await store.dispatch('providerUpdate',{
+        id: editedItem.value.id,
+        first_name: editedItem.value.first_name,
+        last_name: editedItem.value.last_name,
+        email: editedItem.value.email,
+      })
+      Object.assign(providersList.value[editedIndex.value], editedItem.value)
+    }else{
+      providersList.value.push(editedItem.value)
+    }
+  close()
+  }
+ 
+  
+}
+const getMettings = (Item) => {
+  router.push('/admin/provider/meetings/'+Item.id);
+}
+const deleteItemConfirm = async() => {
+  console.log('editedIndex.value',editedIndex.value,editedItem.value.id)
+  await store.dispatch('providerDelete',{
+    id: editedItem.value.id
+  })
+  providersList.value.splice(editedIndex.value, 1)
+  closeDelete()
+}
+const getprovidersList = computed(async () => {
+  store.dispatch('updateIsLoading', true)
+  await store.dispatch('providersList')
+  console.log('getProvidersList',store.getters.getProvidersList)
+    let list = store.getters.getProvidersList
+    store.dispatch('updateIsLoading', false)
+  providersList.value = list
+    return providersList.value
+});
+
+onMounted(() => {
+ 
+
+})
+</script>
+
+<template>
+  <v-row>
+    <v-col cols="12" md="12" v-if="getprovidersList">
+    <VCard title="Providers">
+      <VCardText >
+          <VRow>
+            <VCol
+              cols="12"
+              offset-md="8"
+              md="4"
+            >
+              <VTextField
+                v-model="search"
+                label="Search"
+                placeholder="Search ..."
+                append-inner-icon="ri-search-line"
+                single-line
+                hide-details
+                dense
+                outlined
+              />
+            </VCol>
+          </VRow>
+        </VCardText>
+      <VDataTable
+        :headers="headers"
+        :items="providersList"
+        :search="search"
+        :items-per-page="5"
+        class="text-no-wrap"
+      >
+        <!-- full name -->
+        <template #item.name="{ item }">
+          <div class="d-flex align-center">
+            <!-- avatar -->
+            <VAvatar
+              size="32"
+              :color="item.avatar ? '' : 'primary'"
+              :class="item.avatar ? '' : 'v-avatar-light-bg primary--text'"
+              :variant="!item.avatar ? 'tonal' : undefined"
+            >
+              <VImg
+                v-if="item.avatar"
+                :src="item.avatar"
+              />
+              <span
+                v-else
+                class="text-sm"
+              >{{ avatarText(item.name) }}</span>
+            </VAvatar>
+
+            <div class="d-flex flex-column ms-3">
+              <span class="d-block font-weight-medium text-high-emphasis text-truncate">{{ item.name }}</span>
+              <small>{{ item.post }}</small>
+            </div>
+          </div>
+        </template>
+
+        <!-- status -->
+        <template #item.status="{ item }">
+          <VChip
+            :color="resolveStatusVariant(item.status).color"
+            density="comfortable"
+          >
+            {{ resolveStatusVariant(item.status).text }}
+          </VChip>
+        </template>
+
+        <!-- Actions -->
+        <template #item.actions="{ item }">
+          <div class="d-flex gap-1">
+            <IconBtn
+              size="small"
+              @click="editItem(item)"
+              style="display: none;"
+            >
+              <VIcon icon="ri-pencil-line" />
+            </IconBtn>
+            <IconBtn
+              size="small"
+              @click="deleteItem(item)"
+               style="display: none;"
+            >
+              <VIcon icon="ri-delete-bin-line" />
+            </IconBtn>
+             <IconBtn
+                size="small"
+                @click="getMettings(item)"
+              >
+              <VIcon icon="ri-time-line" />
+            </IconBtn>
+          </div>
+        </template>
+      </VDataTable>
+    </VCard>  
+    </v-col>
+  </v-row>
+  <!-- 👉 Edit Dialog  -->
+  <VDialog
+    v-model="editDialog"
+    max-width="600px"
+  >
+  <VForm ref="refVForm" >
+    <VCard>
+      <VCardTitle>
+        <span class="headline">Edit Provider</span>
+      </VCardTitle>
+
+      <VCardText>
+        <VContainer >
+         
+          <VRow>
+            <!-- fullName -->
+            <VCol cols="12" md="6">
+              <VTextField
+                v-model="editedItem.first_name"
+                label="First Name"
+                :rules="[requiredFirstName]"
+              />
+            </VCol>
+            <VCol cols="12" md="6">
+              <VTextField
+                v-model="editedItem.last_name"
+                label="Last Name"
+                :rules="[requiredLastName]"
+              />
+            </VCol>
+
+            <!-- email -->
+            <VCol cols="12" sm="6" md="12">
+              <VTextField
+                v-model="editedItem.email"
+                label="Email"
+                :rules="[requiredEmail, emailValidator]"
+              />
+            </VCol>
+
+         
+            <!-- <VCol cols="12" sm="6" md="12">
+              <VTextField
+                v-model="editedItem.dob"
+                label="Date Of Birth"
+              />
+            </VCol> -->
+            <VCol cols="12" sm="6" md="12">
+              <VTextField v-model="editedItem.phone_no" label="Phone Number" pattern="^\(\d{3}\) \d{3}-\d{4}$"
+                :rules="[requiredPhone, validUSAPhone]" placeholder="i.e. (000) 000-0000"
+                @input="formatPhoneNumber" max="14" density="comfortable" />
+            </VCol>
+            
+
+         
+
+            <!-- status -->
+            <VCol
+              cols="12"
+
+              md="12"
+            >
+              <VSelect
+                v-model="editedItem.status"
+                :items="selectedOptions"
+                item-title="text"
+                item-value="value"
+                label="Status"
+                variant="outlined"
+              />
+            </VCol>
+          </VRow>
+        </VContainer>
+      </VCardText>
+
+      <VCardActions>
+        <VSpacer />
+
+        <VBtn
+          color="error"
+          variant="outlined"
+          @click="close"
+        >
+          Cancel
+        </VBtn>
+
+        <VBtn
+          color="success"
+          variant="elevated"
+          @click="save"
+        >
+          Save
+        </VBtn>
+        
+      </VCardActions>
+    </VCard>
+    </VForm>
+  </VDialog>
+
+  <!-- 👉 Delete Dialog  -->
+  <VDialog
+    v-model="deleteDialog"
+    max-width="500px"
+  >
+    <VCard>
+      <VCardTitle>
+        Are you sure you want to delete this item?
+      </VCardTitle>
+
+      <VCardActions>
+        <VSpacer />
+
+        <VBtn
+          color="error"
+          variant="outlined"
+          @click="closeDelete"
+        >
+          Cancel
+        </VBtn>
+
+        <VBtn
+          color="success"
+          variant="elevated"
+          @click="deleteItemConfirm"
+        >
+          OK
+        </VBtn>
+
+        <VSpacer />
+      </VCardActions>
+    </VCard>
+  </VDialog>
+</template>
--- a/resources/js/plugins/1.router/additional-routes.js
+++ b/resources/js/plugins/1.router/additional-routes.js
@@ -12,7 +12,7 @@ export const redirects = [
      const userData = useCookie('userData')
      const userRole = userData.value?.role
      if (userRole === 'admin')
-        return { name: 'dashboards-crm' }
+        return { name: 'admin-dashboard' }
      if (userRole === 'client')
        return { name: 'access-control' }
      
@@ -29,9 +29,95 @@ export const redirects = [
    name: 'pages-account-settings',
    redirect: () => ({ name: 'pages-account-settings-tab', params: { tab: 'account' } }),
  },
+  
 ]
 export const routes = [
  // Email filter
+  {
+    path: '/admin/dashboard',
+    name: 'admin-dashboard',
+    component: () => import('@/pages/dashboards/analytics.vue'),
+  },
+  {
+    path: '/admin/patients',
+    name: 'admin-patients',
+    component: () => import('@/pages/patients/patients.vue'),
+  },
+  {
+    path: '/admin/patients/labkit/:patient_id',
+    name: 'admin-patients-labkit',
+    component: () => import('@/pages/pages/patient-labkits/labkit.vue'),
+  },
+  {
+    path: '/admin/patient/meetings/:id',
+    name: 'admin-patient-meeitngs',
+    component: () => import('@/pages/patients/meetings.vue'),
+  },
+  {
+    path: '/admin/patient/meeting-details/:patient_id/:id',
+    name: 'admin-patient-meeitng-details',
+    component: () => import('@/pages/patients/meeting-details.vue'),
+  },
+  {
+    path: '/admin/provider/meetings/:id',
+    name: 'admin-provider-meeitngs',
+    component: () => import('@/pages/providers/meetings.vue'),
+  },
+  {
+    path: '/admin/provider/meeting-details/:provider_id/:id',
+    name: 'admin-provider-meeitng-details',
+    component: () => import('@/pages/providers/meeting-details.vue'),
+  },
+  {
+    path: '/admin/patient/meeting/prescription/:patient_id/:id',
+    name: 'admin-patient-meeitng-prescription',
+    component: () => import('@/pages/pages/patient-meetings/prescription.vue'),
+  },
+  {
+    path: '/admin/patient/meeting/notes/:patient_id/:id',
+    name: 'admin-patient-meeitng-notes',
+    component: () => import('@/pages/pages/patient-meetings/notes.vue'),
+  },
+  {
+    path: '/admin/providers',
+    name: 'admin-providers',
+    component: () => import('@/pages/providers/providers.vue'),
+  },
+  {
+    path: '/admin/labs',
+    name: 'admin-labs',
+    component: () => import('@/pages/labs/labs.vue'),
+  },
+  {
+    path: '/admin/lab-kites',
+    name: 'admin-lab-kites',
+    component: () => import('@/pages/labs/labs-kit.vue'),
+  },
+  {
+    path: '/admin/medicines',
+    name: 'admin-medicines',
+    component: () => import('@/pages/medicines/medicines.vue'),
+  },
+   {
+    path: '/admin/profile',
+    name: 'admin-profile',
+    component: () => import('@/views/pages/account-settings/AccountSettingsAccount.vue'),
+  },
+  {
+    path: '/admin/change-password',
+    name: 'admin-change-password',
+    component: () => import('@/views/pages/account-settings/AccountSettingsSecurity.vue'),
+  },
+   {
+    path: '/admin/site-setting',
+    name: 'admin-site-setting',
+    component: () => import('@/views/pages/account-settings/WebsiteSettings.vue'),
+  },
+   {
+    path: '/admin/patients/patient-profile/:id',
+    name: 'admin-patient-profile',
+     component: () => import('@/pages/patients/patient-profile.vue'),
+  },
  {
    path: '/apps/email/filter/:filter',
    name: 'apps-email-filter',
--- a/resources/js/plugins/i18n/locales/en.json
+++ b/resources/js/plugins/i18n/locales/en.json
@@ -156,6 +156,13 @@
  "Dashboard": "Dashboard",
  "Fleet": "Fleet",
  "Widgets": "Widgets",
+  "Patients": "Patients",
+  "Providers": "Providers",
+  "Labs": "Labs",
+  "Medicines": "Medicines",
+  "Profile": "Profile",
+  "Security": "Security",
+  "Site Setting": "Site Setting",
  "5": "5",
  "10": "10",
  "20": "20",
--- a/resources/js/store.js
+++ b/resources/js/store.js
--- a/resources/js/views/dashboards/crm/CrmActivityTimeline.vue
+++ b/resources/js/views/dashboards/crm/CrmActivityTimeline.vue
@@ -4,7 +4,7 @@ import pdf from '@images/icons/project-icons/pdf.png'
 </script>

 <template>
-  <VCard title="Activity Timeline">
+  <VCard title="Activity">
    <VCardText>
      <VTimeline
        side="end"
--- a/resources/js/views/pages/account-settings/AccountSettingsAccount.vue
+++ b/resources/js/views/pages/account-settings/AccountSettingsAccount.vue
@@ -1,28 +1,38 @@
 <script setup>
-import avatar1 from '@images/avatars/avatar-1.png'
+import avatar1 from '@images/avatars/avatar-1.png';
+import {
+emailValidator,
+requiredEmail,
+requiredName,
+requiredPhone,
+validUSAPhone
+} from '@validators';
+import { useStore } from 'vuex';

+const store = useStore();
+let imageBlob = null;
+const profileData = ref([]);
+const errors = ref({
+  name: undefined,
+  email: undefined,
+  phone_no:undefined,
+})
 const accountData = {
  avatarImg: avatar1,
-  firstName: 'john',
-  lastName: 'Doe',
-  email: 'johnDoe@example.com',
-  org: 'ThemeSelection',
-  phone: '+1 (917) 543-9876',
-  address: '123 Main St, New York, NY 10001',
-  state: 'New York',
-  zip: '10001',
-  country: ['USA'],
-  language: ['English'],
-  timezone: '(GMT-11:00) International Date Line West',
-  currency: 'USD',
+  name: '',
+  last_name: '',
+  email: '',
+  phone_no: '',
 }

+const refVForm = ref()
 const refInputEl = ref()
 const isConfirmDialogOpen = ref(false)
 const accountDataLocal = ref(structuredClone(accountData))
 const isAccountDeactivated = ref(false)
 const validateAccountDeactivation = [v => !!v || 'Please confirm account deactivation']
-
+const getIsTonalSnackbarVisible = ref(false);
+const ImageBase64 = ref();
 const resetForm = () => {
  accountDataLocal.value = structuredClone(accountData)
 }
@@ -33,12 +43,28 @@ const changeAvatar = file => {
  if (files && files.length) {
    fileReader.readAsDataURL(files[0])
    fileReader.onload = () => {
-      if (typeof fileReader.result === 'string')
-        accountDataLocal.value.avatarImg = fileReader.result
+      if (typeof fileReader.result === 'string') {
+         accountDataLocal.value.avatarImg = fileReader.result
+      }
+       ImageBase64.value = fileReader.result.split(',')[1];
+       
    }
  }
 }
-
+onMounted(async () => {
+  await store.dispatch('adminDetial');
+  let list  = await store.getters.getAdminDetail
+  accountDataLocal.value.email = list.email
+  accountDataLocal.value.name = list.name
+  accountDataLocal.value.last_name = list.last_name;
+  accountDataLocal.value.phone_no = list.phone_no
+  if(!list.image_path){
+    accountDataLocal.value.avatarImg = avatar1;
+  }else{
+    accountDataLocal.value.avatarImg = list.image_path
+  } 
+  
+});
 // reset avatar image
 const resetAvatar = () => {
  accountDataLocal.value.avatarImg = accountData.avatarImg
@@ -100,14 +126,64 @@ const currencies = [
  'HUF',
  'INR',
 ]
+
+ 
+const onSubmit = async () => {
+  const { valid } = await refVForm.value.validate()
+  console.log(valid)
+  if (valid) {
+    try {
+          console.log(ImageBase64.value);
+            await store.dispatch('profileUpdate',{
+              name: accountDataLocal.value.name,
+              last_name:  accountDataLocal.value.last_name,
+              phone_no: accountDataLocal.value.phone_no,
+              image: ImageBase64.value, //ecelData,
+            })
+        } catch (error) {
+          console.error(error)
+        }
+  await store.dispatch('adminDetial');
+    let list  = await store.getters.getAdminDetail
+console.log('list',list)
+  accountDataLocal.value.avatarImg = list.image_path
+  accountDataLocal.value.name = list.name
+  accountDataLocal.value.last_name = list.last_name
+  accountDataLocal.value.phone_no = list.phone_no
+  }
+}  
+
+
+
+const formatPhoneNumber = () => {
+  // Remove non-numeric characters from the input
+  const numericValue = accountDataLocal.value.phone_no.replace(/\D/g, '');
+
+  // Apply formatting logic
+  if (numericValue.length <= 10) {
+    accountDataLocal.value.phone_no = numericValue.replace(/(\d{3})(\d{3})(\d{4})/, '($1) $2-$3');
+  } else {
+    // Limit the input to a maximum of 14 characters
+    const truncatedValue = numericValue.slice(0, 10);
+    accountDataLocal.value.phone_no = truncatedValue.replace(/(\d{3})(\d{3})(\d{4})/, '($1) $2-$3');
+  }
+};
 </script>

 <template>
+
  <VRow>
+  
    <VCol cols="12">
      <VCard>
        <VCardText>
          <div class="d-flex mb-10">
+            <VSnackbar v-model="getIsTonalSnackbarVisible" :timeout="5000" location="top end" variant="flat"
+              color="success">
+              <VIcon
+                    class="ri-success-line success-icon"
+                  /> Profile Update Successfully
+            </VSnackbar>
            <!-- 👉 Avatar -->
            <VAvatar
              rounded
@@ -127,7 +203,7 @@ const currencies = [
                    icon="ri-upload-cloud-line"
                    class="d-sm-none"
                  />
-                  <span class="d-none d-sm-block">Upload new photo</span>
+                  <span class="d-none d-sm-block">Upload Logo</span>
                </VBtn>
                <input
                  ref="refInputEl"
@@ -137,18 +213,6 @@ const currencies = [
                  hidden
                  @input="changeAvatar"
                >
-                <VBtn
-                  type="reset"
-                  color="error"
-                  variant="outlined"
-                  @click="resetAvatar"
-                >
-                  <span class="d-none d-sm-block">Reset</span>
-                  <VIcon
-                    icon="ri-refresh-line"
-                    class="d-sm-none"
-                  />
-                </VBtn>
              </div>
              <p class="text-body-1 mb-0">
                Allowed JPG, GIF or PNG. Max size of 800K
@@ -157,7 +221,7 @@ const currencies = [
          </div>

          <!-- 👉 Form -->
-          <VForm>
+          <VForm ref="refVForm">
            <VRow>
              <!-- 👉 First Name -->
              <VCol
@@ -165,9 +229,10 @@ const currencies = [
                cols="12"
              >
                <VTextField
-                  v-model="accountDataLocal.firstName"
-                  placeholder="John"
-                  label="First Name"
+                  v-model="accountDataLocal.name"
+                label="Name"
+                :rules="[requiredName]"
+                :error-messages="errors.name"
                />
              </VCol>

@@ -177,7 +242,7 @@ const currencies = [
                cols="12"
              >
                <VTextField
-                  v-model="accountDataLocal.lastName"
+                  v-model="accountDataLocal.last_name"
                  placeholder="Doe"
                  label="Last Name"
                />
@@ -188,25 +253,18 @@ const currencies = [
                cols="12"
                md="6"
              >
-                <VTextField
+                <VTextField readonly
                  v-model="accountDataLocal.email"
                  label="E-mail"
                  placeholder="johndoe@gmail.com"
                  type="email"
+                  :rules="[requiredEmail, emailValidator]"
+                  :error-messages="errors.email"
                />
              </VCol>

              <!-- 👉 Organization -->
-              <VCol
-                cols="12"
-                md="6"
-              >
-                <VTextField
-                  v-model="accountDataLocal.org"
-                  label="Organization"
-                  placeholder="ThemeSelection"
-                />
-              </VCol>
+           

              <!-- 👉 Phone -->
              <VCol
@@ -214,123 +272,32 @@ const currencies = [
                md="6"
              >
                <VTextField
-                  v-model="accountDataLocal.phone"
+                  v-model="accountDataLocal.phone_no"
                  label="Phone Number"
                  placeholder="+1 (917) 543-9876"
+                  :rules="[requiredPhone, validUSAPhone]"
+                  :error-messages="errors.phone"
+                  @input="formatPhoneNumber"
+                  max="14"
+                  pattern="^\(\d{3}\) \d{3}-\d{4}$"
                />
              </VCol>

-              <!-- 👉 Address -->
-              <VCol
-                cols="12"
-                md="6"
-              >
-                <VTextField
-                  v-model="accountDataLocal.address"
-                  label="Address"
-                  placeholder="123 Main St, New York, NY 10001"
-                />
-              </VCol>

-              <!-- 👉 State -->
-              <VCol
-                cols="12"
-                md="6"
-              >
-                <VTextField
-                  v-model="accountDataLocal.state"
-                  label="State"
-                  placeholder="New York"
-                />
-              </VCol>

-              <!-- 👉 Zip Code -->
-              <VCol
-                cols="12"
-                md="6"
-              >
-                <VTextField
-                  v-model="accountDataLocal.zip"
-                  label="Zip Code"
-                  placeholder="10001"
-                />
-              </VCol>
+              
+            

-              <!-- 👉 Country -->
-              <VCol
-                cols="12"
-                md="6"
-              >
-                <VSelect
-                  v-model="accountDataLocal.country"
-                  multiple
-                  chips
-                  closable-chips
-                  label="Country"
-                  :items="['USA', 'Canada', 'UK', 'India', 'Australia']"
-                  placeholder="Select Country"
-                />
-              </VCol>
+              

-              <!-- 👉 Language -->
-              <VCol
-                cols="12"
-                md="6"
-              >
-                <VSelect
-                  v-model="accountDataLocal.language"
-                  label="Language"
-                  multiple
-                  chips
-                  closable-chips
-                  placeholder="Select Language"
-                  :items="['English', 'Spanish', 'Arabic', 'Hindi', 'Urdu']"
-                />
-              </VCol>

-              <!-- 👉 Timezone -->
-              <VCol
-                cols="12"
-                md="6"
-              >
-                <VSelect
-                  v-model="accountDataLocal.timezone"
-                  label="Timezone"
-                  placeholder="Select Timezone"
-                  :items="timezones"
-                  :menu-props="{ maxHeight: 200 }"
-                />
-              </VCol>
-
-              <!-- 👉 Currency -->
-              <VCol
-                cols="12"
-                md="6"
-              >
-                <VSelect
-                  v-model="accountDataLocal.currency"
-                  label="Currency"
-                  placeholder="Select Currency"
-                  :items="currencies"
-                  :menu-props="{ maxHeight: 200 }"
-                />
-              </VCol>

              <!-- 👉 Form Actions -->
              <VCol
                cols="12"
                class="d-flex flex-wrap gap-4"
              >
-                <VBtn>Save changes</VBtn>
-
-                <VBtn
-                  color="secondary"
-                  variant="outlined"
-                  type="reset"
-                  @click.prevent="resetForm"
-                >
-                  Reset
-                </VBtn>
+                <VBtn  @click.prevent="onSubmit">Save changes</VBtn>
              </VCol>
            </VRow>
          </VForm>
@@ -338,30 +305,6 @@ const currencies = [
      </VCard>
    </VCol>

-    <VCol cols="12">
-      <!-- 👉 Delete Account -->
-      <VCard title="Delete Account">
-        <VCardText>
-          <!-- 👉 Checkbox and Button  -->
-          <div>
-            <VCheckbox
-              v-model="isAccountDeactivated"
-              :rules="validateAccountDeactivation"
-              label="I confirm my account deactivation"
-            />
-          </div>
-
-          <VBtn
-            :disabled="!isAccountDeactivated"
-            color="error"
-            class="mt-3"
-            @click="isConfirmDialogOpen = true"
-          >
-            Deactivate Account
-          </VBtn>
-        </VCardText>
-      </VCard>
-    </VCol>
  </VRow>

  <!-- Confirm Dialog -->
--- a/resources/js/views/pages/account-settings/AccountSettingsSecurity.vue
+++ b/resources/js/views/pages/account-settings/AccountSettingsSecurity.vue
@@ -1,14 +1,16 @@
 <script setup>
-import sittingGirlWithLaptopDark from '@images/illustrations/sitting-girl-with-laptop-dark.png'
-import sittingGirlWithLaptopLight from '@images/illustrations/sitting-girl-with-laptop-light.png'
-
+import sittingGirlWithLaptopDark from '@images/illustrations/sitting-girl-with-laptop-dark.png';
+import sittingGirlWithLaptopLight from '@images/illustrations/sitting-girl-with-laptop-light.png';
+import { useStore } from 'vuex';
+const store = useStore();
+const refVForm = ref(null)
 const isCurrentPasswordVisible = ref(false)
 const isNewPasswordVisible = ref(false)
 const isConfirmPasswordVisible = ref(false)
 const currentPassword = ref('')
 const newPassword = ref('')
 const confirmPassword = ref('')
-
+ const passwordConfirmationTarget = computed(() => newPassword.value);
 const passwordRequirements = [
  'Minimum 8 characters long - the more, the better',
  'At least one lowercase character',
@@ -117,7 +119,28 @@ const recentDevices = [
    },
  },
 ]
-
+const save = async () => {
+  const { valid } = await refVForm.value.validate()
+  console.log(valid)
+  if (valid) {
+    try {
+         
+            await store.dispatch('adminPasswordUpadate',{
+              password: currentPassword.value,
+              new_password :  newPassword.value,
+              confirm_password :  confirmPassword.value,
+            })
+           
+          
+        } catch (error) {
+          console.error(error)
+        }
+   
+  currentPassword.value = null
+  newPassword.value = null
+  confirmPassword.value = null
+  }
+}
 const sittingGirlImg = useGenerateImageVariant(sittingGirlWithLaptopLight, sittingGirlWithLaptopDark)
 const isOneTimePasswordDialogVisible = ref(false)
 </script>
@@ -130,7 +153,7 @@ const isOneTimePasswordDialogVisible = ref(false)
        <VCardItem class="pb-6">
          <VCardTitle>Change Password</VCardTitle>
        </VCardItem>
-        <VForm>
+        <VForm ref="refVForm">
          <VCardText class="pt-0">
            <!-- 👉 Current Password -->
            <VRow>
@@ -147,6 +170,7 @@ const isOneTimePasswordDialogVisible = ref(false)
                  label="Current Password"
                  placeholder="············"
                  @click:append-inner="isCurrentPasswordVisible = !isCurrentPasswordVisible"
+                  
                />
              </VCol>
            </VRow>
@@ -166,6 +190,8 @@ const isOneTimePasswordDialogVisible = ref(false)
                  autocomplete="on"
                  placeholder="············"
                  @click:append-inner="isNewPasswordVisible = !isNewPasswordVisible"
+                   :rules="[passwordValidator]"
+                  
                />
              </VCol>

@@ -173,6 +199,7 @@ const isOneTimePasswordDialogVisible = ref(false)
                cols="12"
                md="6"
              >
+           
                <!-- 👉 confirm password -->
                <VTextField
                  v-model="confirmPassword"
@@ -182,6 +209,7 @@ const isOneTimePasswordDialogVisible = ref(false)
                  label="Confirm New Password"
                  placeholder="············"
                  @click:append-inner="isConfirmPasswordVisible = !isConfirmPasswordVisible"
+                 :rules="[value => confirmedValidator(value, passwordConfirmationTarget)]"
                />
              </VCol>
            </VRow>
@@ -214,15 +242,15 @@ const isOneTimePasswordDialogVisible = ref(false)

            <!-- 👉 Action Buttons -->
            <div class="d-flex flex-wrap gap-4">
-              <VBtn>Save changes</VBtn>
+              <VBtn @click="save">Save changes</VBtn>

-              <VBtn
+              <!-- <VBtn
                type="reset"
                color="secondary"
                variant="outlined"
              >
                Reset
-              </VBtn>
+              </VBtn>-->
            </div>
          </VCardText>
        </VForm>
@@ -231,7 +259,7 @@ const isOneTimePasswordDialogVisible = ref(false)
    <!-- !SECTION -->

    <!-- SECTION Two-steps verification -->
-    <VCol cols="12">
+    <VCol cols="12"   style="display: none;">
      <VCard>
        <VCardItem class="pb-6">
          <VCardTitle>Two-steps verification</VCardTitle>
@@ -256,7 +284,7 @@ const isOneTimePasswordDialogVisible = ref(false)
    </VCol>
    <!-- !SECTION -->

-    <VCol cols="12">
+    <VCol cols="12"   style="display: none;">
      <!-- SECTION: Create an API key -->
      <VCard title="Create an API key">
        <VRow>
@@ -313,7 +341,7 @@ const isOneTimePasswordDialogVisible = ref(false)
    <!-- !SECTION -->
    </VCol>

-    <VCol cols="12">
+    <VCol cols="12"   style="display: none;">
      <!-- SECTION: API Keys List -->
      <VCard>
        <VCardItem class="pb-4">
@@ -363,7 +391,7 @@ const isOneTimePasswordDialogVisible = ref(false)
    </VCol>

    <!-- SECTION Recent Devices -->
-    <VCol cols="12">
+    <VCol cols="12" style="display: none;">
      <!-- 👉 Table -->
      <VCard
        title="Recent Devices"
@@ -396,6 +424,6 @@ const isOneTimePasswordDialogVisible = ref(false)
  </VRow>

  <!-- SECTION Enable One time password -->
-  <TwoFactorAuthDialog v-model:isDialogVisible="isOneTimePasswordDialogVisible" />
+  <TwoFactorAuthDialog v-model:isDialogVisible="isOneTimePasswordDialogVisible" style="display: none;"/>
  <!-- !SECTION -->
 </template>
--- a/resources/js/views/pages/account-settings/WebsiteSettings.vue
+++ b/resources/js/views/pages/account-settings/WebsiteSettings.vue
@@ -0,0 +1,504 @@
+<script setup>
+import { useStore } from 'vuex';
+const store = useStore();
+const accountData = {
+  favicon:'',
+  domain_name: '',
+  footer_text: '',
+  header_title: '',
+  logo: '',
+  plan_description: '',
+  plan_main_title:'',
+ id:'',
+}
+const refVForm = ref(null)
+const refInputEl = ref()
+const refInputElFavicon = ref()
+const isConfirmDialogOpen = ref(false)
+const accountDataLocal = ref(structuredClone(accountData))
+const isAccountDeactivated = ref(false)
+const validateAccountDeactivation = [v => !!v || 'Please confirm account deactivation']
+const imageBase64 = ref(null)
+ const faviconBase64 = ref(null)
+const resetForm = () => {
+  accountDataLocal.value = structuredClone(accountData)
+}
+const resetFormFavicon = () => {
+  accountDataLocal.value = structuredClone(accountData)
+}
+const changeAvatar = file => {
+  const fileReader = new FileReader()
+  const { files } = file.target
+  if (files && files.length) {
+    fileReader.readAsDataURL(files[0])
+    fileReader.onload = () => {
+      if (typeof fileReader.result === 'string') {
+            accountDataLocal.value.logo = fileReader.result
+      }
+    
+          imageBase64.value = fileReader.result.split(',')[1]
+    }
+  }
+}
+const changeAvatarFavicon = file => {
+  const fileReader = new FileReader()
+  const { files } = file.target
+  if (files && files.length) {
+    fileReader.readAsDataURL(files[0])
+    fileReader.onload = () => {
+      if (typeof fileReader.result === 'string') {
+         accountDataLocal.value.favicon = fileReader.result
+      }
+       faviconBase64.value = fileReader.result.split(',')[1]
+    }
+  }
+}
+
+// reset avatar image
+const resetAvatar = () => {
+  accountDataLocal.value.logo = accountData.logo
+}
+const resetAvatarFavicon = () => {
+  accountDataLocal.value.favicon = accountData.favicon
+}
+const timezones = [
+  '(GMT-11:00) International Date Line West',
+  '(GMT-11:00) Midway Island',
+  '(GMT-10:00) Hawaii',
+  '(GMT-09:00) Alaska',
+  '(GMT-08:00) Pacific Time (US & Canada)',
+  '(GMT-08:00) Tijuana',
+  '(GMT-07:00) Arizona',
+  '(GMT-07:00) Chihuahua',
+  '(GMT-07:00) La Paz',
+  '(GMT-07:00) Mazatlan',
+  '(GMT-07:00) Mountain Time (US & Canada)',
+  '(GMT-06:00) Central America',
+  '(GMT-06:00) Central Time (US & Canada)',
+  '(GMT-06:00) Guadalajara',
+  '(GMT-06:00) Mexico City',
+  '(GMT-06:00) Monterrey',
+  '(GMT-06:00) Saskatchewan',
+  '(GMT-05:00) Bogota',
+  '(GMT-05:00) Eastern Time (US & Canada)',
+  '(GMT-05:00) Indiana (East)',
+  '(GMT-05:00) Lima',
+  '(GMT-05:00) Quito',
+  '(GMT-04:00) Atlantic Time (Canada)',
+  '(GMT-04:00) Caracas',
+  '(GMT-04:00) La Paz',
+  '(GMT-04:00) Santiago',
+  '(GMT-03:30) Newfoundland',
+  '(GMT-03:00) Brasilia',
+  '(GMT-03:00) Buenos Aires',
+  '(GMT-03:00) Georgetown',
+  '(GMT-03:00) Greenland',
+  '(GMT-02:00) Mid-Atlantic',
+  '(GMT-01:00) Azores',
+  '(GMT-01:00) Cape Verde Is.',
+  '(GMT+00:00) Casablanca',
+  '(GMT+00:00) Dublin',
+  '(GMT+00:00) Edinburgh',
+  '(GMT+00:00) Lisbon',
+  '(GMT+00:00) London',
+]
+
+const currencies = [
+  'USD',
+  'EUR',
+  'GBP',
+  'AUD',
+  'BRL',
+  'CAD',
+  'CNY',
+  'CZK',
+  'DKK',
+  'HKD',
+  'HUF',
+  'INR',
+]
+onMounted(async () => {
+  await store.dispatch('siteSetting');
+  let list = await store.getters.getSiteSetting 
+console.log('list',list)
+  accountDataLocal.value.logo = list.logo
+  accountDataLocal.value.favicon = list.favicon
+  accountDataLocal.value.plan_main_title = list.plan_main_title
+  accountDataLocal.value.plan_description = list.plan_description
+  accountDataLocal.value.header_title = list.header_title
+  accountDataLocal.value.footer_text = list.footer_text
+  accountDataLocal.value.domain_name = list.domain_name
+  accountDataLocal.value.id = list.id
+});
+const convertImageToBase64 = (event) => {
+      const file = event.target.files[0]
+      const reader = new FileReader()
+      reader.readAsDataURL(file)
+      reader.onload = () => {
+        imageBase64.value = reader.result.split(',')[1]
+      }
+    }
+const save = async () => {
+  const { valid } = await refVForm.value.validate()
+  console.log(valid)
+  if (valid) {
+    try {
+          console.log(imageBase64.value)
+            await store.dispatch('siteSettingUpdate',{
+              plan_main_title: accountDataLocal.value.plan_main_title,
+              plan_description:  accountDataLocal.value.plan_description,
+              header_title: accountDataLocal.value.header_title,
+              footer_text: accountDataLocal.value.footer_text,
+              domain_name: accountDataLocal.value.domain_name,
+              id: accountDataLocal.value.id,
+              logo:imageBase64.value, //ecelData,
+              favicon:faviconBase64.value//imageBase64.value
+            })
+           
+        
+        } catch (error) {
+          console.error(error)
+        }
+   await store.dispatch('siteSetting');
+  let list = await store.getters.getSiteSetting 
+console.log('list',list)
+  accountDataLocal.value.logo = list.logo
+  accountDataLocal.value.favicon = list.favicon
+  accountDataLocal.value.plan_main_title = list.plan_main_title
+  accountDataLocal.value.plan_description = list.plan_description
+  accountDataLocal.value.header_title = list.header_title
+  accountDataLocal.value.footer_text = list.footer_text
+  accountDataLocal.value.domain_name = list.domain_name
+  }
+}
+</script>
+
+<template>
+  <VRow>
+
+      <VCol cols="12">
+        <VCard>
+          <VCardText>
+            <div class="d-flex mb-10">
+              <!-- 👉 Avatar -->
+              <VAvatar
+                rounded
+                size="70"
+                class="me-6"
+                :image="accountDataLocal.logo"
+              />
+
+              <!-- 👉 Upload Photo -->
+              <form class="d-flex flex-column justify-center gap-4">
+                <div class="d-flex flex-wrap gap-4">
+                  <VBtn
+                    color="primary"
+                    @click="refInputEl?.click()"
+                  >
+                    <VIcon
+                      icon="ri-upload-cloud-line"
+                      class="d-sm-none"
+                    />
+                    <span class="d-none d-sm-block">Upload new Logo</span>
+                  </VBtn>
+                  <input
+                    ref="refInputEl"
+                    type="file"
+                    name="file"
+                    accept=".jpeg,.png,.webp,.jpg,GIF"
+                    hidden
+                    @input="changeAvatar"
+                  >
+                  <VBtn
+                    type="reset"
+                    color="error"
+                    variant="outlined"
+                    @click="resetAvatar"
+                  >
+                    <span class="d-none d-sm-block">Reset</span>
+                    <VIcon
+                      icon="ri-refresh-line"
+                      class="d-sm-none"
+                    />
+                  </VBtn>
+                </div>
+                <p class="text-body-1 mb-0">
+                  Allowed JPG, GIF ,webp or PNG. Max size of 800K
+                </p>
+              </form>
+            </div>
+            
+            <div class="d-flex mb-10">
+                <!-- 👉 Avatar -->
+                <VAvatar
+                  rounded
+                  size="70"
+                  class="me-6"
+                  :image="accountDataLocal.favicon"
+                />
+
+                <!-- 👉 Upload Photo -->
+                <form class="d-flex flex-column justify-center gap-4">
+                  <div class="d-flex flex-wrap gap-4">
+                    <VBtn
+                      color="primary"
+                      @click="refInputElFavicon?.click()"
+                    >
+                      <VIcon
+                        icon="ri-upload-cloud-line"
+                        class="d-sm-none"
+                      />
+                      <span class="d-none d-sm-block">Upload new Favicon</span>
+                    </VBtn>
+                    <input
+                      ref="refInputElFavicon"
+                      type="file"
+                      name="file"
+                    accept=".jpeg,.png,.webp,.jpg,GIF"
+                      hidden
+                      @input="changeAvatarFavicon"
+                    >
+                    <VBtn
+                      type="reset"
+                      color="error"
+                      variant="outlined"
+                      @click="resetAvatarFavicon"
+                    >
+                      <span class="d-none d-sm-block">Reset</span>
+                      <VIcon
+                        icon="ri-refresh-line"
+                        class="d-sm-none"
+                      />
+                    </VBtn>
+                  </div>
+                  <p class="text-body-1 mb-0">
+                    Allowed JPG,webp, GIF or PNG. Max size of 800K
+                  </p>
+                </form>
+            </div>
+            <!-- 👉 Form -->
+                <VForm ref="refVForm" >
+              <VRow>
+                <!-- 👉 First Name -->
+                <VCol
+                  md="6"
+                  cols="12"
+                >
+                  <VTextField
+                    v-model="accountDataLocal.plan_main_title"
+                    placeholder="Plan Main Page Title"
+                    label="Plan Page Main Title"
+                    :rules="[requiredValidator]"
+                  />
+                </VCol>
+
+                <!-- 👉 Last Name -->
+                <VCol
+                  md="6"
+                  cols="12"
+                >
+                  <VTextField
+                    v-model="accountDataLocal.plan_description"
+                    placeholder="Doe"
+                    label="Plan Description"
+                    :rules="[requiredValidator]"
+                  />
+                </VCol>
+          <!-- 👉 Header Title -->
+                        <VCol
+                          cols="12"
+                          md="6"
+                          
+                        >
+                          <VTextField
+                            v-model="accountDataLocal.header_title"
+                            label="Header Title"
+                            placeholder="Header Title"
+                            :rules="[requiredValidator]"
+                          
+                          />
+                        </VCol>
+                <VCol
+                  cols="12"
+                  md="6"
+                >
+                  <VTextField
+                    v-model="accountDataLocal.domain_name"
+                    label="Domain Name"
+                    placeholder="Domain Name"
+                    :rules="[requiredValidator]"
+                  />
+                </VCol>
+                <!-- 👉 Email -->
+                <VCol
+                  cols="12"
+                  md="6"
+                >
+                  <VTextarea
+                    v-model="accountDataLocal.footer_text"
+                    label="Footer Text"
+                    placeholder="Footer Text"
+                    :rules="[requiredValidator]"
+                  
+                  />
+                </VCol>
+
+                
+
+                <!-- 👉 Phone -->
+                
+
+                <!-- 👉 Address -->
+                <VCol
+                  cols="12"
+                  md="6"
+                    style="display: none;"
+                >
+                  <VTextField
+                    v-model="accountDataLocal.address"
+                    label="Address"
+                    placeholder="123 Main St, New York, NY 10001"
+                  />
+                </VCol>
+
+                <!-- 👉 State -->
+                <VCol
+                  cols="12"
+                  md="6"
+                    style="display: none;"
+                >
+                  <VTextField
+                    v-model="accountDataLocal.state"
+                    label="State"
+                    placeholder="New York"
+                  />
+                </VCol>
+
+                <!-- 👉 Zip Code -->
+                <VCol
+                  cols="12"
+                  md="6"
+                    style="display: none;"
+                >
+                  <VTextField
+                    v-model="accountDataLocal.zip"
+                    label="Zip Code"
+                    placeholder="10001"
+                  />
+                </VCol>
+
+                <!-- 👉 Country -->
+                <VCol
+                  cols="12"
+                  md="6"
+                    style="display: none;"
+                >
+                  <VSelect
+                    v-model="accountDataLocal.country"
+                    multiple
+                    chips
+                    closable-chips
+                    label="Country"
+                    :items="['USA', 'Canada', 'UK', 'India', 'Australia']"
+                    placeholder="Select Country"
+                  />
+                </VCol>
+
+                <!-- 👉 Language -->
+                <VCol
+                  cols="12"
+                  md="6"
+                    style="display: none;"
+                >
+                  <VSelect
+                    v-model="accountDataLocal.language"
+                    label="Language"
+                    multiple
+                    chips
+                    closable-chips
+                    placeholder="Select Language"
+                    :items="['English', 'Spanish', 'Arabic', 'Hindi', 'Urdu']"
+                  />
+                </VCol>
+
+                <!-- 👉 Timezone -->
+                <VCol
+                  cols="12"
+                  md="6"
+                    style="display: none;"
+                >
+                  <VSelect
+                    v-model="accountDataLocal.timezone"
+                    label="Timezone"
+                    placeholder="Select Timezone"
+                    :items="timezones"
+                    :menu-props="{ maxHeight: 200 }"
+                  />
+                </VCol>
+
+                <!-- 👉 Currency -->
+                <VCol
+                  cols="12"
+                  md="6"
+                    style="display: none;"
+                >
+                  <VSelect
+                    v-model="accountDataLocal.currency"
+                    label="Currency"
+                    placeholder="Select Currency"
+                    :items="currencies"
+                    :menu-props="{ maxHeight: 200 }"
+                  />
+                </VCol>
+
+                <!-- 👉 Form Actions -->
+                <VCol
+                  cols="12"
+                  class="d-flex flex-wrap gap-4"
+                >
+                  <VBtn @click="save">Save changes</VBtn>
+
+                  
+                </VCol>
+              </VRow>
+            </VForm>
+          </VCardText>
+        </VCard>
+      </VCol>
+  
+    <VCol cols="12"   style="display: none;">
+      <!-- 👉 Delete Account -->
+      <VCard title="Delete Account">
+        <VCardText>
+          <!-- 👉 Checkbox and Button  -->
+          <div>
+            <VCheckbox
+              v-model="isAccountDeactivated"
+              :rules="validateAccountDeactivation"
+              label="I confirm my account deactivation"
+            />
+          </div>
+
+          <VBtn
+            :disabled="!isAccountDeactivated"
+            color="error"
+            class="mt-3"
+            @click="isConfirmDialogOpen = true"
+          >
+            Deactivate Account
+          </VBtn>
+        </VCardText>
+      </VCard>
+    </VCol>
+  </VRow>
+
+  <!-- Confirm Dialog -->
+  <ConfirmDialog
+    v-model:isDialogVisible="isConfirmDialogOpen"
+    confirmation-question="Are you sure you want to deactivate your account?"
+    confirm-title="Deactivated!"
+    confirm-msg="Your account has been deactivated successfully."
+    cancel-title="Cancelled"
+    cancel-msg="Account Deactivation Cancelled!"
+  />
+</template>
--- a/resources/views/application.blade.php
+++ b/resources/views/application.blade.php
@@ -3,9 +3,9 @@

 <head>
  <meta charset="UTF-8" />
-  <link rel="icon" href="{{ asset('favicon.ico') }}" />
+  <link rel="icon" href="{{ asset('images/favicon.webp') }}" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>Materio - Vuetify Vuejs Admin Template</title>
+  <title>{{ config('app.name') }}</title>
  <link rel="stylesheet" type="text/css" href="{{ asset('loader.css') }}" />
  @vite(['resources/js/main.js'])
 </head>
@@ -15,7 +15,7 @@
    <div id="loading-bg">
      <div class="loading-logo">
        <!-- SVG Logo -->
-        <svg width="86" height="48" viewBox="0 0 30 24" xmlns="http://www.w3.org/2000/svg">
+        <!-- <svg width="86" height="48" viewBox="0 0 30 24" xmlns="http://www.w3.org/2000/svg">
          <g fill="none" fill-rule="evenodd">
            <path d="M30 21.392a2 2 0 0 1-3.027 1.716l-3.258-1.95a2 2 0 0 1-.973-1.716l-.001-6.7L15
                17.178l-7.742-4.434v6.7a2 2 0 0 1-.973 1.715l-3.258 1.95A2 2 0 0 1 0 21.392V3.585l.005-.15L0 3.572a2 2 0 0
@@ -26,10 +26,9 @@
            <path fill="var(--initial-loader-color)" opacity=".078" d="m30 8.589-7.258 4.052v2.62z" />
            <path d="M3.045 1.866 15 9.194v7.983L0 8.587V3.571a2 2 0 0 1 3.045-1.706Z" fill-opacity=".15" fill="
                #FFF" />
-            <path d="M26.955 1.866 15 9.194v7.983l15-8.59V3.571a2 2 0 0 0-3.045-1.706Z" fill-opacity=".35"
-              fill="#FFF" />
+            <path d="M26.955 1.866 15 9.194v7.983l15-8.59V3.571a2 2 0 0 0-3.045-1.706Z" fill-opacity=".35" fill="#FFF" />
          </g>
-        </svg>
+        </svg> -->
      </div>
      <div class=" loading">
        <div class="effect-1 effects"></div>
@@ -38,7 +37,7 @@
      </div>
    </div>
  </div>
-  
+
  <script>
    const loaderColor = localStorage.getItem('materio-initial-loader-bg') || '#FFFFFF'
    const primaryColor = localStorage.getItem('materio-initial-loader-color') || '#a169ff'
--- a/themeConfig.js
+++ b/themeConfig.js
@@ -4,15 +4,16 @@ import { breakpointsVuetify } from '@vueuse/core'
 import { VIcon } from 'vuetify/components/VIcon'

 // ❗ Logo SVG must be imported with ?raw suffix
-import logo from '@images/logo.svg?raw'
+import logoImage from '@images/logo-peptied-web.webp'
+
 import { AppContentLayoutNav, ContentWidth, FooterType, NavbarType } from '@layouts/enums'

 export const { themeConfig, layoutConfig } = defineThemeConfig({
  app: {
-    title: 'TelemedPro',
+    title: '',

    // ❗ if you have SVG logo and want it to adapt according to theme color, you have to apply color as `color: rgb(var(--v-global-theme-primary))`
-    logo: h('div', { innerHTML: logo, style: 'line-height:0; color: rgb(var(--v-global-theme-primary))' }),
+    logo: h('div', { innerHTML: `<img src="${logoImage}" alt="Logo" style="width:150px;">` }),
    contentWidth: ContentWidth.Boxed,
    contentLayoutNav: AppContentLayoutNav.Vertical,
    overlayNavFromBreakpoint: breakpointsVuetify.md + 16, // 16 for scrollbar. Docs: https://next.vuetifyjs.com/en/features/display-and-platform/
--- a/typed-router.d.ts
+++ b/typed-router.d.ts
@@ -118,7 +118,10 @@ declare module 'vue-router/auto/routes' {
    'front-pages-landing-page': RouteRecordInfo<'front-pages-landing-page', '/front-pages/landing-page', Record<never, never>, Record<never, never>>,
    'front-pages-payment': RouteRecordInfo<'front-pages-payment', '/front-pages/payment', Record<never, never>, Record<never, never>>,
    'front-pages-pricing': RouteRecordInfo<'front-pages-pricing', '/front-pages/pricing', Record<never, never>, Record<never, never>>,
+    'labs-labs': RouteRecordInfo<'labs-labs', '/labs/labs', Record<never, never>, Record<never, never>>,
+    'labs-labs-kit': RouteRecordInfo<'labs-labs-kit', '/labs/labs-kit', Record<never, never>, Record<never, never>>,
    'login': RouteRecordInfo<'login', '/login', Record<never, never>, Record<never, never>>,
+    'medicines-medicines': RouteRecordInfo<'medicines-medicines', '/medicines/medicines', Record<never, never>, Record<never, never>>,
    'not-authorized': RouteRecordInfo<'not-authorized', '/not-authorized', Record<never, never>, Record<never, never>>,
    'pages-account-settings-tab': RouteRecordInfo<'pages-account-settings-tab', '/pages/account-settings/:tab', { tab: ParamValue<true> }, { tab: ParamValue<false> }>,
    'pages-authentication-forgot-password-v1': RouteRecordInfo<'pages-authentication-forgot-password-v1', '/pages/authentication/forgot-password-v1', Record<never, never>, Record<never, never>>,
@@ -145,9 +148,25 @@ declare module 'vue-router/auto/routes' {
    'pages-icons': RouteRecordInfo<'pages-icons', '/pages/icons', Record<never, never>, Record<never, never>>,
    'pages-misc-coming-soon': RouteRecordInfo<'pages-misc-coming-soon', '/pages/misc/coming-soon', Record<never, never>, Record<never, never>>,
    'pages-misc-under-maintenance': RouteRecordInfo<'pages-misc-under-maintenance', '/pages/misc/under-maintenance', Record<never, never>, Record<never, never>>,
+    'pages-patient-labkits-labkit': RouteRecordInfo<'pages-patient-labkits-labkit', '/pages/patient-labkits/labkit', Record<never, never>, Record<never, never>>,
+    'pages-patient-meetings-notes': RouteRecordInfo<'pages-patient-meetings-notes', '/pages/patient-meetings/notes', Record<never, never>, Record<never, never>>,
+    'pages-patient-meetings-prescription': RouteRecordInfo<'pages-patient-meetings-prescription', '/pages/patient-meetings/prescription', Record<never, never>, Record<never, never>>,
    'pages-pricing': RouteRecordInfo<'pages-pricing', '/pages/pricing', Record<never, never>, Record<never, never>>,
    'pages-typography': RouteRecordInfo<'pages-typography', '/pages/typography', Record<never, never>, Record<never, never>>,
    'pages-user-profile-tab': RouteRecordInfo<'pages-user-profile-tab', '/pages/user-profile/:tab', { tab: ParamValue<true> }, { tab: ParamValue<false> }>,
+    'patients-meeting-details': RouteRecordInfo<'patients-meeting-details', '/patients/meeting-details', Record<never, never>, Record<never, never>>,
+    'patients-meetings': RouteRecordInfo<'patients-meetings', '/patients/meetings', Record<never, never>, Record<never, never>>,
+    'patients-notes-panel': RouteRecordInfo<'patients-notes-panel', '/patients/NotesPanel', Record<never, never>, Record<never, never>>,
+    'patients-patient-profile': RouteRecordInfo<'patients-patient-profile', '/patients/patient-profile', Record<never, never>, Record<never, never>>,
+    'patients-patien-tab-overview': RouteRecordInfo<'patients-patien-tab-overview', '/patients/PatienTabOverview', Record<never, never>, Record<never, never>>,
+    'patients-patient-bio-panel': RouteRecordInfo<'patients-patient-bio-panel', '/patients/PatientBioPanel', Record<never, never>, Record<never, never>>,
+    'patients-patients': RouteRecordInfo<'patients-patients', '/patients/patients', Record<never, never>, Record<never, never>>,
+    'patients-prescription-panel': RouteRecordInfo<'patients-prescription-panel', '/patients/PrescriptionPanel', Record<never, never>, Record<never, never>>,
+    'patients-user-tab-overview': RouteRecordInfo<'patients-user-tab-overview', '/patients/UserTabOverview', Record<never, never>, Record<never, never>>,
+    'providers-meeting-details': RouteRecordInfo<'providers-meeting-details', '/providers/meeting-details', Record<never, never>, Record<never, never>>,
+    'providers-meetings': RouteRecordInfo<'providers-meetings', '/providers/meetings', Record<never, never>, Record<never, never>>,
+    'providers-provider-profile': RouteRecordInfo<'providers-provider-profile', '/providers/provider-profile', Record<never, never>, Record<never, never>>,
+    'providers-providers': RouteRecordInfo<'providers-providers', '/providers/providers', Record<never, never>, Record<never, never>>,
    'register': RouteRecordInfo<'register', '/register', Record<never, never>, Record<never, never>>,
    'tables-data-table': RouteRecordInfo<'tables-data-table', '/tables/data-table', Record<never, never>, Record<never, never>>,
    'tables-simple-table': RouteRecordInfo<'tables-simple-table', '/tables/simple-table', Record<never, never>, Record<never, never>>,
--- a/vite.config.js
+++ b/vite.config.js
@@ -1,8 +1,8 @@
-import laravel from 'laravel-vite-plugin'
-import { fileURLToPath } from 'node:url'
 import VueI18nPlugin from '@intlify/unplugin-vue-i18n/vite'
 import vue from '@vitejs/plugin-vue'
 import vueJsx from '@vitejs/plugin-vue-jsx'
+import laravel from 'laravel-vite-plugin'
+import { fileURLToPath } from 'node:url'
 import AutoImport from 'unplugin-auto-import/vite'
 import Components from 'unplugin-vue-components/vite'
 import { VueRouterAutoImports, getPascalCaseRouteName } from 'unplugin-vue-router'
@@ -106,6 +106,8 @@ export default defineConfig({
      '@layouts': fileURLToPath(new URL('./resources/js/@layouts', import.meta.url)),
      '@images': fileURLToPath(new URL('./resources/images/', import.meta.url)),
      '@styles': fileURLToPath(new URL('./resources/styles/', import.meta.url)),
+      '@validators': fileURLToPath(new URL('./resources/js/@core/utils/validators',
+        import.meta.url)),
      '@configured-variables': fileURLToPath(new URL('./resources/styles/variables/_template.scss', import.meta.url)),
      '@db': fileURLToPath(new URL('./resources/js/plugins/fake-api/handlers/', import.meta.url)),
      '@api-utils': fileURLToPath(new URL('./resources/js/plugins/fake-api/utils/', import.meta.url)),
@@ -120,4 +122,4 @@ export default defineConfig({
      './resources/js/**/*.vue',
    ],
  },
-})
+})
Author	SHA1	Message	Date
Muhammad Shahzad	58837c4188	Merge branch 'dev' of https://git.codelfi.com/TelemedPro/hgh_admin into dev	2024-06-08 05:50:07 +05:00
Muhammad Shahzad	55a289e729	fixes	2024-06-08 05:42:42 +05:00
nasir@endelospay.com	c1a05b6404	fix	2024-06-08 04:20:24 +05:00
nasir@endelospay.com	908fdd43e5	fix	2024-06-08 03:54:45 +05:00
nasir@endelospay.com	872735dac3	Merge branch 'dev' of ssh://git.codelfi.com:2202/telemedpro/hgh_admin into dev	2024-06-07 20:14:42 +05:00
nasir@endelospay.com	c1731356ca	fixc	2024-06-07 20:14:35 +05:00
Muhammad Shahzad	cfcd4e1e98	fixes	2024-06-07 04:42:18 +05:00
Muhammad Shahzad	7f697053a5	Merge branch 'dev' of https://git.codelfi.com/TelemedPro/hgh_admin into dev	2024-06-07 04:27:55 +05:00
Muhammad Shahzad	110e4b46ca	fixes	2024-06-07 04:24:45 +05:00
nasir@endelospay.com	e024a459c0	fix	2024-06-07 04:02:32 +05:00
nasir@endelospay.com	bff5e31c09	fix	2024-06-07 02:12:33 +05:00
nasir@endelospay.com	ac6640ba0e	fix	2024-06-07 01:23:53 +05:00
nasir@endelospay.com	58883ba8d5	fix	2024-06-07 01:21:36 +05:00
nasir@endelospay.com	80f71389cc	fix	2024-06-07 01:01:40 +05:00
nasir@endelospay.com	4be0fa47d5	fix	2024-06-06 22:55:51 +05:00
nasir@endelospay.com	e38380e553	Merge branch 'dev' of ssh://git.codelfi.com:2202/telemedpro/hgh_admin into dev	2024-06-06 22:48:48 +05:00
nasir@endelospay.com	970a063bec	fix	2024-06-06 22:48:39 +05:00
Enzo	5fe2d44788	fixes	2024-06-06 22:05:11 +05:00
Enzo	4db4f8568c	Merge branch 'dev' of ssh://git.codelfi.com:2202/TelemedPro/hgh_admin into dev	2024-06-06 22:04:33 +05:00
Enzo	d825c0283a	fixes	2024-06-06 22:04:14 +05:00
Muhammad Shahzad	21bfe929ca	fixes	2024-06-06 21:33:36 +05:00
nasir@endelospay.com	31893255d2	fix	2024-06-06 06:00:55 +05:00
nasir@endelospay.com	c7fa12f28b	fix	2024-06-06 05:49:15 +05:00
nasir@endelospay.com	680b2b1164	fix	2024-06-06 05:26:44 +05:00
nasir@endelospay.com	e238e0ea4b	fix	2024-06-06 05:18:03 +05:00
nasir@endelospay.com	4ce2603b4d	Merge branch 'dev' of ssh://git.codelfi.com:2202/telemedpro/hgh_admin into dev	2024-06-06 05:16:30 +05:00
nasir@endelospay.com	409bae9df4	fix	2024-06-06 05:16:17 +05:00
Muhammad Shahzad	d09e93c317	fixes	2024-06-06 04:50:55 +05:00
Muhammad Shahzad	e47a9eed61	fixes	2024-06-06 04:22:18 +05:00
nasir@endelospay.com	f379d8c2c8	fix	2024-06-06 04:17:20 +05:00
nasir@endelospay.com	ee28cfbaa8	fix	2024-06-06 04:07:04 +05:00
nasir@endelospay.com	0d229f62f1	fix	2024-06-06 04:00:35 +05:00
nasir@endelospay.com	0f9c7cec8e	fix	2024-06-06 02:22:51 +05:00
Muhammad Shahzad	d3ca235ce3	fivx	2024-06-06 01:37:03 +05:00
Muhammad Shahzad	fed1f82d7d	fixes	2024-06-06 01:24:27 +05:00
nasir@endelospay.com	e4ec7789de	fix	2024-06-06 01:15:23 +05:00
nasir@endelospay.com	d247817d5d	Merge branch 'dev' of ssh://git.codelfi.com:2202/telemedpro/hgh_admin into dev	2024-06-06 00:41:49 +05:00
nasir@endelospay.com	f216ff713c	fix	2024-06-06 00:41:41 +05:00
Muhammad Shahzad	02f5a51fa7	Merge branch 'dev' of https://git.codelfi.com/TelemedPro/hgh_admin into dev	2024-06-05 22:59:21 +05:00
Muhammad Shahzad	1342de520d	fixes	2024-06-05 22:58:34 +05:00
nasir@endelospay.com	83459a1ea8	fix	2024-06-05 22:52:34 +05:00
Muhammad Shahzad	7e451af7a2	fixes	2024-06-05 21:06:27 +05:00
Enzo	ba9f6ed571	fixes	2024-06-05 20:47:53 +05:00
Muhammad Shahzad	4b2e2acd19	fixes	2024-06-05 16:44:12 +05:00
Muhammad Shahzad	6c9391da7b	fixes	2024-06-05 16:38:49 +05:00
Muhammad Shahzad	a924bd603e	fixes	2024-06-05 16:26:57 +05:00
Muhammad Shahzad	cff094174e	fixes	2024-06-05 03:52:37 +05:00
Enzo	7007d4a446	Merge branch 'dev' of ssh://git.codelfi.com:2202/TelemedPro/hgh_admin into dev	2024-06-05 00:36:21 +05:00
Enzo	aa2a018004	fixes	2024-06-05 00:35:33 +05:00
nasir@endelospay.com	7fab7461cd	fix	2024-06-05 00:28:41 +05:00
Muhammad Shahzad	dce2aa9357	fixes	2024-06-05 00:19:51 +05:00
Muhammad Shahzad	db2ab34cc2	fixes	2024-06-04 04:51:18 +05:00
Muhammad Shahzad	05ca36f24e	fixes	2024-06-04 04:35:53 +05:00
Inshal	04aef980d3	fix	2024-06-04 04:11:22 +05:00
Inshal	803d5f0b1a	fix icon	2024-06-04 04:05:08 +05:00
Inshal	8f6aaf2324	fix	2024-06-04 03:46:21 +05:00
Inshal	6e41495bc3	fixes	2024-06-04 03:43:35 +05:00
Inshal	9f094ad5b0	fix	2024-06-04 01:31:09 +05:00
Inshal	b45c5bb776	fix	2024-06-04 01:13:50 +05:00
Muhammad Shahzad	961022c15c	fixes	2024-06-04 00:58:08 +05:00
Muhammad Shahzad	98c3b2c797	Merge branch 'dev' of https://git.codelfi.com/TelemedPro/hgh_admin into dev	2024-06-04 00:49:57 +05:00
Muhammad Shahzad	40d0964da6	fixes	2024-06-04 00:48:11 +05:00
Inshal	859a58aed0	fix	2024-06-04 00:30:29 +05:00
Inshal	4ab49f47a4	fix	2024-06-04 00:29:51 +05:00
Muhammad Shahzad	fdb8717a53	Merge branch 'dev' of https://git.codelfi.com/TelemedPro/hgh_admin into dev	2024-06-04 00:16:08 +05:00
Muhammad Shahzad	16c7ea922b	fixes	2024-06-04 00:15:46 +05:00
Inshal	1f6a8c5af1	fix	2024-06-03 22:16:30 +05:00
nasir@endelospay.com	fb95feef0f	Merge branch 'dev' of ssh://git.codelfi.com:2202/telemedpro/hgh_admin into dev	2024-06-03 21:11:57 +05:00
nasir@endelospay.com	48b4d5a714	fix	2024-06-03 21:11:48 +05:00
Inshal	8109a22620	fixes	2024-06-03 20:57:07 +05:00
Inshal	dc2f0e3682	fix	2024-06-01 04:51:45 +05:00
Inshal	22a3278447	fix	2024-06-01 04:50:05 +05:00
Inshal	fc0c654595	fixes	2024-06-01 04:28:22 +05:00
nasir@endelospay.com	88c2df5145	fixed	2024-05-31 20:11:35 +05:00
Inshal	7e0031ba81	fix	2024-05-30 04:04:00 +05:00
Inshal	c0a49cc1b6	store added	2024-05-30 02:57:17 +05:00
Inshal	08c591d635	changes	2024-05-30 00:07:30 +05:00