add tags to create comment

This commit is contained in:
SvyatoslavArtymovych 2023-05-17 12:07:41 +03:00
parent 7f6c7de37b
commit 6fab600d56
9 changed files with 91 additions and 16 deletions

View File

@ -2,4 +2,3 @@
from .pagination import create_pagination
from .breadcrumbs import create_breadcrumbs
from .book_verify import register_book_verify_route, book_validator
from .tags import set_book_tags

View File

@ -10,4 +10,4 @@ class BookTags(BaseModel):
book_id = db.Column(db.Integer, db.ForeignKey("books.id"))
def __repr__(self):
return f"<t:{self.tag} to b:{self.comment}"
return f"<t:{self.tag_id} to b:{self.book_id}"

View File

@ -10,4 +10,4 @@ class CommentTags(BaseModel):
comment_id = db.Column(db.Integer, db.ForeignKey("comments.id"))
def __repr__(self):
return f"<t:{self.tag} to c:{self.comment}"
return f"<t:{self.tag_id} to c:{self.comment_id}"

View File

@ -1161,6 +1161,10 @@ input:checked + .toggle-bg {
z-index: 55;
}
.z-\[150\] {
z-index: 150;
}
.col-span-6 {
grid-column: span 6 / span 6;
}
@ -1981,6 +1985,31 @@ input:checked + .toggle-bg {
border-color: rgb(255 255 255 / var(--tw-border-opacity));
}
.border-red-100 {
--tw-border-opacity: 1;
border-color: rgb(253 232 232 / var(--tw-border-opacity));
}
.border-red-800 {
--tw-border-opacity: 1;
border-color: rgb(155 28 28 / var(--tw-border-opacity));
}
.border-red-600 {
--tw-border-opacity: 1;
border-color: rgb(224 36 36 / var(--tw-border-opacity));
}
.border-red-900 {
--tw-border-opacity: 1;
border-color: rgb(119 29 29 / var(--tw-border-opacity));
}
.border-black {
--tw-border-opacity: 1;
border-color: rgb(0 0 0 / var(--tw-border-opacity));
}
.bg-blue-50 {
--tw-bg-opacity: 1;
background-color: rgb(235 245 255 / var(--tw-bg-opacity));
@ -2451,6 +2480,11 @@ input:checked + .toggle-bg {
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-slate-50 {
--tw-shadow-color: #f8fafc;
--tw-shadow: var(--tw-shadow-colored);
}
.outline {
outline-style: solid;
}
@ -2791,6 +2825,21 @@ input:checked + .toggle-bg {
border-color: transparent;
}
:is(.dark .dark\:border-red-600) {
--tw-border-opacity: 1;
border-color: rgb(224 36 36 / var(--tw-border-opacity));
}
:is(.dark .dark\:border-black) {
--tw-border-opacity: 1;
border-color: rgb(0 0 0 / var(--tw-border-opacity));
}
:is(.dark .dark\:border-white) {
--tw-border-opacity: 1;
border-color: rgb(255 255 255 / var(--tw-border-opacity));
}
:is(.dark .dark\:bg-blue-600) {
--tw-bg-opacity: 1;
background-color: rgb(28 100 242 / var(--tw-bg-opacity));

File diff suppressed because one or more lines are too long

View File

@ -34,14 +34,42 @@
{% else %}
action="{{ url_for('book.create_comment', book_id=book.id, collection_id=collection.id,section_id=section.id,interpretation_id=interpretation.id) }}"
{% endif %}
method="post" class="flex flex-col bg-white dark:bg-gray-900 max-w-full p-3 text-gray-900 divide-y divide-gray-200 dark:text-white dark:divide-gray-700 m-3 border-2 border-gray-200 border-solid rounded-lg dark:border-gray-700">
method="post" class="prevent-submit-on-enter flex flex-col bg-white dark:bg-gray-900 max-w-full p-3 text-gray-900 divide-y divide-gray-200 dark:text-white dark:divide-gray-700 m-3 border-2 border-gray-200 border-solid rounded-lg dark:border-gray-700">
{{ form_hidden_tag() }}
<div class="relative z-0 w-full mb-6 group">
<!-- prettier-ignore -->
<input autocomplete="off" maxlength="256" type="text" name="text" id="floating_email" class="block py-2.5 px-0 w-full text-sm text-gray-900 bg-transparent border-0 border-b-2 border-gray-300 appearance-none dark:text-white dark:border-gray-600 dark:focus:border-blue-500 focus:outline-none focus:ring-0 focus:border-blue-600 peer" placeholder=" " required />
<!-- prettier-ignore -->
<label for="floating_email" class="peer-focus:font-medium absolute text-sm text-gray-500 dark:text-gray-400 duration-300 transform -translate-y-6 scale-75 top-3 -z-10 origin-[0] peer-focus:left-0 peer-focus:text-blue-600 peer-focus:dark:text-blue-500 peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-6" >Comment</label >
<div class="mb-2">
<label for="tags-input" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
Comment
</label>
<input
name="text"
autocomplete="off"
maxlength="256"
type="text"
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
placeholder="Leave your comment here"
required
>
</div>
<div class="mb-6">
<label for="tags-input" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
Tags
</label>
<input type="text" name="tags" class="hidden tags-to-submit">
<input
type="text"
id="tags-input"
class="multiple-input mb-3 bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
placeholder="e.g. Law (press 'Enter' or Comma to add tag. Click on tag to edit it)"
data-save-results-to="tags-to-submit"
>
<div class="multiple-input-items gap-1 flex flex-wrap">
</div>
</div>
</div>
<!-- prettier-ignore -->
<button type="submit" class="ml-auto text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm w-full sm:w-auto px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"> Leave comment </button>
</form>

View File

@ -65,7 +65,7 @@
>
<div class="multiple-input-items gap-1 flex flex-wrap">
{% for tag in book.tags %}
<div class="cursor-pointer multiple-input-word bg-sky-300 hover:bg-sky-400 dark:bg-sky-500 dark:hover:bg-sky-600 rounded text-center py-1/2 px-2">{{tag.name}}</div>
<div class="cursor-pointer multiple-input-word bg-sky-300 hover:bg-sky-400 dark:bg-blue-600 dark:hover:bg-blue-700 rounded text-center py-1/2 px-2">{{tag.name}}</div>
{% endfor %}
</div>
</div>

View File

@ -13,9 +13,8 @@ from app.controllers import (
create_breadcrumbs,
register_book_verify_route,
book_validator,
set_book_tags,
set_comment_tags
)
from app.controllers.tags import set_book_tags, set_comment_tags
from app import models as m, db, forms as f
from app.logger import log
@ -1109,7 +1108,7 @@ def create_comment(
set_comment_tags(comment, tags)
flash("Success!", "success")
return redirect(redirect_url)
return redirect(request.referrer)
else:
log(log.ERROR, "Comment create errors: [%s]", form.errors)
for field, errors in form.errors.items():
@ -1117,7 +1116,7 @@ def create_comment(
for error in errors:
flash(error.lower().replace("field", field_label).title(), "danger")
return redirect(redirect_url)
return redirect(request.referrer)
@bp.route(

View File

@ -95,7 +95,7 @@ const multipleInputJs = () => {
const wordDiv = document.createElement('div');
// prettier-ignore
wordDiv.className = 'cursor-pointer multiple-input-word bg-sky-300 hover:bg-sky-400 dark:bg-sky-500 dark:hover:bg-sky-600 rounded text-center py-1/2 px-2';
wordDiv.className = 'cursor-pointer multiple-input-word bg-sky-300 hover:bg-sky-400 dark:bg-blue-600 dark:hover:bg-blue-700 rounded text-center py-1/2 px-2';
wordDiv.innerHTML = inputValue;
addedWords.push(inputValue);
wordDiv.addEventListener('click', () => {