Files
FE_CPONE/test/vuex/cpone-resultentry-so-others-v6-ui-all/components/sections/PhysicalExam.vue
2026-04-27 10:13:31 +07:00

82 lines
2.2 KiB
Vue

<template>
<v-card>
<v-card-title class="headline">
Pemeriksaan Fisik
</v-card-title>
<v-card-text>
<v-layout row wrap v-for="(fisik, fisikIndex) in fisiks" :key="fisik.id" class="mb-3">
<v-flex xs12>
<v-card flat>
<v-card-title>
<h3>{{ fisik.name }}</h3>
</v-card-title>
<v-card-text>
<v-layout row wrap v-for="(detail, detailIndex) in fisik.details" :key="detail.id"
class="mb-2">
<v-flex xs12 sm6 md4>
<v-checkbox v-model="detail.value" :label="detail.name" :disabled="!canEdit"
@change="handleCheckboxChange(detail.id_code, $event, detailIndex, fisikIndex)"></v-checkbox>
</v-flex>
<v-flex xs12 sm6 md8 v-if="detail.value">
<v-text-field v-model="detail.note" label="Keterangan" :disabled="!canEdit"
@change="$emit('change')"></v-text-field>
</v-flex>
</v-layout>
</v-card-text>
</v-card>
</v-flex>
</v-layout>
</v-card-text>
</v-card>
</template>
<script>
module.exports = {
name: 'PhysicalExam',
props: {
fisiks: {
type: Array,
default: function () { return [] }
},
canEdit: {
type: Boolean,
default: false
}
},
methods: {
handleCheckboxChange: function (id_code, event, detailIndex, fisikIndex) {
this.$emit('change')
this.$emit('checkbox-change', id_code, event, detailIndex, fisikIndex)
}
}
}
</script>
<style scoped>
.v-input--selection-controls {
margin-top: 0;
padding-top: 0;
}
.v-text-field,
.v-textarea {
margin-top: 0;
padding-top: 0;
}
.v-card-title {
padding-bottom: 8px;
}
.v-card-text {
padding-top: 16px;
}
.v-switch {
margin-right: -8px;
}
</style>