Merge pull request #7167 from aignatov-bio/ai-sci-10301-add-pagination-to-linked-tasks-modal

Add pagination to linked task modal [SCI-10301]
This commit is contained in:
aignatov-bio 2024-03-01 17:29:42 +01:00 committed by GitHub
commit d807b56b28
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 37 additions and 14 deletions

View file

@ -129,17 +129,22 @@ class ProtocolsController < ApplicationController
records = records.where(parent_id: @protocol.published_versions) records = records.where(parent_id: @protocol.published_versions)
.or(records.where(parent_id: @protocol.id)) .or(records.where(parent_id: @protocol.id))
end end
records.preload(my_module: { experiment: :project }).distinct records = records.preload(my_module: { experiment: :project })
.distinct.order(updated_at: :desc).page(params[:page]).per(10)
render json: records.map { |record| render json: {
{ data: records.map { |record|
my_module_name: record.my_module.name, {
experiment_name: record.my_module.experiment.name, my_module_name: record.my_module.name,
project_name: record.my_module.experiment.project.name, experiment_name: record.my_module.experiment.name,
my_module_url: protocols_my_module_path(record.my_module), project_name: record.my_module.experiment.project.name,
experiment_url: my_modules_path(experiment_id: record.my_module.experiment.id), my_module_url: protocols_my_module_path(record.my_module),
project_url: experiments_path(project_id: record.my_module.experiment.project.id) experiment_url: my_modules_path(experiment_id: record.my_module.experiment.id),
} project_url: experiments_path(project_id: record.my_module.experiment.project.id)
}
},
next_page: records.next_page,
total_pages: records.total_pages
} }
end end

View file

@ -35,6 +35,14 @@
</a> </a>
</div> </div>
</div> </div>
<div class="flex mt-4">
<Pagination
v-if="totalPage"
:totalPage="totalPage"
:currentPage="page"
@setPage="setPage"
></Pagination>
</div>
</div> </div>
<div class="modal-footer items-center"> <div class="modal-footer items-center">
{{ i18n.t("protocols.index.linked_children.show_version") }} {{ i18n.t("protocols.index.linked_children.show_version") }}
@ -57,6 +65,7 @@
import SelectDropdown from '../../shared/select_dropdown.vue'; import SelectDropdown from '../../shared/select_dropdown.vue';
import axios from '../../../packs/custom_axios.js'; import axios from '../../../packs/custom_axios.js';
import modalMixin from '../../shared/modal_mixin'; import modalMixin from '../../shared/modal_mixin';
import Pagination from '../../shared/datatable/pagination.vue';
export default { export default {
name: 'NewProtocolModal', name: 'NewProtocolModal',
@ -65,13 +74,16 @@ export default {
}, },
mixins: [modalMixin], mixins: [modalMixin],
components: { components: {
SelectDropdown SelectDropdown,
Pagination
}, },
data() { data() {
return { return {
linkedMyModules: [], linkedMyModules: [],
versionsList: [], versionsList: [],
selectedVersion: 'All' selectedVersion: 'All',
page: 1,
totalPage: null
}; };
}, },
mounted() { mounted() {
@ -80,13 +92,14 @@ export default {
}, },
methods: { methods: {
loadLinkedMyModules() { loadLinkedMyModules() {
const urlParams = {}; const urlParams = { page: this.page };
if (this.selectedVersion !== 'All') { if (this.selectedVersion !== 'All') {
urlParams.version = this.selectedVersion; urlParams.version = this.selectedVersion;
} }
axios.get(this.protocol.urls.linked_my_modules, { params: urlParams }) axios.get(this.protocol.urls.linked_my_modules, { params: urlParams })
.then((response) => { .then((response) => {
this.linkedMyModules = response.data; this.linkedMyModules = response.data.data;
this.totalPage = response.data.total_pages;
}); });
}, },
loadVersions() { loadVersions() {
@ -97,6 +110,11 @@ export default {
}, },
changeSelectedVersion(version) { changeSelectedVersion(version) {
this.selectedVersion = version; this.selectedVersion = version;
this.page = 1;
this.loadLinkedMyModules();
},
setPage(page) {
this.page = page;
this.loadLinkedMyModules(); this.loadLinkedMyModules();
} }
} }