search_ui/components/search/view/SearchContent.vue
2025-02-01 14:36:10 +03:30

1119 lines
35 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>
<div class="search-content">
<div class="" v-if="viewMode == 'list'">
<div v-if="listAnswer?.length">
<div class="search-items firefox-scrollbar">
<div
class="search-items__item"
v-for="(item, i) in listAnswer"
:key="i"
>
<div v-if="item.inner_hits?.by_collapse">
<div class="ifffffffffffff search-items__meta flex-column">
<div class="mb-3">
<a
@click.prevent="showMultiText(item._id, 'branch')"
@auxclick.prevent.stop="
showMultiText(item._id, 'branch')
"
class="text__15 text__dark ms-1"
>دوره : {{ item._source.branch ?? "--" }}</a
>
<span class="text__15 text__dark-blue ms-1"
>/ {{ item._source.author }}
</span>
<span class="text__15 text__dark-blue ms-1"
>/ کد دوره:
{{
item._source.research_code.length
? item._source.research_code
: "--"
}}
</span>
</div>
<div class="search-items__header">
<span class="search-items__label text__13 text__dark-gray">{{
item._source.format
}}</span>
<span v-if="item._source.title || item._source.subtitle">
{{ item._source.title ?? subtitle }}
</span>
<span v-else>&nbsp;--</span>
<span v-if="item._source.subject.length" class="text__15">
&nbsp;/موضوع:&nbsp;
<div v-for="(sub, key) in item._source.subject">
{{ key == 0 ? "" : ", " }}
{{ sub.title }}
</div>
</span>
<span class="text__15" v-else>
&nbsp;/&nbsp;واژگان کلیدی:
{{
item._source.keywords.length
? item._source.keywords
: "--"
}}
</span>
<span>
&nbsp;/&nbsp;تاریخ:
{{ shamsiDate(item._source.begin_date) }}
</span>
<!-- <a v-else class="text__15 "> -->
<!-- {{ item._source.subtitle }} -->
<!-- </a> -->
</div>
</div>
<div
v-html="getInnerItems(item)"
class="search-items__detail text__15 line-clamp__2"
></div>
</div>
<div v-else>
<div class="elseeeeeeeee search-items__header">
<a class="search-items__label text__13 text__dark-gray">{{
item._source.format
}}</a>
<a
class="search-items__title text__15 text__blue"
:href="`navigation/list/${activeTabGetter?.key}/${
item._id
}/searchtext=${textSearch ?? undefined}`"
@click.prevent="
showtext(item._source, listAnswer, i, item._id)
"
@auxclick.prevent.stop="
showtext(item._source, listAnswer, i, item._id)
"
v-html="highlightKey(item, 'title', 'subtitle')"
>
</a>
<!-- <span v-if="item._source.subject.length" class="text__15">
موضوع:
<div v-for="(sub, key) in item._source.subject">
{{ key == 0 ? "" : ", " }}
{{ sub.title }}
</div>
</span>
<span v-else-if="item._source.keywords.length" class="text__15">
واژگان کلیدی:
{{ item._source.keywords }}
</span> -->
</div>
<div
class="text__15 text__dark-gray search-items__code"
>
<span style="margin-left: 10px"
>کد داخلی :
{{
item._source.meet_lid && item._source.meet_lid.trim() !== ""
? item._source.meet_lid
: "--"
}}</span
>
<span style="margin-left: 10px"
>کد جلسه :
{{
item._source.meet_code &&
item._source.meet_code.trim() !== ""
? item._source.meet_code
: "--"
}}
</span>
<span style="margin-left: 10px"
>کد دوره :
{{
item._source.research_code &&
item._source.research_code.trim() !== ""
? item._source.research_code
: "--"
}}
</span>
<span style="margin-left: 10px"
>کد پورتال : {{ item._source.id ?? "--" }}
</span>
<span
style="margin-left: 10px"
v-if="
!item?.highlight && selectedlists?.list_key == 'lasttitle'
"
>تاریخ : {{ datefa(item._source.begin_date) }}</span
>
</div>
<div class="search-items__content">
<div class="search-items__meta">
<a
@click.prevent="showMultiText(item._id, 'branch')"
@auxclick.prevent.stop="
showMultiText(item._id, 'branch')
"
class="text__15 text__dark ms-1"
>دوره :
<span v-html="highlightKey(item, 'branch')"></span> ،</a
>
<span class="text__15 text__dark-blue ms-1"
>{{ item._source.author }}
</span>
</div>
<div
v-html="highlightText(item)"
class="search-items__detail text__15 line-clamp__2"
></div>
<div v-if="item._source.keywords" class="search-items__meta">
<span class="text__15 ms-1">واژه‌گان :</span>
<span class="text__15 text__dark-gray search-items__code">{{
item._source.keywords
}}</span>
</div>
<div class="text__15 text__dark-gray search-items__code">
<span v-if="item._source.films" style="margin-left: 10px"
>فیلم : {{ item._source.films }}</span
>
<span v-if="item._source.voices" style="margin-left: 10px"
>صوت : {{ item._source.voices }}</span
>
<span v-if="item._source.photos" style="margin-left: 10px"
>تصاویر : {{ item._source.photos }}</span
>
</div>
<div
v-if="countAudio(item) || item._source?.subject?.length"
class="search-items__meta"
>
<span
v-if="item._source?.subject?.length"
class="text__15 ms-1"
>موضوع :
<span
v-for="(subj, j) in item._source.subject"
:key="j"
class="text__15 text__dark-gray"
style="margin-left: 10px"
>{{ subj.title }}</span
>
</span>
</div>
</div>
<!-- <div v-if="showActionMenu" class="search-item__actions"> -->
<div class="search-item__actions" v-if="showActions">
<span class="tavasi tavasi-more-vert"></span>
<button
v-can="'favorite_create'"
@click.pevent="AddToFavorites(item, i)"
title="علاقه مندی ها"
class="btn show-detail-btn favorites"
type="button"
>
<svg
class="icon"
:class="
item._source.tbookmark == 1
? 'icon-bookmark-1'
: 'icon-bookmark-2'
"
>
<use
:xlink:href="
item._source.tbookmark == 1
? '#icon-bookmark-1'
: '#icon-bookmark-2'
"
></use>
</svg>
</button>
<!-- <button
v-can="'search_analyze'"
@click="showDetails(item)"
title="نمایش جزییات"
class="btn show-detail-btn"
type="button"
>
<span class="tavasi tavasi-eye"></span>
</button> -->
<button
v-can="'search_summary'"
@click="changeCurrent(i)"
title="مشخصات"
class="btn show-detail-btn -rotate-180"
type="button"
>
<span class="tavasi tavasi-Component-71--1"></span>
</button>
<button-component
:title="copyButtonTitleMaker(item._id)"
buttonText=""
class="btn show-detail-btn px-1"
@click="copyToClipboard('', urlResolver(item._id))"
>
<svg class="icon icon-copy2 fz-8">
<use xlink:href="#icon-copy2"></use>
</svg>
</button-component>
</div>
</div>
</div>
</div>
<jahat-pagination
class="pagination"
style="font-size: 13px"
v-if="page.total"
:paginationInfo="page"
@page-changed="pageChanged"
@page-limit-changed="pageLimitChanged"
@sort-changed="sortChanged"
>
</jahat-pagination>
</div>
<no-data v-else></no-data>
</div>
<div class="container-fluid" v-if="viewMode == 'table'">
<div class="row">
<div class="col-12 px-0">
<my-table
:height="'calc(-16em + 100vh)'"
:items="listAnswer"
:tableColumns="domainActiveGetter?.table_columns"
:tableActions="tableActions"
:paginationInfo="pagination"
:sortingInfo="sorting"
@page-changed="pageChanged"
@page-limit-changed="pageLimitChanged"
@show-details="showDetailsHandler"
@copy-link="copyLinkHandler"
@on-linked-title-click="onOnLinkedTitleClick"
@show-text="showTextPage"
:showHeaderSortButton="false"
class="my-table px-0"
>
</my-table>
</div>
</div>
</div>
<base-modal-v2
:hasFooter="false"
v-if="showModal"
:selectedItem="selectedItem"
@close-modal="closeModal"
>
<SubjectModal></SubjectModal>
<!-- <template v-slot:footer> This is a new modal footer. </template> -->
</base-modal-v2>
</div>
</template>
<script>
import favoriteApi from "~/apis/favoriteApi";
import tableActions from "~/json/search/json/listTableContextMenu";
import { mapState, mapActions } from "pinia";
import idbUtil from "~/mixins/idb.js";
/**
* @vue-prop {Array} [summeryKeys=] - کلیدهای خلاصه
* @vue-prop {Object} [pagination=] - صفحه بندی
* @vue-prop {Object} [listSelectedPoint=] - نقطه انتخاب شده در لیست
*
* @vue-data {Boolean} showModal - وضعیت نمایش مدال
* @vue-data {undefined} selectedItem - آیتم انتخاب شده
* @vue-data {Number} page - شماره صفحه فعلی
* @vue-data {Array} listAnswer - لیست پاسخ‌ها
* @vue-data {Number} totalCount - تعداد کل آیتم‌ها
* @vue-data {String} typeCount - نوع تعداد
* @vue-data {Number} countInPage - تعداد در هر صفحه
* @vue-data {Number} maxPage - تعداد بیشینه صفحات
* @vue-data {Number} currentPage - صفحه فعلی
* @vue-data {Number} beginPage - صفحه آغازین
* @vue-data {Number} endPage - صفحه پایانی
* @vue-data {Array} listPage - لیست صفحات
* @vue-data {String} textSearch - متن جستجو
* @vue-data {undefined|Object} httpService - سرویس HTTP
* @vue-data {Object} sorting - تنظیمات مرتب‌سازی
* @vue-data {String} sorting.sortby - فیلد مرتب‌سازی بر اساس
* @vue-data {String|undefined} sorting.sortorder - ترتیب مرتب‌سازی (asc | desc | none)
*
* @vue-computed {Object} [mapState.userPermisionGetter] - دریافت مجوزهای کاربر
* @vue-computed {Object} [mapState.currentUser] - کاربر فعلی
* @vue-computed {Object} [mapState.selectedlists] - بازگرداندن لیست‌های انتخاب شده
* @vue-computed {Object} [mapState.activeTabGetter] - دریافت تب فعال جستجو
* @vue-computed {Object} [mapState.selectedItemEntityGetter] - بازگرداندن آیتم انتخاب شده
* @vue-computed {Boolean} [showActionMenu] - نمایش منوی اقدام
*
* @vue-event {Function} mapActions.SET_LIST_ENTITY - تنظیم لیست انتیتی
* @vue-event {Function} mapActions.SET_ITEM_ENTITY - تنظیم ایتم انتیتی
*/
export default {
mixins: [idbUtil],
props: {
viewMode: {
default: "table",
},
summeryKeys: {
default() {
return [];
},
},
courseKeys: {
default() {
return [];
},
},
pagination: {
default() {
return {};
},
},
listSelectedPoint: {
default() {
return [];
},
},
// tableColumns: {
// default() {
// return [];
// },
// },
activeTabGetter: {
default() {
return {};
},
},
listItem: {
default() {
return {};
},
},
showActions: {
default: true,
},
},
async beforeMount() {
this.httpService = new HttpService(import.meta.env.VITE_REPO_BASE_URL);
this.db = await this.getDb(this.activeTabGetter.key);
this.ready = true;
},
mounted() {
window.scrollTo(0, 0);
if (this.$route.query.q) this.searchText = this.$route.query.q;
},
watch: {
listSelectedPoint(newVal) {
this.listAnswer = newVal;
},
listItem(newVal) {
this.listAnswer = newVal;
},
},
data() {
return {
tableActions: tableActions,
tableColumns: [
{ key: "title", title: "عنوان", width: "6", trancate_word: 6 },
{ key: "ts_ref", title: "مرجع تصویب", width: "2" },
{ key: "ts_date", title: "تاریخ تصویب", width: "1" },
],
showModal: false,
selectedItem: undefined,
page: this.pagination,
listAnswer: [],
totalCount: 0,
typeCount: "",
countInPage: 0,
maxPage: 0,
currentPage: 1,
beginPage: 1,
endPage: 1,
listPage: [],
textSearch: "",
httpService: undefined,
sorting: {
sortby: "created",
sortorder: undefined, // asc | desc | none
},
//بلا استفاده ها
// navigationOptions: [],
// maxLength: 250,
// listId: undefined,
// projectId: undefined,
};
},
computed: {
...mapState(["userPermisionGetter", "currentUser", "selectedlists"]),
// ...mapState(useSearchStore, ["activeTabGetter"]),
...mapState("entity", ["selectedItemEntityGetter"]),
...mapState(useSearchStore, ["searchActiveTabGetter", "domainActiveGetter"]),
showActionMenu() {
let show = false;
if (this.userPermisionGetter?.length)
["search_analyze", "search_summary"].forEach(
(item) =>
(show =
this.currentUser.user_level > 1 ||
this.userPermisionGetter.includes(item))
);
return show;
},
},
methods: {
// ...mapActions("list", ["SET_SELECTED_ITEM", "SET_LIST"]),
...mapActions("entity", ["SET_ITEM_ENTITY", "SET_LIST_ENTITY"]),
shamsiDate(begin_date) {
return new Date(begin_date).toLocaleString("fa").split(",")[0];
},
showTextPage(index) {
const item = this.listAnswer[index];
this.showtext(item._source, this.listAnswer, index, item._id);
},
onOnLinkedTitleClick({ rowItem, tableColumn, index }) {
this.showtext(rowItem._source, this.listAnswer, index, rowItem._id);
},
showDetailsHandler(event) {
this.$emit("changeCurrent", this.listAnswer[event.index]);
},
copyLinkHandler(event) {
let id = this.listAnswer[event]._id;
copyToClipboard("", this.urlResolver(id));
},
copyButtonTitleMaker(id) {
return `کپی لینک: link:\n${location.origin + this.urlResolver(id)}`;
},
//This function adds a new favorite to the user's favorites
/**
* افزودن یا حذف آیتم به/از علاقه‌مندی‌ها
* این متد بررسی می‌کند که آیا آیتم در علاقه‌مندی‌ها قرار دارد یا خیر. اگر ندارد، آن را اضافه می‌کند و اگر دارد، آن را حذف می‌کند.
*
* @param {Object} item - آیتم مورد نظر
* @param {Number} index - اندیس آیتم در لیست
*/
AddToFavorites(item, index) {
if (item._source.tbookmark == 0) {
let url = favoriteApi.favorite.add;
url = url.replace("{{data_type}}", "bookmark");
url = url.replace("{{ref_key}}", this.activeTabGetter?.key);
const formData = {
ref_id: item._id,
title: item._source.title,
};
this.httpService.postRequest(url, formData).then((res) => {
// this.UpdateList();
//refresh After removing or adding favorites
//this.$emit("UpdateList", item.tbookmark);
this.updateListAnswer(index, "tbookmark", 1);
});
} else {
let url = favoriteApi.favorite.deleteByRefid;
url = url.replace("{{data_type}}", "bookmark");
url = url.replace("{{index_key}}", this.activeTabGetter?.key);
url = url.replace("{{ref_id}}", item._id);
const formData = {};
this.httpService.postRequest(url, formData).then((res) => {
//refresh After removing or adding favorites
//this.$emit("UpdateList", item.tbookmark);
this.updateListAnswer(index, "tbookmark", 0);
});
}
},
/**
* به‌روزرسانی مقدار مشخصی از آیتم در لیست پاسخ‌ها
* @param {Number} index - اندیس آیتم در لیست
* @param {String} key - کلید مورد نظر برای به‌روزرسانی
* @param {Any} value - مقدار جدید برای کلید مورد نظر
*/
updateListAnswer(index, key, value) {
if (index in this.listAnswer) {
if (key in this.listAnswer[index]["_source"])
this.listAnswer[index]["_source"][key] = value;
}
},
/**
* تبدیل تاریخ به فرمت فارسی
* @param {String|Date} item - تاریخ مورد نظر
* @return {String} - تاریخ به فرمت فارسی
*/
datefa(item) {
var m = item;
var d = new Date(m).toLocaleDateString("fa-IR");
return d;
},
/**
* شمارش تعداد فایل‌های صوتی
* @param {Object} item - آیتم مورد نظر
* @return {Number} - تعداد فایل‌های صوتی
*/
countAudio(item) {
return item._source.voices;
},
/**
* نمایش جزئیات آیتم انتخاب شده
* @param {Object} selectedItem - آیتم انتخاب شده
*/
showDetails(selectedItem) {
this.selectedItem = selectedItem;
this.openModal();
},
/**
* بستن مدال
*/
closeModal() {
$("#subject-modal")?.modal("hide");
setTimeout(() => {
this.showModal = false;
}, 500);
},
/**
* باز کردن مدال
*/
openModal() {
this.showModal = true;
setTimeout(() => {
$("#subject-modal")?.modal(
{ backdrop: "static", keyboard: false },
"show"
);
}, 500);
},
/**
* دریافت آیتم‌های داخلی
* @param {Object} item - آیتم مورد نظر
* @return {String} - متن حاوی آیتم‌های داخلی
*/
getInnerItems(item) {
if (!item.inner_hits?.by_collapse) return "";
let text = "";
let index = -1;
item.inner_hits.by_collapse.hits.hits.forEach((el) => {
index++;
if (index > 0) {
let content = this.highlightText(el);
if (content.length == 0) {
content = `<span class="text__15 text__dark-gray search-items__code">
<span style="margin-left: 10px">کد داخلی : ${
el._source.meet_lid ?? "--"
}</span>
<span style="margin-left: 10px">کد جلسه : ${
el._source.meet_code ?? "--"
}</span>
<span style="margin-left: 10px">کد دوره : ${
el._source.research_code ?? "--"
}</span>
<span style="margin-left: 10px">کد پورتال : ${
el._source.id ?? "--"
}</span>
</span>`;
}
// show/hide content label(title) if it is valid.
let hasTitle = el._source.title.length ? "" : "d-none";
// convert date to shamsi date.
let shamsiDate = new Date(el._source.begin_date)
.toLocaleString("fa")
.split(",")[0];
// set init value.
let subjectsOrKeywords = el._source.keywords.length
? el._source.keywords
: "--";
// set label init value.
let keyTitle = "<span>/&nbsp;واژگان کلیدی</span>";
// check if subject exists, because it has higher priority than keywords.
let hasSubject = el._source.subject?.length;
// check if subjects if filled.
if (hasSubject) {
// reset variable.
subjectsOrKeywords = "";
// make subjects string.
el._source.subject.forEach((item, index) => {
subjectsOrKeywords += index == 0 ? "" : ", ";
subjectsOrKeywords += item.title;
});
// reset label
keyTitle = "<span>/&nbsp;موضوع</span>";
}
// making the content based on the top variables.
text += `<div class="search-items__header ">
<span class="search-items__label text__13 text__dark-gray ${hasTitle}">${el._source.format}</span>
<span class='one-line mb-2'>${content}</span>
<span> ${keyTitle} : ${subjectsOrKeywords}</span>
<span>/&nbsp;تاریخ : ${shamsiDate}</span>
</div>`;
}
});
return text;
},
/**
* برجسته‌سازی کلیدهای مورد نظر در متن
* @param {Object} item - آیتم مورد نظر
* @param {String} key1 - کلید اول
* @param {String} [key2=""] - کلید دوم (اختیاری)
* @param {String} [key3=""] - کلید سوم (اختیاری)
* @return {String} - متن برجسته‌سازی شده
*/
highlightKey(item, key1, key2 = "", key3 = "") {
var text = "";
if (item.highlight) {
if (item.highlight[key1]) text = item.highlight[key1].join("... ");
else if (key2 && item.highlight[key2])
text = item.highlight[key2].join("... ");
else if (key3 && item.highlight[key3])
text = item.highlight[key3].join("... ");
}
if (text == "") {
if (item._source[key1]) text = item._source[key1];
else if (key2 && item._source[key2]) text = item._source[key2];
else if (key3 && item._source[key3]) text = item._source[key3];
if (text.length > 500) text = text.substring(0, 500);
}
return text;
},
/**
* برجسته‌سازی متن بر اساس کلیدهای خلاصه
* @param {Object} item - آیتم مورد نظر
* @return {String} - متن برجسته‌شده
*/
highlightText(item) {
let key_one = this.summeryKeys[0];
let key_two = this.summeryKeys[1];
// branch = عنوان دوره
if (this.domainActiveGetter.key == "branch") {
key_one = this.courseKeys[0];
key_two = this.courseKeys[1];
}
var text = this.highlightKey(item, key_one, key_two, "mindex");
return text;
},
/**
* تولید URL بر اساس شناسه
* @param {String} _id - شناسه آیتم
* @return {String} - URL تولیدشده
*/
urlResolver(_id) {
const routeData = this.$router.resolve({
name: "navigationView",
params: {
id: _id,
key: this.activeTabGetter?.key,
},
query: {},
});
return routeData.href;
},
/**
* نمایش متن چندگانه در یک تب جدید
* @param {String} id - شناسه آیتم
* @param {String} _listkey - کلید لیست
*/
showMultiText(id, _listkey) {
let _name = "navigation";
const routeData = this.$router.resolve({
name: _name,
params: {
id: id,
key: this.activeTabGetter?.key,
},
query: {
searchtext: this.textSearch ?? undefined,
listkey: _listkey,
},
});
window.open(routeData.href, "_blank");
},
/**
* نمایش متن آیتم در یک تب جدید
* @param {Object} item - آیتم مورد نظر
* @param {Array} listAnswer - لیست پاسخ‌ها
* @param {Number} i - اندیس آیتم
* @param {String} _id - شناسه آیتم
*/
async showtext(_source, listAnswer, rowItem, _id) {
let cloneList = structuredClone(listAnswer);
cloneList.forEach((item, index) => {
cloneList[index] = { ...item, ..._source };
});
let cloneItem = structuredClone(rowItem);
cloneItem = { ...rowItem, _id: _id };
const enableIdb = Boolean(import.meta.env.VITE_ENABLE_IDB);
if (enableIdb) {
this.addDisabled = true;
await this.addToIdb(this.activeTabGetter?.key, cloneItem);
this.addDisabled = false;
}
this.SET_ITEM_ENTITY(cloneItem);
this.SET_LIST_ENTITY(cloneList);
localStorage.setItem("myList", JSON.stringify(cloneList));
localStorage.setItem("myItem", JSON.stringify(cloneItem));
const domainName = buildName() + "";
let _name = "navigationView";
const routeData = this.$router.resolve({
name: _name,
params: {
id: cloneItem._id,
key: this.activeTabGetter?.key,
},
query: {
searchtext: this.textSearch ?? undefined,
},
});
window.open(routeData.href, "_blank");
},
/**
* تنظیم پاسخ‌ها و به‌روزرسانی صفحه‌بندی
* @param {Array} list - لیست پاسخ‌ها
* @param {Number} [count=-1] - تعداد کل آیتم‌ها
* @param {String} [_typeCount=""] - نوع تعداد
*/
setAnswer: function (list, count = -1, _typeCount = "") {
if (count != -1) {
this.totalCount = count;
this.typeCount = _typeCount == "eq" ? "مساوی با " : "بیشتر از ";
this.maxPage =
this.totalCount == 0
? 0
: Math.floor(this.totalCount / this.countInPage) + 1;
this.currentPage = 1;
this.beginPage = 2;
this.endPage = this.beginPage + 3;
if (this.endPage > this.maxPage - 1) {
this.endPage = this.maxPage - 1;
if (this.beginPage > 2) this.beginPage = this.beginPage - 1;
}
this.updateListPage();
}
const total = count;
const pages = Math.ceil(total / this.page.limit);
const pagination = {
total: total,
pages: pages == 0 ? 1 : pages,
};
this.page = { ...this.pagination, ...pagination };
this.listAnswer = list;
this.scrollToTop();
localStorage.setItem("answer", JSON.stringify(this.listAnswer));
},
/**
* به‌روزرسانی لیست صفحات
*/
updateListPage: function () {
this.listPage = [];
for (let i = this.endPage; i >= this.beginPage; i--) {
this.listPage.push(i);
}
setTimeout(() => {
this.scrollToTop();
}, 700);
},
/**
* رفتن به صفحه بعدی یا قبلی
* @param {Number} item - جهت حرکت (1 برای بعدی، -1 برای قبلی)
*/
nextPage: function (item) {
if (item > 0) this.setPage(this.currentPage + 1);
else this.setPage(this.currentPage - 1);
},
/**
* تنظیم صفحه مورد نظر
* @param {Number} item - شماره صفحه
*/
setPage: function (item) {
if (item == -1) {
// begin ...
item = 3;
this.beginPage = 2;
this.endPage = 5;
} else if (item == -2) {
// end ...
item = this.maxPage - 3;
this.beginPage = this.maxPage - 5;
this.endPage = this.maxPage - 1;
} else if (item == this.beginPage) {
this.beginPage--;
if (this.beginPage > 5) {
this.beginPage--;
this.endPage--;
} else {
this.beginPage = 2;
this.endPage = 5;
}
} else if (item == this.endPage) {
if (this.endPage < this.maxPage - 5) {
this.endPage++;
this.beginPage++;
} else {
this.beginPage = this.maxPage - 5;
this.endPage = this.maxPage - 1;
}
}
this.updateListPage();
this.currentPage = item;
this.$emit("changePage", item - 1);
},
/**
* تغییر آیتم فعلی و ارسال آن با استفاده از رویداد
* @param {Number} i - اندیس آیتم در لیست پاسخ‌ها
*/
changeCurrent: function (i) {
this.$emit("changeCurrent", this.listAnswer[i]);
},
/**
* تنظیم متن جستجو و تعداد آیتم‌ها در هر صفحه
* @param {String} item - متن جستجو
* @param {Number} countInPage - تعداد آیتم‌ها در هر صفحه
*/
setTextSearch(item, countInPage) {
this.textSearch = item;
this.countInPage = countInPage;
},
/**
* اسکرول به بالای صفحه
*/
scrollToTop() {
window.scrollTo(0, 0);
},
/**
* تغییر محدودیت صفحه‌بندی و ارسال آن با استفاده از رویداد
* @param {Object} paging - تنظیمات صفحه‌بندی
*/
pageLimitChanged(paging) {
this.resetPagination();
this.page.limit = paging.limit;
this.$emit("changePage", this.page);
},
/**
* تغییر صفحه فعلی و ارسال آن با استفاده از رویداد
* @param {Object} paging - تنظیمات صفحه‌بندی
*/
pageChanged(paging) {
let page = paging.pageNumber;
page -= 1;
this.page.offset = page * paging.limit;
this.page.limit = paging.limit;
this.page.page = paging.pageNumber;
this.$emit("changePage", this.page);
},
/**
* تغییر مرتب‌سازی و ارسال آن با استفاده از رویداد
* @param {Object} sorting - تنظیمات مرتب‌سازی
*/
sortChanged(sorting) {
this.page.page = this.page.offset = 0;
this.sorting = sorting;
this.$emit("changePage", this.sorting);
},
/**
* بازنشانی تنظیمات صفحه‌بندی به حالت اولیه
*/
resetPagination() {
this.page = {
pages: 0,
total: 0,
page: 1,
offset: 0,
limit: 10,
};
},
/**
* دریافت لیست آیتم‌ها بر اساس نوع موجودیت
* @param {String} _entityType - نوع موجودیت
*/
getList(_entityType) {
if (this.fetchingData) return;
this.fetchingData = true;
this.entity_type = _entityType;
let url =
searchApi.Farhanghestan.search_normal +
`/${this.page.offset}/${this.page.limit}`;
this.httpService.getRequest(url).then((res) => {
this.listEntity = res.hits.hits;
const total = res.hits.total.value;
const pages = Math.ceil(total / this.page.limit);
const pagination = {
total: total,
pages: pages == 0 ? 1 : pages,
};
this.page = { ...this.pagination, ...pagination };
this.fetchingData = false;
});
},
},
};
</script>
<style lang="scss" scoped>
// .detail-page__tab-content {
// width: 90%;
// margin-right: 0 !important;
// position: relative;
// &.serve-majles {
// width: 100%;
// }
// }
// .search-items {
// overflow-y: auto;
// height: calc(100vh - 13em);
// }
.search-items__item {
position: relative;
padding: 1em;
overflow: hidden;
&:not(:last-child) {
margin-bottom: 30px;
}
&:hover,
&.active {
background-color: var(--list-background-color);
.search-item__actions {
// width: 6.5em;
width: auto;
transition: width 0.5s;
background: #fff;
border-radius: 0 0.5em 0.5em 0;
.tavasi-more-vert {
transition: all 0.2s;
display: none;
}
}
}
}
.search-item__actions {
position: absolute;
left: 0;
width: 1.6em;
top: 1em;
// overflow: hidden;
transition: all 0.5s;
display: flex;
align-items: center;
.btn {
display: flex;
align-items: center;
justify-content: center;
padding: 0.175rem 0.35rem;
&:hover {
filter: brightness(0.7);
}
.icon-copy2 {
font-size: 0.8rem;
}
&.favorites {
color: calc(--primary-color);
.icon-bookmark-1,
.icon-bookmark-2 {
height: 1.3em;
}
}
}
}
// .detail-page__content {
// top: 35px !important;
// }
// @media only screen and (min-width: 576px) and (max-width: 767.98px) {
// .detail-page__content {
// top: 170px !important;
// }
// }
// @media (max-width: 575.98px) {
// .detail-page__content {
// top: 170px !important;
// }
// }
// @media (max-width: 575.98px) {
// }
// @media only screen and (min-width: 576px) and (max-width: 767.98px) {
// .detail-page__tab-content {
// max-width: 500px;
// }
// }
// @media only screen and (min-width: 768px) and (max-width: 900.98px) {
// .detail-page__tab-content {
// max-width: 600px;
// }
// }
// @media only screen and (min-width: 901px) and (max-width: 1049.98px) {
// .detail-page__tab-content {
// max-width: 900px;
// }
// }
// @media (min-width: 1050px) {
// }
</style>