learning-system-portal/src/components/HomePage/favoritesNote.vue

<template>
    <div class="note-list">
        <ul v-if="list.length > 0">
            <li class="note-list-index" v-for="item in list" :key="item.id">
                <p style="margin-bottom:18px;">
                  <span style="font-size: 16px;font-weight: 600;color: #333;">{{item.courseName || item.title}}</span> <span v-if="isAll" class="qa-bq">#笔记#</span>
                 
                  <span class="follow-hide" style="float:right">
                    <el-button @click.stop="delCollectItem(item)" type="text" icon="el-icon-star-on" style="color:#8590A6">取消收藏</el-button>
                    </span>
                </p>
                <!-- <h6 class="note-title-info follow-home-title">
                    
                </h6> -->
                <p class="note-text">
                    {{item.content}}
                </p>
                <div>
                    <interactBar :type="6" :data="item" :shares="false" :views="false" :readonly="true"></interactBar> 
                </div>
            </li>
        </ul>
        <div v-else class="home-no-list">
            <img class="img" :src="`${webBaseUrl}/images/homeWu/no-note.png`" alt="" srcset="">
            <p class="text">还没有笔记</p>
        </div>
    </div>
  </template>
  
  <script>
    import interactBar from "@/components/Portal/interactBar.vue";
    // import author from "@/components/Portal/authorInfo.vue";
      export default{
        name:"NoteList",
        components: {
          interactBar,
          // timeShow,
        //   author
        },
        props:{
          list:{
            type:Array,
            default:()=>[]
          },
          isDynamic:{
                type:Boolean,
                default:false,
            },
          personal:{
            type:Boolean,
            default:false,
          },
          isAll:{
            type:Boolean,
            default:false,
          }
        },
          data(){
              return{
                noteList:[]
              }
          },
          mounted() {
          },
      methods:{
        delCollectItem(item) {
        this.$confirm('您确定要取消收藏吗？', '取消提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
           })
            .then(() => {
            this.$emit('confirm', item);
            // apiFavorites.del(item){
            //   console.log(this.$parent,"我拿到的父组件")
            // }
            })
            .catch(() => {});
         },
        emitHide(id) {
          this.$emit('hideIndex',id)
        },
         //展示全部
         changeIsAll(item) {
          item.isAll = !item.isAll;
        },
       
       }
      }
  </script>
  
  <style lang="scss" scoped>
    .note-list{
        ul{
            margin: 0;
        }
        .note-list-index{
            padding: 30px 0;
            border-bottom: 1px solid rgba($color: #999999, $alpha: 0.2) !important;
        }
        .note-title-info{
            margin: 0;
            margin-bottom: 16px;
        }
        .note-text{
            margin-bottom: 18px;
            font-size: 14px;
            color: #333330;
            line-height: 20px;
        }
    }
  </style>