Skip to content

Instantly share code, notes, and snippets.

@morozVA
Created Apr 14, 2018
Embed
What would you like to do?
evo пример модуля "Телефонные коды"
?>
<style>
#content{
width:820px;
}
ul{
margin: 0;
border: 1px solid #d8d8d8;
padding-left: 0;
}
ul li>span:first-of-type{
width:5%;
}
ul span>input[type='text']{
margin: 0;
width: auto;
}
li{
list-style-type: none;
}
li:nth-of-type(2n){
background: rgba(182, 0, 100,0.04);
}
ul span{
width:7%;
display: inline-block;
padding: 5px 0 5px 10px;
}
ul span>input{
padding:0;
}
ul input[type='submit']{
display: inline-block;
}
ul .delete{
color: transparent;
}
ul input[type='text']{
border: none;
background: transparent;
width:20%;
color: inherit;
margin: 0 8px 0 0;
height: 30px;
-webkit-border-radius: 4px;
border-radius: 4px;
}
.save { /*#tab2 ul input.save1*/
display: inline-block;
width:13%;
height: 30px;
line-height: 30px;
margin:0 10px;
visibility: hidden;
vertical-align: middle;
}
.edit, .delete, .add{ /*, .edit1, .add1*/
width: 35px;
height: 35px;
background-color: #dee1e7;
cursor: pointer;
border: 1px solid #a4aab9;
border-radius: 3px;
padding: 10px;
background-repeat: no-repeat;
background-position: 50%;
margin: 7px;
}
.save{
/*background-image: url("../assets/templates/qmedia/images/save.png"); */
display: inline-block;
width: 108px;
height: 30px;
line-height: 30px;
margin: 0px;
color: transparent;
border: none;
visibility: hidden;
cursor: pointer;
}
.edit{ /*, .edit1*/
background-image: url("../assets/templates/qmedia/images/edit-icon.png");
vertical-align: bottom;
}
.delete{
background-image: url("../assets/templates/qmedia/images/delete-icon.png");
}
.add{ /* #tab2 .add1*/
background-image: url("../assets/templates/qmedia/images/plus.png");
margin-left:742px;
}
ul input.editable[type='text']{
border:1px solid #ccc !important;
background:#fff !important;
}
li{
margin: 0;
padding: 0;
width: 100%;
}
a{
background: #B60064;
text-shadow: 0 1px 0 rgba(0,0,0,.5);
color: #fff;
float: left;
font: bold 15px/32px 'Lucida sans', Arial, Helvetica;
height: 32px;
padding: 0 30px;
text-decoration: none;
border-right: 2px solid white;
}
a:hover {
background: #333;
}
a:focus{
outline: 0;
}
select {
padding: 0 10px;
-webkit-border-radius: 4px;
border-radius: 4px;
height: 30px;
}
input.save { /* input.save1*/
height: 30px;
background-color: #B60064;
border: none;
cursor: pointer;
margin-left:5px;
}
input[type='submit']:hover, input.save:hover, input[type='button']:hover {
background-color: #B60064;
}
form {
margin-bottom: 0px;
}
h4 {
margin: 30px 0px 10px 0px;
}
img{
width: auto;
/*max-height: 30px;*/
vertical-align: middle;
max-width: 55px;
margin-right:10px;
}
input[type='file']{
/* border: 1px solid #ccc !important;*/
background: #fff !important;
max-width: 100%;
vertical-align: middle;
color: inherit;
margin: 0 8px 0 0;
height: 30px;
-webkit-border-radius: 4px;
border-radius: 4px;
padding-top: 5px;
}
li>span:last-of-type{
width: 38%;
padding:0;
}
li>input[type='text']:first-of-type {
width: 5%;
}
li input[name='pos'] {
width:100% !important;
}
.save{
background: url("../assets/images/save.jpg") no-repeat 50% 50%;
background-size: 75px 30px;
color: transparent;
display:inline-block;
}
.save { /*#tab2 ul input.save1*/
width:75px;
height: 30px;
line-height: 30px;
margin:0 0px;
visibility: hidden;
vertical-align: middle;
border: none;
cursor: pointer;
}
.save:hover{
background: url("../assets/images/saveHover.jpg") no-repeat 50% 50%;
background-size: 75px 30px;
}
#content{
position: relative;
}
#content>p>img {
position: absolute;
left: 0%;
MAX-HEIGHT: 80px;
top: 20%;
z-index: 100;
}
</style>
<h1>Флаги и коды</h1>
<div id="content">
<p><!--<img src="../assets/images/arrow1.png">--> *Используйте числовое поле для сортировки телефонных кодов
</p>
<?php
/*Функция makeTab выводит данные из бд в модуль, обеспечивает добавление/редактирование/удаление записей.
Входящие параметры:
$table_name - название таблицы в бд
$column_1 - колонка с id
$column_2 - колонка изображением
$column_3 - колонка с телефонным кодои
$column_4 - колонка с названием страны
$column_5 - колонка с позицией вывода
*/
function makeTab ($table_name, $column_1, $column_2, $column_3,$column_4,$column_5){
global $modx;
$url = $_GET['referer'];
$table=$modx->db->query("select * from $table_name WHERE $column_1 > '0' ORDER BY $column_5 ASC");
while ($row = $modx->db->getRow($table)){
echo '<li>
<span>
<input type="text" name="id" value='.$row["$column_1"].' style="display:none;" disabled>
<input type="text" name="pos" value='.$row["$column_5"].' disabled>
<input type="text" name="flag1" value="'.$row["$column_2"].'" style="display:none;">
</span>
<span><img src="'.$row["$column_2"].'"></span><!--<input type="file" name="flag_" style="visibility:hidden;" value="">-->
<input type="text" name="code" value="'.$row["$column_3"].'" disabled>
<input type="text" name="desc" value="'.$row["$column_4"].'" disabled>
<input type="submit" class="save" name="save" value="'.$row["$column_1"].'" title="Сохранить">
<input type="button" class="edit" name="edit" title="Редактировать" value="">
<input type="submit" class="delete" name="delete" title="Удалить" value='.$row["$column_1"].'>
</li>';
}
if(isset($_POST['save'])){
$code=$_POST['code'];
$len = count($code);
$id_=$_POST['id'];
$pos=$_POST['pos'];
$desc=$_POST['desc'];
$flag=$_POST['flag'];
$file_types = array('png', 'jpg', 'jpeg', 'gif','');
$extension = end(explode('.', $_FILES['flag']['name']));
//$info = new SplFileInfo($_FILES['flag']['name']);
//$extension = $info->getExtension();
if ($_FILES['flag']['size'] > 300000) {
echo "<p class='audit' style='color:red;width: 100%;'>Фото не загружено, т.к. максимальный размер файла не должен первышать 300000кб!</p>";
}
else if(!in_array($extension, $file_types)){
echo "<p class='audit' style='color:red;width: 100%;'>ФОТО НЕ ЗАГРУЖЕНО, Т.К. ТРЕБУЮТСЯ ФАЙЛЫ С РАСШИРЕНИЕМ PNG, JPG, JPEG, GIF!</p>";
}
else{
$uploaddir = '../assets/images/flags/';
$uploadfile = $uploaddir . basename($_FILES['flag']['name']);
if (move_uploaded_file($_FILES['flag']['tmp_name'], $uploadfile)) {
//$flag_=$uploadfile;
}
$flag_=$uploadfile;
var_dump($flag_);
$flag_1 = $_FILES['flag']['name'];
$errors[] = $flag_1;
var_dump($errors);
if(empty($flag_1)){
var_dump(true);
$res = $modx->db->query("UPDATE $table_name SET $column_3='$code', $column_4='$desc',$column_5='$pos' WHERE $column_1='$id_'");
}
else{
$res = $modx->db->query("REPLACE INTO $table_name ($column_1,$column_2,$column_3,$column_4,$column_5) VALUES('$id_','$flag_','$code','$desc','$pos')");
}
}
}//save
if ($res == 'true') {
?>
<Script language="JavaScript">window.location = '<?=$url; ?>';</Script>
<?php
}
if(isset($_POST['delete'])){
$id= $_POST['delete'];
$result =$modx->db->query("DELETE FROM $table_name WHERE $column_1 = '$id'");
if ($result == 'true') {
?>
<Script language="JavaScript">window.location = '<?=$url; ?>';</Script>
<?php
}
}
}//function
?>
<form enctype="multipart/form-data" action="" method="post" id="flags">
<input type="button" class="add" name="add" title="Добавить запись" value="">
<ul>
<?php
makeTab ('flags', 'id_flag', 'flag', 'code', 'flag_desc', 'position_flag');
$table_max=$modx->db->query("SELECT max(`id_flag`) as `id_max` FROM `flags`;");
$row_max = $modx->db->getRow($table_max);
$max1 = $row_max["id_max"];
$table_max1=$modx->db->query("SELECT max(`position_flag`) as `id_max1` FROM `flags`;");
$row_max1 = $modx->db->getRow($table_max1);
$max_1 = $row_max1["id_max1"];
?>
</ul>
</form>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>
<script>
$(document).ready(function() {
$('.add').click(function(e) {
e.preventDefault();
//var parentId= $(this).parent().parent().attr("id");
//console.log(parentId);
//var num = parentId.substr(3,1);
//if(num==1){
var idItem =("<?=$max1; ?>");
var idItem1 =("<?=$max_1; ?>");
// }
idItem = parseInt(idItem);
idItem++;
idItem1 = parseInt(idItem1);
idItem1++;
$('ul').prepend('<li><span><input type="text" name="id" value="'+idItem+'" style="display:none;" disabled><input type="text" name="pos" value="0" class="pos editable"></span>&nbsp;<span><input type="file" name="flag"></span>&nbsp;<input type="text" name="code" value="" class="editable">&nbsp;<input type="text" name="desc" value="" class="editable">&nbsp;<input type="submit" class="save" name="save" value="'+idItem+'" title="Сохранить" style="visibility:visible">&nbsp;<input type="submit" class="edit" name="edit" title="Редактировать" value="">&nbsp;<input type="submit" class="delete" name="delete" title="Удалить" value=""></li>');
$('ul').find('li').first().find('input.pos').val(idItem1);
$('ul').find('li').first().find('span>input').first().val(idItem);
$('ul').find('li').first().find('.delete').val(idItem);
});
$('ul').on('click', '.edit', function(e){
e.preventDefault();
$(this).parent().find('.save').css('visibility','visible');
$(this).parent().find("input[type='text']").removeAttr("disabled").toggleClass('editable');
$(this).parent().find("span>input[type='text']").removeClass('editable');
$(this).parent().find("span>input[name='pos']").addClass('editable');//
var img = $(this).parent().find("span").last().find("img").attr('src');
//console.log(img);
$(this).parent().find("span").last().find("input").css("visibility","visible");
$(this).parent().find("span").last().append("<input type='file' name='flag' value='"+img+"'>");
});
//validation
//$('li').on('click', '.save', toValidate);
function toValidate(){
$(this).parent().find("input.editable").css("border","1px solid #d9d9d9");
var brand = $(this).parent().children(".editable").val();
//console.log(brand);
if (brand=='') {
//console.log(true);
$(this).parent().find(".editable").css("border","1px solid red");
return false;
}
else {
return true;
}
};
});
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment