admin

게시물관리

<template>
  <div>
    <el-card>
      <h3>게시물관리</h3>
      <el-table :data="items">
        <el-table-column width="50">
          <template #default="scope">
            <div>
              {{ scope.$index }}
              <input type="checkbox" v-model="items[scope.$index].chk" />
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="_id" label="no" width="200" />
        <el-table-column prop="title" label="title" width="200" />
        <el-table-column prop="writer" label="writer" width="200" />
        <el-table-column prop="hit" label="hit" width="200" />
        <el-table-column prop="regdate" label="regdate" width="200" />
      </el-table>
      <el-row>
        <el-col :span="12">
          <el-pagination
            layout="prev, pager, next"
            :total="200"
            @current-change="currentChange"
          ></el-pagination
        ></el-col>
        <el-col :span="6"></el-col>
        <el-col :span="6"> </el-col>
      </el-row>
      <div>
        <input
          type="text"
          placeholder="검색어 입력"
          v-model="search"
          @keyup.enter="handleData"
        />
        <input type="button" value="검색" @click="handleData" />
      </div>
    </el-card>
  </div>
</template>

<script>
export default {
  created() {
    this.handleData();
  },
  data() {
    return {
      items: [], // 게시물내용
      page: 1, // 현재 페이지
      total: "", // 페이지네이션 전체 게시물수
      search: "", // 검색어
    };
  },
  methods: {
    async handleData() {
      const url = "/board/select";
      const headers = { "Content-Type": "application/json" };

      // /board/select?page=1&search=aaa

      const response = await this.axios.get(
        url,
        { params: { page: this.page, search: this.search } },
        { headers: headers }
      );
      console.log(response);
      if (response.data.status === 200) {
        this.items = response.data.result;
        this.total = response.data.total;
      }
    },
    currentChange(page) {
      this.page = page;
      this.handleData();
    },
  },
};
</script>

<style scoped>
</style>