<template>
	<ion-item>
		<ion-note slot="start">{{ $t(label) }}</ion-note>
		<ion-label v-if="type === 'datetime'">{{ utils.showDate(text, '-') }}</ion-label>
		<ion-label v-else-if="type === 'tel'" v-html="utils.parseTel(text)"></ion-label>
		<ion-label v-else-if="type === 'textarea'" class="ion-text-wrap" v-html="text?.split('\n').join('<br/>')"></ion-label>
		<ion-label v-else>{{ text }}</ion-label>
	</ion-item>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { IonItem, IonLabel, IonNote } from '@ionic/vue';
import utils from './../../services/utils.service';

/**
 * 공통 - 아이템 보기
 */
export default defineComponent({
	name: 'SgcItemView',
	components: {
		IonItem,
		IonLabel,
		IonNote,
	},
	setup() {
		return {
			utils,
		};
	},
	props: {
		label: String,
		text: String,
		type: String,
	},
	data() {
		return {};
	},
});
</script>
<style scoped lang="scss"></style>
