scinote-eln/scinote-web
1
1
Fork 0
mirror of https://github.com/scinote-eln/scinote-web.git synced 2025-02-21 22:33:13 +08:00
Code Issues Projects Releases Packages Wiki Activity

Fix linked protocol dropdown [SCI-9328]

Browse source
This commit is contained in:
Martin Artnik 2023-09-28 15:40:48 +02:00
parent a499a0f0ea
commit 82b9b676b6
3 changed files with 36 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
app/javascript/vue/mixins/stackableHeadersMixin.js
View file

@ -87,7 +87,7 @@ export default {
this.secondaryNavigation.style.top = '0px';
header.style.top = '0px';
header.style.boxShadow = 'none';
header.style.zIndex = 10;
header.style.zIndex = 105;
this.headerSticked = false;
}

32
app/javascript/vue/protocol/container.vue
View file

@ -1,22 +1,24 @@
<template>
<div v-if="protocol.id" class="task-protocol">
<div ref="header" class="task-section-header ml-[-1rem] w-[calc(100%_+_2rem)] px-4 bg-sn-white sticky top-0 transition" v-if="!inRepository">
<div class="portocol-header-left-part truncate grow">
<template v-if="headerSticked && moduleName">
<i class="sn-icon sn-icon-navigator sci--layout--navigator-open cursor-pointer p-1.5 border rounded border-sn-light-grey mr-4"></i>
<div @click="scrollTop" class="task-section-title w-[calc(100%_-_4rem)] cursor-pointer">
<h2 class="truncate leading-6">{{ moduleName }}</h2>
</div>
</template>
<template v-else >
<a class="task-section-caret" tabindex="0" role="button" data-toggle="collapse" href="#protocol-content" aria-expanded="true" aria-controls="protocol-content">
<i class="sn-icon sn-icon-right"></i>
<div class="task-section-title">
<h2>{{ i18n.t('Protocol') }}</h2>
<div class="flex items-center grow">
<div class="portocol-header-left-part grow">
<template v-if="headerSticked && moduleName">
<i class="sn-icon sn-icon-navigator sci--layout--navigator-open cursor-pointer p-1.5 border rounded border-sn-light-grey mr-4"></i>
<div @click="scrollTop" class="task-section-title w-[calc(100%_-_4rem)] cursor-pointer">
<h2 class="truncate leading-6">{{ moduleName }}</h2>
</div>
</a>
</template>
<div :class="{'hidden': headerSticked}" >
</template>
<template v-else>
<a class="task-section-caret" tabindex="0" role="button" data-toggle="collapse" href="#protocol-content" aria-expanded="true" aria-controls="protocol-content">
<i class="sn-icon sn-icon-right"></i>
<div class="task-section-title truncate">
<h2>{{ i18n.t('Protocol') }}</h2>
</div>
</a>
</template>
</div>
<div :class="{'hidden': headerSticked}">
<div class="my-module-protocol-status">
<!-- protocol status dropdown gets mounted here -->
</div>

36
app/views/my_modules/protocols/_protocol_status_bar.html.erb
View file

@ -1,21 +1,19 @@
<div class="dropdown my-module-protocol-status">
<div class="flex items-center">
<% if @protocol.linked? %>
<span class="status-label linked">
[<%= t("my_modules.protocols.protocol_status_bar.linked") %>]
</span>
<% else %>
<span class="status-label">
[<%= t("my_modules.protocols.protocol_status_bar.unlinked") %>]
</span>
<% end %>
<a href="#" id="my-module-protocol-info-button" class="status-info
<%= 'parent-newer' if @protocol.parent_newer? %>
<%= 'protocol-newer' if @protocol.newer_than_parent? %>
" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="sn-icon sn-icon-info"></i>
</a>
</div>
<div class="flex items-center dropdown my-module-protocol-status">
<% if @protocol.linked? %>
<span class="status-label linked">
[<%= t("my_modules.protocols.protocol_status_bar.linked") %>]
</span>
<% else %>
<span class="status-label">
[<%= t("my_modules.protocols.protocol_status_bar.unlinked") %>]
</span>
<% end %>
<a href="#" id="my-module-protocol-info-button" class="status-info dropdown-toggle
<%= 'parent-newer' if @protocol.parent_newer? %>
<%= 'protocol-newer' if @protocol.newer_than_parent? %>
" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="sn-icon sn-icon-info"></i>
</a>
<div class="dropdown-menu status-info-dropdown" aria-labelledby="my-module-protocol-info-button">
<div class="dropdown-content">
<div class="dropdown-header">
@ -69,4 +67,6 @@
</div>
</div>
</div>
</div>
</div>