添加 Unstar 功能

src/js/components/App.vue

@@ -90,11 +90,14 @@
                     <el-card class="repository-container">
                         <el-header style="height: auto;">
                             <header>
+                                <Star :repository="repository"></Star>
+
                                 <a :href="repository.repo.html_url" target="_blank" class="full-name">
                                     <i class="fa fa-home"></i>
                                     <span>{{ repository.repo.full_name }}</span>
                                 </a>
 
+                                <!--复制克隆项目地址到剪切板-->
                                 <el-tooltip effect="dark" placement="top" content="Clone with HTTPS">
                                     <el-button type="info" icon="fa fa-clone" circle class="clone"
                                                @click="copyCloneUrlWithHttps" size="small">
@@ -126,7 +129,8 @@
                             </el-main>
 
                             <el-aside v-show="isTocShow" class="toc-aside">
-                                <Toc :readmeHtmlWithoutAnchor="readmeHtml" :repository="repository" @render="render"></Toc>
+                                <Toc :readmeHtmlWithoutAnchor="readmeHtml" :repository="repository"
+                                     @render="render"></Toc>
                             </el-aside>
                         </el-container>
                     </el-card>
@@ -147,6 +151,7 @@
     import SearchOnline from './SearchOnline';
     import Donate from './Donate';
     import VirtualList from 'vue-virtual-scroll-list';
+    import Star from './Star';
 
     export default {
         name: 'App',
@@ -178,7 +183,7 @@
             }
         },
         components: {
-            Tags, Search, Toc, Followers, SearchOnline, Donate, VirtualList,
+            Tags, Search, Toc, Followers, SearchOnline, Donate, VirtualList, Star,
         },
         methods: {
             // 处理语言 icon

src/js/components/Star.vue

@@ -0,0 +1,60 @@
+<template>
+    <el-tooltip effect="dark" placement="top" :content="isStarred ? 'Unstar': 'Star'">
+        <i class="fa" :class="isStarred ? 'fa-star': 'fa-star-o'" @click="star"></i>
+    </el-tooltip>
+</template>
+
+<script>
+    import Github from 'github-api';
+
+    export default {
+        name: "Star",
+        props: ['repository'],
+        data() {
+            return {
+                isStarred: true,
+            }
+        },
+        watch: {
+            'repository.repo.id'(n) {
+                let starredRepositoryIds = db.get('repositories').map('repo.id').value();
+
+                this.isStarred = _.includes(starredRepositoryIds, n);
+            }
+        },
+        methods: {
+            star() {
+                let owner = this.repository.repo.owner.login;
+                let repo = this.repository.repo.name;
+                let token = db.get('token').value();
+                let repository = new Github({token: token}).getRepo(owner, repo);
+
+                if (this.isStarred) {
+                    repository.unstar();
+
+                    let repositories = db.get('repositories').value();
+                    _.remove(repositories, repository => {
+                        return repository.repo.id === this.repository.repo.id;
+                    });
+
+                    db.set('repositories', repositories).write();
+                } else {
+                    repository.star();
+
+                    let obj = this.repository;
+                    Object.assign(obj, {starred_at: ''});
+                    db.get('repositories').push(obj).write();
+                }
+
+                this.isStarred = !this.isStarred;
+            }
+        }
+    }
+</script>
+
+<style scoped>
+    i {
+        margin-right: 15px;
+        cursor: pointer;
+    }
+</style>

src/manifest.json

@@ -1,7 +1,7 @@
 {
     "manifest_version": 2,
     "name": "The Fucking Github",
-    "version": "1.2.1",
+    "version": "1.3.0",
     "description": "View starred repositories, organizing stars, searching stars for Github.",
     "homepage_url": "https://github.com/lvxianchao/the-fucking-github",
     "icons": {