master
SeanChenTaipei 2 years ago
parent b68a13c807
commit 9a1c7c7669
  1. 1044
      static/img/Strategy Page.html
  2. 9
      static/img/Strategy Page_files/all.min.css
  3. 2018
      static/img/Strategy Page_files/bootstrap-icons.css
  4. 7
      static/img/Strategy Page_files/bootstrap.bundle.min.js
  5. 6
      static/img/Strategy Page_files/bootstrap.min.css
  6. 4
      static/img/Strategy Page_files/font-awesome.min.css
  7. 10881
      static/img/Strategy Page_files/jquery-3.6.0.js
  8. 1
      static/img/Strategy Page_files/tailwind.min.css
  9. 18
      static/js/addStock.js
  10. 15
      templates/base.html
  11. 10
      templates/login.html
  12. 16
      templates/result.html
  13. 69
      templates/strategy_tw.html

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

@ -2,7 +2,7 @@
let stockList = ['2330.TW']; let stockList = ['2330.TW'];
// Cache frequently-used DOM elements // Cache frequently-used DOM elements
const $stockForm = $('#stock-form'); const $stockForm = $('#stock-form');
const $stockSelect = $('#stock-select'); // const $stockSelect = $('#stock-select');
const $compSelect = $('#competition'); const $compSelect = $('#competition');
const $stockList = $('#stock-list'); const $stockList = $('#stock-list');
const $submitBtn = $('#submit-btn'); const $submitBtn = $('#submit-btn');
@ -53,17 +53,19 @@ $stockList.on('click', '.delete-btn', function(){
// Event listener for submit button click // Event listener for submit button click
$addStockBtn.click(function(event) { $addStockBtn.click(function(event) {
event.preventDefault(); event.preventDefault();
$('#search').val(''); // console.log($('input[name=assetSelect]').val())
$('#search').trigger("keyup");
// Get selected stock from form // Get selected stock from form
const selectedStock = $stockSelect.val(); var text = $('input[name=assetSelect]').val();
var text = $('#stock-select option:selected').text(); // const selectedStock = text;
if (selectedStock != null && stockList.indexOf(selectedStock)===-1) { // var text = $('#stock-select option:selected').text();
console.log(text)
if (text != null && text!= '' && stockList.indexOf(text)===-1) {
// Add new item to list // Add new item to list
addStockItem(selectedStock, text); addStockItem(text, text);
// Clear input field // Clear input field
$stockSelect.val(''); $('#stockAll').val('');
} }
console.log(stockList); console.log(stockList);
}); });

@ -30,12 +30,9 @@
padding-top: 70px; padding-top: 70px;
padding-bottom: 10px; padding-bottom: 10px;
background-color: #eee; background-color: #eee;
/* font-size: 2vw; */
font-family: Georgia, sans-serif !important; font-family: Georgia, sans-serif !important;
flex-direction: column; flex-direction: column;
height:100vh; height:100vh;
background-image: url({{ url_for('static', filename='img/money.jpeg') }});
background-size: cover;
} }
/* .offcanvas-body { /* .offcanvas-body {
font-size: 2vw; font-size: 2vw;
@ -47,9 +44,7 @@
font-size: 18px; font-size: 18px;
border-bottom: 2px ridge #888888; border-bottom: 2px ridge #888888;
} }
p {
text-indent: 2em;
}
.footer { .footer {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
@ -59,7 +54,9 @@
background-color: #f5f5f5; background-color: #f5f5f5;
} }
{% block style %} {% block style %}
p {
text-indent: 2em;
}
{% endblock %} {% endblock %}
</style> </style>
@ -82,7 +79,7 @@
</a> </a>
<!-- TODO: Login/Logout --> <!-- TODO: Login/Logout -->
<div class="navbar-expand ms-auto"> <div class="navbar-expand ms-auto">
<ul class="navbar-nav me-2 mb-lg-0"> <ul class="navbar-nav me-2">
{% if not session.username %} {% if not session.username %}
<li class="nav-item"> <li class="nav-item">
<a class="nav-link btn btn-lg" href="{{ url_for('login') }}"> <a class="nav-link btn btn-lg" href="{{ url_for('login') }}">
@ -96,7 +93,7 @@
<i class="bi bi-person-check-fill"></i> <i class="bi bi-person-check-fill"></i>
</a> </a>
<ul class="dropdown-menu dropdown-menu-end" style="background-color: rgb(244, 250, 255);"> <ul class="dropdown-menu dropdown-menu-end" style="background-color: rgb(244, 250, 255);">
<li class="px-3 active">歡迎您: {{ session.username|safe }}</li> <li class="px-3">歡迎您: {{ session.username|safe }}</li>
<li><hr class="dropdown-divider"></li> <li><hr class="dropdown-divider"></li>
<li> <li>
<a class="dropdown-item" href="{{ url_for('logout') }}"> <a class="dropdown-item" href="{{ url_for('logout') }}">

@ -5,17 +5,17 @@
{% block title %}Login Page{% endblock %} {% block title %}Login Page{% endblock %}
{% block style %} {% block style %}
.card-body { .card-body {
background-image: linear-gradient(rgba(255,255,255,0.5), rgba(255,255,255,0.5)), url({{ url_for('static', filename='img/cat.png') }}); <!-- background-image: linear-gradient(rgba(255,255,255,0.5), rgba(255,255,255,0.5)), url({{ url_for('static', filename='img/cat.png') }});
background-attachment: fixed-bottom; background-attachment: fixed-bottom;
background-position: right bottom -10px; background-position: right bottom -10px;
background-repeat: no-repeat; background-repeat: no-repeat; -->
<!-- background-size: 40%; --> <!-- background-size: 40%; -->
} }
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<div class="container-fluid fade-in" style="background-color: #eee;min-height:100%;position:relative;"> <div class="container-fluid" style="background-color: #eee;min-height:100%;position:relative;">
<div class="container-fluid px-1 py-4"> <div class="container-fluid py-4">
<div class="row d-flex justify-content-center align-items-center h-100"> <div class="row d-flex justify-content-center align-items-center h-100">
<div class="col-lg-12 col-xl-11"> <div class="col-lg-12 col-xl-11">
<div class="card text-black" style="border-radius: 25px;"> <div class="card text-black" style="border-radius: 25px;">
@ -27,7 +27,7 @@
{% with messages = get_flashed_messages(with_categories=true) %} {% with messages = get_flashed_messages(with_categories=true) %}
{% if messages %} {% if messages %}
{% for category, message in messages %} {% for category, message in messages %}
<div class="alert alert-{{ category }} alert-dismissible fade show mx-3 mb-3 mb-lg-3" role="alert"> <div class="alert alert-{{ category }} alert-dismissible fade show mx-3 mb-3" role="alert">
{{ message }} {{ message }}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button> <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div> </div>

@ -2,11 +2,7 @@
{% set active_page = 'result' %} {% set active_page = 'result' %}
{% block style %} {% block style %}
body {
background-image: url({{ url_for('static', filename='img/money.jpeg') }});
background-repeat: no-repeat; /* Do not repeat the image */
background-size: cover;
}
{% endblock style %} {% endblock style %}
{% block title %}Strategy Page{% endblock%} {% block title %}Strategy Page{% endblock%}
@ -14,11 +10,13 @@ body {
<div class="container-fluid fade-in" style="background-color: #eee;"> <div class="container-fluid fade-in" style="background-color: #eee;">
<div class="container-fluid px-1 py-4"> <div class="container-fluid px-1 py-4">
<div class="alert alert-secondary p-3 mx-3" role="alert"> <div class="alert alert-secondary p-3 mx-3" role="alert">
<div class="d-flex justify-content-bottom"> <div class="flex-row">
<p class="mb-0 mt-2 font-italic font-bold text-xl"> <p class="font-italic font-bold text-xl">
"Risk comes from not knowing what you're doing." "Risk comes from not knowing what you're doing."
</p> </p>
<p class="mb-0 px-1 pt-1 align-self-end text-xs">Warren Edward Buffett</p> </div>
<div class="d-flex flex-row-reverse">
<p class="align-self-end text-xs">- Warren Edward Buffett</p>
</div> </div>
<hr class="my-3 px-5"> <hr class="my-3 px-5">
@ -31,7 +29,7 @@ body {
</select> </select>
</div> </div>
<div> <div>
<button id="changeComp" type="button" class="btn btn-info"><i class="fa-duotone fa-person-running"></i></button> <button id="changeComp" type="button" class="btn btn-secondary"><i class="bi bi-arrow-right-square-fill"></i></button>
</div> </div>
</div> </div>
</div> </div>

@ -9,13 +9,17 @@
{% block title %}Strategy Page{% endblock%} {% block title %}Strategy Page{% endblock%}
{% block style %} {% block style %}
body {
background-image: url({{ url_for('static', filename='img/money.jpeg') }}); .input-group > input {
background-repeat: no-repeat; /* Do not repeat the image */ border: 2px solid #8E8E8E;
background-size: cover; border-radius: 7px;
}
.input-group-lg > input {
border: 2px solid #8E8E8E;
border-radius: 7px;
} }
.input-group{ .input-group-lg > select {
border: 1px solid #8E8E8E; border: 2px solid #8E8E8E;
border-radius: 7px; border-radius: 7px;
} }
.input-group > span{ .input-group > span{
@ -29,9 +33,9 @@ body {
<div class="container-md m-1"> <div class="container-md m-1">
<div class="card mb-3 p-4"> <div class="card mb-3 p-4">
<div class="card mb-3"> <div class="card mb-3">
<img src="{{ url_for("static", filename="img/stock.jpeg") }}" class="card-img-top" alt="..."> <!-- <img src="{{ url_for("static", filename="img/stock.jpeg") }}" class="card-img-top" alt="..."> -->
<div class="card-body"> <div class="card-body">
<h5 class="card-title text-xl font-bold">投資組合建立步驟</h5> <h5 class="card-title text-xl font-bold">投資組合建立步驟 <i class="bi bi-arrow-down-right-circle-fill"></i></h5>
<ol class="list-group list-group-flush list-group-numbered"> <ol class="list-group list-group-flush list-group-numbered">
<li class="list-group-item"><span class="ps-2">輸入投資組合名稱</span></li> <li class="list-group-item"><span class="ps-2">輸入投資組合名稱</span></li>
<li class="list-group-item"><span class="ps-2">選擇所參加的課程或競賽</span></li> <li class="list-group-item"><span class="ps-2">選擇所參加的課程或競賽</span></li>
@ -42,24 +46,20 @@ body {
</ol> </ol>
</div> </div>
</div> </div>
<div class="input-group mb-1 input-group-lg flex-nowrap"> <div class="input-group-lg">
<span class="input-group-text" id="addon-wrapping">投資組合名稱</span> <label for="input1" class="form-label text-xl font-bold">投資組合名稱</label>
<input name="portName" type="text" class="form-control" placeholder="EX. 空軍一號" aria-label="" aria-describedby="addon-wrapping" required> <input if="imput1" name="portName" type="text" class="form-control" placeholder="EX. 空軍一號" required>
</div> </div>
<div class="input-group input-group-lg mb-3"> <div class="input-group-lg mb-3">
<span class="input-group-text" id="inputGroup-sizing-default">請選擇所參加的課程/競賽</span> <label for="competition" class="form-label text-xl font-bold">請選擇所參加的課程/競賽</label>
<select id="competition" class="form-select" size="1" aria-label="size 5 select example"> <select id="competition" class="form-select" size="1">
{% include 'competitions.html' %} {% include 'competitions.html' %}
</select> </select>
</div> </div>
<div class="input-group input-group-lg mb-1" > <label for="stockAll" class="form-label text-xl font-bold">選擇資產:</label>
<span class="input-group-text" id="search1">搜尋</span> <div class="mb-3 input-group d-flex">
<input id="search" type="text" class="form-control" placeholder="輸入資產代號" aria-label="Large" aria-describedby="inputGroup-sizing-default"> <input name="assetSelect" class="form-control" list="datalistOptions" id="stockAll" placeholder="輸入資產名稱...">
<span class="input-group-text" id="inputGroup-sizing-default">下方加入資產</span> <datalist id="datalistOptions">
</div>
<div class="input-group input-group-lg mb-3">
<span class="input-group-text" id="inputGroup-sizing-default">請選擇資產</span>
<select id="stock-select" class="form-select form-select-sm" size="5" aria-label="size 5 select example">
{% if session.tw==0 %} {% if session.tw==0 %}
{% for key, data in data_us.items() -%} {% for key, data in data_us.items() -%}
<option value="{{ key|e }}">{{ key|e }} | {{ data|e }}</option> <option value="{{ key|e }}">{{ key|e }} | {{ data|e }}</option>
@ -68,17 +68,18 @@ body {
{% for key, data in data_tw.items() -%} {% for key, data in data_tw.items() -%}
<option value="{{ key|e }}">{{ key|e }} | {{ data|e }} </option> <option value="{{ key|e }}">{{ key|e }} | {{ data|e }} </option>
{% endfor %} {% endfor %}
</select> </datalist>
<button class="btn btn-secondary" <button class="btn btn-secondary"
type="button" type="button btn-lg"
id="addStockBtn"> id="addStockBtn">
加入 加入
</button> </button>
</div> </div>
<hr class="my-3">
<div class="card"> <div class="card">
<div class="card-header d-flex"> <div class="card-header d-flex">
<div class="py-2 font-bold text-xl"> <div class="py-2 font-bold">
已選擇的資產 已選擇的資產
</div> </div>
<div class="btn-group ms-auto"> <div class="btn-group ms-auto">
@ -91,21 +92,22 @@ body {
</div> </div>
</div> </div>
<div class="card-body"> <div class="card-body">
<div class="input-group input-group-lg mb-3"> <div class="input-group mb-3">
<span class="input-group-text me-auto bg-info" id="inputGroup3">請選擇訓練/回測數據比例</span> <!-- <span class="input-group-text me-auto bg-info" id="inputGroup3">請選擇訓練/回測數據比例</span> -->
<select id="ratio-select" class="form-select" size="1" aria-label=""> <select id="ratio-select" class="form-select">
<option value="0.5">5:5</option> <option value="0.5">5:5</option>
<option value="0.6">6:4</option> <option value="0.6">6:4</option>
<option selected value="0.7">7:3</option> <option selected value="0.7">7:3</option>
<option value="0.8">8:2</option> <option value="0.8">8:2</option>
<option value="0.9">9:1</option> <option value="0.9">9:1</option>
</select> </select>
<select id="role-select" class="form-select" size="1" aria-label=""> <select id="role-select" class="form-select">
<option selected value="max_sharpe">最大化夏普比率</option> <option selected value="max_sharpe">最大化夏普比率</option>
<option value="max_sortino">最大化索提諾比率</option> <option value="max_sortino">最大化索提諾比率</option>
<option value="min_volatility">最小化波動率</option> <option value="min_volatility">最小化波動率</option>
</select> </select>
</div> </div>
<ol class="list-group list-group-numbered" id="stock-list" type="1"> <ol class="list-group list-group-numbered" id="stock-list" type="1">
<li class="list-group-item"> <li class="list-group-item">
<span class="px-2">2330.TW | 台積電 | 2000-01-05 ~</span> <span class="px-2">2330.TW | 台積電 | 2000-01-05 ~</span>
@ -129,13 +131,6 @@ body {
<span> <span>
確認後將會暫時關閉建立按鈕,請等待完成訊息! 確認後將會暫時關閉建立按鈕,請等待完成訊息!
</span> </span>
<ol class="list-group list-group-flush list-group-numbered">
<li class="list-group-item"><span class="ps-2">輸入投資組合名稱</span></li>
<li class="list-group-item"><span class="ps-2">選擇所參加的課程或競賽</span></li>
<li class="list-group-item"><span class="ps-2">選擇資產 (可使用搜索功能篩選)</span></li>
<li class="list-group-item"><span class="ps-2">確認資產後按下 "確認資產", 查看資產價格動態圖表</span></li>
<li class="list-group-item"><span class="ps-2">選擇訓練/測試集比率, 確認後按下 "建立投資組合", 查看回傳訊息</span></li>
</ol>
<div class="input-group"> <div class="input-group">
<span class="input-group-text">輸入筆記</span> <span class="input-group-text">輸入筆記</span>
<textarea id="commentPort" class="form-control" aria-label="With textarea"></textarea> <textarea id="commentPort" class="form-control" aria-label="With textarea"></textarea>

Loading…
Cancel
Save