search_ui/pages/search/lists.vue
2025-02-01 14:36:10 +03:30

1859 lines
59 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<NuxtLayout name="search-layout" :menu="sidbarMenu">
<div class="searchNavigation">
<div class="container-fluid">
<div class="row main-page__content-header">
<div class="col">
<div class="row border-bottom">
<div
class="col-12 order-1 order-lg-1 col-lg-3 d-flex justify-content-start"
>
<div class="d-flex align-items-center mb-1">
<button
name="button"
type="button"
class="toggle-mobile-nav dropdown-hamburger d-md-none"
@click.prevent="toggleSidebarMenu()"
>
<span class="sr-only">باز کردن منوی کنار</span>
<svg class="s18" data-testid="sidebar-icon">
<use href="assets/common/img/icons.svg#sidebar"></use>
</svg>
</button>
<div
v-if="!isMajlesBuild()"
class="d-flex align-items-center"
>
<label
for="repositories-desktop"
class="float-labels no-wrap ms-2"
>
فهرستهای مرتبط با مخزن داده:
</label>
<USelectMenu
v-model="selectedListItem"
:options="searchListSchemaGetter"
@update:model-value="onSelectNavigation"
>
</USelectMenu>
<!-- <multiselect
v-if="searchListSchemaGetter?.length"
:searchable="true"
:close-on-select="true"
:show-labels="false"
label="label"
track-by="key"
placeholder="انتخاب فهرست"
:value="searchListActiveSchemaGetter"
:options="searchListSchemaGetter"
@select="onSelectNavigation"
:hide-selected="false"
:max-height="250"
:width="50"
openDirection="rtl"
id="repositories-desktop"
class="multiselect"
>
</multiselect> -->
</div>
</div>
</div>
<div class="col-12 order-2 order-lg-1 col-lg-7">
<div class="nav-tabs-container nav-tabs border-bottom-0">
<div class="d-lg-none">
<button
class="btn"
@click.prevent="openNavigationFilter(2)"
>
<svg class="icon icon-Component-356--1">
<use xlink:href="#icon-Component-356--1"></use>
</svg>
</button>
</div>
<ul class="nav">
<li
class="nav-item desktop"
v-for="(navItem, index) in navTabs"
:key="index"
>
<button
:title="navItem.label"
type="button"
@click.prevent="updateCategoryList(navItem, index)"
class="btn nav-link"
:class="{
active: searchListActiveTabGetter?.key == navItem.key,
}"
>
{{ navItem.label }}
</button>
</li>
<li
class="nav-item mobile tabs-more-btn d-md-none"
v-if="navTabs?.length > 2"
>
<div class="dropdown">
<button
class="btn"
type="button"
id="dropdownMenuButton"
data-bs-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
>
<svg class="icon icon-Component-81--1">
<use xlink:href="#icon-Component-81--1"></use>
</svg>
</button>
<div
class="dropdown-menu"
aria-labelledby="dropdownMenuButton"
>
<a
v-if="navItem?.key !== 'custome'"
class="dropdown-item"
@click.prevent="updateCategoryList(navItem, index)"
v-for="(navItem, index) in navTabs"
:key="index"
:class="{
active:
searchListActiveTabGetter?.key == navItem.key,
}"
>{{ navItem.label }}</a
>
</div>
</div>
</li>
</ul>
</div>
</div>
<!-- <div class="col-1 order-1 order-lg-1 col-lg-1 d-flex justify-content-end">
<button
class="btn"
style="z-index: 9"
v-if="activeTab?.key == 'custome'"
@click.prevent="
selectedNavigationFilter = !selectedNavigationFilter
"
>
<svg class="icon icon-filter">
<use xlink:href="#icon-filter"></use>
</svg>
</button>
</div> -->
</div>
<!-- #region show only in custom tab -->
<div
class="d-flex pt-2 pb-2 justify-content-center custom-filter-container flex-column flex-lg-row"
v-if="searchListActiveTabGetter?.key == 'custome'"
>
<div
class="me-2 d-block align-items-center"
v-if="searchListActiveSchemaGetter"
>
<label class="multiselect-lable ms-1" for=""
>سطح اول فهرست:</label
>
<USelectMenu
:popper="{ placement: 'left-end' }"
searchable
searchable-placeholder="Search a person..."
v-model:query="fieldOneQuery"
v-if="searchListActiveSchemaGetter?.info?.items?.length"
option-attribute="title"
placeholder="انتخاب کنید"
v-model="fieldOne"
:options="searchListActiveSchemaGetter?.info?.items"
@update:model-value="onComboChanged()"
>
</USelectMenu>
</div>
<div
class="me-3 ms-2 align-items-center d-none d-lg-block"
v-if="searchListActiveSchemaGetter"
>
<label class="multiselect-lable ms-1" for="">سطح دوم:</label>
<USelectMenu
:popper="{ placement: 'left-end' }"
searchable
searchable-placeholder="Search a person..."
v-model:query="fieldTwoQuery"
v-if="searchListActiveSchemaGetter?.info?.items?.length"
option-attribute="title"
placeholder="انتخاب کنید"
v-model="fieldTwo"
:options="searchListActiveSchemaGetter?.info?.items"
@update:model-value="onComboChanged()"
>
</USelectMenu>
</div>
<div
class="me-2 align-items-center d-none d-lg-block"
v-if="searchListActiveSchemaGetter"
>
<label class="multiselect-lable ms-1" for="">سطح سوم:</label>
<USelectMenu
:popper="{ placement: 'left-end' }"
searchable
searchable-placeholder="Search a person..."
v-model:query="fieldThreeQuery"
v-if="searchListActiveSchemaGetter?.info?.items?.length"
option-attribute="title"
placeholder="انتخاب کنید"
v-model="fieldThree"
:options="searchListActiveSchemaGetter?.info?.items"
@update:model-value="onComboChanged()"
>
</USelectMenu>
</div>
</div>
<!-- #endregion show only in custom tab -->
</div>
</div>
<div class="row">
<div class="col-md-4 col-lg-3 pe-0">
<div class="pages-content" ref="navigationFilter">
<search-navigation-filter
v-if="searchListActiveTabGetter?.key == 'custome'"
:fieldThree="fieldThree"
:fieldTwo="fieldTwo"
:fieldOne="fieldOne"
:fields="fields"
:key="componentCounter"
:class="{ 'show-list-panel': showListPanel }"
@can-view="canView = $event"
ref="panel"
@statusPag="statusPag2"
@isShowPag="isShowPag"
@list-changed="setList"
@update-meta="metaItems = $event"
@list-item-changed="setListItem"
@hide-panel="showToggleListPanel"
></search-navigation-filter>
<div v-else>
<category-list
v-if="dataCatched"
ref="categorylist"
:activeTab="searchListActiveTabGetter"
:selectedNavigation="searchListActiveSchemaGetter"
:lastSearchInListMode="lastSearchInListMode"
:treeLists="treeLists"
@filterUpdate="filterUpdate"
@list-changed="listChanged"
@set-selected-list="updateTitle"
@show-category="showCategory"
:key="componentCounter"
></category-list>
</div>
</div>
</div>
<div class="col-md-8 col-lg-9">
<div class="tabel-main">
<div class="tab-content py-2 px-3" id="myTabContent">
<div class="container-fluid">
<div class="row">
<div class="col-12 col-md-6 d-flex align-items-center">
<!-- <div class="navigation-filter dropdown-hamburger">
<button
class="btn"
@click.prevent="openNavigationFilter(2)"
style="z-index: 9"
>
<svg class="icon icon-Component-158--5">
<use xlink:href="#icon-Component-158--5"></use>
</svg>
</button>
</div> -->
<div
class="d-flex w-100 overflow-hidden text-truncate"
v-if="selectionFilterItemsGetter?.length <= 0"
v-html="currentPathHtml"
></div>
<div
class="d-flex w-100"
style="height: 4em"
v-if="selectionFilterItemsGetter?.length"
>
<div
class="me-1 d-flex w-100 overflow-hidden flex-column"
>
<a
@click.prevent="emptyFilter()"
class="filters__delete text__12"
>حذف فیلترها
</a>
<search-filter
:filters="selectionFilterItemsGetter"
@remove-filter="delFilterItem"
class="filter-items"
></search-filter>
</div>
</div>
</div>
<div
class="col-12 col-md-6 d-flex align-items-center justify-content-end"
>
<sub-header
:enableNewButton="false"
:canCreate="'item_new'"
:title="tableTitle"
@view-mode-switched="switchViewMode"
@filterSelect="filterSelect"
class="sub-header"
:key="rerenderSubheader"
></sub-header>
<!-- v-if="listAggregations" -->
<button
class="btn"
@click.prevent="
openModalFilter('SearchFilterModal', '')
"
style="z-index: 9"
>
<svg class="icon icon-filter-list">
<use xlink:href="#icon-filter-list"></use>
</svg>
</button>
<div class="select-export-container mt-2">
<div class="dropdown">
<button
class="btn btn-outline-light border-0"
type="button"
data-bs-toggle="dropdown"
aria-expanded="false"
>
<span
class="tavasi tavasi-excel-file-2 ms-1"
></span>
</button>
<div class="dropdown-menu">
<button
class="dropdown-item"
type="button"
:disabled="fetchingDataForExport"
@click="exportJsonToExcel('current')"
value="current"
>
جاری
</button>
<button
class="dropdown-item"
type="button"
:disabled="fetchingDataForExport"
@click="exportJsonToExcel('all')"
value="all"
>
همه
</button>
</div>
</div>
</div>
<!-- <button
class="btn"
style="z-index: 9"
v-if="activeTab?.key == 'custome'"
@click.prevent="
selectedNavigationFilter = !selectedNavigationFilter
"
>
<svg class="icon icon-filter">
<use xlink:href="#icon-filter"></use>
</svg>
</button> -->
</div>
</div>
</div>
<div
class="tab-pane fade show active d-flex"
id="table"
role="tabpanel"
aria-labelledby="table-tab"
>
<template v-if="canView">
<!-- <my-table
:height="heightHandler('table')"
v-if="viewMode === 'table'"
:isDraggable="true"
:hasSearch="false"
:hasSubject="true"
:hasSummary="true"
:fetchingData="fetchingData"
:items="listItem"
:tableColumns="getTableColumns"
:tableActions="tableActions"
:paginationInfo="pagination"
:sortingInfo="sorting"
@update-order="updateOrder"
@show-details="showDetails"
@open-form="openForm"
@show-text="showTextPage"
@page-changed="pageChanged"
@page-limit-changed="pageLimitChanged"
@sort-changed="sortChanged"
@search="searchInTable"
@on-linked-title-click="onOnLinkedTitleClick"
:showHeaderSortButton="false"
class="my-table"
>
</my-table> -->
<!-- :height="heightHandler('list')" -->
<!-- :summeryKeys="['content', 'mindex', 'mintro']" -->
<template v-if="fetchingData">
<the-content-loading
:loadingTitle="'در حال دریافت اطلاعات'"
class="table-loading"
></the-content-loading>
</template>
<template v-else>
<MyContent
:key="reRender"
:pagination="pagination"
:viewMode="viewMode"
@changeCurrent="changeCurrent"
@changePage="changePaging"
:schemaItems="
searchListActiveSchemaGetter?.search_content
"
:items="listHits"
:tableColumns="
searchListActiveSchemaGetter?.table_columns
"
:tableActions="
tableColumnsHandler(searchListActiveTabGetter)
"
class="col-12"
>
</MyContent>
</template>
<!-- <component
v-if="dataCatched"
:showActions="false"
class="flex-grow-1"
:key="reRender"
:is="contentComponentName"
:summeryKeys="['title', 'subtitle', 'mintro']"
:courseKeys="['title', 'subtitle', 'mintro']"
:pagination="pagination"
:displayMode="'tangihlist'"
:viewMode="viewMode"
:key_data="searchListActiveSchemaGetter?.key"
:activeTabGetter="searchListActiveSchemaGetter"
:tableColumns="getTableColumns"
:listItem="listItem"
@changeCurrent="changeCurrent"
@changePage="changePaging"
ref="content"
></component> -->
<item-details
v-if="showDetailsPanel"
:key="formRerrenderer"
:selectedItem="rowItem"
@open-form="openForm"
@close-detail-panel="showDetailsPanel = false"
></item-details>
</template>
<no-data v-else>
<p class="text-center p-3">عدم دسترسی</p>
</no-data>
</div>
<!-- <template v-if="showModal">
<NewItemModal
@close-modal="closeModal"
@delete-item="updateList"
@update-list="updateList"
/>
</template> -->
<base-modal-v2
v-if="openSubjectForm"
modalSize="modal-lg"
:modalTitle="modalTitle"
:hasFooter="false"
@close="hideSubjectForm"
>
<SearchSubjectForm
v-if="slotComponentName == 'SearchSubjectForm'"
@update-list="updateList"
@selectedFilterUrl="selectedFilterUrl"
:listAggregations="listAggregations"
:filteKey="'source_key'"
:activeTabGetter="searchListActiveSchemaGetter"
></SearchSubjectForm>
<SearchFilterModal
v-if="slotComponentName == 'SearchFilterModal'"
@update-list="updateList"
@selectedFilterUrl="selectedFilterUrl"
:listAggregations="listAggregations"
:filteKey="'source_key'"
:activeTabGetter="searchListActiveSchemaGetter"
></SearchFilterModal>
</base-modal-v2>
</div>
</div>
</div>
</div>
</div>
</div>
</NuxtLayout>
</template>
<script>
import tableActions from "~/json/search/json/listTableContextMenu";
import { mapState, mapActions } from "pinia";
import searchApis from "~/apis/searchApi";
import sidbarMenuDefault from "~/json/search/json/menu.json";
import sidbarMenuMin from "~/json/search/json/sidbarMenuMin.json";
// import menu from "~/json/reports/menu.json";
import { useSearchStore } from "~/stores/searchStore";
import { useCommonStore } from "~/stores/commonStore";
import { useEntityStore } from "~/stores/entityStore";
import { useListStore } from "~/stores/listStore";
export default {
name: "searchNavigation",
setup() {
useHead({
title: import.meta.env.VITE_ENTITY_PAGE_TITLE,
meta: [{ name: "description", content: "My page description" }],
bodyAttrs: {
class: import.meta.env.VITE_SEARCH_PAGE_TITLE,
},
});
definePageMeta({
layout: false,
name: "searchNavigation",
});
},
watch: {
getPanelStatus(status) {
if (status) this.openForm();
else this.closeModal();
},
// $route: {
// handler: function () {
// this.sidebarCollapsedSetter(false);
// },
// deep: true,
// immediate: true,
// },
listIdGetter(newId) {
this.filterBy(this.selectedFilter);
},
// selectedListItem({ key, label }) {
// const selected = this.searchListSchemaGetter.find((i) => i.key == key);
// this.onSelectNavigation(selected);
// },
},
created() {
let schemaExist =
this.searchListActiveTabGetter && this.searchListSchemaGetter;
if (schemaExist) {
this.getComboList();
} else this.getSchemas();
},
beforeMount() {
if (buildName() == "monir" || window?.innerWidth < 575) {
this.viewMode = "list";
} else {
this.viewMode = "table";
}
},
// mixins: [filterItemMixin],
mounted() {
if (window.outerWidth < 992) {
this.$store.commit("TOGGLE_SIDEBAR_MENU");
}
this.pagination.limit = 25;
this.updatPathTitle();
this.selected = this.people[0];
this.selectedListItem = this.searchListActiveSchemaGetter;
},
updated() {
const itemActiveTabElement = this.$el.querySelector(".itemActiveTab");
if (itemActiveTabElement) {
itemActiveTabElement.removeEventListener(
"click",
this.onItemActiveTabClick
);
itemActiveTabElement.addEventListener("click", this.onItemActiveTabClick);
}
},
data() {
return {
selected: undefined,
people: [
{
id: "benjamincanac",
label: "benjamincanac",
href: "https://github.com/benjamincanac",
target: "_blank",
avatar: { src: "https://avatars.githubusercontent.com/u/739984?v=4" },
},
{
id: "Atinux",
label: "Atinux",
href: "https://github.com/Atinux",
target: "_blank",
avatar: { src: "https://avatars.githubusercontent.com/u/904724?v=4" },
},
{
id: "smarroufin",
label: "smarroufin",
href: "https://github.com/smarroufin",
target: "_blank",
avatar: {
src: "https://avatars.githubusercontent.com/u/7547335?v=4",
},
},
{
id: "nobody",
label: "Nobody",
icon: "i-heroicons-user-circle",
},
],
selectedListOptions: [
{
key: "sanad",
label: "منابع",
},
{
key: "qanon",
label: "qanon",
},
],
selectedListItem: undefined,
dataCatched: false, // showing components after data cached.
loading: false,
rerenderSubheader: 1,
tableActions: tableActions,
viewMode: "",
tableTitle: "",
currentPageName: "list",
listAggregations: undefined,
treeLists: "",
filterUrl: "",
url_GET_item: "",
filterLists: "",
statusPag: "",
state_list: 0,
listItem: [],
listHits: [],
navigationOptions: [],
fields: [],
fieldOne: null,
fieldTwo: null,
fieldThree: null,
fieldOneQuery: null,
fieldTwoQuery: null,
fieldThreeQuery: null,
activeTab: null,
activeListItem: undefined,
// selectedNavigationIndex: undefined,
// selectedNavigation: undefined,
listPanelSorting: undefined,
listPanelSorting: undefined,
lastSearchInListMode: true,
showfilterCategory: true,
fetchingDataForExport: false,
showListPanel: false,
// selectedNavigationFilter: false,
componentCounter: 1,
page: 0,
currentPathItem: "",
currentPathHtml: "",
schemaFilter: null,
tabIndex: 0,
reRender: 1,
// menu: menu,
// selectedFilter: "table",
// sidbarMenuDefault: sidbarMenuDefault,
// sidbarMenuMin: sidbarMenuMin,
// showModal: false,
formRerrenderer: 1,
sorting: {
sortby: "id",
sortorder: "asc", // asc | desc
},
componentName: "ItemList",
openSubjectForm: false,
metaItems: [],
subjectItemState: false,
subjectTitle: "",
canView: true,
currentPanelList: {},
tableTitle: "",
rowItem: undefined,
showDetailsPanel: false,
formRerrenderer: 1,
exportOffset: 0,
exportLimit: 500,
viewMode: "table",
selectedFilter: "table",
// menu: menu,
showModal: false,
listId: undefined,
listItem: [],
pagination: {
pages: 0,
total: 0,
page: 1,
offset: 0,
limit: 10,
},
fetchingData: false,
roles: [],
selectedItemClone: {
title: "",
id: undefined,
project_id: this.projectGetter?.id,
},
prevSelectedItemIndex: undefined,
showPanel: false,
projects: [],
list: [],
loading: false,
currentItem: {},
listChilds: [],
paragraphs: [],
breadcrumb: [],
selectedItem: {},
paperPropertyes: {},
prevActivePaperIndex: 0,
FILTER_BY_ENUM: {
1: "دفترهای من",
2: "اشتراکی",
3: "همه اسناد",
},
selectedFilterNumber: 3,
items: [],
editMode: false,
contextMenu: [],
newItemType: 0,
childs: [
{
title: "یادداشت",
users: {
name: "حسن",
avatar: "",
},
},
{
title: "2یادداشت",
},
],
SearchSubjectForm: "SearchFilterModal",
};
},
computed: {
...mapState(useCommonStore, [
"getPanelStatus",
"isSidebarCollapsed",
"getUserLastState",
"organNameGetter",
"schemasGetter",
"activeSchemaGetter",
]),
...mapState(useSearchStore, [
"searchListSchemaGetter",
"searchListActiveSchemaGetter",
"searchListActiveTabGetter",
"selectionFilterItemsGetter",
"searchListActiveTabGetter",
]),
...mapState(useListStore, [
"listComponentNameGetter",
"selectedProjectGetter",
"listIdGetter",
"selectedItemGetter",
"listGetter",
]),
myKey() {
// if (this.key_data) return this.key_data;
return this.searchListActiveSchemaGetter?.key;
},
navTabs() {
if (!isMajlesBuild()) return this.searchListActiveSchemaGetter?.items;
if (this.searchListActiveSchemaGetter?.items) {
let res = this.searchListActiveSchemaGetter?.items.filter((item) => {
if (item.key == "dotic" || item.key == "organ") return false;
return true;
});
return res;
} else return [];
},
schemasItem(item, index) {
this.modetab = index;
let full_path = this.$route.fullPath;
let newRoutePath = full_path;
let prevKey = this.$route.query.key;
if (prevKey)
newRoutePath = full_path.replace(`key=${prevKey}`, `key=${item.key}`);
else newRoutePath = full_path + `?key=${item.key}`;
this.$set(this.$route.query, "key", item.key);
history.pushState({}, document.title, newRoutePath);
this.searchActiveTabSetter(item);
this.searchStart(this.textSearch);
// this.$emit("searchStart", this.$refs.searchline?.textSearch);
},
contentComponentName() {
if (this.searchListActiveSchemaGetter?.searchContent)
return this.searchListActiveSchemaGetter.searchContent;
return "SearchContent";
},
getTableColumns() {
if (this.searchListActiveTabGetter?.table_columns)
return this.searchListActiveTabGetter.table_columns;
if (this.searchListActiveSchemaGetter?.table_columns)
return this.searchListActiveSchemaGetter.table_columns;
return this.selectedProjectGetter?.table_columns;
},
sidbarMenu() {
if (isMajlesBuild()) return sidbarMenuMin;
else return sidbarMenuDefault;
},
},
methods: {
...mapActions(useCommonStore, [
"schemasSetter",
"activeSchemaSetter",
"TOGGLE_PANEL",
"checkPermissions",
"storeState",
"getState",
]),
...mapActions(useSearchStore, [
"searchListActiveSchemaSetter",
"searchListSchemaSetter",
"searchListActiveTabSetter",
"selectionFilterItemsSetter",
]),
...mapActions(useListStore, [
"SET_LIST_COMPONENT_NAME",
"SET_SELECTED_ITEM",
"SET_SELECTED_PROJECT",
"SET_LIST_ID",
"SET_LIST",
"SET_LIST_ID",
"SET_SELECTED_PROJECT",
]),
...mapActions(useEntityStore, ["SET_ITEM_ENTITY", "SET_LIST_ENTITY"]),
tableColumnsHandler(activeTab) {
if (activeTab?.actions) return activeTab?.actions;
else return this.searchListActiveSchemaGetter?.actions;
},
getDetailUrl(item) {
let key = "";
key = this.myKey;
if (!key) key = "qasection"; // برای شرایطی که بصورت مدال استفاده می شود گتر بالا پر نیست
let id = item._id;
let hash = "";
if (this.$route.name == "qrule") {
hash = "#qmodel";
key = "qsection";
id = item._source?.ref_id ? item._source.ref_id : id;
}
if (key == "qasection") {
key = "qsection";
}
let name = "detail";
const routeData = this.$router.resolve({
name: name,
params: {
id: id,
key: key,
},
hash: hash,
query: {},
});
return routeData.href;
},
showTextPage(index) {
const item = this.listHits[index];
window.open(this.getDetailUrl(item), "_blank");
},
onOnLinkedTitleClick({ rowItem, tableColumn, index }) {
const item = this.listHits[index];
if (tableColumn.key == "qanon_title")
this.showtext(item._source, this.listHits, index, item);
else window.open(this.getDetailUrl(item), "_blank");
},
/**
* باز کردن یک تب جدید با جزئیات مورد انتخاب شده.
* @param {Object} item - مورد انتخاب شده.
* @param {Array} listAnswer - لیست پاسخ‌ها.
* @param {Number} i - اندیس مورد.
* @param {Object} t - شیء نماینده مورد.
*/
showtext(_source, listAnswer, index, rowItem) {
let cloneList = listAnswer;
cloneList.forEach((item, index) => {
cloneList[index] = { ...item, ..._source };
});
let qanon_id = _source.qanon_id;
let cloneItem = rowItem;
cloneItem = { ...rowItem, _id: qanon_id };
this.SET_ITEM_ENTITY(cloneItem);
this.SET_LIST_ENTITY(cloneList);
localStorage.setItem("myList", JSON.stringify(cloneList));
localStorage.setItem("myItem", JSON.stringify(cloneItem));
window.open(this.urlResolver(qanon_id), "_blank");
},
/**
* حل تارنمای مربوط به نمایش یک مورد خاص.
* @param {String} _id - شناسه مورد.
* @param {String} [key=""] - کلید مورد.
* @returns {String} آدرس تارنما برای نمایش.
*/
urlResolver(_parent, key = "") {
if (key == "") key = this.myKey;
if (!key) key = "qasection"; // برای شرایطی که بصورت مدال استفاده می شود گتر بالا پر نیست
let path = "/search/lists";
if (key == "qsection") path = "detail";
const routeData = this.$router.resolve({
path: path,
params: {
id: _parent,
key: key,
},
query: {},
});
return routeData.href;
},
changeCurrent: function (item) {
// this.showSummary = false;
// this.$nextTick(() => {
// this.showSummary = true;
// });
// this.currentItem = item;
// if (this.$refs.summary) this.$refs.summary.setInfo(item);
},
changePaging: function (item) {
this.pagination = item;
this.getListItemByFilter();
},
hideSubjectForm() {
this.selectedItem = {};
this.openSubjectForm = false;
},
showSubjectForm({ rowItem }) {
this.selectedItem = rowItem;
this.SET_SELECTED_ITEM(rowItem);
this.slotComponentName = "SearchSubjectForm";
this.openSubjectForm = true;
this.modalTitle = "افزودن موضوع";
},
openModalFilter(componentName, title) {
this.slotComponentName = componentName;
this.openSubjectForm = true;
this.modalTitle = title;
},
async getCustumListItem() {
if (this.fetchingData) return;
this.fetchingData = true;
let url = "";
if (this.subjectItemState)
url = searchApis.navigation.reportSubjectItem.replace(
"{{subject_title}}",
this.subjectTitle
);
else url = searchApis.navigation.reportItem;
url += `/${this.searchListActiveSchemaGetter.key}`;
url += `/${this.sorting.sortby}/${this.sorting.sortorder}`;
url += `/${this.pagination.offset}/${this.pagination.limit}/`;
if (this.listGetter && this.listGetter.length) {
if (this.listGetter.length <= this.fields.length) {
for (let i = 0; i < this.listGetter.length; i++) {
url += `${this.fields[i].name}=${this.listGetter[i].key}`;
if (i != this.listGetter.length - 1) url += "&";
}
}
}
if (this.filterLists !== "") {
url = url + this.filterLists;
}
try {
const { $api } = useNuxtApp();
const response = await $api(searchApis.schema.list, {
method: "POST",
baseURL: repoUrl(),
body: {
organ: this.organNameGetter,
system: "search",
build_state: buildState(),
},
});
this.listItem = [];
this.listAggregations = response.aggregations;
this.listHits = response.hits.hits;
this.listHits.forEach((element) => {
this.listItem.push(element._source);
});
this.initNormalRespone(this.listHits, response.hits.total.value);
const total = response.hits.total.value;
const pages = Math.ceil(total / this.pagination.limit);
const pagination = {
total: total,
pages: pages == 0 ? 1 : pages,
};
this.pagination = { ...this.pagination, ...pagination };
} catch (err) {
this.fetchingData = false;
}
},
updatPathTitle(item = "--") {
let path = "";
let itemDtataRepository = this.searchListActiveSchemaGetter?.label;
let itemActiveTab = this.searchListActiveTabGetter?.label;
// path = `${itemDtataRepository}/${itemActiveTab}/${item}`;
path = `<span class=" ms-2 me-1 " style="color: #00b6e3;">${itemDtataRepository}</span>/<span class="text-primary ms-2 me-1 itemActiveTab" style="color: #00b6e3; cursor:pointer">${itemActiveTab}</span>/ <span class=" ms-2 me-1" >${item}</span>`;
// اضافه کردن ریشه به مسیر نهایی
this.currentPathHtml = path;
this.currentPathItem = `${itemDtataRepository}_${itemActiveTab}_${item}`;
},
onItemActiveTabClick() {
this.openNavigationFilter(2);
},
emptyFilter() {
this.selectionFilterItemsSetter([]);
},
delFilterItem(item) {
var filterItems = this.selectionFilterItemsGetter;
var index = this.selectionFilterItemsGetter?.indexOf(item);
var filterSelect = [];
if (index != -1) {
// this.filterSelect.splice(index, 1);
filterItems.splice(index, 1);
} else
filterItems.forEach((element) => {
filterSelect.push(element.id);
});
// this.$emit("filterSelect", filterSelect);
this.selectionFilterItemsSetter(filterItems);
},
showCategory() {
this.$refs.navigationFilter?.classList.add("d-none");
},
filterSelect(itemSelect) {
itemSelect.sort(function (x, y) {
return y - x;
});
var filter = "";
var prevType = "";
itemSelect.forEach((item) => {
var items = item.split("#");
if (prevType == items[0]) {
filter += "$" + items[1];
} else {
filter += "&" + items[0] + "=" + items[1];
}
prevType = items[0];
});
this.filterLists = filter;
this.getListItemByFilter();
},
selectedFilterUrl(url) {
this.filterLists = url;
this.getListItemByFilter();
},
heightHandler(item) {
if (item == "table") {
if (this.searchListActiveTabGetter?.key == "custome") {
return "calc(100vh - 15em)";
} else {
return "calc(100vh - 12em)";
}
} else {
if (this.searchListActiveTabGetter?.key == "custome") {
return "calc(100vh - 17em)";
} else {
return "calc(100vh - 14em)";
}
}
},
updateTitle(list) {
this.tableTitle = list.title;
},
updateCategoryList(navItem, index) {
this.fetchingData = false;
this.searchListActiveTabSetter(navItem);
// this.activeTab = navItem;
this.tabIndex = index;
this.updatPathTitle();
this.selectionFilterItemsSetter([]);
this.listItem = [];
this.listAggregations = {};
this.listHits = [];
this.switchViewMode(this.viewMode);
this.componentCounter++;
this.rerenderSubheader++;
},
listChanged(tags = []) {
let res = [];
tags.split(",").forEach((e) => {
let i = e.lastIndexOf("_");
if (i != -1) {
res.push(e.substring(0, i));
}
});
this.setFilterNavigate(res);
},
setFilterNavigate(value = []) {
this.filterNavigate = value;
},
filterUpdate(object) {
this.filterUrl = object.filter;
this.url_GET_item = object.url;
this.state_list = object.state_list;
this.page = 0;
this.updatPathTitle(object.title);
this.getListItemByFilter();
// if (this.searchingState) this.getQuery(false, true);
// else this.getDefaultByFilter();
},
getListItemByFilter(sortby = "sort_date_timestamp", sortorder = "desc") {
if (this.searchListActiveTabGetter?.key == "custome") {
this.getCustumListItem();
} else {
if (this.state_list == 1) this.getListByFilter1(sortby, sortorder);
else this.getListByFilter2(sortby, sortorder);
}
},
async getListByFilter1(sortby = "sort_date_timestamp", sortorder = "desc") {
// let url = "{{buildName}}/data/{{index_key}}/{{field_collapsed}}/{{offset}}/{{limit}}/{{sortby}}/{{sortorder}}/{{filterUrl}}";
let url = this.url_GET_item;
url = url.replace("{{buildName}}", buildName());
url = url.replace(
"{{index_key}}",
this.searchListActiveSchemaGetter?.key
);
url = url.replace("{{offset}}", this.pagination?.offset);
url = url.replace("{{limit}}", this.pagination?.limit);
url = url.replace("{{sortby}}", sortby);
url = url.replace("{{sortorder}}", sortorder);
url = url.replace(
"{{field_collapsed}}",
this.searchListActiveTabGetter?.field_collapsed ?? "normal"
);
url = url.replace("{{filter}}", this.filterUrl);
if (this.filterLists !== "") {
url = url + this.filterLists;
}
try {
const { $api } = useNuxtApp();
const response = await $api(url, {
baseURL: repoUrl(),
});
this.listItem = [];
this.listAggregations = response.aggregations;
this.listHits = response.hits.hits;
this.listHits.forEach((element, index) => {
this.listItem[index] = { ...element, ...element._source };
});
// if (this.viewMode != "table") {
this.initNormalRespone(this.listHits, response.hits.total.value);
// }
const total = response.hits.total.value;
const pages = Math.ceil(total / this.pagination.limit);
const pagination = {
total: total,
pages: pages == 0 ? 1 : pages,
};
this.pagination = { ...this.pagination, ...pagination };
this.reRender++;
} catch (err) {
this.fetchingData = false;
}
},
async getListByFilter2(sortby = "sort_date_timestamp", sortorder = "desc") {
// let url = 'navigate/report/items/{{index_key}}/{{sortby}}/{{sortorder}}/{{offset}}/{{limit}}/{{filter}}';
let url = this.url_GET_item;
url = url.replace(
"{{index_key}}",
this.searchListActiveSchemaGetter?.key
);
url = url.replace("{{offset}}", this.pagination?.offset);
url = url.replace("{{limit}}", this.pagination?.limit);
url = url.replace("{{sortby}}", sortby);
url = url.replace("{{sortorder}}", sortorder);
// url = url.replace("{{field_collapsed}}", this.activeTab?.field_collapsed);
url = url.replace("{{filter}}", this.filterUrl);
if (this.filterLists !== "") {
url = url + this.filterLists;
}
try {
const { $api } = useNuxtApp();
const response = await $api(searchApis.schema.list, {
method: "POST",
baseURL: repoUrl(),
body: {
organ: this.organNameGetter,
system: "search",
build_state: buildState(),
},
});
this.listItem = [];
this.listAggregations = response.aggregations;
this.listHits = response.hits.hits;
this.listHits.forEach((element) => {
this.listItem.push(element._source);
});
// if (this.viewMode != "table") {
this.initNormalRespone(this.listHits, response.hits.total.value);
// }
const total = response.hits.total.value;
const pages = Math.ceil(total / this.pagination.limit);
const pagination = {
total: total,
pages: pages == 0 ? 1 : pages,
};
this.pagination = { ...this.pagination, ...pagination };
this.reRender++;
} catch (err) {
this.fetchingData = false;
}
},
initNormalRespone(list, total, pageOnly = false, filteronly = false) {
if (pageOnly) {
this.$refs.content?.setAnswer(list, total);
} else if (filteronly) {
this.$refs.content?.setAnswer(list, total);
} else {
this.$refs.content?.setAnswer(list, total);
}
},
async getSchemas() {
try {
const { $api } = useNuxtApp();
const response = await $api(searchApis.schema.list, {
method: "POST",
baseURL: repoUrl(),
body: {
organ: this.organNameGetter,
system: "navigateList",
build_state: buildState(),
},
});
this.searchListSchemaSetter(response.data.navigateList);
this.searchListActiveSchemaSetter(response.data.navigateList[0]);
this.searchListActiveTabSetter(response.data.navigateList[0].items[0]);
this.getComboList();
} catch (err) {}
},
//mehdi
AddToFolder(text) {
if (this.selectedProjectGetter.lists.length) {
if (text == "positionOne") {
let myString = this.selectedProjectGetter.lists[0].items;
let myArray1 = myString.split(",");
let myArray2 = this.selectedProjectGetter.items;
let myArray3 = [];
for (let i = 0; i < myArray1.length; i++) {
for (let j = 0; j < myArray2.length; j++) {
if (myArray1[i] === myArray2[j].name) {
myArray3.push(myArray2[j]);
break;
}
}
}
this.fieldOne = myArray3[0];
this.fieldTwo = myArray3[1];
this.fieldThree = myArray3[2];
setTimeout(() => {
this.onComboChanged();
this.componentCounter++;
}, 300);
} else if (text == "positionTow") {
let myString = this.selectedProjectGetter.lists[1].items;
let myArray1 = myString.split(",");
let myArray2 = this.selectedProjectGetter.items;
let myArray3 = [];
for (let i = 0; i < myArray1.length; i++) {
for (let j = 0; j < myArray2.length; j++) {
if (myArray1[i] === myArray2[j].name) {
myArray3.push(myArray2[j]);
break;
}
}
}
this.fieldOne = myArray3[0];
this.fieldTwo = myArray3[1];
this.fieldThree = myArray3[2];
setTimeout(() => {
this.onComboChanged();
this.componentCounter++;
}, 300);
} else {
let myString = this.selectedProjectGetter.lists[2].items;
let myArray1 = myString.split(",");
let myArray2 = this.selectedProjectGetter.items;
let myArray3 = [];
for (let i = 0; i < myArray1.length; i++) {
for (let j = 0; j < myArray2.length; j++) {
if (myArray1[i] === myArray2[j].name) {
myArray3.push(myArray2[j]);
break;
}
}
}
this.fieldOne = myArray3[0];
this.fieldTwo = myArray3[1];
this.fieldThree = myArray3[2];
setTimeout(() => {
this.onComboChanged();
this.componentCounter++;
}, 300);
}
}
},
openNavigationFilter(item) {
// debugger
// if (item == 1) {
// this.$refs.pags.classList.add("position1");
// this.$refs.pags.classList.remove("position2");
// } else {
// this.$refs.pags.classList.add("position2");
// this.$refs.pags.classList.remove("position1");
// }
this.$refs.navigationFilter?.classList.remove("d-none");
},
statusPag2($event) {
this.statusPag = $event;
switch (this.statusPag) {
case (this.statusPag = 2):
this.$refs.pags?.classList.add("position1");
this.$refs.pags?.classList.remove("position2");
break;
case (this.statusPag = 1):
this.$refs.pags?.classList.add("position2");
this.$refs.pags?.classList.remove("position1");
break;
}
},
isShowPag(event) {
this.$refs.navigationFilter?.classList.add("d-none");
},
//mehdi
exportJsonToExcel(evt) {
let title = " ";
if (evt === "current") {
title = new Date().toJSON().slice(0, 10);
if (this.currentPathItem) title = this.currentPathItem;
convertJsonToExcelUsingPlugin(
this.filterColumns(this.listItem, this.getTableColumns),
title
).finally(() => {
this.fetchingDataForExport = false;
});
} else if (evt === "all") {
//دسترسی را چک کند
let file_counter = 1;
// let offset = 0;
// while (offset < this.pagination.total) {
// let limit = 500;
// درخواست
this.getAllListItemForExport(this.exportOffset, this.exportLimit)
.then((response) => {
let file_name = new Date().toJSON().slice(0, 10) + file_counter;
file_counter++;
if (this.currentPathItem) title = this.currentPathItem;
convertJsonToExcelUsingPlugin(
this.filterColumns(response?.hits.hits, this.getTableColumns),
file_name
)
.then(() => {
this.exportOffset += this.exportLimit;
if (
this.exportOffset + this.exportLimit >
this.pagination.total
)
this.exportLimit = this.pagination.total - this.exportOffset;
if (this.exportOffset < this.pagination.total)
this.exportJsonToExcel(evt);
})
.finally(() => {
this.fetchingDataForExport = false;
});
})
.finally(() => {
this.fetchingDataForExport = false;
});
}
// }
},
filterColumns(listItem = [], columns = []) {
let clonedItems = listItem;
let clonedColumns = columns;
let filteredItems = [];
clonedItems.forEach((item, index) => {
let filterObject = {};
clonedColumns.forEach((j) => {
filterObject[j.title] = item._source[j.key];
});
filteredItems[index] = filterObject;
});
return filteredItems;
},
async getAllListItemForExport(offset = 0, limit = 500) {
if (this.fetchingDataForExport) return;
this.fetchingDataForExport = true;
let url =
searchApis.navigation.reportItem +
`/${this.searchListActiveSchemaGetter?.info?.index_name}`;
url += `/${this.sorting.sortby}/${this.sorting.sortorder}`;
url += `/${offset}/${limit}/&`;
if (this.listGetter && this.listGetter.length) {
if (this.listGetter.length <= this.fields.length) {
for (let i = 0; i < this.listGetter.length; i++) {
url += `${this.fields[i].name}=${this.listGetter[i].key}`;
if (i != this.listGetter.length - 1) url += "&";
}
}
}
try {
const { $api } = useNuxtApp();
return await $api(url, {
baseURL: repoUrl(),
body: {
organ: this.organNameGetter,
system: "search",
build_state: buildState(),
},
});
} catch (err) {}
},
async updateOrder({ rowItem, newOrder }) {
const res = rowItem.subject.filter(
(item) => item.title == this.listGetter[this.listGetter.length - 1].key
);
const payload = {
id: rowItem.id_store,
subject_id: res[0].id,
subject_title: res[0].title,
subject_order: +newOrder,
};
const url = searchApis.subject.order;
try {
const { $api } = useNuxtApp();
const response = await $api(url, {
method: "POST",
baseURL: repoUrl(),
body: payload,
});
this.mySwalToast({
title: response.message,
html: "",
});
} catch (err) {}
},
async getComboList() {
if (this.fetchingData) return;
this.fetchingData = true;
let url = searchApis.navigation.list;
url = url.replace("@entity", this.searchListActiveSchemaGetter?.key);
try {
const { $api } = useNuxtApp();
const response = await $api(url, {
baseURL: repoUrl(),
});
// this.navigationOptions = response.data;
// this.navigationOptions[0].meta = JSON.parse(
// this.navigationOptions[0].meta
// );
// this.navigationOptions[0].table_columns = JSON.parse(
// this.navigationOptions[0].table_columns
// );
// this.navigationOptions[0].table_columns_subject = JSON.parse(
// this.navigationOptions[0].table_columns_subject
// );
// this.SET_SELECTED_PROJECT(this.navigationOptions[0]);
this.dataCatched = true;
this.fetchingData = false;
} catch (err) {
this.fetchingData = false;
}
},
onSelectNavigation(evt = null) {
if (evt) {
// this.searchListSchemaSetter();
this.searchListActiveSchemaSetter(evt);
this.searchListActiveTabSetter(evt);
this.updatPathTitle();
// this.fieldOne = null;
// this.fieldTwo = null;
// this.fieldThree = null;
// this.SET_LIST([]);
// this.listItem = [];
// this.fields = [];
// this.componentCounter++;
// if (typeof evt?.meta == "string") {
// try {
// evt.meta = JSON.parse(evt.meta);
// evt.table_columns = JSON.parse(evt.table_columns);
// evt.table_columns_subject = JSON.parse(evt.table_columns_subject);
// } catch (e) {}
// }
// this.selectedNavigation = evt;
// this.SET_SELECTED_PROJECT(this.selectedNavigation);
// this.updatPathTitle();
}
},
onComboChanged() {
this.SET_LIST([]);
this.listItem = [];
const vm = this;
setTimeout(() => {
if (vm.fieldOne || vm.fieldTwo || vm.fieldThree)
vm.fields = [vm.fieldOne, vm.fieldTwo, vm.fieldThree].filter(
(item) => item != null
);
vm.componentCounter++;
}, 300);
},
toggleSidebarMenu() {
this.$store.commit("TOGGLE_SIDEBAR_MENU");
},
showToggleListPanel() {
this.showListPanel = !this.showListPanel;
},
searchInTable() {},
async getListItem() {
if (this.fetchingData) return;
this.fetchingData = true;
let url = "";
if (this.subjectItemState)
url = searchApis.navigation.reportSubjectItem.replace(
"{{subject_title}}",
this.subjectTitle
);
else url = searchApis.navigation.reportItem;
url += `/${this.searchListActiveSchemaGetter.key}`;
url += `/${this.sorting.sortby}/${this.sorting.sortorder}`;
url += `/${this.pagination.offset}/${this.pagination.limit}/`;
if (this.listGetter && this.listGetter.length) {
if (this.listGetter.length <= this.fields.length) {
for (let i = 0; i < this.listGetter.length; i++) {
url += `${this.fields[i].name}=${this.listGetter[i].key}`;
if (i != this.listGetter.length - 1) url += "&";
}
}
}
try {
const { $api } = useNuxtApp();
const response = await $api(url, {
baseURL: repoUrl(),
});
let list = response.hits.hits;
list.forEach((element, index) => {
list[index] = { ...element, ...element._source };
});
this.listItem = list;
this.listHits = list;
this.listAggregations = response.aggregations ?? {};
const total = response.hits.total.value;
const pages = Math.ceil(total / this.pagination.limit);
const pagination = {
total: total,
pages: pages == 0 ? 1 : pages,
};
this.pagination = { ...this.pagination, ...pagination };
this.fetchingData = false;
} catch (err) {
this.fetchingData = false;
}
},
setList() {
// this.listId = listId;
},
setListItem(meta) {
// this.listId = listId;
let cc = this.getTableColumns;
this.meta = meta;
this.resetPagination();
this.checkPermisionBeforGetList();
// this.getListItem();
},
switchViewMode(mode) {
this.viewMode = mode;
if (this.viewMode != "table") {
setTimeout(() => {
this.initNormalRespone(this.listHits, this.pagination.total);
}, 300);
}
},
showTextPage(index) {
let pageTitle = this.listItem[index].title ?? "بدون عنوان";
pageTitle = pageTitle.replaceAll(" ", "-");
const routeData = this.$router.resolve({
name: "navigation",
params: {
id: this.listItem[index].id ?? this.listItem[index].id_store,
key: this.searchListActiveSchemaGetter.key,
},
query: {
searchtext: this.pageTitle ?? undefined,
},
});
window.open(routeData.href, "_blank");
},
resetPagination() {
this.pagination = {
pages: 0,
total: 0,
page: 1,
offset: 0,
limit: 10,
};
},
pageChanged(paging) {
let page = paging.pageNumber;
page -= 1;
this.pagination.offset = page * paging.limit;
this.pagination.limit = paging.limit;
this.pagination.page = paging.pageNumber;
this.getListItemByFilter();
},
pageLimitChanged(paging) {
this.resetPagination();
this.pagination.limit = paging.limit;
this.getListItemByFilter();
},
sortChanged(sorting) {
// keep limit status.
// reset page and offset values.
this.fetchingData = false;
this.pagination.page = this.pagination.offset = 0;
this.sorting = sorting;
this.getListItemByFilter(this.sorting.sortby, this.sorting.sortorder);
},
checkPermisionBeforGetList() {
// this.checkPermissions({ permission: "item_view", _this: this })
// .then(() => {
this.getListItem();
// })
// .catch(() => { });
},
showDetails(item) {
const { show, rowItem } = item;
this.SET_SELECTED_ITEM(rowItem);
this.rowItem = rowItem;
this.showDetailsPanel = true;
this.formRerrenderer++;
},
updateList() {
this.closeModal();
this.getListItem();
},
openForm(data = undefined) {
this.selectedItem = data;
this.SET_SELECTED_ITEM(data);
this.openModal();
},
closeModal() {
$("#meta-item-modal").modal("hide");
// this.TOGGLE_PANEL(false);
setTimeout(() => {
this.showModal = false;
}, 500);
},
openModal() {
this.showModal = true;
setTimeout(() => {
$("#meta-item-modal").modal(
{ backdrop: "static", keyboard: false },
"show"
);
}, 500);
},
},
};
</script>
<style lang="scss">
.custom-filter-container {
@media screen and (min-width: 575px) {
background-color: rgba(0, 0, 0, 0.05);
}
.multiselect {
// width: 12em;
// border: 2px solid rgb(127, 170, 170) !important;
border-radius: 0.5em;
// .multiselect__content-wrapper {
// width: 12em;
// }
@media screen and (max-width: 575px) {
.multiselect__tags {
font-size: 0.8rem;
}
}
}
}
</style>
<style lang="scss" scoped>
.multiselect {
width: 12em;
white-space: nowrap;
}
.table-container {
padding: 0em;
}
.float-labels {
margin-bottom: 0 !important;
}
.main-page__content-header {
background: linear-gradient(to top, #fcfcfc 0%, #eee 90%);
padding-top: 1em;
}
.multiselect-lable {
white-space: nowrap;
}
</style>