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

Refactor modal loading [SCI-6780]

Browse source
This commit is contained in:
Anton 2022-05-04 10:25:53 +02:00
parent e06b398bb4
commit 3b60c62c79
12 changed files with 47 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
app/controllers/step_orderable_elements_controller.rb
View file

@ -2,7 +2,7 @@
class StepOrderableElementsController < ApplicationController
before_action :load_vars_nested
before_action :load_vars
before_action :load_vars, only: :destroy
before_action :check_manage_permissions, only: %i(create destroy)
def create

14
app/javascript/vue/protocol/mixins/components/delete.js
View file

@ -1,11 +1,15 @@
export default {
data() {
return {
confirmingDelete: false
};
},
methods: {
showDeleteModal() {
$('#modalDestroyProtocolContent').modal('show');
$('#modalDestroyProtocolContent .delete-step').off().one('click', () => {
this.deleteComponent();
$('#modalDestroyProtocolContent').modal('hide');
});
this.confirmingDelete = true;
},
closeDeleteModal() {
this.confirmingDelete = false;
},
deleteComponent() {
$.ajax({

1
app/javascript/vue/protocol/modals.vue
View file

@ -1,6 +1,5 @@
<template>
<div class="protocol-modals">
<deleteComponentModal/>
</div>
</template>
<script>

21
app/javascript/vue/protocol/modals/delete_component.vue
View file

@ -1,5 +1,5 @@
<template>
<div class="modal" id="modalDestroyProtocolContent" tabindex="-1" role="dialog">
<div ref="modal" class="modal" id="modalDestroyProtocolContent" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
@ -14,8 +14,8 @@
</div>
<div class="modal-footer">
<button class="btn btn-secondary" data-dismiss="modal">{{ i18n.t('general.cancel') }}</button>
<button class="btn btn-danger delete-step">Delete forever</button>
<button class="btn btn-secondary" @click="cancel">{{ i18n.t('general.cancel') }}</button>
<button class="btn btn-danger" @click="confirm">{{ i18n.t('protocols.steps.modals.delete_component.confirm')}}</button>
</div>
</div>
</div>
@ -23,6 +23,19 @@
</template>
<script>
export default {
name: 'deleteComponentModal'
name: 'deleteComponentModal',
mounted() {
$(this.$refs.modal).modal('show');
},
methods: {
confirm() {
$(this.$refs.modal).modal('hide');
this.$emit('confirm');
},
cancel() {
$(this.$refs.modal).modal('hide');
this.$emit('cancel');
}
}
}
</script>

4
app/javascript/vue/protocol/step.vue
View file

@ -109,10 +109,10 @@
},
changeState() {
this.step.attributes.completed = !this.step.attributes.completed;
this.$emit('step:update', this.step)
this.$emit('step:update', this.step.attributes)
$.post(this.step.attributes.urls.state_url, {completed: this.step.attributes.completed}).error(() => {
this.step.attributes.completed = !this.step.attributes.completed;
this.$emit('step:update', this.step)
this.$emit('step:update', this.step.attributes)
HelperModule.flashAlertMsg(this.i18n.t('errors.general'), 'danger');
})
},

4
app/javascript/vue/protocol/step_components/checklist.vue
View file

@ -4,13 +4,17 @@
<button class="btn icon-btn btn-light" @click="showDeleteModal">
<i class="fas fa-trash"></i>
</button>
<deleteComponentModal v-if="confirmingDelete" @confirm="deleteComponent" @cancel="closeDeleteModal"/>
</div>
</template>
<script>
import DeleteMixin from 'vue/protocol/mixins/components/delete.js'
import deleteComponentModal from 'vue/protocol/modals/delete_component.vue'
export default {
name: 'Checklist',
components: { deleteComponentModal },
mixins: [DeleteMixin],
props: {
element: {

4
app/javascript/vue/protocol/step_components/table.vue
View file

@ -4,13 +4,17 @@
<button class="btn icon-btn btn-light" @click="showDeleteModal">
<i class="fas fa-trash"></i>
</button>
<deleteComponentModal v-if="confirmingDelete" @confirm="deleteComponent" @cancel="closeDeleteModal"/>
</div>
</template>
<script>
import DeleteMixin from 'vue/protocol/mixins/components/delete.js'
import deleteComponentModal from 'vue/protocol/modals/delete_component.vue'
export default {
name: 'StepTable',
components: { deleteComponentModal },
mixins: [DeleteMixin],
props: {
element: {

4
app/javascript/vue/protocol/step_components/text.vue
View file

@ -4,13 +4,17 @@
<button class="btn icon-btn btn-light" @click="showDeleteModal">
<i class="fas fa-trash"></i>
</button>
<deleteComponentModal v-if="confirmingDelete" @confirm="deleteComponent" @cancel="closeDeleteModal"/>
</div>
</template>
<script>
import DeleteMixin from 'vue/protocol/mixins/components/delete.js'
import deleteComponentModal from 'vue/protocol/modals/delete_component.vue'
export default {
name: 'StepText',
components: { deleteComponentModal },
mixins: [DeleteMixin],
props: {
element: {

2
app/serializers/checklist_serializer.rb
View file

@ -6,7 +6,7 @@ class ChecklistSerializer < ActiveModel::Serializer
attributes :name, :urls
def urls
return unless object.step
return if object.destroyed?
{
delete_url: step_checklist_path(object.step, object)

4
app/serializers/step_table_serializer.rb
View file

@ -6,7 +6,9 @@ class StepTableSerializer < ActiveModel::Serializer
attributes :name, :urls
def urls
return unless object.step
return if object.destroyed?
object.reload unless object.step
{
delete_url: step_table_path(object.step, object)

2
app/serializers/step_text_serializer.rb
View file

@ -6,7 +6,7 @@ class StepTextSerializer < ActiveModel::Serializer
attributes :text, :urls
def urls
return unless object.step
return if object.destroyed?
{
delete_url: step_text_path(object.step, object)

1
config/locales/en.yml
View file

@ -2528,6 +2528,7 @@ en:
title: 'Delete content'
description_1: 'You’re about to delete a content block from your protocol. It might contain data you don’t want to lose. You won’t be able to get it back.'
description_2: 'Are you sure you want to delete it?'
confirm: 'Delete forever'
options:
up_arrow_title: "Move step up"
down_arrow_title: "Move step down"