1+ @page
2+ @inject IViewLocalizer Localizer
3+ @{
4+ ViewData [" Title" ] = Localizer [" contact" ];
5+ }
6+ <style >
7+ .modal-body .row {
8+ line-height : 2.5em ;
9+ border-bottom : 1px solid #efefef ;
10+ }
11+ .card-contact {
12+ margin-bottom : 10px ;
13+ }
14+ .btn-group {
15+ margin-top : 15px ;
16+ }
17+ .form-group-label a {
18+ float : right ;
19+ color : red ;
20+ }
21+ </style >
22+ <div class =" bf-main" >
23+ <partial name =" ~/Pages/Admin/Shared/_Notifybar.cshtml" />
24+ <div id =" app" class =" bf-body" style =" display :none " >
25+ <div class =" bf-content" >
26+ <label class =" form-group-label" >@Localizer ["contact"]</label >
27+
28+ <div class =" row" >
29+ <div v-for =" (item, index) in contacts" class =" col-md-6 card-contact" >
30+ <div class =" card" >
31+ <div class =" card-body" >
32+ <div class =" form-group-label" >
33+ {{ getDate (item .dateNotified )}} / {{ item .notifier .split (" |" )[0]}}
34+ <a href =" #" v-on:click =" remove(item.id)" ><i class =" fa fa-times" ></i ></a >
35+ </div >
36+ <div class =" email" >
37+ <a :href =" 'mailto:'+item.notifier.split('|')[1]+''" >{{ item .notifier .split ('|' )[1] }} </a >
38+ </div >
39+ <hr />
40+ {{ item .content }}
41+ </div >
42+ </div >
43+ </div >
44+ </div >
45+
46+ <div v-if =" contacts && contacts.length == 0" class =" bf-list-empty" >
47+ @Localizer ["not-found"]!
48+ </div >
49+
50+ <!-- Pagination -->
51+ <ul v-if =" contacts && contacts.length > 0" class =" bf-pagination d-flex" >
52+ <li v-if =" pager.showOlder" class =" bf-pagination-item" >
53+ <a class =" bf-pagination-link" title =" older" :href =" pagelink('older')" >
54+ <i class =" bf-pagination-icon fa fa-chevron-left" ></i >
55+ </a >
56+ </li >
57+ <li v-if =" pager.showNewer" class =" bf-pagination-item" >
58+ <a class =" bf-pagination-link" title =" newer" :href =" pagelink('newer')" >
59+ <i class =" bf-pagination-icon fa fa-chevron-right" ></i >
60+ </a >
61+ </li >
62+ <li class =" bf-pagination-item" >
63+ <span class =" bf-pagination-count" >
64+ {{ cntFrom }} -{{ cntTo }} out of {{ pager .total }}
65+ </span >
66+ </li >
67+ </ul >
68+ <!-- /Pagination -->
69+ </div >
70+ </div >
71+ </div >
72+
73+ @section Scripts{
74+ <script >
75+ new Vue ({
76+ el: " #app" ,
77+ data: {
78+ contacts: [],
79+ pager: {},
80+ page: 1 ,
81+ cntFrom: 0 ,
82+ cntTo: 0
83+ },
84+ methods: {
85+ load : function (page ) {
86+ axios .get (webRoot + ' api/notifications/contact?page=' + page)
87+ .then (response => {
88+ this .contacts = response .data .notifications ;
89+ this .pager = response .data .pager ;
90+
91+ this .cntFrom = this .pager .currentPage == 1 ? 1 : (this .pager .currentPage - 1 ) * this .pager .itemsPerPage + 1 ;
92+ this .cntTo = this .pager .currentPage * this .pager .itemsPerPage < this .pager .total ? this .pager .currentPage * this .pager .itemsPerPage : this .pager .total ;
93+ $ (' #app' ).fadeIn ();
94+ })
95+ .catch (function (error ) { toastr .error (error); });
96+ },
97+ remove : function (id ) {
98+ var result = confirm (" Please confirm removing this message" );
99+ if (result) {
100+ axios .delete (webRoot + ' api/notifications/remove/' + id)
101+ .then (response => {
102+ toastr .success (' Removed' );
103+ setTimeout (function () { location .reload (); }, 1000 );
104+ })
105+ .catch (function (error ) { toastr .error (error); });
106+ }
107+ return false ;
108+ }
109+ },
110+ beforeMount () {
111+ this .load (1 )
112+ }
113+ })
114+ </script >
115+ }
0 commit comments