384 lines
9.8 KiB
Vue
384 lines
9.8 KiB
Vue
<template>
|
||
<div class="detail-page__content main_page">
|
||
<div class="detail-page__tab-content pb-0">
|
||
<div
|
||
class="search-items"
|
||
element="div"
|
||
:options="{
|
||
paddingAbsolute: true,
|
||
|
||
|
||
}"
|
||
defer
|
||
>
|
||
<div
|
||
class="search-items__item"
|
||
v-for="(item, i) in listAnswer"
|
||
:key="i"
|
||
>
|
||
<div class="search-items__header">
|
||
<a
|
||
@click.prevent=""
|
||
class="search-items__title text__15 text__blue"
|
||
>
|
||
{{ item.key }}
|
||
</a>
|
||
</div>
|
||
<div class="text__15 text__dark-gray search-items__code">
|
||
<span style="margin-left: 10px"
|
||
>تعداد جلسات : {{ item.doc_count }}</span
|
||
>
|
||
</div>
|
||
|
||
<div class="search-item__actions">
|
||
<span class="tavasi tavasi-more-vert"></span>
|
||
<!-- <button
|
||
v-can="'search_summary'"
|
||
@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_summary'"
|
||
@click="changeCurrent(i)"
|
||
title="مشخصات"
|
||
class="btn show-detail-btn -rotate-180"
|
||
type="button"
|
||
>
|
||
<span class="tavasi tavasi-Component-71--1"></span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- <div v-if="maxPage > 0" class="search-items__pagination mt-4" style="font-family: Sahel">
|
||
<ul>
|
||
<li class="prev"><a @click="nextPage(1)">بعدی</a></li>
|
||
<li :class="{ active: maxPage === currentPage }">
|
||
<a @click="setPage(maxPage)">{{ maxPage }}</a>
|
||
</li>
|
||
<li v-if="endPage < maxPage - 1">
|
||
<a @click="setPage(-2)">...</a>
|
||
</li>
|
||
<li v-for="(item, i) in listPage" :key="i" :class="{ active: item === currentPage }">
|
||
<a @click="setPage(item)">{{ item }}</a>
|
||
</li>
|
||
<li v-if="beginPage > 2"><a @click="setPage(-1)">...</a></li>
|
||
<li :class="{ active: 1 === currentPage }">
|
||
<a @click="setPage(1)">1</a>
|
||
</li>
|
||
<li class="next"><a @click="nextPage(-1)">قبلی</a></li>
|
||
</ul>
|
||
</div> -->
|
||
<jahat-pagination
|
||
style="font-size: 13px"
|
||
v-if="pagination.total"
|
||
:paginationInfo="pagination"
|
||
@page-changed="pageChanged"
|
||
@page-limit-changed="pageLimitChanged"
|
||
@sort-changed="sortChanged"
|
||
>
|
||
</jahat-pagination>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
props: ["pagination", "tq"],
|
||
data() {
|
||
return {
|
||
listAnswer: [],
|
||
totalCount: 0,
|
||
typeCount: "",
|
||
countInPage: 0,
|
||
maxPage: 0,
|
||
currentPage: 1,
|
||
beginPage: 1,
|
||
endPage: 1,
|
||
listPage: [],
|
||
textSearch: "",
|
||
iscode: true,
|
||
sorting: {
|
||
sortby: "created",
|
||
sortorder: undefined, // asc | desc | none
|
||
},
|
||
pag: this.pagination,
|
||
};
|
||
},
|
||
|
||
beforeCreate: function () {},
|
||
methods: {
|
||
|
||
pageLimitChanged(paging) {
|
||
this.resetPagination();
|
||
this.pag.limit = paging.limit;
|
||
|
||
this.$emit("changePage", this.pag);
|
||
},
|
||
pageChanged(paging) {
|
||
let page = paging.pageNumber;
|
||
page -= 1;
|
||
this.pag.offset = page * paging.limit;
|
||
this.pag.limit = paging.limit;
|
||
this.pag.page = paging.pageNumber;
|
||
|
||
this.$emit("changePage", this.pag);
|
||
},
|
||
sortChanged(sorting) {
|
||
this.pag.page = this.pag.offset = 0;
|
||
this.sorting = sorting;
|
||
|
||
this.$emit("changePage", this.sorting);
|
||
},
|
||
resetPagination() {
|
||
this.pag = {
|
||
pages: 0,
|
||
total: 0,
|
||
page: 1,
|
||
offset: 0,
|
||
limit: 10,
|
||
};
|
||
},
|
||
// getListSpecial(_entityType, _specialType) {
|
||
|
||
// if (this.fetchingData) return;
|
||
// this.fetchingData = true;
|
||
|
||
// this.entity_type = _entityType;
|
||
|
||
// let url = searchApi.Farhanghestan.search_normal;
|
||
|
||
// url = url + `/${this.pagination.offset}/${this.pagination.limit}/`;
|
||
|
||
// this.httpService.getRequest(url).then((res) => {
|
||
|
||
// this.listEntity = res.hits.hits;
|
||
|
||
// const total = res.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;
|
||
// });
|
||
// },
|
||
getList(_entityType) {
|
||
if (this.fetchingData) return;
|
||
this.fetchingData = true;
|
||
|
||
this.entity_type = _entityType;
|
||
|
||
let url =
|
||
searchApi.Farhanghestan.search_normal +
|
||
`/${this.pag.offset}/${this.pag.limit}`;
|
||
|
||
this.httpService.getRequest(url).then((res) => {
|
||
this.listEntity = res.hits.hits;
|
||
|
||
const total = res.hits.total.value;
|
||
const pages = Math.ceil(total / this.pag.limit);
|
||
const pagination = {
|
||
total: total,
|
||
pages: pages == 0 ? 1 : pages,
|
||
};
|
||
|
||
this.pag = { ...this.pagination, ...pagination };
|
||
|
||
this.fetchingData = false;
|
||
});
|
||
},
|
||
|
||
//mehdi
|
||
|
||
highlightText(item) {
|
||
var text = "";
|
||
if (item.highlight) {
|
||
if (item.highlight.branch) text = item.highlight.branch.join("... ");
|
||
} else {
|
||
if (item._source.branch) text = item._source.branch;
|
||
|
||
if (text.length > 500) text = text.substring(0, 500);
|
||
}
|
||
return text;
|
||
},
|
||
datefa(item) {
|
||
var d = new Date(item._source.begin_date).toLocaleDateString("fa-IR");
|
||
return d;
|
||
},
|
||
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.pag.limit);
|
||
const pagination = {
|
||
total: total,
|
||
pages: pages == 0 ? 1 : pages,
|
||
};
|
||
|
||
this.pag = { ...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);
|
||
}
|
||
},
|
||
nextPage: function (item) {
|
||
if (item > 0) this.setPage(this.currentPage + 1);
|
||
else this.setPage(this.currentPage - 1);
|
||
},
|
||
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);
|
||
},
|
||
changeCurrent: function (i) {
|
||
this.$emit("changeCurrent", this.listAnswer[i]);
|
||
},
|
||
setTextSearch(item, countInPage) {
|
||
this.textSearch = item;
|
||
this.countInPage = countInPage;
|
||
},
|
||
scrollToTop() {
|
||
window.scrollTo(0, 0);
|
||
},
|
||
},
|
||
|
||
|
||
mounted() {
|
||
window.scrollTo(0, 0);
|
||
this.textSearch = this.tq;
|
||
if (this.$route.query.q) this.searchText = this.$route.query.q;
|
||
},
|
||
};
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
// .search-items {
|
||
//height: calc(100vh - 17em);
|
||
// border-left: 1px solid #f2f2e6;
|
||
// }
|
||
|
||
.search-items__item {
|
||
position: relative;
|
||
padding: 1em;
|
||
|
||
&:not(:last-child) {
|
||
margin-bottom: 30px;
|
||
}
|
||
|
||
&:hover,
|
||
&.active {
|
||
background-color: var(--list-background-color);
|
||
|
||
.search-item__actions {
|
||
width: 3em;
|
||
transition: all 0.5s;
|
||
|
||
.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;
|
||
|
||
.tavasi {
|
||
color: #adbec4;
|
||
}
|
||
}
|
||
}
|
||
|
||
.detail-page__tab-content {
|
||
margin-right: 0px !important;
|
||
}
|
||
.detail-page__content {
|
||
position: initial;
|
||
// right: 366px !important;
|
||
}
|
||
</style>
|