418 lines
9.8 KiB
Vue
418 lines
9.8 KiB
Vue
<template>
|
|
<div class="user__item-container">
|
|
<div class="user__item">
|
|
<div class="col">
|
|
<div class="user__content">
|
|
<div class="d-flex mb-2">
|
|
<div class="favorite-item-label">
|
|
{{ labelchange(entity._source.ref_key) }}
|
|
</div>
|
|
<a
|
|
:title="entity._source.title ?? entity._source?.subtitle"
|
|
:href="`navigation/list/${entity._source.ref_key}/${
|
|
entity._source.ref_id
|
|
}/searchtext=${searchText ?? ''}`"
|
|
@click.prevent="showtext(entity)"
|
|
@auxclick.prevent.stop="showtext(entity)"
|
|
class="favorite-item-title"
|
|
>
|
|
{{ entity._source.title }}
|
|
</a>
|
|
</div>
|
|
<div class="mb-2 text__15 search-items__code">
|
|
<span style="margin-left: 10px"
|
|
><span class="font-weight-semi-bold">تاریخ :</span>
|
|
{{ datefa(entity._source.time_edit) }}</span
|
|
>
|
|
<span
|
|
v-if="entity._source?.history_number"
|
|
style="margin-left: 10px"
|
|
><span class="font-weight-semi-bold">تعداد مشاهده :</span>
|
|
{{ entity._source.history_number }} بار
|
|
</span>
|
|
</div>
|
|
<div class="mb-2">
|
|
<p class="text-break">{{ entity.data }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto" v-if="entity._source?.bookmark_tags?.length">
|
|
<div class="d-flex">
|
|
<span
|
|
v-for="(bm, index) in entity._source.bookmark_tags"
|
|
:key="index"
|
|
class="badge"
|
|
>{{ bm }}</span
|
|
>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto d-flex" v-if="$route.name == 'favorites'">
|
|
<div class="dropdown">
|
|
<button
|
|
class="btn dropdown-toggle"
|
|
type="button"
|
|
id="dropdownMenuButton"
|
|
data-toggle="dropdown"
|
|
aria-haspopup="true"
|
|
aria-expanded="false"
|
|
>
|
|
دسته بندی
|
|
</button>
|
|
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
|
|
<button
|
|
type="button"
|
|
v-for="(cat, index) in categories"
|
|
:key="index"
|
|
class="dropdown-item"
|
|
@click.prevent="addToCat(entity._source?.bookmark_tags, cat)"
|
|
>
|
|
{{ cat }}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<button-component
|
|
@click="deleteNotification(entity)"
|
|
buttonText=""
|
|
v-tooltip="'حذف'"
|
|
classes="btn"
|
|
>
|
|
<svg class="icon icon-Component-295--1">
|
|
<use xlink:href="#icon-Component-295--1"></use>
|
|
</svg>
|
|
</button-component>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapState } from "pinia";
|
|
import adminApi from "~/apis/adminApi";
|
|
import { usePermitStore } from "~/stores/permitStore";
|
|
|
|
export default {
|
|
props: {
|
|
categories: {
|
|
default() {
|
|
return [];
|
|
},
|
|
},
|
|
entity: {
|
|
default() {
|
|
return {};
|
|
},
|
|
},
|
|
searchText: {
|
|
default: "",
|
|
},
|
|
},
|
|
watch: {
|
|
role_id() {
|
|
this.getRoles();
|
|
},
|
|
user_id() {
|
|
this.getRoles();
|
|
},
|
|
},
|
|
|
|
// beforeMount() {
|
|
// this.httpService = new HttpService(
|
|
// import.meta.env.VITE_BASE_URL + repoUrl()
|
|
// );
|
|
// },
|
|
// mounted() {
|
|
// this.getRoles();
|
|
// },
|
|
data() {
|
|
return {
|
|
listUserPermission: [],
|
|
collapseAll: false,
|
|
grouplist: [],
|
|
groupbyList: {},
|
|
roles: [],
|
|
httpService: undefined,
|
|
};
|
|
},
|
|
computed: {
|
|
...mapState(usePermitStore, ["projectGetter"]),
|
|
...mapState(useFavoriteStore, [
|
|
"favoriteSchemaGetter",
|
|
"favoriteActiveTabGetter",
|
|
]),
|
|
},
|
|
methods: {
|
|
addToCat(cats, cat) {
|
|
this.$emit("add-to-cat", { cats: cats ?? [], cat, id: this.entity._id });
|
|
},
|
|
datefa(item) {
|
|
var m = item * 1000; //برای تبدیل به میلی ثانیه
|
|
|
|
var d = new Date(m).toLocaleDateString("fa-IR");
|
|
let options = { weekday: "long", hour: "2-digit", minute: "2-digit" };
|
|
var d2 = new Date(m).toLocaleDateString("fa-IR", options);
|
|
return d2 + " " + d;
|
|
},
|
|
//change label for favorite-item-label
|
|
labelchange(key) {
|
|
let item = this.favoriteActiveTabGetter?.index_keys.find(
|
|
(item) => item.key == key
|
|
);
|
|
if (item) return item.label;
|
|
|
|
return "";
|
|
},
|
|
showtext(item) {
|
|
let _name = "navigationView";
|
|
|
|
const routeData = this.$router.resolve({
|
|
name: _name,
|
|
params: {
|
|
id: item._source.ref_id,
|
|
key: item._source.ref_key,
|
|
},
|
|
query: {
|
|
searchtext: this.searchText ?? undefined,
|
|
},
|
|
});
|
|
window.open(routeData.href, "_blank");
|
|
},
|
|
deleteNotification(item) {
|
|
this.mySwalConfirm({
|
|
title: "هشدار!!!",
|
|
html: `از حذف آیتم جاری اطمینان دارید؟ `,
|
|
icon: "warning",
|
|
}).then((result) => {
|
|
if (result.isConfirmed) {
|
|
let url = adminApi.notification.delete;
|
|
url = url.replace("{{id}}", item._id);
|
|
url = url.replace("{{entity_type}}", item._source.entity_type);
|
|
|
|
// this.httpService.postRequest(url).then((res) => {
|
|
// this.mySwalToast({
|
|
// html: res?.message ?? "با موفقیت حذف شد.",
|
|
// });
|
|
|
|
// setTimeout(() => {
|
|
// this.$emit("getList");
|
|
// }, 500);
|
|
// });
|
|
}
|
|
});
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.user__item-container {
|
|
position: relative;
|
|
margin-bottom: 1em;
|
|
|
|
border-radius: 1em;
|
|
border: 1px solid #eee;
|
|
padding: 1em;
|
|
|
|
&.read {
|
|
border-right-width: 3px;
|
|
border-right-style: solid;
|
|
border-right-color: #33eb33;
|
|
background-color: #33eb331a;
|
|
border-radius: 1em;
|
|
border-top-right-radius: 0;
|
|
border-bottom-right-radius: 0;
|
|
}
|
|
&.unread {
|
|
border-right-width: 3px;
|
|
border-right-style: solid;
|
|
border-right-color: red;
|
|
background-color: rgba(255, 0, 0, 0.08);
|
|
border-radius: 1em;
|
|
border-top-right-radius: 0;
|
|
border-bottom-right-radius: 0;
|
|
}
|
|
|
|
.user__item {
|
|
align-items: center;
|
|
display: flex;
|
|
// align-items: center;
|
|
// padding: 0.5em 0;
|
|
margin-bottom: 0.5em;
|
|
border-radius: 0;
|
|
|
|
.user__content {
|
|
// display: flex;
|
|
// align-items: center;
|
|
// flex-direction: column;
|
|
// margin-right: 1em;
|
|
// width: 100%;
|
|
.user__text_show {
|
|
max-width: 13em;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
}
|
|
.user__text {
|
|
color: #1b2733;
|
|
width: 90%;
|
|
}
|
|
.user__date {
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
font-size: 0.8rem;
|
|
margin-top: 1em;
|
|
color: #bac4ce;
|
|
}
|
|
.favorite-item-label {
|
|
white-space: nowrap;
|
|
padding: 0 5px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border-radius: 6px;
|
|
background: #fff;
|
|
border: 1px solid #e4dfd8;
|
|
height: 20px;
|
|
margin-left: 8px;
|
|
color: rgba(0, 0, 0, 0.4);
|
|
}
|
|
.favorite-item-title {
|
|
cursor: pointer;
|
|
color: #00b6e3;
|
|
font-size: 0.875em;
|
|
}
|
|
&:hover {
|
|
background-color: #e8fcff;
|
|
.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;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.badge {
|
|
padding: 0.5em;
|
|
display: flex;
|
|
align-items: center;
|
|
line-height: 1.2;
|
|
font-size: 1rem;
|
|
background-color: transparent;
|
|
text-shadow: 1px;
|
|
border: 1px solid #eee;
|
|
|
|
&-danger {
|
|
color: red;
|
|
}
|
|
&-success {
|
|
color: #28a745;
|
|
}
|
|
}
|
|
|
|
&:not(:last-child) {
|
|
// border-bottom: 1px solid #eee;
|
|
}
|
|
|
|
&:nth-child(odd) {
|
|
// background-color: #eee;
|
|
}
|
|
.user__pic {
|
|
width: 5em;
|
|
height: 5em;
|
|
|
|
border-radius: 50%;
|
|
overflow: hidden;
|
|
border: 2px solid #eee;
|
|
|
|
img {
|
|
object-fit: cover;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
// .user__content {
|
|
// margin-right: 0.5em;
|
|
// flex: 1;
|
|
|
|
// .user__item-head {
|
|
// margin-left: 1.5em;
|
|
// display: flex;
|
|
// align-items: center;
|
|
// justify-content: space-between;
|
|
// }
|
|
// }
|
|
|
|
.user__no-pic {
|
|
border: 2px solid #fff;
|
|
color: white;
|
|
font-size: 10px;
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
font-size: 10px;
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
}
|
|
}
|
|
|
|
&: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;
|
|
|
|
&:hover {
|
|
filter: brightness(0.7);
|
|
}
|
|
|
|
.tavasi,
|
|
.icon-copy2 {
|
|
color: #adbec4;
|
|
}
|
|
.icon-copy2 {
|
|
font-size: 0.8rem;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|