v0.0.3
- Добавлено модальное окно редактирования номера
This commit is contained in:
Alexander Zhirov
parent
cf3962d71d
commit
c0290cd753
12 changed files with 294 additions and 128 deletions
100
js/message.js
100
js/message.js
|
|
@ -1,100 +0,0 @@
|
|||
class Message {
|
||||
timer;
|
||||
|
||||
constructor() {
|
||||
this.div = $('<div id="div-message"></div>');
|
||||
this.div.css({
|
||||
"position": "absolute",
|
||||
"top": "10px",
|
||||
"right": "20px",
|
||||
"z-index": "1000"
|
||||
});
|
||||
|
||||
$('body').append(this.div);
|
||||
}
|
||||
|
||||
success(message, delay = 6000) {
|
||||
this.print(message, delay, '#52b818', '#bffdc0');
|
||||
}
|
||||
|
||||
warning(message, delay = 6000) {
|
||||
this.print(message, delay, '#b8ae18', '#f8fdbf');
|
||||
}
|
||||
|
||||
error(message, delay = 6000) {
|
||||
this.print(message, delay, '#b96161', '#fddede');
|
||||
}
|
||||
|
||||
print = function(message, delay, border, background) {
|
||||
if (delay < 6000) delay = 6000;
|
||||
let Timer = function(callback, delay) {
|
||||
let timerId, start, remaining = delay;
|
||||
|
||||
this.pause = function() {
|
||||
clearTimeout(timerId);
|
||||
remaining -= new Date() - start;
|
||||
};
|
||||
|
||||
this.resume = function() {
|
||||
start = new Date();
|
||||
clearTimeout(timerId);
|
||||
timerId = setTimeout(callback, remaining);
|
||||
};
|
||||
|
||||
this.dead = function() {
|
||||
clearTimeout(timerId);
|
||||
};
|
||||
|
||||
this.resume();
|
||||
}
|
||||
|
||||
let newMessage = $(`<div class="message">${message}</div>`);
|
||||
|
||||
newMessage.css({
|
||||
"border": `1px solid ${border}`,
|
||||
"background-color": `${background}`,
|
||||
"color": "#333",
|
||||
"padding": "10px 30px",
|
||||
"text-align": "center",
|
||||
"display": "none",
|
||||
"margin": "10px 0 0 0",
|
||||
"width": "350px",
|
||||
"opacity": "1",
|
||||
"cursor": "pointer"
|
||||
});
|
||||
|
||||
newMessage.hover(function(){
|
||||
$(this).css({
|
||||
"opacity": "1"
|
||||
});
|
||||
}, function(){
|
||||
$(this).css({
|
||||
"opacity": "0.3"
|
||||
});
|
||||
});
|
||||
|
||||
this.div.append(newMessage);
|
||||
|
||||
let opacityTimeout = setTimeout(function() {
|
||||
newMessage.fadeTo(1000, 0.3);
|
||||
}, 2500);
|
||||
|
||||
newMessage.fadeIn(500).mouseenter(() => {
|
||||
clearTimeout(opacityTimeout);
|
||||
this.timer.pause();
|
||||
}).mouseleave(() => {
|
||||
this.timer.resume();
|
||||
}).click(() => {
|
||||
this.timer.dead();
|
||||
newMessage.fadeOut(0, function(){
|
||||
this.remove();
|
||||
});
|
||||
});
|
||||
|
||||
this.timer = new Timer(() => {
|
||||
newMessage.fadeOut(500, function(){
|
||||
this.remove();
|
||||
});
|
||||
}, delay);
|
||||
}
|
||||
}
|
||||
4
js/noticer.min.js
vendored
Normal file
4
js/noticer.min.js
vendored
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
/*! noticer - v0.1.0 - 2023-05-31
|
||||
* https://git.zhirov.kz/alexander/noticer
|
||||
* Copyright Alexander Zhirov; Licensed GPL-2.0 */
|
||||
class Noticer{timer;constructor(){this.div=$('<div id="noticer"></div>'),this.div.css({position:"absolute",top:"10px",right:"20px","z-index":"1000"}),$("body").append(this.div)}success(e,t=6e3){this.print(e,t,"#52b818","#bffdc0")}warning(e,t=6e3){this.print(e,t,"#b8ae18","#f8fdbf")}error(e,t=6e3){this.print(e,t,"#b96161","#fddede")}print=function(e,t,n,s){t<6e3&&(t=6e3);let i=function(e,t){let n,s,o=t;this.pause=function(){clearTimeout(n),o-=new Date-s},this.resume=function(){s=new Date,clearTimeout(n),n=setTimeout(e,o)},this.dead=function(){clearTimeout(n)},this.resume()},o=$(`<div class="notice">${e}</div>`);o.css({border:`1px solid ${n}`,"background-color":`${s}`,color:"#333",padding:"10px 30px","text-align":"center",display:"none",margin:"10px 0 0 0",width:"350px",opacity:"1",cursor:"pointer"}),o.hover(function(){$(this).css({opacity:"1"})},function(){$(this).css({opacity:"0.3"})}),this.div.append(o);let a=setTimeout(function(){o.fadeTo(1e3,.3)},2500);o.fadeIn(500).mouseenter(()=>{clearTimeout(a),this.timer.pause()}).mouseleave(()=>{this.timer.resume()}).click(()=>{this.timer.dead(),o.fadeOut(0,function(){this.remove()})}),this.timer=new i(()=>{o.fadeOut(500,function(){this.remove()})},t)}}
|
||||
90
js/script.js
90
js/script.js
|
|
@ -1,7 +1,7 @@
|
|||
var numbers = [];
|
||||
|
||||
$(document).ready(function () {
|
||||
message = new Message;
|
||||
noticer = new Noticer;
|
||||
|
||||
$("button").button();
|
||||
$("#tabs").tabs();
|
||||
|
|
@ -59,9 +59,9 @@ function isJSON(str) {
|
|||
|
||||
function loadData() {
|
||||
request('listsgroups', 'text').then(data => {
|
||||
data.error ? message.error(data.message) : generateListsGroups(data);
|
||||
data.error ? noticer.error(data.message) : generateListsGroups(data);
|
||||
}).catch(error => {
|
||||
message.error(error.message);
|
||||
noticer.error(error.message);
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -78,16 +78,16 @@ function generateListsGroups(data) {
|
|||
});
|
||||
}
|
||||
|
||||
async function generateGroupNumbers(panel) {
|
||||
function generateGroupNumbers(panel) {
|
||||
request('groupnumbers', 'json', { group: panel.data("group-name") }).then(data => {
|
||||
if (isJSON(data) && JSON.parse(data).error)
|
||||
message.error(JSON.parse(data).message);
|
||||
noticer.error(JSON.parse(data).message);
|
||||
else {
|
||||
numbers = data;
|
||||
showNumbers(panel);
|
||||
}
|
||||
}).catch(error => {
|
||||
message.error(error.message);
|
||||
noticer.error(error.message);
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -95,7 +95,7 @@ function showNumbers(panel, data = numbers) {
|
|||
(new divNotFoundNumbers).remove();
|
||||
let body = panel.find('.body').html('');
|
||||
$(data).each((i, j) => {
|
||||
let row = $(`<tr class="row" data-number="${j.id}"></tr>`);
|
||||
let row = $(`<tr class="row" data-number="${j.number}"></tr>`);
|
||||
row.append(`<td>${j.number}</td>`);
|
||||
row.append(`<td>${j.list}</td>`);
|
||||
row.append(`<td>${j.all_cc}</td>`);
|
||||
|
|
@ -104,8 +104,8 @@ function showNumbers(panel, data = numbers) {
|
|||
row.append(`<td>${j.comment}</td>`);
|
||||
body.append(row);
|
||||
|
||||
row.click(function(){
|
||||
// numberEdit($(this).data('number'));
|
||||
row.click(function() {
|
||||
numberEdit($(this).data('number'));
|
||||
});
|
||||
});
|
||||
|
||||
|
|
@ -133,3 +133,75 @@ function divNotFoundNumbers() {
|
|||
notFound.remove();
|
||||
}
|
||||
}
|
||||
|
||||
function numberEdit(number) {
|
||||
request('editnumber', 'text', {number: number}).then(data => {
|
||||
if (isJSON(data) && JSON.parse(data).error)
|
||||
noticer.error(JSON.parse(data).message);
|
||||
else {
|
||||
showEditNumber(data, [
|
||||
{
|
||||
id: "btn-save",
|
||||
text: "Сохранить",
|
||||
icon: "ui-icon-check",
|
||||
click: function() {
|
||||
actionNumber($(this), 'update');
|
||||
}
|
||||
},
|
||||
{
|
||||
id: "btn-delete",
|
||||
text: "Удалить",
|
||||
icon: "ui-icon-trash",
|
||||
click: function() {
|
||||
// removeNumber($(this));
|
||||
}
|
||||
}
|
||||
], `Редактирование номера ${number}`);
|
||||
}
|
||||
}).catch(error => {
|
||||
noticer.error(error.message);
|
||||
});
|
||||
}
|
||||
|
||||
function showEditNumber(data, actionButton, title) {
|
||||
let form = $(data);
|
||||
|
||||
form.appendTo('body').dialog({
|
||||
title: title,
|
||||
height: 'auto',
|
||||
width: 'auto',
|
||||
maxHeight: 500,
|
||||
minHeight: 50,
|
||||
resizable: false,
|
||||
modal: true,
|
||||
show: { effect: "fade", duration: 500 },
|
||||
close: function(event, ui) {
|
||||
$(this).dialog('destroy').remove()
|
||||
},
|
||||
buttons: [
|
||||
...actionButton,
|
||||
{
|
||||
text: "Отмена",
|
||||
icon: "ui-icon-cancel",
|
||||
click: function() {
|
||||
$(this).dialog("close");
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
$('#number-group, #number-list').selectmenu({
|
||||
width: 200
|
||||
});
|
||||
}
|
||||
|
||||
function actionNumber(currentWindow, query) {
|
||||
let number = $('#number-number').val();
|
||||
let group = $('#number-group').val();
|
||||
let list = $('#number-list').val();
|
||||
let all_cc = $('#number-all-cc').val();
|
||||
let white_cc = $('#number-white-cc').val();
|
||||
let black_cc = $('#number-black-cc').val();
|
||||
let comment = $('#number-comment').val();
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue