59 lines
1.7 KiB
Vue
59 lines
1.7 KiB
Vue
<template>
|
|
<div class="list-group">
|
|
<label class="list-group-item">
|
|
<input
|
|
class="form-check-input me-1"
|
|
:name="data.LOCVOTSEQ"
|
|
:type="multiIs === '1' ? 'checkbox' : 'radio'"
|
|
:value="data.VOTDETSEQ"
|
|
:checked="selectedValues.includes(data.VOTDETSEQ)"
|
|
@change="handleChange"
|
|
>
|
|
{{ data.LOCVOTCON }}
|
|
<a v-if="data.LOCVOTLIK" :href="data.LOCVOTLIK.startsWith('http') ? data.LOCVOTLIK : 'http://' + data.LOCVOTLIK" target="_blank">
|
|
{{ data.LOCVOTLIK }}
|
|
</a>
|
|
</label>
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref } from 'vue';
|
|
|
|
const props = defineProps({
|
|
data: {
|
|
type: Object,
|
|
required: true,
|
|
},
|
|
multiIs: {
|
|
type: String,
|
|
required: true,
|
|
},
|
|
selectedValues: {
|
|
type: Array,
|
|
required: true,
|
|
},
|
|
})
|
|
const emit = defineEmits(["update:selectedValues"]);
|
|
|
|
const handleChange = (event) => {
|
|
const value = event.target.value;
|
|
let updatedValues = [];
|
|
// 체크박스일 때 여러 개 선택 가능
|
|
if (props.multiIs === "1") {
|
|
updatedValues = event.target.checked
|
|
? [...props.selectedValues, { VOTDETSEQ: value, LOCVOTSEQ: props.data.LOCVOTSEQ, LOCVOTCON: props.data.LOCVOTCON }]
|
|
: props.selectedValues.filter(v => v.VOTDETSEQ !== value);
|
|
} else {
|
|
// 라디오 버튼일 때 하나만 선택 가능
|
|
updatedValues = [{ VOTDETSEQ: value, LOCVOTSEQ: props.data.LOCVOTSEQ, LOCVOTCON: props.data.LOCVOTCON }];
|
|
}
|
|
emit("update:selectedValues", updatedValues);
|
|
};
|
|
</script>
|
|
|
|
<style>
|
|
|
|
</style>
|