add api get post

This commit is contained in:
2024-11-04 06:45:34 +07:00
parent bd7da15ca3
commit 8c2ad217eb
12 changed files with 1438 additions and 1323 deletions

130
.gitignore vendored Normal file
View File

@@ -0,0 +1,130 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
lerna-debug.log*
.pnpm-debug.log*
# Diagnostic reports (https://nodejs.org/api/report.html)
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
# Runtime data
pids
*.pid
*.seed
*.pid.lock
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov
# Coverage directory used by tools like istanbul
coverage
*.lcov
# nyc test coverage
.nyc_output
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
.grunt
# Bower dependency directory (https://bower.io/)
bower_components
# node-waf configuration
.lock-wscript
# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release
# Dependency directories
node_modules/
jspm_packages/
# Snowpack dependency directory (https://snowpack.dev/)
web_modules/
# TypeScript cache
*.tsbuildinfo
# Optional npm cache directory
.npm
# Optional eslint cache
.eslintcache
# Optional stylelint cache
.stylelintcache
# Microbundle cache
.rpt2_cache/
.rts2_cache_cjs/
.rts2_cache_es/
.rts2_cache_umd/
# Optional REPL history
.node_repl_history
# Output of 'npm pack'
*.tgz
# Yarn Integrity file
.yarn-integrity
# dotenv environment variable files
.env
.env.development.local
.env.test.local
.env.production.local
.env.local
# parcel-bundler cache (https://parceljs.org/)
.cache
.parcel-cache
# Next.js build output
.next
out
# Nuxt.js build / generate output
.nuxt
dist
# Gatsby files
.cache/
# Comment in the public line in if your project uses Gatsby and not Next.js
# https://nextjs.org/blog/next-9-1#public-directory-support
# public
# vuepress build output
.vuepress/dist
# vuepress v2.x temp and cache directory
.temp
.cache
# Docusaurus cache and generated files
.docusaurus
# Serverless directories
.serverless/
# FuseBox cache
.fusebox/
# DynamoDB Local files
.dynamodb/
# TernJS port file
.tern-port
# Stores VSCode versions used for testing VSCode extensions
.vscode-test
# yarn v2
.yarn/cache
.yarn/unplugged
.yarn/build-state.yml
.yarn/install-state.gz
.pnp.*

177
app.vue
View File

@@ -3,143 +3,78 @@
<v-app>
<v-app-bar>
<v-app-bar-title>Hello</v-app-bar-title>
<v-spacer/>
<v-spacer />
<v-btn @click="toggleTheme">
<!-- <v-icon>ph:sun</v-icon> -->
<v-icon>ph:sun</v-icon>
toggle thema</v-btn>
</v-app-bar>
<v-main>
<v-container>
<v-text-field class="mb-5" label="Name" type="name"/>
<v-card
title="Nutrition"
flat
>
<template v-slot:text>
<v-text-field
v-model="search"
label="Search"
variant="outlined"
hide-details
single-line
></v-text-field>
</template>
<v-card title="List Surat Kontrol" flat>
<template v-slot:text>
<v-text-field v-model="search" label="Search" prepend-inner-icon="mdi-magnify" variant="outlined" hide-details single-line></v-text-field>
</template>
<v-data-table
:headers="headers"
:items="desserts"
:search="search"
></v-data-table>
</v-card>
<v-data-table :headers="headers" :items="subspesialis" F :search="search"></v-data-table>
</v-card>
</v-container>
<v-container>
<v-card title="List Surat Kontrol" flat>
<template v-slot:text>
<v-text-field v-model="search" label="Search" prepend-inner-icon="mdi-magnify" variant="outlined" hide-details single-line></v-text-field>
</template>
<v-data-table :headers="headers" :items="surkon.list_data" F :search="search"></v-data-table>
</v-card>
</v-container>
</v-main>
</v-app>
</div>
</template>
<script setup>
import { ref } from "vue";
import { useTheme } from "vuetify";
import { storeToRefs } from "pinia";
const theme = useTheme();
const toggleTheme = () => {
function toggleTheme () {
theme.global.name.value = theme.global.current.value.dark ? 'light' : 'myTheme';
};
}
// const itemsPerPage= 5;
const search= '';
const headers= [
{
align: 'start',
key: 'name',
sortable: false,
title: 'Dessert (100g serving)',
},
{ key: 'calories', title: 'Calories' },
{ key: 'fat', title: 'Fat (g)' },
{ key: 'carbs', title: 'Carbs (g)' },
{ key: 'protein', title: 'Protein (g)' },
{ key: 'iron', title: 'Iron (%)' },
];
const desserts= [
{
name: 'Frozen Yogurt',
calories: 159,
fat: 6.0,
carbs: 24,
protein: 4.0,
iron: 1,
},
{
name: 'Ice cream sandwich',
calories: 237,
fat: 9.0,
carbs: 37,
protein: 4.3,
iron: 1,
},
{
name: 'Eclair',
calories: 262,
fat: 16.0,
carbs: 23,
protein: 6.0,
iron: 7,
},
{
name: 'Cupcake',
calories: 305,
fat: 3.7,
carbs: 67,
protein: 4.3,
iron: 8,
},
{
name: 'Gingerbread',
calories: 356,
fat: 16.0,
carbs: 49,
protein: 3.9,
iron: 16,
},
{
name: 'Jelly bean',
calories: 375,
fat: 0.0,
carbs: 94,
protein: 0.0,
iron: 0,
},
{
name: 'Lollipop',
calories: 392,
fat: 0.2,
carbs: 98,
protein: 0,
iron: 2,
},
{
name: 'Honeycomb',
calories: 408,
fat: 3.2,
carbs: 87,
protein: 6.5,
iron: 45,
},
{
name: 'Donut',
calories: 452,
fat: 25.0,
carbs: 51,
protein: 4.9,
iron: 22,
},
{
name: 'KitKat',
calories: 518,
fat: 26.0,
carbs: 65,
protein: 7,
iron: 6,
},
];
const search = ref("");
const headers = [
{
align: 'start',
key: 'name',
sortable: false,
},
{ key: 'Nomor_surat_kontrol', title: 'Nomor surat kontrol' },
{ key: 'Nomor_sep', title: 'Nomor sep' },
{ key: 'Tanggal_cetak_surat_kontrol', title: 'Tanggal Entry' },
{ key: 'Tanggal_rencana_kontrol', title: 'Tanggal Rencana Kontrol' },
{ key: 'No_rm', title: 'Nomor Rekam Medik' },
{ key: 'NamaDokter', title: 'Nama Dokter' },
];
const payload = ref({
no_rm: "",
no_sep: "",
poliklinik: "",
tanggal_awal: "2024-10-16",
tanggal_akhir: "2024-10-30",
offset: "0",
limit: "10",
});
const { subspesialis } = storeToRefs(useSubspesialisStore());
const { loadSubspesialis } = useSubspesialisStore();
const { surkon } = storeToRefs(useSubspesialisStorePost());
const { loadSurKon } = useSubspesialisStorePost();
// Call loadSurKon when the page loads
onMounted(() => {
loadSubspesialis();
loadSurKon(payload);
});
</script>

View File

@@ -1,131 +0,0 @@
<template>
<div>
<v-app>
<v-app-bar>
<v-app-bar-title>Hello</v-app-bar-title>
<v-spacer/>
<v-btn @click="toggleTheme">
<!-- <v-icon>ph:sun</v-icon> -->
toggle thema</v-btn>
</v-app-bar>
<v-main>
<v-container>
<v-text-field class="mb-5" label="Name" type="name"/>
<v-data-table-server
v-model:items-per-page="itemsPerPage"
:headers="headers"
:items="desserts"
item-value="name"
class="elevation-1"
></v-data-table-server>
</v-container>
</v-main>
</v-app>
</div>
</template>
<script setup>
import { useTheme } from "vuetify";
const theme = useTheme();
const toggleTheme = () => {
theme.global.name.value = theme.global.current.value.dark ? 'light' : 'myTheme';
};
const itemsPerPage= 5;
const headers= [
{
title: 'Dessert (100g serving)',
align: 'start',
sortable: false,
key: 'name',
},
{ title: 'Calories', key: 'calories', align: 'end' },
{ title: 'Fat (g)', key: 'fat', align: 'end' },
{ title: 'Carbs (g)', key: 'carbs', align: 'end' },
{ title: 'Protein (g)', key: 'protein', align: 'end' },
{ title: 'Iron (%)', key: 'iron', align: 'end' },
];
const desserts = [
{
name: 'Frozen Yogurt',
calories: 159,
fat: 6.0,
carbs: 24,
protein: 4.0,
iron: '1',
},
{
name: 'Jelly bean',
calories: 375,
fat: 0.0,
carbs: 94,
protein: 0.0,
iron: '0',
},
{
name: 'KitKat',
calories: 518,
fat: 26.0,
carbs: 65,
protein: 7,
iron: '6',
},
{
name: 'Eclair',
calories: 262,
fat: 16.0,
carbs: 23,
protein: 6.0,
iron: '7',
},
{
name: 'Gingerbread',
calories: 356,
fat: 16.0,
carbs: 49,
protein: 3.9,
iron: '16',
},
{
name: 'Ice cream sandwich',
calories: 237,
fat: 9.0,
carbs: 37,
protein: 4.3,
iron: '1',
},
{
name: 'Lollipop',
calories: 392,
fat: 0.2,
carbs: 98,
protein: 0,
iron: '2',
},
{
name: 'Cupcake',
calories: 305,
fat: 3.7,
carbs: 67,
protein: 4.3,
iron: '8',
},
{
name: 'Honeycomb',
calories: 408,
fat: 3.2,
carbs: 87,
protein: 6.5,
iron: '45',
},
{
name: 'Donut',
calories: 452,
fat: 25.0,
carbs: 51,
protein: 4.9,
iron: '22',
},
];
</script>

View File

@@ -4,6 +4,7 @@ export default defineNuxtConfig({
modules:[
"nuxt-icon",
"@nuxtjs/google-fonts",
"@pinia/nuxt",
async (options, nuxt) => {
nuxt.hooks.hook('vite:extendConfig', config => config.plugins.push(
vuetify({

2197
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@@ -10,9 +10,12 @@
"postinstall": "nuxt prepare"
},
"dependencies": {
"@pinia/nuxt": "^0.5.5",
"axios": "^1.7.7",
"nuxt": "^3.13.0",
"pinia": "^2.2.4",
"vite-plugin-vuetify": "^2.0.4",
"vue": "latest",
"vue": "^3.0.0",
"vuetify": "^3.7.0-beta.1",
"vuetify-nuxt-module": "^0.18.2"
},
@@ -20,6 +23,6 @@
"@nuxt/icon": "^1.5.1",
"@nuxtjs/google-fonts": "^3.0.0-1",
"nuxt-icon": "^1.0.0-beta.7",
"sass-embedded": "^1.78.0"
"sass-embedded": "^1.80.5"
}
}

View File

@@ -1,5 +1,4 @@
import { createApp } from 'vue';
import { createVuetify, ThemeDefinition } from "vuetify";
import { createVuetify, type ThemeDefinition } from "vuetify";
import { md2 } from 'vuetify/blueprints';
// import { VDataTable } from 'vuetify/labs/VDataTable'
@@ -10,7 +9,7 @@ const myTheme: ThemeDefinition = {//untuk mengatur tema terang atau gelap
}
}
export default defineNuxtPlugin((app) => {
export default defineNuxtPlugin(app => {
const vuetify = createVuetify({
ssr: true,
@@ -19,7 +18,6 @@ export default defineNuxtPlugin((app) => {
defaults:{
VTextField:{
variant:"outlined",
color:"primary",
},
},
theme:{

View File

@@ -0,0 +1,16 @@
import axios from "axios";
export default defineEventHandler(async (event) => {
try {
const response = await axios.get("http://localhost:8082/api/suratkontrol");
// console.log(response.data)
return response.data
} catch (error) {
console.error("Error posting to surat kontrol API:", error);
throw createError({
statusCode: 500,
statusMessage: "Failed to fetch data from surat kontrol API",
});
}
});

View File

@@ -0,0 +1,23 @@
import axios from "axios";
export default defineEventHandler(async (event) => {
// Read the body of the incoming request
const body = await readBody(event);
try {
const response = await axios.post("http://localhost:8082/api/suratkontrol/cari", body, {
headers: {
"Content-Type": "application/json",
},
});
console.log(response.data)
return response.data
} catch (error) {
console.error("Error posting to surat kontrol API:", error);
throw createError({
statusCode: 500,
statusMessage: "Failed to fetch data from surat kontrol API",
});
}
});

View File

@@ -1,3 +0,0 @@
{
"extends": "../.nuxt/tsconfig.server.json"
}

55
stores/users.ts Normal file
View File

@@ -0,0 +1,55 @@
interface Subspesialis {
id: number;
Kode: string;
Subspesialis: string;
FK_daftar_spesialis_ID: number;
Spesialis: string;
}
export const useSubspesialisStore = defineStore("Subspesialises", () => {
const subspesialis = ref<any[]>([]);
const loadSubspesialis = async () => {
try {
subspesialis.value = await $fetch("/api/surkon/get");
} catch (error) {
console.error("Failed to load subspesialis:", error);
}
};
return {
subspesialis,
loadSubspesialis,
};
});
export const useSubspesialisStorePost = defineStore("SuratKontrol", () => {
// Create state for holding users
const surkon = ref<any[]>([]);
// Function to load user data
const loadSurKon = async (payload: Record<string, any>) => {
try {
surkon.value = await $fetch("/api/surkon/post", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(payload)
});
} catch (error) {
console.error("Failed to load surkon:", error);
}
};
return {
surkon,
loadSurKon,
};
});
//Path:stores/users.ts
if (import.meta.hot) {
// import.meta.hot.accept(acceptHMRUpdate(useUsersStore, import.meta.hot))
import.meta.hot.accept(acceptHMRUpdate(useSubspesialisStore, import.meta.hot));
import.meta.hot.accept(acceptHMRUpdate(useSubspesialisStorePost, import.meta.hot));
}

View File

@@ -1,8 +1,6 @@
import { h } from 'vue'
import { Icon } from '@iconify/vue'
import type { IconSet, IconAliases, IconProps } from 'vuetify'
import {Icon} from "#components";
const aliases: IconAliases = {
collapse: "ph:caret-up",
complete: "ph:check",
@@ -43,12 +41,9 @@ const aliases: IconAliases = {
calendar: "ph:calendar",
};
const custom: IconSet = {
component: (props: IconProps) => h(Icon,{
name: props.icon,
tag: props.tag,
disabled: props.disabled
}),
}
const custom: IconSet = {
// @ts-ignore
component: (props: IconProps) => h(Icon, { ...props }),
};
export { aliases, custom };