Files
Backend-Api/ServiceHost/Areas/Admin/Pages/Company/SmsResult/Index.cshtml

595 lines
20 KiB
Plaintext
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.
@page
@model ServiceHost.Areas.Admin.Pages.Company.SmsResult.IndexModel
@{
<style>
.container .searchPannel {
background: aliceblue;
overflow-x: scroll;
box-shadow: 0px 1px 15px 0 #b4c0b2;
border-radius: 20px;
min-height: 700px;
}
.container .filter {
background: aliceblue;
box-shadow: 0px 1px 15px 0 #b4c0b2;
border-radius: 20px;
margin-bottom: 20px;
}
table {
border-collapse: separate;
border-spacing: 0;
}
.table > thead > tr > th {
border-bottom: 2px aliceblue !important;
background-color: #a6c2db;
color: #2b7d85;
text-wrap: nowrap;
}
.table > tbody > tr > td {
color: #638f8f;
border-top: 2px solid aliceblue !important;
background-color: #cae8e8;
text-wrap: nowrap;
}
tr td:first-child {
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
}
tr td:last-child {
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
}
tr:nth-child(even) td{
background-color: #d8f1f1 !important;
}
tr th:first-child {
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
}
tr th:last-child {
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
}
.successSend {
background-color: #b8e3bc;
color: #638f6e;
padding: 2px 7px;
border-radius: 5px;
}
.numbers {
background-color: #b8e3bc;
color: #638f6e;
display: block;
width: 30px;
border-radius: 5px;
}
.errored {
animation: shake 300ms;
box-shadow: inset 0 0 2px #eb3434, 0 0 5px #eb3434 !important;
border: 1px solid #eb3434 !important;
}
@@media screen and (min-width: 1600px) {
.table > thead > tr > th {
font-size: 17px;
}
.table > tbody > tr > td {
font-size: 17px;
}
}
.date-box{
display: flex;
background-color: #cee8d9;
align-items: center;
padding: 7px;
border-radius: 10px;
margin: 3px;
width: 24.6%
}
.selectTo {
background-color: #cee8d9;
align-items: center;
padding: 7px;
border-radius: 10px;
margin: 3px;
width: 24.6%
}
.bottomRow{
background-color: #d8f1f1;
align-items: center;
padding: 7px;
border-radius: 10px;
margin: 3px;
width: 24.6%
}
.api {
background-color: #b8e3bc;
border-color: #b8e3bc;
color: #638f6e !important;
bottom: 5px;
font-family: 'Web_Yekan' !important;
}
.searchAll {
border-bottom-right-radius: 0px;
border-top-right-radius: 0px;
background-color: #3c8397;
border-color: #3c8397;
font-family: 'Web_Yekan' !important;
}
.searchOne {
border-bottom-left-radius: 0px;
border-top-left-radius: 0px;
background-color: #3da9c6;
border-color: #3da9c6;
font-family: 'Web_Yekan' !important;
margin-left: -3px;
}
.searchOne:hover , .searchOne:focus , .searchOne:active{
background-color: #8fe1e9;
border-color: #8fe1e9;
}
.searchAll:hover , .searchAll:focus , .searchAll:active{
background-color: #1a7c8a;
border-color: #1a7c8a;
}
.searchOne i{
padding-left: 3px;
font-size: 14px;
}
@@media only screen and (max-width : 1820px) {
.date-box{
width: 24.2%
}
.selectTo {
width: 24.2%
}
.bottomRow{
width: 24.2%
}
}
@@media only screen and (max-width : 992px) {
.date-box {
width: 100%;
margin: 0px 0px 2px 0px;
}
.selectTo {
width: 49%;
margin: 0px 0px 2px 0px;
}
.contractingParty {
width: 100%;
margin: 0px 0px 2px 0px;
}
.startDate {
margin: 0px 0px 2px 0px;
width: 50%;
}
.endDate {
margin: 0px 0px 2px 0px;
width: 50%
}
.bottomRow{
margin: 0px 0px 2px 0px;
width: 50%
}
.searchAll {
width: 49.5%;
}
.searchOne {
width: 49.8%;
}
}
@@media only screen and (max-width : 375px) {
.date-box {
width: 100%;
margin: 0px 0px 2px 0px;
}
.selectTo {
width: 49%;
margin: 0px 0px 2px 0px;
}
.contractingParty {
width: 100%;
margin: 0px 0px 2px 0px;
}
.startDate {
margin: 0px 0px 2px 0px;
width: 50%;
}
.endDate {
margin: 0px 0px 2px 0px;
width: 50%
}
.bottomRow{
margin: 0px 0px 2px 0px;
width: 50%
}
}
.panel-title {
padding: 2px 10px;
}
::-webkit-scrollbar {
width: 8px;
}
::-webkit-scrollbar-track {
background: #dfdfdf;
border-radius: 5px;
}
::-webkit-scrollbar-thumb {
background: #3c8397;
border-radius: 5px;
}
.goToTop {
position: fixed;
bottom: 40px;
}
</style>
var i = 1;
var successSend = "successSend";
}
<input type="hidden" name="pageIndex" id="pageIndex" value="@Model.PageIndex"/>
<input type="hidden" id="contractingPatyId" name="PartyId" value="@Model.PartyId"/>
<input type="hidden" id="year" name="Year" value="@Model.Year"/>
<input type="hidden" id="month" name="Month" value="@Model.Month"/>
<input type="hidden" id="start" name="startDate" value="@Model.StartDate"/>
<input type="hidden" id="end" name="endtDate" value="@Model.EndDate"/>
<input type="hidden" id="status" name="Status" value="@Model.Status"/>
<input type="hidden" id="mobile" name="Mobile" value="@Model.Mobile"/>
<input type="hidden" id="typeOfSms" name="TypeOfSms" value="@Model.TypeOfSms"/>
<a asp-page="/Company/SmsResult/ApiResults" class="btn btn-info btn-rounded waves-effect waves-light m-b-5 api">گزارش ای پی آی</a>
<a asp-page="/Company/SmsResult/SmsSettings" class="btn btn-info btn-rounded waves-effect waves-light m-b-5 api"> تنظیمات پیامک خودکار </a>
<div class="container filter">
<h3 class="panel-title" style="display: inline-block;color: #7a96a6"><i class="fa fa-search" style="padding-left: 3px; font-size: 14px"></i> جستجو</h3>
<button class="btn btn-info btn-rounded waves-effect waves-light m-b-5 goToTop"> <i class="fa fa-chevron-up" style="font-size: 20px"></i> برو بالا</button>
<form class="form-inline" style="margin-top: -10px" role="form" method="get" name="search-theme-form" id="search-theme-form" autocomplete="off">
<div class="">
<div class="row" style="padding: 15px 10px 0px">
<div class="col-md-3 col-sm-6 col-xs-12 pull-right selectTo contractingParty">
<div class="form-group" style="width: 100% !important; margin: 0 auto;">
<select class="form-control select-city" asp-for="SearchModel.ContractingPatyId" asp-items="Model.ContractingParties" style="width: 100% !important">
<option value="0"> طرف حساب </option>
</select>
</div>
</div>
<div class="col-md-3 col-sm-6 col-xs-12 pull-right date-box" dir="rtl">
<div class="form-group" style="width: 36% !important; margin: 0 auto; font-size: 14px !important;">
انتخاب تاریخ
</div>
<div class="form-group" style="width: 30% !important; margin: 0 auto;">
<select class="form-control " asp-for="SearchModel.Year" style="width: 100% !important">
<option value=" "> سال </option>
@foreach (var itemi in Model.YearlyList)
{
<option style="font-family: 'IranSans' !important;" value="@itemi"> @itemi </option>
}
</select>
</div>
<div class="form-group" style="width: 30% !important; margin: 0 auto;">
<select class="form-control" asp-for="SearchModel.Month" style="width: 100% !important">
<option value=" "> ماه</option>
<option value="01"> فروردین</option>
<option value="02"> اردیبهشت</option>
<option value="03"> خرداد</option>
<option value="04"> تیر</option>
<option value="05"> مرداد</option>
<option value="06"> شهریور</option>
<option value="07"> مهر</option>
<option value="08"> آبان</option>
<option value="09"> آذر</option>
<option value="10"> دی</option>
<option value="11"> بهمن</option>
<option value="12"> اسفند</option>
</select>
</div>
</div>
<div class="col-md-3 col-sm-6 col-xs-6 pull-right selectTo startDate" dir="rtl">
<div class="form-group" style="width: 100% !important; margin: 0 auto;">
@*<label class="sr-only" asp-for="SearchModel.ContractingPartyID"></label>*@
<input dir="ltr" maxlength="10" id="startDateFa" style="text-align: center; width: 100%" placeholder="تاریخ شروع" class="form-control date" asp-for="SearchModel.StartDateFa"/>
</div>
</div>
<div class="col-md-3 col-sm-6 col-xs-6 pull-right selectTo endDate" dir="rtl">
<div class="form-group" style="width: 100% !important; margin: 0 auto;">
@*<label class="sr-only" asp-for="SearchModel.ContractingPartyID"></label>*@
<input dir="ltr" maxlength="10" id="endDateFa" style="text-align: center; width: 100%" placeholder="تاریخ پایان" class="form-control date" asp-for="SearchModel.EndDateFa"/>
</div>
</div>
</div>
<div class="row" style="padding: 0px 10px 15px">
<div class="col-md-3 col-sm-6 col-xs-12 pull-right bottomRow">
<div class="form-group" style="width: 100% !important; margin: 0 auto;">
<select class="form-control" asp-for="SearchModel.TypeOfSms" style="width: 100% !important">
<option value=" "> نوع پیامک</option>
<option value="صورت حساب ماهانه"> صورت حساب ماهانه</option>
<option value="یادآور بدهی ماهانه"> یادآور بدهی ماهانه </option>
<option value="یادآور تمدید قرارداد"> یادآور تمدید قرارداد </option>
<option value="اعلام مسدودی طرف حساب"> اعلام مسدودی طرف حساب </option>
<option value="هشدار اول"> هشدار اول </option>
<option value="هشدار دوم"> هشدار دوم </option>
<option value="اقدام قضایی"> اقدام قضایی </option>
<option value="یادآور وظایف"> یادآور وظایف </option>
<option value="یادآور تایید قرارداد مالی"> یادآور تایید قرارداد مالی</option>
</select>
</div>
</div>
<div class="col-md-3 col-sm-6 col-xs-12 pull-right bottomRow">
<div class="form-group" style="width: 100% !important; margin: 0 auto;">
<select class="form-control" asp-for="SearchModel.Status" style="width: 100% !important">
<option value=" "> وضعیت ارسال</option>
<option value="موفق"> موفق</option>
<option value="ناموفق"> ناموفق</option>
</select>
</div>
</div>
<div class="col-md-3 col-sm-6 col-xs-12 pull-right bottomRow">
<select class="form-control" style="width: 100% !important">
<option value=" "> وضعیت دریافت</option>
<option value="موفق"> موفق</option>
<option value="ناموفق"> ناموفق</option>
</select>
</div>
<div class="col-md-3 col-sm-6 col-xs-12 pull-right bottomRow">
<input dir="ltr" maxlength="11" style="text-align: center; width: 100%" placeholder="شماره موبایل" class="form-control persianDateInputa" asp-for="SearchModel.Mobile"/>
</div>
</div>
<div class="row" style="padding: 0px 10px 15px">
<div class=" col-md-4 col-lg-4 col-xs-12 col-sm-12 pull-right" style="padding-left: 0;">
<button type="submit" class="btn btn-success btn-rounded waves-effect waves-light m-b-5 search searchOne"> <i class="fa fa-search"></i> جستجو</button>
<a asp-page="./Index" class="btn btn-info btn-rounded waves-effect waves-light m-b-5 searchAll">حذف فیلتر</a>
</div>
</div>
</div>
</form>
</div>
<div class="container searchPannel">
<h3 class="panel-title" style="display: inline-block;color: #7a96a6"><i class="fa fa-list" style="padding-left: 3px; font-size: 14px"></i> لیست پیامک ها</h3>
<table class="table">
<thead>
<tr>
<th>ردیف</th>
<th>نام طرف حساب</th>
<th>شماره همراه</th>
<th style="text-align: center">وضعیت ارسال</th>
<th>نوع پیامک</th>
<th> جزئیات</th>
<th style="text-align: center">ساعت</th>
<th>تاریخ</th>
</tr>
</thead>
<tbody class="tb">
@foreach (var item in Model.SmsResultViewModels)
{
<tr>
<td style="text-align: center">
<span class="numbers">@i</span>
</td>
<td>@item.ContractingPartyName</td>
<td style="font-family: 'IranText' !important;">@item.Mobile</td>
<td style="text-align: center">
<span class="@{if (item.Status == "موفق"){@successSend}}">@item.Status</span>
</td>
<td>@item.TypeOfSms</td>
<td style="text-align: center; ">
<a class="btn btn-warning pull-right m-rl-5" style="border-radius: 10px; background-color: #f6ffd8 !important"
href="#showmodal=@Url.Page("./ApiResults", "ByMessId", new { messId = item.MessageId, fullName = item.ContractingPartyName })">
<i class="md md-textsms"></i>
</a>
</td>
<td style="text-align: center">@item.HourAndMinute</td>
<td style="font-family: 'IranText' !important;">@item.CreationDateFa</td>
@{
i++;
}
</tr>
}
</tbody>
</table>
</div>
@section Script
{
<script src="~/AdminTheme/assets/js/site.js"></script>
<script src="~/admintheme/js/jquery.mask_1.14.16.min.js"></script>
<script>
function details(id, fullName) {
const parametr = `&messId=${id}&fullName=${fullName}`;
const url = '#showmodal=@Url.Page("/Company/SmsResult/ApiResults", "ByMessId")';
window.location.href = url + parametr;
}
function loadMore() {
const pageIndex = Number($('#pageIndex').val());
const b = pageIndex % 30;
const contractingPartyId = Number($('#contractingPatyId').val());
const year = $('#year').val();
const month = $('#month').val();
const start = $('#start').val();
const end = $('#end').val();
const typeOfSms = $('#typeOfSms').val();
const status = $('#status').val();
const mobile = $('#mobile').val();
if (b === 0 && pageIndex > 0) {
// var searchModel = {};
// searchModel.Status = $('#status').val();
// searchModel.ContractingPatyId = Number($('#contractingPatyId').val());
$.ajax({
async: false,
contentType: 'charset=utf-8',
dataType: 'json',
type: 'GET',
url: '@Url.Page("./Index", "Pagination")',
data: {
pageIndex: pageIndex,
contractingPartyId: contractingPartyId,
year: year,
month: month,
start: start,
end: end,
typeOfSms: typeOfSms,
status: status,
mobile: mobile
},
headers: { "RequestVerificationToken": $('@Html.AntiForgeryToken()').val() },
success: function(response) {
if (response.pageIndex > 0) {
var n = pageIndex + 1;
$.each(response.smsResultViewModels,
function(i, item) {
const successSend = item.status == "موفق" ? "successSend" : "";
const html = `<tr>
<td style="text-align: center"><span class="numbers">${n}</span></td>
<td>${item.contractingPartyName}</td>
<td style="font-family: 'IranText' !important;">${item.mobile}</td>
<td style="text-align: center"><span class="${successSend}">${item.status}</span></td>
<td>${item.typeOfSms}</td>
<td style="text-align: center; ">
<button type="button" class="btn btn-warning pull-right m-rl-5" style="border-radius: 10px; background-color: #f6ffd8 !important"
onclick="details(${item.messageId},'${item.contractingPartyName}')">
<i class="md md-textsms"></i>
</button></td>
<td style="text-align: center">${item.hourAndMinute}</td>
<td style="font-family: 'IranText' !important;">${item.creationDateFa}</td>
</tr>`;
$('.tb').append(html);
n += 1;
});
const newPageIndex = pageIndex + response.pageIndex;
$('#pageIndex').val(newPageIndex);
}
},
failure: function(response) {
console.log(5, response);
}
});
}
}
// function goToTop() {
// $('.goToTop').show().fadeIn();;
// }
$(window).scroll(function() {
console.log(`document height ${$(document).height()}`);
if ($(window).scrollTop() + $(window).height() > $(document).height() - 600) {
// goToTop();
loadMore();
}
if ($(this).scrollTop() > 100) {
$('.goToTop').show().fadeIn();
} else {
$('.goToTop').fadeOut().hide();
}
});
$(window).scroll(function() {
});
$('.goToTop').on('click',
function() {
$('html, body').animate({ scrollTop: 0 }, 360);
return false;
});
// $(window).scroll(bindScroll);
$(document).ready(function() {
$(".date").mask("0000/00/00");
$('.goToTop').hide();
});
$("#startDateFa").keyup(function() {
const value = $(this).val();
const lengthValue = value.length;
if (lengthValue == 10) {
if (!dateValidCheck(this)) {
$(this).addClass("errored");
} else {
$(this).removeClass("errored");
}
} else if (lengthValue == 0) {
$(this).removeClass("errored");
}
});
$("#endDateFa").keyup(function() {
const value = $(this).val();
const lengthValue = value.length;
if (lengthValue == 10) {
if (!dateValidCheck(this)) {
$(this).addClass("errored");
} else {
$(this).removeClass("errored");
}
} else if (lengthValue == 0) {
$(this).removeClass("errored");
}
});
</script>
}