NUXT_FRONTEND/pages/admin/publications/search/index.vue

<template>
  <div class="admin_search">
    <div>
      <h2>Поиск</h2>
      <v-row>
        <form class="row" @submit.prevent>
          <v-text-field @keyup.enter="searchTrigger" label="Введите чтобы начать поиск" v-model="string">
          </v-text-field>
          <v-btn @click="searchTrigger">Поиск</v-btn>
        </form>
      </v-row>

      <v-expansion-panels multiple v-if="searchList">
        <v-expansion-panel v-for="news in searchList.data" :key="news.id">
          <v-expansion-panel-header>
            <v-col cols="6">
              <b v-html="news.title"></b>
            </v-col>
            <v-col cols="1">
              <!--Категория:-->
              {{ news.category_for_admin ? news.category_for_admin.title : '' }}
            </v-col>

            <v-col cols="2">
            <!--Время:--> {{ news.start_activity}}
            </v-col>
            <v-col cols="3">
              <v-btn link tile color="success" :to="{name: 'admin-publications-id', params: { id: news.id}}">
                <v-icon left> mdi-pencil </v-icon>
                <!--изменить-->
              </v-btn>
              <v-btn tile color="error" @click="deleteNews(news.id)">
                <v-icon left> mdi-delete-outline </v-icon>
                <!--удалить-->
              </v-btn>
              <v-btn tile color="primary" @click="copy(news)">
                <v-icon left> mdi-content-copy </v-icon>
                инжект
              </v-btn>
            </v-col>
          </v-expansion-panel-header>
          <v-expansion-panel-content v-html="news.text"  class="text" max-width="500">
          </v-expansion-panel-content>

        </v-expansion-panel> <v-pagination
          v-model="counter"
          :length="Math.floor(searchList.total/40)"
          ref="pagination"
          @input="searchTrigger"
          :next-icon="'>'"
          :prev-icon="'<'"
          :next-aria-label="'next-text'"
          :prev-aria-label="'prev-text'"
          :page-aria-label="'page-text'"
          :current-page-aria-label="'current-page'"
          total-visible="10"
        ></v-pagination>
      </v-expansion-panels>
    </div>
  </div>
</template>

<script>
export default {
  layout: "admin",
  data() {
    return {
        string: "",
        searchList: [],
        counter: 1
    };
  },
  methods :{
       searchTrigger() {
        this.$axios
          .get("admin/news/search/" + this.string + '/page_' + this.counter)
          .then((res) => {
              this.searchList = res.data.data;
              return res
          });
    },

    copy(item) {
      let res = "##news_" + item.id + "##";
      this.$clipboard(res);
    },
  }
};
</script>

<style lang="less">
  .admin_search{
    padding: 40px;
    form{
      margin: 20px 10px;
      input{
        margin: 0;
        border: 0;
        height: auto;
      }
    }
  }
</style>