Files
FE_CPONE/mockup/fo/fo02/index.php
2026-04-27 10:08:27 +07:00

247 lines
9.3 KiB
PHP

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>ONE</title>
<link rel="stylesheet" href="../../../libs/vendor/css/google-fonts.css">
<link rel="stylesheet" href="../../../libs/vendor/css/vuetify.min.css">
<style>
table.v-table tbody td,table.v-table tbody th {
height: 40px;
}
table.v-table thead tr {
height: 40px;
}
</style>
</head>
<body>
<div v-cloak id="app">
<v-app id="smartApp">
<smart-navbar></smart-navbar>
<v-content class="blue lighten-5">
<v-container fluid fill-height style="height:inherit" pa-2>
<v-layout row wrap>
<v-flex xs12>
<template>
<v-tabs
centered
color="blue lighten-3"
dark
fixed-tabs
class="elevation-2"
>
<v-tabs-slider color="yellow"></v-tabs-slider>
<v-tab href="../fo01">
<v-icon>list</v-icon> &nbsp; PATIENT LIST
</v-tab>
<v-tab href="#tab-1" active-tab>
<v-icon>opacity</v-icon> &nbsp; SAMPLING
</v-tab>
<v-tab href="../fo03">
<v-icon>verified_user</v-icon> &nbsp; SAMPLE VERIFICATION
</v-tab>
<v-tab href="../fo03">
<v-icon>motorcycle</v-icon> &nbsp; SAMPLE DISTRIBUTION
</v-tab>
<!-- <v-tab-item
v-for="i in 4"
:key="i"
:value="'tab-' + i"
> -->
<!-- <v-card flat>
<v-card-text>{{ text }}</v-card-text>
</v-card>
</v-tab-item> -->
</v-tabs>
</template>
</v-flex>
<v-flex xs12>
<v-card class="pt-1 mt-2 pr-1 pl-1 elevation-2">
<v-layout>
<v-flex xs2>
<start-date></start-date>
</v-flex>
<v-flex xs2>
<start-date label="End Date"></start-date>
</v-flex>
<v-flex xs1>
&nbsp;
</v-flex>
<v-flex xs2>
<sample-station></sample-station>
</v-flex>
<v-flex xs1>
&nbsp;
</v-flex>
<v-flex xs4>
<v-text-field
label="Search"
placeholder=". . ."
></v-text-field>
</v-flex>
</v-layout>
</v-card>
</v-flex>
<v-flex xs12>
<v-layout>
<v-flex xs4>
<list-patient fill-height></list-patient>
</v-flex>
<v-flex xs8>
<v-layout row wrap>
<v-flex pa-2 xs12>
<v-card class="elevation-2">
<v-layout>
<v-flex xs2 ma-1 pa-1>
<v-card class="pa-1">
<img src="https://d2gg9evh47fn9z.cloudfront.net/800px_COLOURBOX19479590.jpg" width="100%" />
</v-card>
</v-flex>
<!-- DETAIL PATIENT HERE -->
<detail-patient></detail-patient>
<!-- <v-flex xs1 pa-1>&nbsp;
</v-flex> -->
<v-flex xs6 pa-1>
<list-px></list-px>
</v-flex>
</v-layout>
<!-- <v-card-actions>
<v-btn flat color="orange">Share</v-btn>
<v-btn flat color="orange">Explore</v-btn>
</v-card-actions> -->
</v-card>
</v-flex>
<v-flex xs12 pa-2>
<v-card>
<v-card-title primary-title class="pb-1 blue lighten-3 white--text pt-2">
<div>
<h5 class="headline mb-0">SAMPLES</h5>
</div>
</v-card-title>
<v-card-text class="pt-1">
<v-layout>
<v-flex xs2 pl-3 pr-3>
<v-card class="text-xs-center pa-2">
<img src="https://anggrek.aplikasi.web.id/smartklinik/assets/app/image/samplesystem/new/b2.png" height="75">
<h3>URINE</h3>
</v-card>
</v-flex>
</v-layout>
</v-card-text>
</v-card>
</v-flex>
</v-layout>
</v-flex>
</v-layout>
</v-flex>
</v-layout>
</v-container>
</v-content>
<v-footer color="blue lighten-2" app>
<span class="white--text">&copy; 2017</span>
</v-footer>
</v-app>
</div>
<!-- Vendor -->
<script src="../../../libs/vendor/axios.min.js"></script>
<script src="../../../libs/vendor/vue.js"></script>
<script src="../../../libs/vendor/vuex.js"></script>
<script src="../../../libs/vendor/vuetify.js"></script>
<!-- App Script -->
<?php
$ts = "?ts=" . Date("ymdhis");
?>
<script type="module">
import { store } from './store.js<?php echo $ts ?>';
import { smartNavbarComponent } from './components/smartNavbarComponent.js<?php echo $ts ?>';
import { listPatientComponent } from './components/listPatientComponent.js<?php echo $ts ?>';
import { listPxComponent } from './components/listPxComponent.js<?php echo $ts ?>';
import { startDateComponent } from './components/startDateComponent.js<?php echo $ts ?>';
import { sampleStationComponent } from './components/sampleStationComponent.js<?php echo $ts ?>';
import { detailPatientComponent } from './components/detailPatientComponent.js<?php echo $ts ?>';
// import { dialogFormComponent } from './components/dialogFormComponent.js<?php echo $ts ?>';
//for testing
// window.store = store;
new Vue({
store,
el: '#app',
components: {
'smart-navbar': smartNavbarComponent,
'list-patient': listPatientComponent,
'start-date': startDateComponent,
'sample-station': sampleStationComponent,
'list-px': listPxComponent,
'detail-patient': detailPatientComponent
// 'dialog-form':dialogFormComponent
},
data: {
drawer: false,
date: new Date().toISOString().substr(0, 10),
menu: false,
modal: false,
menu2: false,
patient_name: 'Heri Suryawan',
patient_mr: 'MR-090201001',
patient_dob: '09-09-1999 / 24yr 3mt 2dy'
},
computed : {
// binding () {
// const binding = {}
// if (this.$vuetify.breakpoint.mdAndUp) binding.column = true
// return binding
// }
}
})
</script>
<style>
[v-cloak] {
display: none
}
</style>
</body>
</html>