123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193 |
- <html>
- <head>
- <title>Master service</title>
- <style>
- html, body {
- color: #333;
- padding: 20px;
- }
- .block {
- flex-grow: 1;
- max-width: 100%;
- padding-right: 40px;
- }
- .container {
- display: flex;
- justify-content: space-between;
- max-width: 1200px;
- flex-wrap: wrap;
- }
- .table {
- padding: 20px;
- border: 1px solid #dadada;
- }
- .table__header,
- .table__row {
- display: flex;
- }
- .table__header {
- padding-bottom: 10px;
- font-weight: bold;
- }
- .form-error {
- color: #FF3333;
- }
- .table__col-narrow {
- width: 100px;
- }
- .table__col-wide {
- width: 200px;
- }
- .table__col-actions {
- width: 120px;
- display: flex;
- justify-content: space-between;
- }
- .table__col-narrow:last-child,
- .table__col-wide:last-child {
- width: auto;
- }
- .form__input {
- width: 200px;
- padding: 5px;
- }
- .form__submit {
- padding: 5px;
- }
- .form__select {
- padding: 5px;
- min-width: 200px;
- }
- </style>
- </head>
- <body>
- <h1>CQRS Demo: master service</h1>
- <div class="container">
- <div class="block">
- <h2>Users:</h2>
- <div class="table">
- <div class="table__header">
- <div class="table__col-narrow">ID</div>
- <div class="table__col-wide">Username</div>
- <div class="table__col-wide">Actions</div>
- </div>
- <div class="table__body">
- {% for user in users %}
- <div class="table__row">
- <div class="table__col-narrow">{{ user.id }}</div>
- <div class="table__col-wide">{{ user.username }}</div>
- <div class="table__col-actions">
- <form action="/users/{{ user.id }}/update/" method="POST">
- <input type="submit" value="Update" />
- {% csrf_token %}
- </form>
- <form action="/users/{{ user.id }}/delete/" method="POST">
- <input type="submit" value="Delete" />
- {% csrf_token %}
- </form>
- </div>
- </div>
- {% endfor %}
- </div>
- </div>
- <br />
- <form method="POST" action="/users/">
- <input type="text" name="username" placeholder="username" class="form__input" required />
- <input type="submit" value="Create" class="form__submit" />
- {% csrf_token %}
- </form>
- <div class="form-error">
- {{ user_error }}
- </div>
- </div>
- <div class="block">
- <h2>Products:</h2>
- <div class="table">
- <div class="table__header">
- <div class="table__col-narrow">ID</div>
- <div class="table__col-wide">Type</div>
- <div class="table__col-wide">Name</div>
- <div class="table__col-wide">Actions</div>
- </div>
- <div class="table__body">
- {% for product in products %}
- <div class="table__row">
- <div class="table__col-narrow">{{ product.id }}</div>
- <div class="table__col-wide">{{ product.product_type.name }}</div>
- <div class="table__col-wide">{{ product.name }}</div>
- <div class="table__col-wide">
- <form action="/products/{{ product.id }}/delete/" method="POST">
- <input type="submit" value="Delete" />
- {% csrf_token %}
- </form>
- </div>
- </div>
- {% endfor %}
- </div>
- </div>
- <br />
- <form method="POST" action="/products/">
- <select class="form__select" name="product_type" required>
- <option value="" disabled selected>Select product type</option>
- {% for product_type in product_types %}
- <option value="{{ product_type.id }}">
- {{ product_type.id }} {{ product_type.name }}
- </option>
- {% endfor %}
- </select>
- <input type="text" name="name" placeholder="name" class="form__input" required />
- <input type="submit" value="Create" class="form__submit" />
- {% csrf_token %}
- </form>
- </div>
- <div class="block">
- <h2>User purchases:</h2>
- <div class="table">
- <div class="table__header">
- <div class="table__col-narrow">ID</div>
- <div class="table__col-narrow">User ID</div>
- <div class="table__col-wide">Product</div>
- <div class="table__col-wide">Time</div>
- <div class="table__col-wide">Actions</div>
- </div>
- <div class="table__body">
- {% for purchase in purchases %}
- <div class="table__row">
- <div class="table__col-narrow">{{ purchase.id }}</div>
- <div class="table__col-narrow">{{ purchase.user_id }}</div>
- <div class="table__col-wide">{{ purchase.product.name }}</div>
- <div class="table__col-wide">{{ purchase.action_time }}</div>
- <div class="table__col-wide">
- <form action="/purchases/{{ purchase.id }}/delete/" method="POST">
- <input type="submit" value="Delete" />
- {% csrf_token %}
- </form>
- </div>
- </div>
- {% endfor %}
- </div>
- </div>
- <br />
- <form method="POST" action="/purchases/">
- <select class="form__select" name="product" required>
- <option value="" disabled selected>Select product</option>
- {% for product in products %}
- <option value="{{ product.id }}">{{ product.id }} {{ product.name }}</option>
- {% endfor %}
- </select>
- <select class="form__select" name="user" required>
- <option value="" disabled selected>Select user</option>
- {% for user in users %}
- <option value="{{ user.id }}">{{ user.id }} {{ user.username }}</option>
- {% endfor %}
- </select>
- <input type="submit" value="Buy" class="form__submit" />
- {% csrf_token %}
- </form>
- <div class="form-error">
- {{ purchase_error }}
- </div>
- </div>
- </div>
- </body>
- </html>
|