File name
Commit message
Commit date
05-22
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="{ 'tbl data': 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"
>
<div class="layout">
<svg-icon type="mdi" :path="pinPath" :width="18" :height="18" v-if="index == 'bbsNm' && ntcList.includes(idx)"></svg-icon>
<svg-icon type="mdi" :path="lockPath" :width="18" :height="18" v-else-if="index == 'bbsNm' && lockList.includes(idx)"></svg-icon>
<p>{{ content }}</p>
</div>
</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 data-none">
등록된 정보가 존재하지 않습니다.
</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 {
// pinPath: mdiPin,
// lockPath: mdiLock,
};
},
methods: {
handleClick: function (row, idx) {
this.$emit("listClick", idx); // 'listClick' 이벤트 발생
},
isboldCheck(index) {
return this.ntcList.includes(index) ? "contentBold" : "";
},
},
watch: {},
computed: {
pinPath() {
return this.$iconPath('mdiPin');
},
lockPath() {
return this.$iconPath('mdiLock');
}
},
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>