scinote-eln/scinote-web
1
1
Fork 0
mirror of https://github.com/scinote-eln/scinote-web.git synced 2025-01-31 20:19:05 +08:00
Code Issues Projects Releases Packages Wiki Activity

Fix filters layout [SCI-9697]

Browse source
This commit is contained in:
Anton 2023-11-20 16:35:21 +01:00
parent 26c726789c
commit d68367eb37
2 changed files with 6 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
app/javascript/vue/shared/filters/inputs/date_range_filter.vue
View file

@ -1,14 +1,16 @@
<template> <template>
<div class="mb-6"> <div class="mb-6">
<label class="sci-label">{{ filter.label }}</label> <label class="sci-label">{{ filter.label }}</label>
<div class="flex items-center gap-5"> <div class="flex items-center gap-2 flex-col">
<DateTimePicker <DateTimePicker
class="w-full"
@change="updateDateFrom" @change="updateDateFrom"
:placeholder="i18n.t('From')" :placeholder="i18n.t('From')"
:dateOnly="true" :dateOnly="true"
:selectorId="`DatePicker${filter.key}`" :selectorId="`DatePicker${filter.key}`"
/> />
<DateTimePicker <DateTimePicker
class="w-full"
@change="updateDateTo" @change="updateDateTo"
:placeholder="i18n.t('To')" :placeholder="i18n.t('To')"
:dateOnly="true" :dateOnly="true"

6
app/views/shared/filter_dropdown/_datetime_search.html.erb
View file

@ -2,14 +2,14 @@
<div class="created-on-label"> <div class="created-on-label">
<label class="sci-label"><%= label %></label> <label class="sci-label"><%= label %></label>
</div> </div>
<div class="flex items-center gap-4"> <div class="flex items-center flex-col gap-2">
<div class="datetime-picker-container flex"> <div class="datetime-picker-container flex w-full">
<div id="<%= "#{container_class}_from_container" %>" class="vue-date-time-picker-filter grow"> <div id="<%= "#{container_class}_from_container" %>" class="vue-date-time-picker-filter grow">
<input ref="input" class="from-date" type="hidden" v-model="date" id="<%= "#{container_class}_from" %>" /> <input ref="input" class="from-date" type="hidden" v-model="date" id="<%= "#{container_class}_from" %>" />
<date-time-picker class="w-full" @cleared="clearDate" ref="vueDateTime" @change="updateDate" mode="datetime" placeholder="<%= t('filters_modal.from_placeholder') %>"></date-time-picker> <date-time-picker class="w-full" @cleared="clearDate" ref="vueDateTime" @change="updateDate" mode="datetime" placeholder="<%= t('filters_modal.from_placeholder') %>"></date-time-picker>
</div> </div>
</div> </div>
<div class="datetime-picker-container flex"> <div class="datetime-picker-container flex w-full">
<div id="<%= "#{container_class}_to_container" %>" class="vue-date-time-picker-filter grow"> <div id="<%= "#{container_class}_to_container" %>" class="vue-date-time-picker-filter grow">
<input ref="input" class="to-date" type="hidden" v-model="date" id="<%= "#{container_class}_to" %>" /> <input ref="input" class="to-date" type="hidden" v-model="date" id="<%= "#{container_class}_to" %>" />
<date-time-picker class="w-full" @cleared="clearDate" ref="vueDateTime" @change="updateDate" mode="datetime" placeholder="<%= t('filters_modal.to_placeholder') %>"></date-time-picker> <date-time-picker class="w-full" @cleared="clearDate" ref="vueDateTime" @change="updateDate" mode="datetime" placeholder="<%= t('filters_modal.to_placeholder') %>"></date-time-picker>