init

main.py

@@ -0,0 +1,88 @@
+# fastapi
+from fastapi import FastAPI, Request, Response, HTTPException
+from fastapi import templating
+from fastapi.templating import Jinja2Templates
+from fastapi.responses import HTMLResponse, RedirectResponse, JSONResponse
+from fastapi.middleware.cors import CORSMiddleware
+
+# static file
+from fastapi.staticfiles import StaticFiles
+
+# fastapi view function parameters
+from typing import List, Optional
+
+# path
+import os
+
+# time
+import datetime
+
+# db
+import dataset
+from passlib import context
+
+# authorize
+from passlib.context import CryptContext
+# from jose import JWTError, jwt
+from fastapi_jwt_auth import AuthJWT
+from fastapi_jwt_auth.exceptions import AuthJWTException
+from fastapi.security import OAuth2AuthorizationCodeBearer, OAuth2PasswordRequestForm
+
+
+# app
+app = FastAPI()
+
+
+
+# 
+app.mount(path='/templates', app=StaticFiles(directory='templates'), name='templates')
+app.mount(path='/static', app=StaticFiles(directory='static'), name='static ')
+
+
+
+# 
+templates = Jinja2Templates(directory='templates')
+
+# view
+@app.get('/', response_class=HTMLResponse)
+async def index(request: Request):
+    print(request)
+    return templates.TemplateResponse(name='index.html', context={'request': request})
+
+
+# @app.get('/make_video', response_class=HTMLResponse)
+# async def index(request: Request):
+#     print(request)
+#     return templates.TemplateResponse(name='make_video.html', context={'request': request})
+
+@app.get('/login', response_class=HTMLResponse)
+async def login(request: Request):
+    return templates.TemplateResponse(name='login.html', context={'request': request})
+
+@app.get('/home', response_class=HTMLResponse)
+async def login(request: Request):
+    return templates.TemplateResponse(name='home.html', context={'request': request})
+
+@app.get('/monitor/tower', response_class=HTMLResponse)
+async def login(request: Request):
+    return templates.TemplateResponse(name='home.html', context={'request': request})
+
+@app.get('/optim', response_class=HTMLResponse)
+async def login(request: Request):
+    return templates.TemplateResponse(name='optim.html', context={'request': request})
+
+@app.get('/monotor/vibration', response_class=HTMLResponse)
+async def login(request: Request):
+    return templates.TemplateResponse(name='vibration.html', context={'request': request})
+
+@app.get('/history', response_class=HTMLResponse)
+async def login(request: Request):
+    return templates.TemplateResponse(name='history.html', context={'request': request})
+
+@app.get('/set_up/device', response_class=HTMLResponse)
+async def login(request: Request):
+    return templates.TemplateResponse(name='device.html', context={'request': request})
+
+@app.get('/set_up/system', response_class=HTMLResponse)
+async def login(request: Request):
+    return templates.TemplateResponse(name='system.html', context={'request': request})

static/index.css

@@ -0,0 +1,3 @@
+#member{
+    float: right;
+}

static/index.js

@@ -0,0 +1,129 @@
+// //設定cookie
+// function setCookie(name,value)
+// {
+//     var Days = 30;
+//     var exp = new Date();
+//     exp.setTime(exp.getTime() + Days*24*60*60*1000);
+//     document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
+// }
+
+// //獲取cookie
+// function getCookie(name)
+// {
+//     var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
+//     if(arr=document.cookie.match(reg))
+//     return unescape(arr[2]);
+//     else
+//     return null;
+// }
+
+// //setCookie('lan','hk');    繁體中文
+// //setCookie('lan','en');    英文
+
+// var zh = {
+//     "title" : "中文Title",
+//     "info" : "中文info",
+//     "login" : "中文Login",
+//     "choose_character": "中文choose_character"
+// };
+
+// var hk = {
+//     "title" : "hk Title",
+//     "info" : "hk info",
+//     "login" : "hk Login",
+//     "choose_character": "hk choose_character"
+// };
+
+// var en = {
+//     "title" : "英文Title",
+//     "info" : "英文info",
+//     "login" : "英文Login",
+//     "choose_character": "英文choose_character"
+// };
+
+
+
+// // 4. 轉換
+// function changeLan(val) {
+//     var val = val.value;
+//     setCookie('lan', val);
+//     $('[set-lan]').each(function(){
+//         var me = $(this);
+//         var a = me.attr('set-lan').split(':');
+//         var p = a[0];   //文字放置位置
+//         var m = a[1];   //文字標示
+        
+//         //用選擇語言後保存在cookie中，這裡讀取cooikes的語言版本
+//         var lan = getCookie('lan');
+//         console.log(lan);
+    
+//         //選取語言文字
+//         switch(lan){
+//             case 'zh':
+//                 var t = zh[m];  
+//                 console.log(t);
+//                 break;
+//             case 'en':
+//                 var t = en[m];
+//                 console.log(t);
+//                 break;
+//             default:
+//                 var t = hk[m];
+//                 console.log(t);
+//         }
+    
+//         //所選語言沒有就換
+//         if(t==undefined) t = zh[m];
+//         if(t==undefined) t = en[m];
+//         if(t==undefined) t = hk[m];
+    
+//         if(t==undefined) return true;   //都沒有就跳出
+    
+//         //文字放置位置有（html,val等，可以自己添加）
+//         switch(p){
+//             case 'html':
+//                 me.html(t);
+//                 break;
+//             case 'val':
+//             case 'value':
+//                 me.val(t);
+//                 break;
+//             default:
+//                 me.html(t);
+//         }
+    
+//     });
+// }
+
+
+
+// // js裡面的轉換
+// function get_lan(m)
+// {
+//     //獲取文字
+//     var lan = getCookie('lan');     //語言版本
+//     //選取語言文字
+//     switch(lan){
+//         case 'zh':
+//             var t = zh[m];
+//             break;
+//         case 'hk':
+//             var t = hk[m];
+//             break;
+//         default:
+//             var t = en[m];
+//     }
+
+//     //如果沒有找到就轉換其他語言
+//     if(t==undefined) t = zh[m];
+//     if(t==undefined) t = en[m];
+//     if(t==undefined) t = hk[m];
+
+//     if(t==undefined) t = m; //如果還是沒有就直接用標示
+
+//     return t;
+// }
+
+
+// // 
+// changeLan('zh');

templates/index.html

@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang='zh-TW'>
+    <head>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <!-- link -->
+        <link rel="stylesheet" href="static/index.css">
+        
+        <title set-lan="html:title">機械所水塔監控網站</title>
+    </head>
+    <body>
+      <div>
+        <nav class="nav-top">
+          <div class="logo"></div>
+            <img src="static/img/logo.png" alt="Logo" />
+          <div class="member">
+              <button >訊息通知</button>
+              <button onclick="javascript:location.href='/login'">會員登入</button>
+          </div>
+          
+        </nav>
+      </div>
+      <div class="nav-side-bar">
+        <nav class="nav-side-bar">
+          <ul>
+            <li><a href="/home">總覽</a></li>
+            <li><a href="/monitor/tower">水塔監控</a></li>
+            <li><a href="/optim">智能最佳化</a></li>
+            <li><a href="/monotor/vibration">震動監控</a></li>
+            <li><a href="/history">歷史資料</a></li>
+            <li><a href="/set_up/device">設備設定</a></li>
+            <li><a href="/set_up/system">系統設定</a></li>
+          </ul>
+        </nav>
+      </div>
+        
+        
+          <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
+          <script type="text/javascript" src="static/index.js"></script>
+      
+        </body>
+
+</html>

templates/login.html

@@ -0,0 +1,9 @@
+{% extends "index.html" %}
+{% block title %}Login{% endblock %}
+{% block head %}
+{{ super() }}
+{% endblock %}
+
+<div>
+    
+</div>