Tsumanu/actix-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add loading animation

Browse Source
This commit is contained in:
Manuel Gugger 2022-10-06 15:08:00 +02:00
parent 0b293b5807
commit aacc610926
3 changed files with 23 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
templates/base.html
View File

@ -49,9 +49,28 @@
}); });
</script> </script>
<style>
.loader-wrapper {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
/*background: rgba(120,120,120,.2);*/
display: flex;
justify-content: center;
align-items: center;
z-index: 5;
pointer-events: none
}
</style>
</head> </head>
<body> <body>
<div id="loading" class="loader-wrapper htmx-indicator">
<div class="loader is-size-1"></div>
</div>
{% include "header.html" %} {% include "header.html" %}
<div class="container is-fluid"> <div class="container is-fluid">
{% block content %} {% block content %}

4
templates/create_or_edit.html
View File

@ -1,7 +1,7 @@
{% extends "base.html" %} {% extends "base.html" %}
{% block content %} {% block content %}
<form method="post" enctype="multipart/form-data"> <form hx-boost="true" hx-indicator="#loading" hx-encoding="multipart/form-data" method="post" enctype="multipart/form-data">
{% for model_field in view_model.fields -%} {% for model_field in view_model.fields -%}
<div class="field"> <div class="field">
<label class="{{ model_field | get_html_input_type }}" for="{{ model_field.field_name }}"> <label class="{{ model_field | get_html_input_type }}" for="{{ model_field.field_name }}">
@ -26,7 +26,7 @@
{%- endfor %} {%- endfor %}
<div class="field is-grouped"> <div class="field is-grouped">
<div class="control"> <div class="control">
<button class="button is-link" type="submit">Save</button> <button class="button is-link" type="submit">Save</i></button>
</div> </div>
<div class="control"> <div class="control">
<a class="button is-link is-light" href="{{ list_link }}">Cancel</a> <a class="button is-link is-light" href="{{ list_link }}">Cancel</a>

4
templates/list.html
View File

@ -35,7 +35,7 @@
placeholder="Search" placeholder="Search"
hx-get="/admin/{{ entity_name }}/list?render_partial=true&entities_per_page={{ entities_per_page }}&page={{ page }}" hx-get="/admin/{{ entity_name }}/list?render_partial=true&entities_per_page={{ entities_per_page }}&page={{ page }}"
hx-trigger="keyup changed delay:500ms, search" hx-target="#{{ entity_name }}table" hx-trigger="keyup changed delay:500ms, search" hx-target="#{{ entity_name }}table"
hx-indicator=".htmx-indicator"> hx-indicator="#loading">
<span class="icon is-small is-left"> <span class="icon is-small is-left">
<i class="fas fa-search"></i> <i class="fas fa-search"></i>
</span> </span>
@ -66,7 +66,7 @@
<div id="{{ entity_name }}table"> <div id="{{ entity_name }}table">
<form id="checked-rows"> <form id="checked-rows">
<table class="table is-fullwidth is-hoverable"> <table class="table is-fullwidth is-hoverable is-striped">
<thead> <thead>
<tr> <tr>
<th> <th>