
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
<template>
<table :class="{ 'list-table mb10': true, [className]: className }">
<colgroup>
<col v-for="(w, idx) in colgroup" :width="w" :key="idx" />
</colgroup>
<thead>
<tr>
<th v-for="(title, idx) in thead" :key="idx" class="text-ct">
{{ title }}
</th>
</tr>
</thead>
<tbody>
<template v-if="tbody.length > 0">
<tr v-for="(row, idx) in tbody" :key="idx" @click="handleClick(row, idx)" class="cursor"
:class="isboldCheck(idx)">
<td v-if="$slots.checkbox" class="text-ct">
<slot name="checkbox" :row="row" :idx="idx"></slot>
</td>
<td v-for="(content, index) in row" :key="index" :class="index === 'title' ? 'text-lf' : 'text-ct'">
<img v-if="index == 'bbsNm' && lockList.includes(idx)" class="lock-icon"
src="../../../resources/svg/Lock.svg" alt="lock" />
<template v-if="index === 'aprvAplySttsCd' && row.aprvAplySttsCd">
<span :class="{'border radius inline-block pd5': true, 'success':row.aprvAplySttsCd === '승인완료','ing':row.aprvAplySttsCd === '승인요청'}">{{ row.aprvAplySttsCd }}</span>
</template>
<template v-else>
{{ content }}
</template>
</td>
<td v-if="$slots.button">
<slot name="button" :row="row" :idx="idx"></slot>
</td>
</tr>
</template>
<tr v-else>
<td :colspan="thead.length" class="text-ct">
등록된 정보가 존재하지 않습니다.
</td>
</tr>
</tbody>
</table>
</template>
<script>
export default {
props: {
colgroup: {
type: Array,
default: [],
},
thead: {
type: Array,
default: [],
},
tbody: {
type: Array,
default: [],
},
className: {
type: String,
default: "",
},
ntcCnt: {
type: Number,
default: 0,
},
lockList: {
type: Array,
default: [],
},
ntcList: {
type: Array,
default: [],
},
},
data() {
return {};
},
methods: {
handleClick: function (row, idx) {
this.$emit("listClick", idx); // 'listClick' 이벤트 발생
},
isboldCheck(index) {
return this.ntcList.includes(index) ? "contentBold" : "";
},
},
watch: {},
computed: {},
components: {},
mounted() { },
};
</script>
<style scoped>
.contentBold {
font-weight: bold;
}
.lock-icon {
width: 15px;
height: 15px;
margin-right: 5px;
margin-left: 5px;
display: inline-block;
vertical-align: inherit;
}
</style>