app-MAIL-temp/app/dashboard/templates/dashboard/directory.html

144 lines
4.6 KiB
HTML
Raw Normal View History

{% extends 'default.html' %}
{% set active_page = "directory" %}
{% block title %}
Directory
{% endblock %}
{% block default_content %}
<div class="row">
2020-04-05 19:59:48 +02:00
<div class="col">
<h1 class="h3"> Directories
<a class="ml-3 text-info" style="font-size: 12px" data-toggle="collapse" href="#howtouse" role="button"
aria-expanded="false" aria-controls="collapseExample">
How to use <i class="fe fe-chevrons-down"></i>
</a>
</h1>
{% if not current_user.is_premium() %}
2020-01-19 22:06:36 +01:00
<div class="alert alert-danger" role="alert">
This feature is only available in premium plan.
</div>
{% endif %}
<div class="alert alert-primary collapse" id="howtouse" role="alert">
<div>
Directory allows you to create aliases <b>on the fly</b>.
</div>
<div class="mt-2 pb-2">
1⃣ Pick a name for your directory, says <em>my_dir</em> <br>
2⃣ Quickly use one of the following formats to create an alias on-the-fly <b>without creating this alias
beforehand</b>
</div>
2020-05-11 23:22:06 +02:00
<div class="pl-3 py-2 bg-secondary">
<em>my_dir/<b>anything</b>@{{ FIRST_ALIAS_DOMAIN }}</em> or <br>
<em>my_dir+<b>anything</b>@{{ FIRST_ALIAS_DOMAIN }}</em> or <br>
<em>my_dir#<b>anything</b>@{{ FIRST_ALIAS_DOMAIN }}</em> <br>
</div>
<em><b>anything</b></em> is any string composed of lowercase character.
<div class="mt-2">
You can use this feature on the following domains:
{% for alias_domain in ALIAS_DOMAINS %}
<div class="font-weight-bold">{{ alias_domain }} </div>
{% endfor %}
2020-01-19 22:06:36 +01:00
</div>
2020-01-19 22:34:31 +01:00
<div class="h4 text-primary mt-3">
The alias will be created the first time it receives an email.
</div>
</div>
<div class="row">
{% for dir in dirs %}
<div class="col-12 col-lg-6">
<div class="card" style="">
<div class="card-body">
<h5 class="card-title">
{{ dir.name }}
</h5>
<h6 class="card-subtitle mb-2 text-muted">
Created {{ dir.created_at | dt }} <br>
<span class="font-weight-bold">{{ dir.nb_alias() }}</span> aliases.
</h6>
</div>
<div class="card-footer p-0">
<div class="row">
<div class="col">
<form method="post">
<input type="hidden" name="form-name" value="delete">
<input type="hidden" class="dir-name" value="{{ dir.name }}">
<input type="hidden" name="dir-id" value="{{ dir.id }}">
<span class="card-link btn btn-link float-right text-danger delete-dir">
Delete
</span>
</form>
</div>
</div>
</div>
</div>
</div>
{% endfor %}
</div>
<form method="post" class="mt-2">
{{ new_dir_form.csrf_token }}
<input type="hidden" name="form-name" value="create">
<h2 class="h4">New Directory</h2>
2020-01-09 20:43:03 +01:00
{{ new_dir_form.name(class="form-control", placeholder="my-directory",
pattern="[0-9a-z-_]{3,}",
title="Only letter, number, dash (-), underscore (_) can be used. Directory name must be at least 3 characters.") }}
{{ render_field_errors(new_dir_form.name) }}
<div class="small-text">
Directory name must be at least 3 characters.
Only lowercase letter, number, dash (-), underscore (_) can be used.
</div>
<button class="btn btn-lg btn-success mt-2">Create</button>
</form>
</div>
</div>
{% endblock %}
{% block script %}
<script>
$(".delete-dir").on("click", function (e) {
let directory = $(this).parent().find(".dir-name").val();
2020-04-30 22:37:39 +02:00
let that = $(this);
let message = `All aliases associated with <b>${directory}</b> directory will also be deleted, ` +
" please confirm.";
2020-04-30 22:37:39 +02:00
bootbox.confirm({
message: message,
buttons: {
confirm: {
label: 'Yes, delete it',
className: 'btn-danger'
},
cancel: {
label: 'Cancel',
className: 'btn-outline-primary'
}
},
2020-04-30 22:37:39 +02:00
callback: function (result) {
if (result) {
that.closest("form").submit();
}
}
2020-04-30 22:37:39 +02:00
})
});
</script>
{% endblock %}