将配置文件独立出来；

dannyy0003 · Mar 15, 2020 · 74ede41 · 74ede41
1 parent 820b74a
commit 74ede41
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 12 deletions.
diff --git a/public/index.html b/public/index.html
@@ -5,6 +5,40 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
   <title>Uptime Status</title>
   <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" type="image/x-icon" />
+  <script>
+
+  // 配置
+  window.Config = {
+
+    // 站点名
+    SiteName: 'Uptime Status',
+
+    // 站点链接
+    SiteUrl: '/',
+
+    // UptimeRobot Api Keys
+    // 支持 Monitor-Specific 和 Read-Only 两只 Api Key
+    ApiKeys: [
+      'm784488775-dd1ad84b209c05f8e185c33e',
+      'm784490063-7b5da437e7f1e0d67613714d',
+      'm784497419-de55aa09902ccb3ab22d548a',
+      'm784496436-71a4bf7b1e3bdf7756be131b',
+    ],
+
+    // 导航栏菜单
+    Navi: [
+      {
+        text: 'Homepage',
+        url: 'https://status.org.cn/'
+      },
+      {
+        text: 'GitHub',
+        url: 'https://github.com/yb/uptime-status'
+      }
+    ]
+  };
+
+  </script>
 </head>
 <body>
   <div id="app"></div>

diff --git a/src/components/app.js b/src/components/app.js
@@ -2,9 +2,9 @@ import React from 'react';
 import Header from './header';
 import Footer from './footer';
 import Uptime from './uptime';
-import { ApiKeys } from './../config';
 
 const App = () => {
+  const { ApiKeys } = window.Config;
   return (
     <>
       <Header />

diff --git a/src/components/header.js b/src/components/header.js
@@ -2,13 +2,15 @@ import React from 'react';
 import Link from './link';
 
 const Header = () => {
+  const { SiteName, SiteUrl, Navi } = window.Config;
   return (
     <div id="header">
       <div className="container">
-        <a className="logo" href="./">Uptime Status</a>
+        <a className="logo" href={SiteUrl}>{SiteName}</a>
         <div className="navi">
-          <Link text="Homepage" to="https://status.org.cn/" />
-          <Link text="GitHub" to="https://github.com/yb/uptime-status" />
+        {Navi.map((item, index) => (
+          <Link key={index} text={item.text} to={item.url} />
+        ))}
         </div>
       </div>
     </div>

diff --git a/src/config.js b/src/config.js