risk-calc/templates/main.jinja2

365 строки
19 KiB
Plaintext
Исходник Обычный вид История

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8" />
<meta name="application-name" content="Калькулятор рисков" />
<meta name="author" content="Иваницкий Глеб Олегович" />
<meta name="description" content="{{ description }}" />
<meta name="keywords" content="{{ keywords }}" />
<meta name="robots" content="{{ robots }}" />
<title>{{ title }}</title>
<link rel="icon" href="/static/icons/risk-calc.svg" type="image/svg+xml" />
<link rel="stylesheet" href="/static/styles/main.css" />
<script src="/static/scripts/vendor.js"></script>
<script src="/static/scripts/main.js"></script>
</head>
<body>
<aside id="top-bar">
<div id="logo">
<svg id="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18">
<rect x="1" y="1" width="16" height="16" fill="#FFF"></rect>
<path d="m16,0H2C.9,0,0,.9,0,2v14c0,1.1.9,2,2,2h14c1.1,0,2-.9,2-2V2c0-1.1-.9-2-2-2m-6,4.1l1.1-1.1,1.4,1.4,1.4-1.4,1.1,1.1-1.4,1.4,1.4,1.4-1.1,1.1-1.4-1.4-1.4,1.4-1.1-1.1,1.4-1.4-1.4-1.4m-6.8.6h5v1.5H3.2v-1.5m5.3,8.3h-2v2h-1.5v-2h-2v-1.5h2v-2h1.5v2h2v1.5m6.5,1.2h-5v-1.5h5v1.5m0-2.4h-5v-1.5h5v1.5Z" fill="#3574f0"></path>
</svg>
<span id="title">Калькулятор рисков</span>
</div>
<div id="actions">
<button id="solve">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512">
<path d="M73 39c-14.8-9.1-33.4-9.4-48.5-.9S0 62.6 0 80V432c0 17.4 9.4 33.4 24.5 41.9s33.7 8.1 48.5-.9L361 297c14.3-8.7 23-24.2 23-41s-8.7-32.2-23-41L73 39z" fill="var(--color-9)"></path>
</svg>
<span style="padding-left: .5rem; padding-right: .1rem;">Решить</span>
</button>
</div>
</aside>
<div id="content">
<aside id="menu">
<span class="header">Меню</span>
<div class="item">
<input data-fragment="1" type="button" value="Матрица n&times;m. Игры с природой" />
<div class="marker"></div>
</div>
<div class="item">
<input data-fragment="2" type="button" value="Матрица 2&times;2. Графоаналитический метод" />
<div class="marker"></div>
</div>
</aside>
<main id="main">
<section id="input">
<div data-fragment="1">
<table id="fragment-1-matrix" class="matrix"></table>
<table class="properties">
<tr>
<th colspan="2">Размер матрицы</th>
</tr>
<tr>
<th>
<label for="fragment-1-width">Ширина:</label>
</th>
<td>
<input id="fragment-1-width" type="number" min="2" value="2" />
</td>
</tr>
<tr>
<th>
<label for="fragment-1-height">Высота:</label>
</th>
<td>
<input id="fragment-1-height" type="number" min="2" value="2" />
</td>
</tr>
<tr>
<td colspan="2">
<input id="fragment-1-generate-matrix" class="primary" type="button" value="Применить" />
</td>
</tr>
<tr>
<th colspan="2">Заполнить случайными значениями</th>
</tr>
<tr>
<th>
<label for="fragment-1-min-random-value">Минимальное:</label>
</th>
<td>
<input id="fragment-1-min-random-value" type="number" value="0" />
</td>
</tr>
<tr>
<th>
<label for="fragment-1-max-random-value">Максимальное:</label>
</th>
<td>
<input id="fragment-1-max-random-value" type="number" value="10" />
</td>
</tr>
<tr>
<td colspan="2">
<div>
<input id="fragment-1-fill-random-values" class="primary" type="button" value="Применить" />
<input id="fragment-1-clear-matrix" class="secondary" type="button" value="Очистить" />
</div>
</td>
</tr>
<tr>
<th colspan="2">Прочее</th>
</tr>
<tr>
<th>
<label for="fragment-1-optimism-criterion">Критерий оптимизма:</label>
</th>
<td>
<input id="fragment-1-optimism-criterion" type="number" min="0" max="1" step=".1" value="0.5" />
</td>
</tr>
<tr>
<th>
<label for="fragment-1-fraction-digits">Точность округления:</label>
</th>
<td>
<input id="fragment-1-fraction-digits" type="number" min="0" max="3" value="1" />
</td>
</tr>
</table>
</div>
<div data-fragment="2">
<table id="fragment-2-matrix" class="matrix"></table>
<table class="properties">
<tr>
<th colspan="2">Заполнить случайными значениями</th>
</tr>
<tr>
<th>
<label for="fragment-2-min-random-value">Минимальное:</label>
</th>
<td>
<input id="fragment-2-min-random-value" type="number" value="0" />
</td>
</tr>
<tr>
<th>
<label for="fragment-2-max-random-value">Максимальное:</label>
</th>
<td>
<input id="fragment-2-max-random-value" type="number" value="10" />
</td>
</tr>
<tr>
<td colspan="2">
<div>
<input id="fragment-2-fill-random-values" class="primary" type="button" value="Применить" />
<input id="fragment-2-clear-matrix" class="secondary" type="button" value="Очистить" />
</div>
</td>
</tr>
<tr>
<th colspan="2">Прочее</th>
</tr>
<tr>
<th>
<label for="fragment-2-fraction-digits">Точность округления:</label>
</th>
<td>
<input id="fragment-2-fraction-digits" type="number" min="0" max="3" value="2" />
</td>
</tr>
<tr>
<th>
<label for="fragment-2-graph-size">Размер графика:</label>
</th>
<td>
<input id="fragment-2-graph-size" type="number" min="480" max="3840" value="720" />
</td>
</tr>
</table>
</div>
</section>
<section id="output">
<div data-fragment="1">
<table class="properties">
<tr>
<th colspan="2" style="padding-top: 0;">Седловая точка</th>
</tr>
<tr>
<th>
<label for="fragment-1-lowest-price">Нижняя цена игры:</label>
</th>
<td>
<input id="fragment-1-lowest-price" type="text" data-value="" />
</td>
</tr>
<tr>
<th>
<label for="fragment-1-highest-price">Верхняя цена игры:</label>
</th>
<td>
<input id="fragment-1-highest-price" type="text" data-value="" />
</td>
</tr>
<tr>
<th>
<label for="fragment-1-saddle-point">Седловая точка:</label>
</th>
<td>
<input id="fragment-1-saddle-point" type="text" data-value="" />
</td>
</tr>
<tr>
<th colspan="2">Критерии</th>
</tr>
<tr>
<th>
<label for="fragment-1-laplace-criterion">Критерий Лапласа:</label>
</th>
<td>
<input id="fragment-1-laplace-criterion" type="text" data-value="" />
</td>
</tr>
<tr>
<th>
<label for="fragment-1-wald-criterion">Критерий Вальда:</label>
</th>
<td>
<input id="fragment-1-wald-criterion" type="text" data-value="" />
</td>
</tr>
<tr>
<th>
<label for="fragment-1-max-of-max-criterion">Максимакс:</label>
</th>
<td>
<input id="fragment-1-max-of-max-criterion" type="text" data-value="" />
</td>
</tr>
<tr>
<th>
<label for="fragment-1-min-of-min-criterion">Минимин:</label>
</th>
<td>
<input id="fragment-1-min-of-min-criterion" type="text" data-value="" />
</td>
</tr>
<tr>
<th>
<label for="fragment-1-savage-criterion">Критерий Сэвиджа:</label>
</th>
<td>
<input id="fragment-1-savage-criterion" type="text" data-value="" />
</td>
</tr>
<tr>
<th>
<label for="fragment-1-hurwitz-criterion">Критерий Гурвица:</label>
</th>
<td>
<input id="fragment-1-hurwitz-criterion" type="text" data-value="" />
</td>
</tr>
<tr>
<th colspan="2">Матрица сожалений</th>
</tr>
</table>
<table id="fragment-1-regret-matrix" class="matrix"></table>
</div>
<div data-fragment="2">
<table class="properties">
<tr>
<th colspan="2" style="padding-top: 0;">Седловая точка</th>
</tr>
<tr>
<th>
<label for="fragment-2-lowest-price">Нижняя цена игры:</label>
</th>
<td>
<input id="fragment-2-lowest-price" type="text" data-value="" />
</td>
</tr>
<tr>
<th>
<label for="fragment-2-highest-price">Верхняя цена игры:</label>
</th>
<td>
<input id="fragment-2-highest-price" type="text" data-value="" />
</td>
</tr>
<tr>
<th>
<label for="fragment-2-saddle-point">Седловая точка:</label>
</th>
<td>
<input id="fragment-2-saddle-point" type="text" data-value="" />
</td>
</tr>
<tr class="extra">
<th colspan="2">Вероятности стратегий и цена игры</th>
</tr>
<tr class="extra">
<th>
<label for="fragment-2-p1">Стратегия A&#8321;:</label>
</th>
<td>
<input id="fragment-2-p1" type="text" data-value="" />
</td>
</tr>
<tr class="extra">
<th>
<label for="fragment-2-p2">Стратегия A&#8322;:</label>
</th>
<td>
<input id="fragment-2-p2" type="text" data-value="" />
</td>
</tr>
<tr class="extra">
<th>
<label for="fragment-2-q1">Стратегия B&#8321;:</label>
</th>
<td>
<input id="fragment-2-q1" type="text" data-value="" />
</td>
</tr>
<tr class="extra">
<th>
<label for="fragment-2-q2">Стратегия B&#8322;:</label>
</th>
<td>
<input id="fragment-2-q2" type="text" data-value="" />
</td>
</tr>
<tr class="extra">
<th>
<label for="fragment-2-v">Цена игры:</label>
</th>
<td>
<input id="fragment-2-v" type="text" data-value="" />
</td>
</tr>
</table>
<table class="properties extra" style="margin-top: 1rem;">
<tr>
<th colspan="2" style="padding-top: 0;">График стратегий игрока A</th>
</tr>
<tr>
<td>
<canvas id="fragment-2-a-player-graph"></canvas>
</td>
</tr>
<tr>
<th colspan="2">График стратегий игрока B</th>
</tr>
<tr>
<td>
<canvas id="fragment-2-b-player-graph"></canvas>
</td>
</tr>
</table>
</div>
</section>
</main>
</div>
<aside id="bottom-bar">
<span>&copy; Иваницкий Г. О.,&nbsp;</span>
<span id="copyright-years" data-from="2023">2023</span>
<span>.&nbsp;</span>
<a href="https://csasq.ru/about/contacts" target="_blank">Обратная связь</a>
</aside>
</body>
</html>