게시판 리스트 수정

This commit is contained in:
nevermoregb 2024-12-17 14:01:16 +09:00
parent 742d371646
commit 80f293c203
5 changed files with 117 additions and 97 deletions

View File

@ -37,11 +37,7 @@
<!-- Core CSS -->
<link rel="stylesheet" href="/vendor/css/rtl/core.css" class="template-customizer-core-css" />
<link
rel="stylesheet"
href="/vendor/css/rtl/theme-default.css"
class="template-customizer-theme-css"
/>
<link rel="stylesheet" href="/vendor/css/rtl/theme-default.css" class="template-customizer-theme-css" />
<link rel="stylesheet" href="/css/demo.css" />
<!-- Vendors CSS -->
@ -53,7 +49,7 @@
<script src="/vendor/js/helpers.js"></script>
<!--! Template customizer & Theme config files MUST be included after core stylesheets and helpers.js in the <head> section -->
<!--? Template customizer: To hide customizer set displayCustomizer value false in config.js. -->
<script src="/vendor/js/template-customizer.js"></script>
<!-- <script src="/vendor/js/template-customizer.js"></script> -->
<!--? Config: Mandatory theme config file contain global vars & default theme options, Set your preferred theme option in this file. -->
<script src="/js/config.js"></script>
</head>

View File

@ -2,98 +2,106 @@
{
"id": 1,
"title": "타이틀1",
"content": "헌법재판소가 윤석열 대통령 탄핵심판 사건의 첫 변론 준비 기일을 27일 오후 2시에 연다고 밝혔다. 헌재는 이번 사건의 주심 배당도 마쳤지만 비공개 원칙에 따라 공개하지 않기로 했다.이진 헌재 공보관은 16일 언론브리핑에서 “(윤 대통령 탄핵 사건을) 변론 준비 절차에 회부하고, 1차 변론 준비 기일을 27일 오후 2시로 지정했다”고 밝혔다. 이어 “변론 준비 기일에서 검찰과 경찰 등의 수사기록을 조기에 확보하기로 했다”고 덧붙였다. 헌법재판관들은 이날 오전 10시에 재판관 회의를 열고 이같은 내용을 결정했다.",
"date": "2024-12-16 18:01",
"img": "https://picsum.photos/id/1/250/250"
"content": "헌법재판소가 윤석열 대통령 탄핵심판 사건의 첫 변론 준비 기일을 27일 오후 2시에 연다고 밝혔다. 헌재는 이번 사건의 주심 배당도 마쳤지만 비공개 원칙에 따라 공개하지 않기로 했다.이진 헌재 공보관은 16일 언론브리핑에서 “(윤 대통령 탄핵 사건을) 변론 준비 절차에 회부하고, 1차 변론 준비 기일을 27일 오후 2시로 지정했다”고 밝혔다. ",
"date": "2024.12.16 18:01",
"img": "https://picsum.photos/id/1/250/250",
"viewCount": 10,
"cmtCount": 2
},
{
"id": 2,
"title": "타이틀2",
"content": "헌법재판소가 윤석열 대통령 탄핵심판 사건의 첫 변론 준비 기일을 27일 오후 2시에 연다고 밝혔다. 헌재는 이번 사건의 주심 배당도 마쳤지만 비공개 원칙에 따라 공개하지 않기로 했다.이진 헌재 공보관은 16일 언론브리핑에서 “(윤 대통령 탄핵 사건을) 변론 준비 절차에 회부하고, 1차 변론 준비 기일을 27일 오후 2시로 지정했다”고 밝혔다. 이어 “변론 준비 기일에서 검찰과 경찰 등의 수사기록을 조기에 확보하기로 했다”고 덧붙였다. 헌법재판관들은 이날 오전 10시에 재판관 회의를 열고 이같은 내용을 결정했다.",
"date": "2024-12-16 18:02"
"date": "2024.12.16 18:02",
"viewCount": 10,
"cmtCount": 2
},
{
"id": 3,
"title": "타이틀3",
"content": "헌법재판소가 윤석열 대통령 탄핵심판 사건의 첫 변론 준비 기일을 27일 오후 2시에 연다고 밝혔다. 헌재는 이번 사건의 주심 배당도 마쳤지만 비공개 원칙에 따라 공개하지 않기로 했다.이진 헌재 공보관은 16일 언론브리핑에서 “(윤 대통령 탄핵 사건을) 변론 준비 절차에 회부하고, 1차 변론 준비 기일을 27일 오후 2시로 지정했다”고 밝혔다. 이어 “변론 준비 기일에서 검찰과 경찰 등의 수사기록을 조기에 확보하기로 했다”고 덧붙였다. 헌법재판관들은 이날 오전 10시에 재판관 회의를 열고 이같은 내용을 결정했다.",
"date": "2024-12-16 18:03",
"date": "2024.12.16 18:03",
"img": "https://picsum.photos/id/3/250/250"
},
{
"id": 4,
"title": "타이틀4",
"content": "헌법재판소가 윤석열 대통령 탄핵심판 사건의 첫 변론 준비 기일을 27일 오후 2시에 연다고 밝혔다. 헌재는 이번 사건의 주심 배당도 마쳤지만 비공개 원칙에 따라 공개하지 않기로 했다.이진 헌재 공보관은 16일 언론브리핑에서 “(윤 대통령 탄핵 사건을) 변론 준비 절차에 회부하고, 1차 변론 준비 기일을 27일 오후 2시로 지정했다”고 밝혔다. 이어 “변론 준비 기일에서 검찰과 경찰 등의 수사기록을 조기에 확보하기로 했다”고 덧붙였다. 헌법재판관들은 이날 오전 10시에 재판관 회의를 열고 이같은 내용을 결정했다.",
"date": "2024-12-16 18:04",
"img": "https://picsum.photos/id/4/250/250"
"date": "2024.12.16 18:04",
"img": "https://picsum.photos/id/4/250/250",
"viewCount": 100,
"cmtCount": 22
},
{
"id": 5,
"title": "타이틀5",
"content": "헌법재판소가 윤석열 대통령 탄핵심판 사건의 첫 변론 준비 기일을 27일 오후 2시에 연다고 밝혔다. 헌재는 이번 사건의 주심 배당도 마쳤지만 비공개 원칙에 따라 공개하지 않기로 했다.이진 헌재 공보관은 16일 언론브리핑에서 “(윤 대통령 탄핵 사건을) 변론 준비 절차에 회부하고, 1차 변론 준비 기일을 27일 오후 2시로 지정했다”고 밝혔다. 이어 “변론 준비 기일에서 검찰과 경찰 등의 수사기록을 조기에 확보하기로 했다”고 덧붙였다. 헌법재판관들은 이날 오전 10시에 재판관 회의를 열고 이같은 내용을 결정했다.",
"date": "2024-12-16 18:05",
"date": "2024.12.16 18:05",
"img": "https://picsum.photos/id/5/250/250"
},
{
"id": 6,
"title": "타이틀6",
"content": "헌법재판소가 윤석열 대통령 탄핵심판 사건의 첫 변론 준비 기일을 27일 오후 2시에 연다고 밝혔다. 헌재는 이번 사건의 주심 배당도 마쳤지만 비공개 원칙에 따라 공개하지 않기로 했다.이진 헌재 공보관은 16일 언론브리핑에서 “(윤 대통령 탄핵 사건을) 변론 준비 절차에 회부하고, 1차 변론 준비 기일을 27일 오후 2시로 지정했다”고 밝혔다. 이어 “변론 준비 기일에서 검찰과 경찰 등의 수사기록을 조기에 확보하기로 했다”고 덧붙였다. 헌법재판관들은 이날 오전 10시에 재판관 회의를 열고 이같은 내용을 결정했다.",
"date": "2024-12-16 18:06",
"date": "2024.12.16 18:06",
"img": "https://picsum.photos/id/6/250/250"
},
{
"id": 7,
"title": "타이틀7",
"content": "헌법재판소가 윤석열 대통령 탄핵심판 사건의 첫 변론 준비 기일을 27일 오후 2시에 연다고 밝혔다. 헌재는 이번 사건의 주심 배당도 마쳤지만 비공개 원칙에 따라 공개하지 않기로 했다.이진 헌재 공보관은 16일 언론브리핑에서 “(윤 대통령 탄핵 사건을) 변론 준비 절차에 회부하고, 1차 변론 준비 기일을 27일 오후 2시로 지정했다”고 밝혔다. 이어 “변론 준비 기일에서 검찰과 경찰 등의 수사기록을 조기에 확보하기로 했다”고 덧붙였다. 헌법재판관들은 이날 오전 10시에 재판관 회의를 열고 이같은 내용을 결정했다.",
"date": "2024-12-16 18:07",
"date": "2024.12.16 18:07",
"img": "https://picsum.photos/id/7/250/250"
},
{
"id": 8,
"title": "타이틀8",
"content": "헌법재판소가 윤석열 대통령 탄핵심판 사건의 첫 변론 준비 기일을 27일 오후 2시에 연다고 밝혔다. 헌재는 이번 사건의 주심 배당도 마쳤지만 비공개 원칙에 따라 공개하지 않기로 했다.이진 헌재 공보관은 16일 언론브리핑에서 “(윤 대통령 탄핵 사건을) 변론 준비 절차에 회부하고, 1차 변론 준비 기일을 27일 오후 2시로 지정했다”고 밝혔다. 이어 “변론 준비 기일에서 검찰과 경찰 등의 수사기록을 조기에 확보하기로 했다”고 덧붙였다. 헌법재판관들은 이날 오전 10시에 재판관 회의를 열고 이같은 내용을 결정했다.",
"date": "2024-12-16 18:08",
"date": "2024.12.16 18:08",
"img": "https://picsum.photos/id/8/250/250"
},
{
"id": 9,
"title": "타이틀9",
"content": "헌법재판소가 윤석열 대통령 탄핵심판 사건의 첫 변론 준비 기일을 27일 오후 2시에 연다고 밝혔다. 헌재는 이번 사건의 주심 배당도 마쳤지만 비공개 원칙에 따라 공개하지 않기로 했다.이진 헌재 공보관은 16일 언론브리핑에서 “(윤 대통령 탄핵 사건을) 변론 준비 절차에 회부하고, 1차 변론 준비 기일을 27일 오후 2시로 지정했다”고 밝혔다. 이어 “변론 준비 기일에서 검찰과 경찰 등의 수사기록을 조기에 확보하기로 했다”고 덧붙였다. 헌법재판관들은 이날 오전 10시에 재판관 회의를 열고 이같은 내용을 결정했다.",
"date": "2024-12-16 18:09",
"date": "2024.12.16 18:09",
"img": "https://picsum.photos/id/9/250/250"
},
{
"id": 10,
"title": "타이틀10",
"content": "헌법재판소가 윤석열 대통령 탄핵심판 사건의 첫 변론 준비 기일을 27일 오후 2시에 연다고 밝혔다. 헌재는 이번 사건의 주심 배당도 마쳤지만 비공개 원칙에 따라 공개하지 않기로 했다.이진 헌재 공보관은 16일 언론브리핑에서 “(윤 대통령 탄핵 사건을) 변론 준비 절차에 회부하고, 1차 변론 준비 기일을 27일 오후 2시로 지정했다”고 밝혔다. 이어 “변론 준비 기일에서 검찰과 경찰 등의 수사기록을 조기에 확보하기로 했다”고 덧붙였다. 헌법재판관들은 이날 오전 10시에 재판관 회의를 열고 이같은 내용을 결정했다.",
"date": "2024-12-16 18:10",
"img": "https://picsum.photos/id/10/250/250"
"date": "2024.12.16 18:10",
"img": "https://picsum.photos/id/10/250/250",
"viewCount": 22,
"cmtCount": 33
},
{
"id": 11,
"title": "타이틀11",
"content": "헌법재판소가 윤석열 대통령 탄핵심판 사건의 첫 변론 준비 기일을 27일 오후 2시에 연다고 밝혔다. 헌재는 이번 사건의 주심 배당도 마쳤지만 비공개 원칙에 따라 공개하지 않기로 했다.이진 헌재 공보관은 16일 언론브리핑에서 “(윤 대통령 탄핵 사건을) 변론 준비 절차에 회부하고, 1차 변론 준비 기일을 27일 오후 2시로 지정했다”고 밝혔다. 이어 “변론 준비 기일에서 검찰과 경찰 등의 수사기록을 조기에 확보하기로 했다”고 덧붙였다. 헌법재판관들은 이날 오전 10시에 재판관 회의를 열고 이같은 내용을 결정했다.",
"date": "2024-12-16 18:11",
"date": "2024.12.16 18:11",
"img": "https://picsum.photos/id/11/250/250"
},
{
"id": 12,
"title": "타이틀12",
"content": "헌법재판소가 윤석열 대통령 탄핵심판 사건의 첫 변론 준비 기일을 27일 오후 2시에 연다고 밝혔다. 헌재는 이번 사건의 주심 배당도 마쳤지만 비공개 원칙에 따라 공개하지 않기로 했다.이진 헌재 공보관은 16일 언론브리핑에서 “(윤 대통령 탄핵 사건을) 변론 준비 절차에 회부하고, 1차 변론 준비 기일을 27일 오후 2시로 지정했다”고 밝혔다. 이어 “변론 준비 기일에서 검찰과 경찰 등의 수사기록을 조기에 확보하기로 했다”고 덧붙였다. 헌법재판관들은 이날 오전 10시에 재판관 회의를 열고 이같은 내용을 결정했다.",
"date": "2024-12-16 18:12",
"date": "2024.12.16 18:12",
"img": "https://picsum.photos/id/12/250/250"
},
{
"id": 13,
"title": "타이틀13",
"content": "헌법재판소가 윤석열 대통령 탄핵심판 사건의 첫 변론 준비 기일을 27일 오후 2시에 연다고 밝혔다. 헌재는 이번 사건의 주심 배당도 마쳤지만 비공개 원칙에 따라 공개하지 않기로 했다.이진 헌재 공보관은 16일 언론브리핑에서 “(윤 대통령 탄핵 사건을) 변론 준비 절차에 회부하고, 1차 변론 준비 기일을 27일 오후 2시로 지정했다”고 밝혔다. 이어 “변론 준비 기일에서 검찰과 경찰 등의 수사기록을 조기에 확보하기로 했다”고 덧붙였다. 헌법재판관들은 이날 오전 10시에 재판관 회의를 열고 이같은 내용을 결정했다.",
"date": "2024-12-16 18:13",
"date": "2024.12.16 18:13",
"img": "https://picsum.photos/id/13/250/250"
},
{
"id": 14,
"title": "타이틀14",
"content": "헌법재판소가 윤석열 대통령 탄핵심판 사건의 첫 변론 준비 기일을 27일 오후 2시에 연다고 밝혔다. 헌재는 이번 사건의 주심 배당도 마쳤지만 비공개 원칙에 따라 공개하지 않기로 했다.이진 헌재 공보관은 16일 언론브리핑에서 “(윤 대통령 탄핵 사건을) 변론 준비 절차에 회부하고, 1차 변론 준비 기일을 27일 오후 2시로 지정했다”고 밝혔다. 이어 “변론 준비 기일에서 검찰과 경찰 등의 수사기록을 조기에 확보하기로 했다”고 덧붙였다. 헌법재판관들은 이날 오전 10시에 재판관 회의를 열고 이같은 내용을 결정했다.",
"date": "2024-12-16 18:14",
"date": "2024.12.16 18:14",
"img": "https://picsum.photos/id/14/250/250"
}
]

View File

@ -1,11 +1,11 @@
<template>
<div class="">
<div class="" role="button">
<div class="card">
<div class="d-flex">
<div v-if="data.item.img">
<img class="card-img card-img-left" :src="data.item.img" alt="" style="max-height: 200px; min-width: 200px" />
<div v-if="data.item.img" class="col-3">
<img class="card-img card-img-left" :src="data.item.img" alt="" />
</div>
<div>
<div lass="col-9">
<div class="card-body">
<h5 class="card-title">{{ data.item.title }}</h5>
<p class="card-text">
@ -13,6 +13,7 @@
</p>
<p class="card-text">
<small class="text-muted">{{ data.item.date }}</small>
<slot name="optInfo"></slot>
</p>
</div>
</div>

View File

@ -1,12 +1,12 @@
<template>
<nav aria-label="Page navigation">
<ul class="pagination pagination-rounded justify-content-center">
<li class="page-item first">
<!-- <li class="page-item first">
<a class="page-link" href="javascript:void(0);"><i class="tf-icon bx bx-chevrons-left bx-sm"></i></a>
</li>
<li class="page-item prev">
</li> -->
<!-- <li class="page-item prev">
<a class="page-link" href="javascript:void(0);"><i class="tf-icon bx bx-chevron-left bx-sm"></i></a>
</li>
</li> -->
<li class="page-item">
<a class="page-link" href="javascript:void(0);">1</a>
</li>

View File

@ -9,7 +9,16 @@
</router-link>
</div>
<template v-for="(item, index) in list" :key="item.id">
<board-card :item="item" />
<board-card :item="item" @click="goDetail(item.id)">
<template #optInfo>
<span v-show="item.viewCount" style="padding-left: 10px" class="text-muted"
><i class="fa-regular fa-eye"></i> {{ item.viewCount }}</span
>
<span v-show="item.cmtCount" style="padding-left: 10px" class="text-muted"
><i class="fa-regular fa-comment-dots"></i> {{ item.cmtCount }}
</span>
</template>
</board-card>
</template>
<div class="mt-8">
{{ list[0].title }}
@ -24,9 +33,15 @@
import BoardCard from '@/components/list/BoardCard.vue';
import Pagination from '@/components/pagination/Pagination.vue';
import SearchBar from '@/components/search/SearchBar.vue';
import router from '@/router';
import dummy from '@a/boardDummy.json';
const list = ref(dummy);
/** 상세로 이동 */
const goDetail = idx => {
router.push(`/board/get/${idx}`);
};
</script>
<style></style>