chore: 重构部分代码

更换新的接口api 存储驱动更换为localForage 更好的pc端样式添加pwa配置
journey-ad · Dec 16, 2023 · a191f0f · a191f0f
1 parent 413a19d
commit a191f0f
Show file tree

Hide file tree

Showing 53 changed files with 4,245 additions and 16,830 deletions.
diff --git a/README.md b/README.md
@@ -1,7 +1,5 @@
-<p align="center"><img src="https://count.getloli.com/get/@pixiv-viewer.github" alt="pixiv-viewer"></p>
-
 # pixiv-viewer
-![Github CI](https://github.com/journey-ad/pixiv-viewer/workflows/Github%20CI/badge.svg?branch=master)
+[![Build Status](https://www.travis-ci.org/journey-ad/pixiv-viewer.svg?branch=master)](https://www.travis-ci.org/journey-ad/pixiv-viewer)
 
 [DEMO](https://journey-ad.github.io/pixiv-viewer)
 
@@ -72,4 +70,4 @@ See [Configuration Reference](https://cli.vuejs.org/config/).
 - HBuilder X：云打包 App
 
 ## LICENSE
-[![MIT License Copyright (c) 2020 Jad](https://img.shields.io/github/license/journey-ad/pixiv-viewer)](https://github.com/journey-ad/pixiv-viewer/blob/master/LICENSE)
+[![MIT License Copyright (c) 2020 Jad](https://img.shields.io/github/license/journey-ad/pixiv-viewer)](https://github.com/journey-ad/pixiv-viewer/blob/master/LICENSE)
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -9,32 +9,35 @@
   },
   "dependencies": {
     "@vant/touch-emulator": "^1.2.0",
+    "@vue/cli-plugin-pwa": "^4.5.19",
     "axios": "^0.19.2",
-    "core-js": "^3.6.4",
+    "core-js": "^3.34.0",
     "file-saver": "^2.0.2",
     "gif.js": "^0.2.0",
     "gifshot": "^0.4.5",
     "js-base64": "^2.5.2",
     "jszip": "^3.4.0",
+    "localforage": "^1.10.0",
     "lodash": "^4.17.15",
     "moment": "^2.24.0",
+    "register-service-worker": "^1.7.2",
     "swiper": "^5.3.6",
     "v-calendar": "^1.0.3",
-    "vant": "^2.6.0",
-    "vue": "2.6.12",
+    "vant": "^2.13.2",
+    "vue": "^2.6.14",
     "vue-awesome-swiper": "^4.1.0",
     "vue-concise-slider": "^3.4.4",
     "vue-moment": "^4.1.0",
-    "vue-router": "3.1.5",
-    "vuex": "3.1.2",
+    "vue-router": "^3.6.5",
+    "vue-waterfall2": "1.10.6",
+    "vuex": "^3.6.2",
     "whammy": "^0.0.1"
   },
   "devDependencies": {
-    "@vue/cli-plugin-babel": "^4.2.0",
-    "@vue/cli-plugin-eslint": "^4.2.0",
-    "@vue/cli-plugin-router": "^4.2.0",
-    "@vue/cli-plugin-vuex": "^4.2.0",
-    "@vue/cli-service": "^4.2.0",
+    "@vue/cli-plugin-babel": "^4.5.19",
+    "@vue/cli-plugin-eslint": "^4.5.19",
+    "@vue/cli-service": "^4.5.19",
+    "@vue/compiler-sfc": "^2.7.15",
     "babel-eslint": "^10.0.3",
     "babel-plugin-import": "^1.13.0",
     "eslint": "^6.7.2",
@@ -43,6 +46,6 @@
     "stylus": "^0.54.7",
     "stylus-loader": "^3.0.2",
     "vue-svg-icon": "^1.2.9",
-    "vue-template-compiler": "2.6.12"
+    "vue-template-compiler": "^2.6.14"
   }
 }
diff --git a/public/img/icons/android-chrome-192x192.png b/public/img/icons/android-chrome-192x192.png
diff --git a/public/img/icons/android-chrome-512x512.png b/public/img/icons/android-chrome-512x512.png
diff --git a/public/img/icons/android-chrome-maskable-192x192.png b/public/img/icons/android-chrome-maskable-192x192.png
diff --git a/public/img/icons/android-chrome-maskable-512x512.png b/public/img/icons/android-chrome-maskable-512x512.png
diff --git a/public/img/icons/apple-touch-icon-120x120.png b/public/img/icons/apple-touch-icon-120x120.png
diff --git a/public/img/icons/apple-touch-icon-152x152.png b/public/img/icons/apple-touch-icon-152x152.png
diff --git a/public/img/icons/apple-touch-icon-180x180.png b/public/img/icons/apple-touch-icon-180x180.png
diff --git a/public/img/icons/apple-touch-icon-60x60.png b/public/img/icons/apple-touch-icon-60x60.png
diff --git a/public/img/icons/apple-touch-icon-76x76.png b/public/img/icons/apple-touch-icon-76x76.png
diff --git a/public/img/icons/apple-touch-icon.png b/public/img/icons/apple-touch-icon.png
diff --git a/public/img/icons/favicon-16x16.png b/public/img/icons/favicon-16x16.png
diff --git a/public/img/icons/favicon-32x32.png b/public/img/icons/favicon-32x32.png
diff --git a/public/img/icons/msapplication-icon-144x144.png b/public/img/icons/msapplication-icon-144x144.png
diff --git a/public/img/icons/mstile-150x150.png b/public/img/icons/mstile-150x150.png
diff --git a/public/img/icons/safari-pinned-tab.svg b/public/img/icons/safari-pinned-tab.svg
diff --git a/public/index.html b/public/index.html
@@ -3,8 +3,8 @@
 
 <head>
   <meta charset="utf-8">
-  <meta http-equiv="X-UA-Compatible"
-        content="IE=edge">
+  <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <link rel="icon"
         href="<%= BASE_URL %>favicon.ico">
   <title><%= htmlWebpackPlugin.options.title %></title>

diff --git a/public/robots.txt b/public/robots.txt
@@ -0,0 +1,2 @@
+User-agent: *
+Disallow:
diff --git a/public/static/js/flexible.js b/public/static/js/flexible.js
@@ -9,7 +9,7 @@
     var flexible = lib.flexible || (lib.flexible = {});
 
     if (metaEl) {
-        console.warn('将根据已有的meta标签来设置缩放比例');
+        console.warn('将根据已有的meta标签来设置缩放比例');
         var match = metaEl.getAttribute('content').match(/initial\-scale=([\d\.]+)/);
         if (match) {
             scale = parseFloat(match[1]);
@@ -35,7 +35,7 @@
         var isIPhone = win.navigator.appVersion.match(/iphone/gi);
         var devicePixelRatio = win.devicePixelRatio;
         if (isIPhone) {
-            // iOS下，对于2和3的屏，用2倍的方案，其余的用1倍方案
+            // iOS下，对于2和3的屏，用2倍的方案，其余的用1倍方案
             if (devicePixelRatio >= 3 && (!dpr || dpr >= 3)) {               
                 //dpr = 3;
 				dpr = 1;
@@ -45,7 +45,7 @@
                 dpr = 1;
             }
         } else {
-            // 其他设备下，仍旧使用1倍的方案
+            // 其他设备下，仍旧使用1倍的方案
             dpr = 1;
         }
 		dpr = 1;
@@ -66,8 +66,8 @@
     }
     function refreshRem(){
         var width = docEl.getBoundingClientRect().width;
-        if (width / dpr > 540) {
-            width = 540 * dpr;
+        if (width / dpr > 650) {
+            width = 650 * dpr;
         }
         var rem = width / 10;
         docEl.style.fontSize = rem + 'px';

diff --git a/src/App.vue b/src/App.vue
@@ -2,15 +2,45 @@
   <div id="app">
     <Preload />
     <router-view />
+    <transition name="fade">
+      <div class="back-top" @click="toTop" v-show="isTopShow">
+        <Icon class="icon-top" name="top"></Icon>
+      </div>
+    </transition>
   </div>
 </template>
 
 <script>
 import Preload from "@/components/Preload";
+
 export default {
+  name: "App",
+  data() {
+    return {
+      isTopShow: false,
+    };
+  },
+  methods: {
+    toTop() {
+      document.documentElement.scrollTo({ top: 0, behavior: "smooth" });
+    },
+    scrollHandler() {
+      if (document.documentElement.scrollTop > 1200) {
+        this.isTopShow = true;
+      } else {
+        this.isTopShow = false;
+      }
+    },
+  },
+  mounted() {
+    window.addEventListener("scroll", this.scrollHandler);
+  },
+  beforeUnmount() {
+    window.removeEventListener("scroll", this.scrollHandler);
+  },
   components: {
-    Preload
-  }
+    Preload,
+  },
 };
 </script>
 
@@ -20,5 +50,29 @@ export default {
   -moz-osx-font-smoothing: grayscale;
   max-width: 750px;
   margin: 0 auto;
+
+  &.show-nav {
+    .back-top {
+      bottom: 130px;
+    }
+  }
+
+  .back-top {
+    position: fixed;
+    right: 40px;
+    bottom: 40px;
+    cursor: pointer;
+
+    .icon-top {
+      width: 100px;
+      height: 100px;
+    }
+  }
+}
+
+@media screen and (min-width: 768px) {
+  #app {
+    max-width: 1200px;
+  }
 }
 </style>
diff --git a/src/api/http.js b/src/api/http.js
@@ -1,14 +1,19 @@
 import axios from 'axios'
+import store from '@/store'
 
-const baseURL = 'https://hibiapi.getloli.com/'
+const baseURL = 'https://hibiapi.journeyad.repl.co/api/'
 
-axios.defaults.baseURL = baseURL
 axios.defaults.timeout = 10000
 axios.defaults.headers.post['Content-Type'] = 'application/json'
 
 const get = async (url, params) => {
   try {
-    const res = await axios.get(url, { params })
+    const { SETTING } = store.state
+
+    const res = await axios.get(url, {
+      baseURL: SETTING.api || baseURL,
+      params
+    })
 
     return new Promise((resolve, reject) => {
       let data = res.data
@@ -25,7 +30,12 @@ const get = async (url, params) => {
 
 const post = async (url, data) => {
   try {
-    const res = await axios.post(url, data).data
+
+    const { SETTING } = store.state
+    const res = await axios.post(url,
+      data,
+      { baseURL: SETTING.api || baseURL }
+    ).data
 
     return new Promise((resolve, reject) => {
       let data = res.data