From d1c5c9b24512606f9339d1f248e27a6fdc3b3439 Mon Sep 17 00:00:00 2001
From: Alvis Zhao <alvisisme@163.com>
Date: Thu, 3 Jun 2021 19:05:43 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E6=B5=8B=E8=AF=95storage=E5=AD=98?=
 =?UTF-8?q?=E5=82=A8=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 extension/.eslintrc.js                |  3 +++
 extension/public/background.js        | 10 ---------
 extension/public/manifest.json        |  6 ------
 extension/src/components/vbutton.vue  |  7 ++++++-
 extension/src/pages/options/app.vue   | 29 +++++++++++++++++++++++++--
 extension/src/pages/popup/app.vue     | 15 +++++++++++++-
 extension/src/service/data-service.js | 20 ++++++++++++++++++
 extension/vue.config.js               |  2 --
 8 files changed, 70 insertions(+), 22 deletions(-)
 delete mode 100644 extension/public/background.js
 create mode 100644 extension/src/service/data-service.js

diff --git a/extension/.eslintrc.js b/extension/.eslintrc.js
index 2c6a7fa..09d91ff 100644
--- a/extension/.eslintrc.js
+++ b/extension/.eslintrc.js
@@ -3,6 +3,9 @@ module.exports = {
   env: {
     node: true
   },
+  globals: {
+    chrome: 'readonly'
+  },
   extends: [
     'plugin:vue/essential',
     '@vue/standard'
diff --git a/extension/public/background.js b/extension/public/background.js
deleted file mode 100644
index 28612c9..0000000
--- a/extension/public/background.js
+++ /dev/null
@@ -1,10 +0,0 @@
-chrome.runtime.onInstalled.addListener(function() {
-  // 扩展第一次安装时触发
-  // alert('安装完成')
-})
-
-chrome.bookmarks.onCreated.addListener(function() {
-  // alert('新增书签')
-})
-// chrome.browserAction.setBadgeText({text: '↑'})
-// chrome.browserAction.setBadgeText({text: '↓'})
diff --git a/extension/public/manifest.json b/extension/public/manifest.json
index 20f475b..a2af8ce 100644
--- a/extension/public/manifest.json
+++ b/extension/public/manifest.json
@@ -19,12 +19,6 @@
       "128": "images/bookmark128.png"
     }
   },
-  "background": {
-    "scripts": [
-      "background.js"
-    ],
-    "persistent": false
-  },
   "options_page": "options.html",
   "homepage_url": "https://github.com/alvisisme",
   "permissions": [
diff --git a/extension/src/components/vbutton.vue b/extension/src/components/vbutton.vue
index a7e84d2..86ddd95 100644
--- a/extension/src/components/vbutton.vue
+++ b/extension/src/components/vbutton.vue
@@ -1,5 +1,5 @@
 <template>
-  <button class="v-button">
+  <button class="v-button" @click="handleClick">
     <slot></slot>
   </button>
 </template>
@@ -9,6 +9,11 @@ export default {
   name: 'VButton',
   props: {
     msg: String
+  },
+  methods: {
+    handleClick (e) {
+      this.$emit('click', e)
+    }
   }
 }
 </script>
diff --git a/extension/src/pages/options/app.vue b/extension/src/pages/options/app.vue
index 0045859..6d20f59 100644
--- a/extension/src/pages/options/app.vue
+++ b/extension/src/pages/options/app.vue
@@ -1,7 +1,7 @@
 <template>
   <div id="app">
     <v-row>
-      <h1>配置页面</h1>
+      <h1>{{name}}配置页面</h1>
     </v-row>
     <v-row>
       配置项
@@ -9,7 +9,7 @@
 
     <v-row>
       <v-col :span=12>
-        <v-button>保存</v-button>
+        <v-button @click="save()">保存</v-button>
       </v-col>
       <v-col :span=12>
         <v-button>取消</v-button>
@@ -22,6 +22,7 @@
 import vRow from '@/components/vrow.vue'
 import vCol from '@/components/vcol.vue'
 import vButton from '@/components/vbutton.vue'
+import dataService from '@/service/data-service'
 
 export default {
   name: 'App',
@@ -29,6 +30,30 @@ export default {
     vRow,
     vCol,
     vButton
+  },
+  data () {
+    return {
+      name: '',
+      num: 0
+    }
+  },
+  methods: {
+    save () {
+      const value = 'aaaa'
+      chrome.storage.local.set({ key: value }, function () {
+        console.log('Value is set to ' + value)
+      })
+
+      chrome.storage.local.get(['key'], function (result) {
+        console.log('Value currently is ' + result.key)
+      })
+      dataService.setUpdatetime(`${this.num++} : ${Date.now()}`)
+      // const bg = chrome.extension.getBackgroundPage()
+      // bg.setUpdateTime(`${this.num++} : ${Date.now()}`)
+    }
+  },
+  created () {
+    this.name = chrome.i18n.getMessage('name')
   }
 }
 </script>
diff --git a/extension/src/pages/popup/app.vue b/extension/src/pages/popup/app.vue
index fa3767b..a9c6652 100644
--- a/extension/src/pages/popup/app.vue
+++ b/extension/src/pages/popup/app.vue
@@ -13,7 +13,7 @@
 
     <v-row>
       <v-col :span=12>
-        <v-button>上传</v-button>
+        <v-button @click="upload()">上传</v-button>
       </v-col>
       <v-col :span=12>
         <v-button>下载</v-button>
@@ -27,6 +27,7 @@ import vLoading from '@/components/vloading.vue'
 import vRow from '@/components/vrow.vue'
 import vCol from '@/components/vcol.vue'
 import vButton from '@/components/vbutton.vue'
+import dataService from '@/service/data-service'
 
 export default {
   name: 'App',
@@ -41,6 +42,18 @@ export default {
       loading: false,
       updateTime: new Date()
     }
+  },
+  methods: {
+    upload () {
+      dataService.getUpdatetime().then(val => {
+        this.updateTime = val
+      })
+    }
+  },
+  created () {
+    dataService.getUpdatetime().then(val => {
+      this.updateTime = val
+    })
   }
 }
 </script>
diff --git a/extension/src/service/data-service.js b/extension/src/service/data-service.js
new file mode 100644
index 0000000..26d9048
--- /dev/null
+++ b/extension/src/service/data-service.js
@@ -0,0 +1,20 @@
+function setUpdatetime (time) {
+  return new Promise((resolve, reject) => {
+    chrome.storage.local.set({
+      updateTime: time
+    }, resolve)
+  })
+}
+
+function getUpdatetime () {
+  return new Promise((resolve, reject) => {
+    chrome.storage.local.get(['updateTime'], function (result) {
+      resolve(result.updateTime)
+    })
+  })
+}
+
+export default {
+  setUpdatetime,
+  getUpdatetime
+}
diff --git a/extension/vue.config.js b/extension/vue.config.js
index 00eaa8d..6649029 100644
--- a/extension/vue.config.js
+++ b/extension/vue.config.js
@@ -1,5 +1,3 @@
-const HtmlWebpackPlugin = require('html-webpack-plugin')
-
 module.exports = {
   publicPath: '',
   pages: {