Ноябрь 2021

datatables.net: перекашивает заголовок таблицы при переключении между вкладками

29.11.2021 Павел Грибов WEB

При переключении между вкладками, иногда шапка таблицы «узежает».

Решение: в момент переключения вкладок, «перерисовываем» шапку:

    $("#tabs").tabs({
	activate: function( event, ui ) { 
		$('#client_pays_grid').dataTable().fnAdjustColumnSizing();
   });

$("#tabs").tabs({

activate: function( event, ui ) {

$('#client_pays_grid').dataTable().fnAdjustColumnSizing();

});

Оставить комментарий datatables, datatables.net, fnAdjustColumnSizing

Дошли руки до datatables.net

26.11.2021 Павел Грибов PHP, WEB

Наконец дошли руки до освоения плагина databales.net для работы с таблицами. До этого всё использовал jqgrid. Вот типичный шаблон c выгрузкой в excel, загрузкой данных из json, добавления в POST своих данных, получения id выделенной строки.

HTML:

<table id="clientsgrid" class="display" style="width:100%">
        <thead>
            <tr>
                <th>#</th>
                <th></th>
                <th>Телефон</th>
                <th>ФИО</th>
                <th>Email</th>
                <th>Дата</th>
            </tr>
        </thead>
    </table>

<thead>

<tr>

<th>Телефон</th>

<th>Email</th>

</tr>

</thead>

</table>

Javascript:

 function ClientsGridList(){

    table=$('#clientsgrid').DataTable( {
        dom: 'Bfrtip',
        destroy: true,
        select: true,
        buttons: [
            'excel','print'
        ],        
         paging: true,
         keys: true,
        //scrollY:        200,
        //scrollCollapse: true,
        //scroller:       true,         
        "processing": true,
        "serverSide": true,
        "ajax": {
            "url": "/server/clients/ClientsGrid",
            "type": "POST",
            "data": {
                "owner":owner_select.value,
                "segment":users_groups_array_select.value
            }
        },
    "language": {
             url: '/js/i18n/datatable.json'
        },        
    "columns": [
            { "data": "id"},
            { "data": "deleted" },
            { "data": "phone"},
            { "data": "name" },
            { "data": "email" },
            { "data": "dt"}            
        ]        
    } );
    $('#clientsgrid').unbind();
    $('#clientsgrid').on('dblclick', 'tbody td', function () {
         tr = $(this).closest('tr');
         //console.log(tr);
         row = table.row( tr );
         data=row.data();
         user_id=data.id;         
         DrawCartUser(user_id);
    }); 
   // table.ajax.reload();
  };

function ClientsGridList(){

table=$('#clientsgrid').DataTable( {

dom: 'Bfrtip',

destroy: true,

select: true,

buttons: [

'excel','print'

paging: true,

keys: true,

//scrollY: 200,

//scrollCollapse: true,

//scroller: true,

"processing": true,

"serverSide": true,

"ajax": {

"url": "/server/clients/ClientsGrid",

"type": "POST",

"data": {

"owner":owner_select.value,

"segment":users_groups_array_select.value

}

"language": {

url: '/js/i18n/datatable.json'

"columns": [

{ "data": "id"},

{ "data": "deleted" },

{ "data": "phone"},

{ "data": "name" },

{ "data": "email" },

{ "data": "dt"}

]

} );

$('#clientsgrid').unbind();

$('#clientsgrid').on('dblclick', 'tbody td', function () {

tr = $(this).closest('tr');

//console.log(tr);

row = table.row( tr );

data=row.data();

user_id=data.id;

DrawCartUser(user_id);

});

// table.ajax.reload();

};

PHP:

$owner= _POST("owner"); // владелец (если суперадмин - выводим всех)
$segment= _POST("segment"); // какой сегмент (если -1, выводим всех)
$draw= _POST("draw"); // какая страница
$start= _POST("start"); // с какой записи по счету
$length= _POST("length"); // записей на страницу
$order= _POST("order")[0]["column"]; // по какой колонке сортируем
$order= _POST("columns")[$order]["data"];
$sidx= _POST("order")[0]["dir"]; // способ сортировки
$search_value=_POST("search")["value"]; // что ищем
$search_regex=_POST("search")["regex"]; // регулярка

$res=$Users->GetClientsGrid($Users,$owner,$segment,$start,$length,$order,$sidx,$search_value);    
if ($res->error):
        echo '{"error": "'.$res->errortext.'" }';
        die();
   else:
        $res->result->draw=$draw;
        jsonExit($res->result);
endif;

$owner= _POST("owner"); // владелец (если суперадмин - выводим всех)

$segment= _POST("segment"); // какой сегмент (если -1, выводим всех)

$draw= _POST("draw"); // какая страница

$start= _POST("start"); // с какой записи по счету

$length= _POST("length"); // записей на страницу

$order= _POST("order")[0]["column"]; // по какой колонке сортируем

$order= _POST("columns")[$order]["data"];

$sidx= _POST("order")[0]["dir"]; // способ сортировки

$search_value=_POST("search")["value"]; // что ищем

$search_regex=_POST("search")["regex"]; // регулярка

$res=$Users->GetClientsGrid($Users,$owner,$segment,$start,$length,$order,$sidx,$search_value);

if ($res->error):

echo '{"error": "'.$res->errortext.'" }';

die();

else:

$res->result->draw=$draw;

jsonExit($res->result);

endif;

Ну и получается что то вроде:

Оставить комментарий datatables.net, типичный шаблон таблицы

PostgreeSQL: контроль уникальности вставки

22.11.2021 Павел Грибов MySQL

Хороший вариант: возложить контроль уникальности вставляемых данных, на уровень БД. Если это по каким-то причинам не возможно, то можно попробовать такой вариант:

insert into users_groups_filling (user_id,user_group) 
select  :user_id,:user_group 
where 
 NOT EXISTS (
	 SELECT id from users_groups_filling where user_id=:user_id and user_group=:user_group
 )

insert into users_groups_filling (user_id,user_group)

select :user_id,:user_group

where

NOT EXISTS (

SELECT id from users_groups_filling where user_id=:user_id and user_group=:user_group

)

Оставить комментарий postgree, контроль уникальности

Jqgrid-free: свернуть все остальные развёрнутые субгриды

20.11.2021 Павел Грибов WEB

Задача: при развертывании нового субгрида, необходимо чтобы все остальные развернутые — сворачивались.

Решение:

	subGridRowExpanded: function(subgrid_id, row_id) {
                    $("#ezs_list").jqGrid('setSelection', row_id);
                    // свертываем все остальные субгриды
                    var rowIds = $("#ezs_list").getDataIDs();
                        $.each(rowIds, function (index, rowId) {
                            $("#ezs_list").collapseSubGridRow(rowId); 
                        });                    
                    
                    StationsGrid(subgrid_id, row_id);
		},

subGridRowExpanded: function(subgrid_id, row_id) {

$("#ezs_list").jqGrid('setSelection', row_id);

// свертываем все остальные субгриды

var rowIds = $("#ezs_list").getDataIDs();

$.each(rowIds, function (index, rowId) {

$("#ezs_list").collapseSubGridRow(rowId);

});

StationsGrid(subgrid_id, row_id);

Оставить комментарий collapse subgrid, jqgrid, jqgrid-free

PHP: Рисуем SVG

17.11.2021 Павел Грибов PHP

Один из вариантов генерации картинок svg «на лету». Капля, внутри буква, окруженная полукругами.

<?php

$blob_status=5; 
$pies=[1,2,3,4,5,6];

function GetColorPieByState($state){    
    switch ($state) {
        case 1:$color="#2afc24";break;  
        case 2:$color="#2afc24";break;  
        case 3:$color="#fc2424";break;  
        case 4:$color="#fc2424";break;  
        case 5:$color="#fc2424";break;  
        case 6:$color="#cccccc";break;  
        default:$color="#7DD8B5";break; 
    }
    return $color;
};

function String2Array($st){
    $st=mb_substr($st, 0, -1);
    return explode(",", $st);
};

function GetColorBlobByState($state){    
    $station_fill="#D1FFB4";
    if ($state==1) $station_fill="#2afc24";
    if ($state==2) $station_fill="#fc2424";
    if ($state==3) $station_fill="#fc2424";
    if ($state==4) $station_fill="#fc2424";
    if ($state==5) $station_fill="#cccccc";
    return $station_fill;
};

function SaveSvgBlobIco($blob_status,$pies,$filename){
    
}

Draw($blob_status,$pies);

function Draw($blob_status,$pies){
    
    $station_fill=GetColorBlobByState($blob_status);

    $svg="";
    $svg=$svg.'<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="264">';
    $svg=$svg."<defs>";
    $svg=$svg."    <style>";
    $svg=$svg."        .blob_fill {fill:$station_fill;}"; /*Цвет капли*/       
    $svg=$svg.'    </style>';
    $svg=$svg.'</defs>';
    //Рисунок капли
    $svg=$svg.'   <path class="blob_fill" d="m199.10001,101.02451c0,90.53423 -99.52251,161.55548 -99.52251,161.55548s-99.5775,-76.21059 -99.5775,-161.55548a99.55,101.0245 0 0 1 199.10001,0z" id="svg_1"/>';
    //Буква й
    $svg=$svg.'   <text transform="matrix(7.0814, 0, 0, 6.46509, -382.002, -470.036)" xml:space="preserve" text-anchor="start" font-family="Helvetica, Arial, sans-serif" font-size="24" id="svg_3" y="94.56099" x="61.67799" stroke-opacity="null" stroke-width="0" stroke="null" fill="#EDFFFF">й</text>';

    $svg=$svg.'<g style="stroke:black;stroke-width:1">';

    function pt($x,$y,$rad,$gap,$r,$ang,$mns=-1){ 
      //global $x,$y,$rad,$gap;      
      $a=($ang-90)*$rad-$mns*asin($gap/$r); 
      return sprintf('%0.2f,%0.2f',$x+$r*cos($a),$y+$r*sin($a));
    }

    $x=100;
    $y=100;
    $r=60;  // внутренний радиус
    $rc=90; // внешний радиус
    $gap=20; // отступ между кусками
    $a360=360/count($pies); 
    $M_PI=3.14159265358; 
    $rad=$M_PI/180.;
    $out='';
    $ang1=0;      


    foreach ($pies as $connector) {  
      $dang = 1 * $a360;       
      $laf  = $dang > 180? 1 : 0; 
      $ang2 = $ang1 + $dang;      
      $out.= '<path d="M'.pt($x,$y,$rad,$gap,$rc,$ang1).'L'.pt($x,$y,$rad,$gap,$r, $ang1)."A $r,$r, 0,$laf,1 "  .pt($x,$y,$rad,$gap,$r,$ang2,1).
                      'L'.pt($x,$y,$rad,$gap,$rc,$ang2,1)."A $rc,$rc, 0,$laf,0, ".pt($x,$y,$rad,$gap,$rc,$ang1).'" style="fill:'.GetColorPieByState($connector).'" />'."\n";
      $ang1=$ang2;
    }
    $svg=$svg.$out;
    $svg=$svg.'</g></svg>';
    echo $svg;
};
?>

<?php

$blob_status=5;

$pies=[1,2,3,4,5,6];

function GetColorPieByState($state){

switch ($state) {

case 1:$color="#2afc24";break;

case 2:$color="#2afc24";break;

case 3:$color="#fc2424";break;

case 4:$color="#fc2424";break;

case 5:$color="#fc2424";break;

case 6:$color="#cccccc";break;

default:$color="#7DD8B5";break;

}

return $color;

};

function String2Array($st){

$st=mb_substr($st, 0, -1);

return explode(",", $st);

};

function GetColorBlobByState($state){

$station_fill="#D1FFB4";

if ($state==1) $station_fill="#2afc24";

if ($state==2) $station_fill="#fc2424";

if ($state==3) $station_fill="#fc2424";

if ($state==4) $station_fill="#fc2424";

if ($state==5) $station_fill="#cccccc";

return $station_fill;

};

function SaveSvgBlobIco($blob_status,$pies,$filename){

}

Draw($blob_status,$pies);

function Draw($blob_status,$pies){

$station_fill=GetColorBlobByState($blob_status);

$svg="";

$svg=$svg.'<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="264">';

$svg=$svg."<defs>";

$svg=$svg." <style>";

$svg=$svg." .blob_fill {fill:$station_fill;}"; /*Цвет капли*/

$svg=$svg.' </style>';

$svg=$svg.'</defs>';

//Рисунок капли

$svg=$svg.' <path class="blob_fill" d="m199.10001,101.02451c0,90.53423 -99.52251,161.55548 -99.52251,161.55548s-99.5775,-76.21059 -99.5775,-161.55548a99.55,101.0245 0 0 1 199.10001,0z" id="svg_1"/>';

//Буква й

$svg=$svg.' <text transform="matrix(7.0814, 0, 0, 6.46509, -382.002, -470.036)" xml:space="preserve" text-anchor="start" font-family="Helvetica, Arial, sans-serif" font-size="24" id="svg_3" y="94.56099" x="61.67799" stroke-opacity="null" stroke-width="0" stroke="null" fill="#EDFFFF">й</text>';

$svg=$svg.'<g style="stroke:black;stroke-width:1">';

function pt($x,$y,$rad,$gap,$r,$ang,$mns=-1){

//global $x,$y,$rad,$gap;

$a=($ang-90)*$rad-$mns*asin($gap/$r);

return sprintf('%0.2f,%0.2f',$x+$r*cos($a),$y+$r*sin($a));

}

$x=100;

$y=100;

$r=60; // внутренний радиус

$rc=90; // внешний радиус

$gap=20; // отступ между кусками

$a360=360/count($pies);

$M_PI=3.14159265358;

$rad=$M_PI/180.;

$out='';

$ang1=0;

foreach ($pies as $connector) {

$dang = 1 * $a360;

$laf = $dang > 180? 1 : 0;

$ang2 = $ang1 + $dang;

$out.= '<path d="M'.pt($x,$y,$rad,$gap,$rc,$ang1).'L'.pt($x,$y,$rad,$gap,$r, $ang1)."A $r,$r, 0,$laf,1 " .pt($x,$y,$rad,$gap,$r,$ang2,1).

'L'.pt($x,$y,$rad,$gap,$rc,$ang2,1)."A $rc,$rc, 0,$laf,0, ".pt($x,$y,$rad,$gap,$rc,$ang1).'" style="fill:'.GetColorPieByState($connector).'" />'."\n";

$ang1=$ang2;

}

$svg=$svg.$out;

$svg=$svg.'</g></svg>';

echo $svg;

};

Оставить комментарий blob, php, pie, svg

1 2 »

Ноябрь 2021
Пн	Вт	Ср	Чт	Пт	Сб	Вс
1	2	3	4	5	6	7
8	9	10	11	12	13	14
15	16	17	18	19	20	21
22	23	24	25	26	27	28
29	30