Commit e0e82549bc4d2fb10827ce607faa68acf4289fe2
1 parent
36a8dd60
table
Showing
6 changed files
with
86 additions
and
114 deletions
Show diff stats
frontend/views/goods/index.php
| @@ -163,23 +163,7 @@ Pjax::begin(); | @@ -163,23 +163,7 @@ Pjax::begin(); | ||
| 163 | <?php | 163 | <?php |
| 164 | Pjax::end(); | 164 | Pjax::end(); |
| 165 | ?> | 165 | ?> |
| 166 | -<script type="text/javascript"> | ||
| 167 | - function changeText() { | ||
| 168 | - e = document.getElementById('button_grey_card'); | ||
| 169 | - e.innerHTML = e.innerHTML == "Скрыть карточку товара" ? "Открыть карточку товара" : "Скрыть карточку товара"; | ||
| 170 | - } | ||
| 171 | - $('#button_grey_card').click(function(){ | ||
| 172 | - changeText(); | ||
| 173 | - $(this).toggleClass('change_b'); | ||
| 174 | - $('.tovar_card').toggleClass('tovar_card_visible'); | ||
| 175 | - $('.table').toggleClass('table_height'); | ||
| 176 | - }); | ||
| 177 | - $('.link_sort').click(function(){ | ||
| 178 | - | ||
| 179 | - $(this).find('.desc').toggleClass('arrow_downA'); | ||
| 180 | - | ||
| 181 | - }) | ||
| 182 | -</script> | 166 | + |
| 183 | 167 | ||
| 184 | <div class="modal fade" id="details_content_block" > | 168 | <div class="modal fade" id="details_content_block" > |
| 185 | <div class="modal-dialog table_details"> | 169 | <div class="modal-dialog table_details"> |
frontend/views/goods/one_item.php
| @@ -20,9 +20,12 @@ $cross_prefix = ( empty($model->crosses) )? '': '_cross'; | @@ -20,9 +20,12 @@ $cross_prefix = ( empty($model->crosses) )? '': '_cross'; | ||
| 20 | <img src="/images/favourite_notactive.png" class="favourite"> | 20 | <img src="/images/favourite_notactive.png" class="favourite"> |
| 21 | <img src="/images/favourite.png" class="pose"> | 21 | <img src="/images/favourite.png" class="pose"> |
| 22 | </td> | 22 | </td> |
| 23 | - <td style="border-bottom: 0" class="large_width"><?= $model->description?> | ||
| 24 | - <a class="tecdoc_id_info" data-toggle="modal" data-target="#details_content_block" data-id="<?= $model->tecdoc_id ?>" href=""><img src="/images/gear.png"></a> | ||
| 25 | - <a href="" id="go_photo"><img src="/images/icon_cam.png"></a> | 23 | + <td style="border-bottom: 0" class="large_width"> |
| 24 | + <p><?= $model->description?></p> | ||
| 25 | + <div class="buttons_sm"> | ||
| 26 | + <a class="tecdoc_id_info" data-toggle="modal" data-target="#details_content_block" data-id="<?= $model->tecdoc_id ?>" href=""><img src="/images/gear.png"></a> | ||
| 27 | + <a href="" id="go_photo"><img src="/images/icon_cam.png"></a> | ||
| 28 | + </div> | ||
| 26 | </td> | 29 | </td> |
| 27 | <?php | 30 | <?php |
| 28 | $this->endBlock(); | 31 | $this->endBlock(); |
frontend/views/goods/one_item1.php deleted
| 1 | -<?php | ||
| 2 | -use \yii\helpers\Html; | ||
| 3 | - | ||
| 4 | -$this->registerCssFile('/css/BC2_catalog_zapchasti.css'); | ||
| 5 | -// если товар один и тот же то выводим только цену и кол-во | ||
| 6 | -// иначе всю информацию | ||
| 7 | -$new_good = false; | ||
| 8 | -//в провайдере в качестве ключей установлен - артикул | ||
| 9 | -$article_arr = $widget->dataProvider->getKeys(); | ||
| 10 | -if ( empty($article_arr[$index - 1]) || $article_arr[$index - 1] != $key ) | ||
| 11 | - // если предыдущий артикул равен текущему, то это тот же товар | ||
| 12 | - $new_good = true; | ||
| 13 | -?> | ||
| 14 | - | ||
| 15 | -<?php $this->beginBlock('item_details'); | ||
| 16 | -// выделим отдельно детали товара в блок, для опционального его вывода | ||
| 17 | -?> | ||
| 18 | - <tr style="border-bottom: 0"> | ||
| 19 | - <td style="border-bottom: 0" class="small_width"><?= $model->brand?></td> | ||
| 20 | - <td style="border-bottom: 0" class="medium_width"><?= $model->article?> | ||
| 21 | - <img src="/images/favourite_notactive.png" class="favourite"> | ||
| 22 | - <img src="/images/favourite.png" class="pose"> | ||
| 23 | - </td> | ||
| 24 | - <td style="border-bottom: 0" class="large_width"><?= $model->description?> | ||
| 25 | - <a class="tecdoc_id_info" data-toggle="modal" data-target="#details_content_block" data-id="<?= $model->tecdoc_id ?>" href=""><img src="/images/gear.png"></a> | ||
| 26 | - <a href="" id="go_photo"><img src="/images/icon_cam.png"></a> | ||
| 27 | - </td> | ||
| 28 | -<?php $this->endBlock(); ?> | ||
| 29 | - | ||
| 30 | - <?php $this->beginBlock('empty_details'); | ||
| 31 | - // иначе пустой блок | ||
| 32 | - ?> | ||
| 33 | - <tr style="border-bottom: 0;border-top: 0;"> | ||
| 34 | - <td style="border-bottom: 0;border-top: 0;"></td> | ||
| 35 | - <td style="border-bottom: 0;border-top: 0;"></td> | ||
| 36 | - <td style="border-bottom: 0;border-top: 0;"></td> | ||
| 37 | - | ||
| 38 | - <?php $this->endBlock(); ?> | ||
| 39 | - | ||
| 40 | - <?php | ||
| 41 | - if($new_good){ | ||
| 42 | - echo $this->blocks['item_details']; | ||
| 43 | - }else{ | ||
| 44 | - echo $this->blocks['empty_details']; | ||
| 45 | - } | ||
| 46 | - | ||
| 47 | - ?> | ||
| 48 | - <td class="right"> | ||
| 49 | - <table class="tovar_table right" cellspacing="0" cellpadding="0" border="0" style="border: 0;"> | ||
| 50 | - <tbody> | ||
| 51 | - <tr class="one" style="border-bottom: 0; | ||
| 52 | - border-top: 0;"> | ||
| 53 | - <td class="row_select" style="border-bottom: 0; | ||
| 54 | - border-top: 0;"> | ||
| 55 | - <div class="lend-tovar-cart-left"> | ||
| 56 | - <input type="text" class="lend-tovar-cart-number" value="1"> | ||
| 57 | - <div class="arrow-cart-lend-wr"> | ||
| 58 | - <img class="arrow-cart-lend-1" src="/images/arrow-cart-up.png" width="9" height="6" alt=""> | ||
| 59 | - <img class="arrow-cart-lend-2" src="/images/arrow-cart-down1.png" width="9" height="6" alt=""> | ||
| 60 | - </div> | ||
| 61 | - </div> | ||
| 62 | - <button class="purple">В корзину</button> | ||
| 63 | - </td> | ||
| 64 | - | ||
| 65 | - </tr> | ||
| 66 | - </tbody></table> | ||
| 67 | - | ||
| 68 | - </td> | ||
| 69 | - <td class="right_large"> | ||
| 70 | - <table class="inner" border='0' style='border-top:0; border-left:0'> | ||
| 71 | - <tr border='0' style='border-top:0; border-left:0'><td border='0' style='border-top:0; border-left:0'><?= $model->box ?></td></tr> | ||
| 72 | - | ||
| 73 | - </table> | ||
| 74 | - </td> | ||
| 75 | - <td class="right_small"><table class="inner" border='0' style='border-top:0; border-left:0'> | ||
| 76 | - <tr border='0' style='border-top:0; border-left:0'><td border='0' style='border-top:0; border-left:0'><?= $model->delivery?> дн.</td></tr> | ||
| 77 | - | ||
| 78 | - </table></td> | ||
| 79 | - <td class="right_medium"><table class="inner" border='0' style='border-top:0; border-left:0'> | ||
| 80 | - <tr border='0' style='border-top:0; border-left:0'><td border='0' style='border-top:0; border-left:0'><?= $model->outputPrice?></td></tr> | ||
| 81 | - | ||
| 82 | - </table></td> | ||
| 83 | - </tr> | ||
| 84 | - | ||
| 85 | - | ||
| 86 | - <div id="modal_form_photo"> | ||
| 87 | - <span id="modal_close"><img src="/images/close_form.png"></span> | ||
| 88 | - <img src="<?= $model->image ?>"> | ||
| 89 | - </div> | ||
| 90 | \ No newline at end of file | 0 | \ No newline at end of file |
frontend/web/css/general_styles.css
| @@ -2760,10 +2760,6 @@ margin-left: 0!important | @@ -2760,10 +2760,6 @@ margin-left: 0!important | ||
| 2760 | } | 2760 | } |
| 2761 | 2761 | ||
| 2762 | 2762 | ||
| 2763 | -#modal_form_photo img:nth-child(2){ | ||
| 2764 | - display: table; | ||
| 2765 | - margin: 112px auto; | ||
| 2766 | -} | ||
| 2767 | 2763 | ||
| 2768 | ::-webkit-input-placeholder { | 2764 | ::-webkit-input-placeholder { |
| 2769 | color: #333333; | 2765 | color: #333333; |
frontend/web/css/main.css
| @@ -625,4 +625,28 @@ div.required:after { content: " *"; | @@ -625,4 +625,28 @@ div.required:after { content: " *"; | ||
| 625 | 625 | ||
| 626 | .large_width{ | 626 | .large_width{ |
| 627 | padding-left:13px!important; | 627 | padding-left:13px!important; |
| 628 | +} | ||
| 629 | + | ||
| 630 | +.thin_line { | ||
| 631 | + line-height: 26px; | ||
| 632 | +} | ||
| 633 | + | ||
| 634 | +.bold_line { | ||
| 635 | + line-height: 25px; | ||
| 636 | +} | ||
| 637 | + | ||
| 638 | +.row_select { | ||
| 639 | + padding-bottom: 8px; | ||
| 640 | + width: 163px; | ||
| 641 | + position: relative; | ||
| 642 | + height: auto; | ||
| 643 | +} | ||
| 644 | + | ||
| 645 | + | ||
| 646 | +.large_width p{ | ||
| 647 | + width: 250px; | ||
| 648 | + display: inline-block; | ||
| 649 | +} | ||
| 650 | +.buttons_sm{ | ||
| 651 | + display: inline; | ||
| 628 | } | 652 | } |
| 629 | \ No newline at end of file | 653 | \ No newline at end of file |
frontend/web/js/goods.js
| @@ -47,4 +47,58 @@ $( document ).ready(function() { | @@ -47,4 +47,58 @@ $( document ).ready(function() { | ||
| 47 | } | 47 | } |
| 48 | } | 48 | } |
| 49 | 49 | ||
| 50 | -}) | 50 | + |
| 51 | +//модальное окно для фото | ||
| 52 | + $('a#go_photo').click( function(event){ // ловим клик по ссылки с id="go" | ||
| 53 | + event.preventDefault(); // выключаем стандартную роль элемента | ||
| 54 | + var scrollTop = window.pageYOffset ? window.pageYOffset : (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop); | ||
| 55 | + viewportHeight = $(window).height(); | ||
| 56 | + var modalWidth=$('#modal_form_photo').width()/2; | ||
| 57 | + var modalHeight=$('#modal_form_photo').outerHeight()/2; | ||
| 58 | + $('#overlay').fadeIn(400, // сначала плавно показываем темную подложку | ||
| 59 | + function(){ // после выполнения предъидущей анимации | ||
| 60 | + $('#modal_form_photo') | ||
| 61 | + .css({'display':'block',opacity: 1, marginTop: -modalHeight, marginLeft: -modalWidth}) // убираем у модального окна display: none; | ||
| 62 | + .animate({opacity: 1, top: scrollTop+(viewportHeight/2)}, 200); // плавно прибавляем прозрачность одновременно со съезжанием вниз | ||
| 63 | + | ||
| 64 | + | ||
| 65 | + }); | ||
| 66 | + | ||
| 67 | + }); | ||
| 68 | + /* Закрытие модального окна, тут делаем то же самое но в обратном порядке */ | ||
| 69 | + $('#modal_close, #overlay').click( function(){ // ловим клик по крестику или подложке | ||
| 70 | + $('#modal_form_photo') | ||
| 71 | + .animate({opacity: 0, top: '45%'}, 200, // плавно меняем прозрачность на 0 и одновременно двигаем окно вверх | ||
| 72 | + function(){ // после анимации | ||
| 73 | + $(this).css('display', 'none'); // делаем ему display: none; | ||
| 74 | + $('#overlay').fadeOut(400); // скрываем подложку | ||
| 75 | + } | ||
| 76 | + ); | ||
| 77 | + }); | ||
| 78 | + | ||
| 79 | + | ||
| 80 | + //открытие-закрытие карточки товара и смена текста на бирке карточки товара | ||
| 81 | + function changeText() { | ||
| 82 | + console.log('odfks'); | ||
| 83 | + e = document.getElementById('button_grey_card'); | ||
| 84 | + console.log( e.innerHTML ); | ||
| 85 | + e.innerHTML = e.innerHTML == "Скрыть карточку товара" ? "Открыть карточку товара" : "Скрыть карточку товара"; | ||
| 86 | + } | ||
| 87 | + $('#button_grey_card').click(function(){ | ||
| 88 | + changeText(); | ||
| 89 | + $(this).toggleClass('change_b'); | ||
| 90 | + $('.tovar_card').toggleClass('tovar_card_visible'); | ||
| 91 | + $('.table').toggleClass('table_height'); | ||
| 92 | + }); | ||
| 93 | + | ||
| 94 | + //стрелочки вниз | ||
| 95 | + $('.link_sort').click(function(){ | ||
| 96 | + | ||
| 97 | + $(this).find('.desc').toggleClass('arrow_downA'); | ||
| 98 | + | ||
| 99 | + }) | ||
| 100 | + | ||
| 101 | +}); | ||
| 102 | + | ||
| 103 | + | ||
| 104 | + |