Ищу html-шаблон универсального передаточного документа (УПД)

Собственно, проблема в теме изложена. Внезапно понадобилось выписывать еще и УПД. Заказчик прислал PDF, в тырнетах полно DOC/RTF/XLSX вариантов. Форма документа столь обширна, что вызывает грусть-тоску. Так что решил спросить: может, кто уже делал или находил сверстанный HTML-шаблон, при этом готов им поделиться — поделитесь, пожалуйста.

Виталий Батушев
Виталий Батушев
25 декабря 2020, 13:22
modx.pro
7 728

Комментарии: 9

Георгий
Георгий
25 апреля 2022, 12:53
Я тоже нигде не нашел, поэтому таки сверстал, что заняло нереальное количество времени. Выкладываю, во имя спасения страждущих!

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>

<body>
    <style>
    @page {
      /*size: 210mm 297mm; */
    size:  297mm 210mm;
      /* Chrome sets own margins, we change these printer settings */
      margin: 10mm 10mm 10mm 10mm;
    }

        body {
	margin:0px;
	width:100%;
	height:100%;
	background:#FFF;
}

@media screen {
    body {
        padding: 30px;
    }
}

* {
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
}

body,td,th {
	font-family: sans-serif;
	font-weight: normal;
	color:#000;
}
        
body .upd, .upd td, .upd th {
    font-size: 11px;
    vertical-align: top;
}

.bold {
	font-weight: bold;
}

a {
	color:#000;
    text-decoration: underline !important;
}
a img {
	border:none;
}

img.full_width {
	width:100%;
	height:auto;
}

h1,h2,h3 {
    font-weight: bold;
}

body,td,th {
	font-size:16px;
}
h1 {
	font-size:30px;
}
h2 {
	font-size:24px;
}
h3 {
	font-size:18px;
}

.gap {
	height:30px;
}

.nowrap {
	white-space:nowrap;
}

.clear {
	clear:both;
	height:0px;
	line-height:0px;
	font-size:0px;
}
.clearfix {
	overflow:hidden;
}

.vertical_centered_content {
	display: -webkit-flex;
	-webkit-align-items: center; 
	display: flex;
	align-items: center;
}
.vertical_centered_content > .inner {
	display:inline;
	width:100%;
}
.horizontal_centered_content {
	display: -webkit-flex;
	-webkit-justify-content: center;
	display: flex;
	justify-content: center;
	text-align:center;
}
.horizontal_centered_content > .inner {
	display:inline;
	width:100%;
}

@media screen {
    .doc.landscape {
        width: 1080px;
    }
    .doc.portrait {
        width: 720px;
    }
}
        
        .updorderlist, .updorderlist td {
            border: 1px solid #000;
            border-collapse: collapse;
        }
        
        .updskeleton, .updskeleton > tbody > tr > td {
            border: 1px solid #FFF;
        }
        
        table {
    border-collapse: collapse;
}

        
    </style>
    <div class="doc landscape upd">
        
<table class="updskeleton" width="100%" border="0" cellspacing="0" cellpadding="0">
  <tbody>
        <tr>
          <td width="110" style="padding: 5px">
                Универсальный передаточный документ

                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tbody>
                        <tr>
                            <td style="vertical-align: middle !important;">Статус:</td>
                            <td style="width: 50%; border: 1px solid #000; text-align: center !important; padding: 5px">1</td>
                        </tr>
                    </tbody>
                </table>
                
                1 — счет-фактура и передаточный документ (акт)

                2 — передаточный документ (акт)
            </td>
            <td style="border-left: 2px solid #000">
                <table width="100%" border="0" cellspacing="0" cellpadding="5">
                    <tbody>
                        <tr>
                            <td width="100">Счет-фактура №</td>
                            <td width="100" style="border-bottom: 1px solid #000; text-align: center !important">#code#</td>
                            <td width="20">от</td>
                            <td width="100" style="border-bottom: 1px solid #000; text-align: center !important">#date#</td>
                            <td width="20">(1)</td>
                            <td rowspan="2" style="text-align: right !important; font-size: 9px">
                                Приложение № 1 к постановлению Правительства Российской Федерации от 26 декабря 2011 г. № 1137
                                (в редакции постановления Правительства Российской Федерации от 2 апреля 2021 г. № 534)
                            </td>
                        </tr>
                        <tr>
                            <td>Исправление №</td>
                            <td style="border-bottom: 1px solid #000"> </td>
                            <td>от</td>
                            <td style="border-bottom: 1px solid #000"> </td>
                            <td>(1а)</td>
                        </tr>
                    </tbody>
                </table>
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tbody>
                        <tr>
                            <td width="50%">
                                <table width="100%" border="0" cellspacing="0" cellpadding="5">
                                    <tbody>
                                        <tr>
                                            <td width="170"><b>Продавец:</b></td>
                                            <td style="border-bottom: 1px solid #000">#companyname#</td>
                                            <td width="20">(2)</td>
                                        </tr>
                                        <tr>
                                            <td>Адрес:</td>
                                            <td style="border-bottom: 1px solid #000">#companyaddress#</td>
                                            <td>(2а)</td>
                                        </tr>
                                        <tr>
                                            <td>ИНН/КПП продавца:</td>
                                            <td style="border-bottom: 1px solid #000">#companyinn#/#companykpp#</td>
                                            <td>(2б)</td>
                                        </tr>
                                        <tr>
                                            <td>Грузоотправитель и его адрес:</td>
                                            <td style="border-bottom: 1px solid #000">#companyname#, #companyaddress#</td>
                                            <td>(3)</td>
                                        </tr>
                                        <tr>
                                            <td>Грузополучатель и его адрес:</td>
                                            <td style="border-bottom: 1px solid #000">#clientname#, #clientaddress#</td>
                                            <td>(4)</td>
                                        </tr>
                                        <tr>
                                            <td>К платежно-расчетному документу №</td>
                                            <td style="border-bottom: 1px solid #000">#updpp#</td>
                                            <td>(5)</td>
                                        </tr>
                                        <tr>
                                            <td>Документ об отгрузке</td>
                                            <td style="border-bottom: 1px solid #000"> </td>
                                            <td>(5a)</td>
                                        </tr>
                                    </tbody>
                                </table>
                                
                            </td>
                            <td>
                                <table width="100%" border="0" cellspacing="0" cellpadding="5">
                                    <tbody>
                                        <tr>
                                            <td width="170"><b>Покупатель:</b></td>
                                            <td style="border-bottom: 1px solid #000">#clientname#</td>
                                            <td width="20">(6)</td>
                                        </tr>
                                        <tr>
                                            <td>Адрес:</td>
                                            <td style="border-bottom: 1px solid #000">#clientaddress#</td>
                                            <td>(6а)</td>
                                        </tr>
                                        <tr>
                                            <td>ИНН/КПП покупателя:</td>
                                            <td style="border-bottom: 1px solid #000">#clientinn#/#clientkpp#</td>
                                            <td>(6б)</td>
                                        </tr>
                                        <tr>
                                            <td>Валюта: наименование, код</td>
                                            <td style="border-bottom: 1px solid #000">Российский рубль, 643</td>
                                            <td>(7)</td>
                                        </tr>
                                        <tr>
                                            <td>Идентификатор государственного контракта, договора (соглашения) (при наличии):</td>
                                            <td style="border-bottom: 1px solid #000"> </td>
                                            <td>(8)</td>
                                        </tr>
                                    </tbody>
                                </table>
                                
                            </td>
                        </tr>
                    </tbody>
                </table>

            </td>
        </tr>
    </tbody>
</table>
        
<table class="updorderlist" width="100%" border="0" cellspacing="0" cellpadding="5">
  <tbody>
    <tr style="font-size:9px">
      <td width="110" rowspan="2">Код товара / работ, услуг</td>
      <td width="30" rowspan="2" style="border-left:2px solid #000">№ п/п</td>
      <td rowspan="2">Наименование товара (описание выполненных работ, оказанных услуг), имущественного права</td>
      <td rowspan="2" width="40">Код вида това-
ра</td>
      <td colspan="2">Единица измерения</td>
      <td rowspan="2" width="70">Количест-
во (объём)</td>
      <td rowspan="2" width="70">Цена (тариф) за единицу измерения</td>
      <td rowspan="2" width="70">Стоимость товаров (работ, услуг), имущест-
венных прав без налога — всего</td>
      <td rowspan="2" width="50">В том числе сумма акциза</td>
      <td rowspan="2" width="50">Нало-
говая ставка</td>
      <td rowspan="2" width="70">Сумма налога, предъяв-
ляемая покупателю</td>
      <td rowspan="2" width="70">Стоимость товаров (работ, услуг), имущест-
венных прав с налогом — всего</td>
      <td colspan="2">Страна происхождения товара</td>
      <td rowspan="2" width="60" style="font-size:9px">Регистраци-
онный номер декларации на товары или регист-
рационный номер пар-
тии товара, подлежаще-
го просле-
живаемости</td>
    </tr>
    <tr>
      <td width="40">Код</td>
      <td width="30">Условно-
е обоз-
начение (нацио-
нальное)</td>
      <td width="30">Циф-
ровой код</td>
      <td width="30">Краткое наиме-
нование</td>
      </tr>
    <tr>
      <td style="border-right:2px solid #000; text-align: center; font-size: 9px">A</td>
      <td style="text-align: center; font-size: 9px">1</td>
      <td style="text-align: center; font-size: 9px">1а</td>
      <td style="text-align: center; font-size: 9px">1б</td>
      <td style="text-align: center; font-size: 9px">2</td>
      <td style="text-align: center; font-size: 9px">2а</td>
      <td style="text-align: center; font-size: 9px">3</td>
      <td style="text-align: center; font-size: 9px">4</td>
      <td style="text-align: center; font-size: 9px">5</td>
      <td style="text-align: center; font-size: 9px">6</td>
      <td style="text-align: center; font-size: 9px">7</td>
      <td style="text-align: center; font-size: 9px">8</td>
      <td style="text-align: center; font-size: 9px">9</td>
      <td style="text-align: center; font-size: 9px">10</td>
      <td style="text-align: center; font-size: 9px">10а</td>
      <td style="text-align: center; font-size: 9px">11</td>
    </tr>
    <tr>
      <td style="border-right:2px solid #000"> </td>
      <td>1</td>
      <td>ТОВАР</td>
      <td> </td>
      <td>046</td>
      <td>шт</td>
      <td>11110.000</td>
      <td>1000000.00</td>
      <td>1230000.00</td>
      <td> </td>
      <td>20%</td>
      <td>123123.00</td>
      <td>1000000.00</td>
      <td> </td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td style="border-right:2px solid #000"> </td>
      <td colspan="7">Всего к оплате (9)</td>
      <td>ИТОГО</td>
      <td colspan="2" style="text-align: center !important">X</td>
      <td>НАЛОГ</td>
      <td>ФИНИШ</td>
      <td colspan="3"> </td>
      </tr>
  </tbody>
</table>
<table class="updskeleton" width="100%" border="0" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
            <td width="110" style="padding: 5px">
                Документ составлен на 2 листах
            </td>
            <td style="border-left: 2px solid #000; border-bottom: 2px solid #000; padding-bottom: 5px">
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tbody>
                        <tr>
                            <td width="49%">
                                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                                  <tbody>
                                    <tr>
                                      <td width="170" style="padding: 5px">Руководитель организации или иное уполномоченное лицо</td>
                                      <td style="border-bottom: 1px solid #000; padding: 5px" width="100"> </td>
                                      <td width="10"> </td>
                                      <td style="vertical-align: bottom !important; border-bottom: 1px solid #000; padding: 5px">#companydirectorname#</td>
                                    </tr>
                                    <tr>
                                      <td> </td>
                                      <td style="text-align: center; font-size:9px">(подпись)</td>
                                      <td> </td>
                                      <td style="text-align: center; font-size:9px">(ф.и.о.)</td>
                                    </tr>
                                  </tbody>
                                </table>
                            </td>
                            <td width="2%"> </td>
                            <td>
                                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                                  <tbody>
                                    <tr>
                                      <td width="170" style="padding: 5px">Главный бухгалтер или иное уполномоченное лицо</td>
                                      <td style="border-bottom: 1px solid #000; padding: 5px" width="100"> </td>
                                      <td width="10"> </td>
                                      <td style="vertical-align: bottom !important; border-bottom: 1px solid #000; padding: 5px">#companydirectorname#</td>
                                    </tr>
                                    <tr>
                                      <td> </td>
                                      <td style="text-align: center; font-size:9px">(подпись)</td>
                                      <td> </td>
                                      <td style="text-align: center; font-size:9px">(ф.и.о.)</td>
                                    </tr>
                                  </tbody>
                                </table>
                            </td>
                        </tr>
                    </tbody>
                </table>
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                  <tbody>
                    <tr>
                      <td width="170" style="padding: 5px">Индивидуальный предприниматель или иное уполномоченное лицо</td>
                      <td style="border-bottom: 1px solid #000; padding: 5px" width="100"> </td>
                      <td width="10"> </td>
                      <td style="vertical-align: bottom !important; border-bottom: 1px solid #000; padding: 5px">#companydirectorname#</td>
                      <td width="2%"> </td>
                      <td style="vertical-align: bottom !important; border-bottom: 1px solid #000; padding: 5px" width="49%">#companyogrn#</td>
                    </tr>
                    <tr>
                      <td> </td>
                      <td style="text-align: center; font-size:9px">(подпись)</td>
                      <td> </td>
                      <td style="text-align: center; font-size:9px">(ф.и.о.)</td>
                      <td> </td>
                      <td style="text-align: center; font-size:9px">(реквизиты свидетельства о государственной регистрации индивидуального предпринимателя)</td>
                    </tr>
                  </tbody>
                </table>
            </td>
        </tr>
    </tbody>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tbody>
    <tr>
      <td width="280" style="padding: 5px">Основание передачи (сдачи) / получения (приемки)</td>
      <td style="border-bottom: 1px solid #000; padding: 5px">#basis#</td>
      <td width="10" style="padding: 5px">[8]</td>
    </tr>
    <tr>
      <td> </td>
      <td style="text-align: center; font-size:9px">(договор, доверенность и др.)</td>
      <td> </td>
    </tr>
  </tbody>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tbody>
    <tr>
      <td width="190" style="padding: 5px; padding-top:0px;">Данные о транспортировке и грузе</td>
      <td style="border-bottom: 1px solid #000; padding: 5px; padding-top:0px;"> </td>
      <td width="10" style="padding: 5px; padding-top:0px;">[9]</td>
    </tr>
    <tr>
      <td> </td>
      <td style="text-align: center; font-size:9px; padding-bottom: 5px">(транспортная накладная, поручение экспедитору, экспедиторская/складская расписка и др., масса нетто/брутто груза, если не приведены ссылки на транспортные документы, содержащие эти сведения)</td>
      <td> </td>
    </tr>
  </tbody>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0" style="page-break-inside:avoid">
    <tbody>
        <tr>
            <td width="50%" style="padding-right: 5px; border-right: 2px solid #000">
                <div style="padding-left:5px;">Товар (груз) передал / услуги, результаты работ, права сдал</div>
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                  <tbody>
                    <tr>
                      <td width="200" style="border-bottom: 1px solid #000; padding: 5px">#companydirectorposition#</td>
                      <td width="10"> </td>
                      <td style="border-bottom: 1px solid #000" width="100"> </td>
                      <td width="10"> </td>
                      <td style="border-bottom: 1px solid #000; padding: 5px">#companydirectorname#</td>
                      <td width="10" style="padding: 5px">[10]</td>
                    </tr>
                    <tr>
                      <td style="text-align: center; font-size:9px">(должность)</td>
                      <td> </td>
                      <td style="text-align: center; font-size:9px">(подпись)</td>
                      <td> </td>
                      <td style="text-align: center; font-size:9px">(ф.и.о.)</td>
                      <td> </td>
                    </tr>
                  </tbody>
                </table>
                <table width="100%" border="0" cellspacing="0" cellpadding="5">
                  <tbody>
                    <tr>
                      <td width="210">Дата отгрузки, передачи (сдачи)</td>
                      <td style="border-bottom: 1px solid #000;">#date#</td>
                      <td width="10">[11]</td>
                    </tr>
                  </tbody>
                </table>
                
                <div style="padding-left:5px;">Иные сведения об отгрузке, передаче</div>
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                  <tbody>
                    <tr>
                      <td style="border-bottom: 1px solid #000"> </td>
                      <td width="10" style="padding: 5px">[12]</td>
                    </tr>
                    <tr>
                      <td style="text-align: center; font-size:9px">(ссылки на неотъемлемые приложения, сопутствующие документы, иные документы и т.п.)</td>
                      <td> </td>
                    </tr>
                  </tbody>
                </table>
                
                <div style="padding-left:5px;">Ответственный за правильность оформления факта хозяйственной жизни</div>
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                  <tbody>
                    <tr>
                      <td width="200" style="border-bottom: 1px solid #000; padding: 5px">#companydirectorposition#</td>
                      <td width="10"> </td>
                      <td style="border-bottom: 1px solid #000" width="100"> </td>
                      <td width="10"> </td>
                      <td style="border-bottom: 1px solid #000; padding: 5px">#companydirectorname#</td>
                      <td width="10" style="padding: 5px">[13]</td>
                    </tr>
                    <tr>
                      <td style="text-align: center; font-size:9px">(должность)</td>
                      <td> </td>
                      <td style="text-align: center; font-size:9px">(подпись)</td>
                      <td> </td>
                      <td style="text-align: center; font-size:9px">(ф.и.о.)</td>
                      <td> </td>
                    </tr>
                  </tbody>
                </table>
                
                <div style="padding-left:5px;">Наименование экономического субъекта — составителя документа (в т. ч. комиссионера / агента)</div>
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                  <tbody>
                    <tr>
                      <td style="border-bottom: 1px solid #000; padding: 5px">#companyname#, ИНН/КПП #companyinn#/#companykpp#</td>
                      <td width="10" style="padding: 5px">[14]</td>
                    </tr>
                    <tr>
                      <td style="text-align: center; font-size:9px">(может не заполняться при проставлении печати в М.П., может быть указан ИНН/КПП)</td>
                      <td> </td>
                    </tr>
                  </tbody>
                </table>
                
                <div style="padding-left:50px;">М.П.</div>
            </td>
            <td style="padding-left: 5px">
                <div style="padding-left:5px;">Товар (груз) получил / услуги, результаты работ, права принял</div>
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                  <tbody>
                    <tr>
                      <td width="200" style="border-bottom: 1px solid #000;"> </td>
                      <td width="10"> </td>
                      <td style="border-bottom: 1px solid #000" width="100"> </td>
                      <td width="10"> </td>
                      <td style="border-bottom: 1px solid #000;"> </td>
                      <td width="10" style="padding: 5px">[15]</td>
                    </tr>
                    <tr>
                      <td style="text-align: center; font-size:9px">(должность)</td>
                      <td> </td>
                      <td style="text-align: center; font-size:9px">(подпись)</td>
                      <td> </td>
                      <td style="text-align: center; font-size:9px">(ф.и.о.)</td>
                      <td> </td>
                    </tr>
                  </tbody>
                </table>
                <table width="100%" border="0" cellspacing="0" cellpadding="5">
                  <tbody>
                    <tr>
                      <td width="210">Дата получения (приемки)</td>
                      <td style="border-bottom: 1px solid #000;"> </td>
                      <td width="10">[16]</td>
                    </tr>
                  </tbody>
                </table>
                
                <div style="padding-left:5px;">Иные сведения о получении, приемке</div>
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                  <tbody>
                    <tr>
                      <td style="border-bottom: 1px solid #000"> </td>
                      <td width="10" style="padding: 5px">[17]</td>
                    </tr>
                    <tr>
                      <td style="text-align: center; font-size:9px">(информация о наличии/отсутствии претензии; ссылки на неотъемлемые приложения и другие документы и т. п.)</td>
                      <td> </td>
                    </tr>
                  </tbody>
                </table>
                
                <div style="padding-left:5px;">Ответственный за правильность оформления факта хозяйственной жизни</div>
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                  <tbody>
                    <tr>
                      <td width="200" style="border-bottom: 1px solid #000"> </td>
                      <td width="10"> </td>
                      <td style="border-bottom: 1px solid #000" width="100"> </td>
                      <td width="10"> </td>
                      <td style="border-bottom: 1px solid #000"> </td>
                      <td width="10" style="padding: 5px">[18]</td>
                    </tr>
                    <tr>
                      <td style="text-align: center; font-size:9px">(должность)</td>
                      <td> </td>
                      <td style="text-align: center; font-size:9px">(подпись)</td>
                      <td> </td>
                      <td style="text-align: center; font-size:9px">(ф.и.о.)</td>
                      <td> </td>
                    </tr>
                  </tbody>
                </table>
                
                <div style="padding-left:5px;">Наименование экономического субъекта — составителя документа</div>
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                  <tbody>
                    <tr>
                      <td style="border-bottom: 1px solid #000; padding: 5px">#clientname#, ИНН/КПП #clientinn#/#clientkpp#</td>
                      <td width="10" style="padding: 5px">[19]</td>
                    </tr>
                    <tr>
                      <td style="text-align: center; font-size:9px">(может не заполняться при проставлении печати в М.П., может быть указан ИНН/КПП)</td>
                      <td> </td>
                    </tr>
                  </tbody>
                </table>
                
                <div style="padding-left:50px;">М.П.</div>
            </td>
        </tr>
    </tbody>
</table>

        
    </div>
</body>
</html>
    Alexandr
    Alexandr
    01 февраля 2023, 09:15
    Зарегистрировался только для того чтобы сказать тебе спасибо, мужик, за труд и за то, что поделился! Печатная форма УПД
      partmall.ru
      partmall.ru
      06 февраля 2023, 14:16
      Тоже зарегистрировался, чтобы выразить благодарность! Спасибо вам, что сэкономили кучу моего времени и нервных клеток!
        Екатерина
        Екатерина
        26 декабря 2023, 15:40
        Благодарю!
        Кирилл
        Кирилл
        15 марта 2023, 15:12
        Тоже хотел, во-первых, поблагодарить Георгия за форму. Но проблема в том, что я сначала потратил 3 дня, чтобы свою сварганить, а потом только ради прикола решил проверить, есть ли в инете готовая))) Да, такое тоже бывает.
        В итоге, что мы имеем. Я тоже решил выложить свой результат.
        Моя форма дополнена java-скриптом, который подсчитывает общую сумму включённых в таблицу товаров. Также несколько насыщеннее оформлена по стилям (CSS), ну, и является адаптивной (тянется как под альбомную, так и под книжную распечатку). В общем, пользуйтесь на здоровье.

        <!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Универсальный передаточный документ</title>

    <style>
        /* Общие */
        /*Структура
        str: 1_1 | 1_2 (1_2_1, 1_2_2, 1_2_3)
        str:     2
        str: 3_1 | 3_2
        str:     4
        str: 5_1 | 5_2
        */
        body {margin: 0px; padding: 0px}
        table {border-collapse: collapse;}
        td {border: 0px solid black}
        th {border: 0px solid black}
        .border_a, .border_a td {border: 4px solid black;} /*Бордюр вокруг*/
        .border_r, .str2 td.border_r {border-right: 4px solid black;} /*Бордюр справа*/
        .border_b {border-bottom: 4px solid black;} /*Бордюр снизу*/
        .border_b_lite {border-bottom: 1px solid black;}
        .bold {font-weight: bold;} /*Жирный шрифт*/
        .footnote {font-size: 70%; text-align: center; vertical-align: top;} /*Сноска -- подпись под строкой*/
        .cut_string {border-right: 10px solid white;} /*Усечение подстрочных линий*/
        .small_text {font-size: 70%} /*Мелкий шрифт*/
        .vertical_text {writing-mode: vertical-lr;} /*Вертикальный текст*/

        /* --str1_2-- Столбец правый _ Строка первая: TABLE + DIV _ НОМЕР СЧЕТА ФАКТУРЫ, ИСПРАВЛЕНИЕ. ПРИЛОЖЕНИЕ №1 */
        .str1_2 {display: flex; justify-content: left;} /*Ставим у родительского блока*/
        .str1_2_1 {width: 45%;}
        .str1_2_2 {width: 55%; line-height: 0; text-align: right;} /* Убираем строки */

        /* --str1_2_3-- */
        .str1_2_3 {width: 100%; margin-bottom: 5px;} /*Ставим у родительского блока*/
        .str1_2 th, .str1_2_3 th {text-align: left; font-weight: normal;}
        .str1_2 th {white-space: pre;}

        /* --str2-- */
        .str2 td {border: 1px solid black; text-align: center; font-size: 90%;}
        .str2 th {text-align: left;}


        /* --str3-- */
        .str3 {width: 100%; margin-top: 15px;} /*Ставим у родительского блока*/

        /* --str4-- */
        .str4 {width: 100%;} /*Ставим у родительского блока*/

        /* --str5-- Столбец 1 и 2 */
        .str5 {display: flex; justify-content: left;} /*Ставим у родительского блока*/
        .str5_1 {width: 50%;}
        .str5_2 {width: 50%;} /* Убираем строки */

        /**/

    </style>
    <script type="text/javascript">
        function startsumms(){
            /*summ('sum1count', 'summ1res');*/
            summ('customPrices1','summPrice1');
            summ('customPrices2','summPrice2');
            summ('customPrices3','summPrice3');
            MakePricesFormat();
            /*window.print()*/;
        }

        function summ(fromClass,toId){
            try{
                var amount = 0;
                var tdArr = document.getElementsByClassName(fromClass);

                for(var i =0; i < tdArr.length; i++){
                    var res = tdArr[i].innerHTML.replace(",", ".");
                    var getint = parseFloat(res);
                    if(!isNaN(getint)){ amount = amount + getint; }
                }
                if(isNaN(amount)){amount=0;}
                document.getElementById(toId).innerHTML = amount;
            }
            catch(e){
                document.getElementById(toId).innerHTML = amount.toFixed(2);
            }
        }

        function MakePricesFormat(){
            var tdArr = document.getElementsByClassName("customPrices");

            for(var i =0; i < tdArr.length; i++)
            {
                var getint = parseFloat(tdArr[i].innerHTML.replace(",", "."));
                if(!isNaN(getint))
                {
                    tdArr[i].innerHTML = parseFloat(tdArr[i].innerHTML.replace(",", ".")).toFixed(2);
                }
            }

            var tdArr = document.getElementsByClassName("sum1count");

            for (var i = 0; i < tdArr.length; i++)
            {
                var getint = parseFloat(tdArr[i].innerHTML.replace(",", "."));
                if (!isNaN(getint))
                {
                    tdArr[i].innerHTML = parseFloat(tdArr[i].innerHTML.replace(",", ".")).toFixed(2);
                }
            }
        }

        function number_to_string(_number) {
            var _arr_numbers = new Array();
            _arr_numbers[1] = new Array('', 'один', 'два', 'три', 'четыре', 'пять', 'шесть', 'семь', 'восемь', 'девять', 'десять', 'одиннадцать', 'двенадцать', 'тринадцать', 'четырнадцать', 'пятнадцать', 'шестнадцать', 'семнадцать', 'восемнадцать', 'девятнадцать');
            _arr_numbers[2] = new Array('', '', 'двадцать', 'тридцать', 'сорок', 'пятьдесят', 'шестьдесят', 'семьдесят', 'восемьдесят', 'девяносто');
            _arr_numbers[3] = new Array('', 'сто', 'двести', 'триста', 'четыреста', 'пятьсот', 'шестьсот', 'семьсот', 'восемьсот', 'девятьсот');
            function number_parser(_num, _desc) {
                var _string = '';
                var _num_hundred = '';
                if (_num.length == 3) {
                    _num_hundred = _num.substr(0, 1);
                    _num = _num.substr(1, 3);
                    _string = _arr_numbers[3][_num_hundred] + ' ';
                }
                if (_num < 20) _string += _arr_numbers[1][parseFloat(_num)] + ' ';
                else {
                    var _first_num = _num.substr(0, 1);
                    var _second_num = _num.substr(1, 2);
                    _string += _arr_numbers[2][_first_num] + ' ' + _arr_numbers[1][_second_num] + ' ';
                }
                switch (_desc){
                    case 0:
                        var _last_num = parseFloat(_num.substr(-1));
                        if (_last_num == 1) _string += 'рубль';
                        else if (_last_num > 1 && _last_num < 5) _string += 'рублей';
                        else _string += 'рублей';
                        break;
                    case 1:
                        var _last_num = parseFloat(_num.substr(-1));
                        if (_last_num == 1) _string += 'тысяча ';
                        else if (_last_num > 1 && _last_num < 5) _string += 'тысяч ';
                        else _string += 'тысяч ';
                        _string = _string.replace('один ', 'одна ');
                        _string = _string.replace('два ', 'две ');
                        break;
                    case 2:
                        var _last_num = parseFloat(_num.substr(-1));
                        if (_last_num == 1) _string += 'миллион ';
                        else if (_last_num > 1 && _last_num < 5) _string += 'миллиона ';
                        else _string += 'миллионов ';
                        break;
                    case 3:
                        var _last_num = parseFloat(_num.substr(-1));
                        if (_last_num == 1) _string += 'миллиард ';
                        else if (_last_num > 1 && _last_num < 5) _string += 'миллиарда ';
                        else _string += 'миллиардов ';
                        break;
                }
                _string = _string.replace('  ', ' ');
                return _string;
            }
            function decimals_parser(_num) {
                var _first_num = _num.substr(0, 1);
                var _second_num = parseFloat(_num.substr(1, 2));
                var _string = ' ' + _first_num + _second_num;
                if (_second_num == 1) _string += ' копейка';
                else if (_second_num > 1 && _second_num < 5) _string += ' копеек';
                else _string += ' копеек';
                return _string;
            }
            if (!_number || _number == 0) return ''
            if (typeof _number !== 'number') {
                _number = _number.replace(',', '.');
                _number = parseFloat(_number);
                if (isNaN(_number)) return ''
            }
            _number = _number.toFixed(2);
            if(_number.indexOf('.') != -1) {
                var _number_arr = _number.split('.');
                var _number = _number_arr[0];
                var _number_decimals = _number_arr[1];
            }
            var _number_length = _number.length;
            var _string = '';
            var _num_parser = '';
            var _count = 0;
            for (var _p = (_number_length - 1); _p >= 0; _p--) {
                var _num_digit = _number.substr(_p, 1);
                _num_parser = _num_digit +  _num_parser;
                if ((_num_parser.length == 3 || _p == 0) && !isNaN(parseFloat(_num_parser))) {
                    _string = number_parser(_num_parser, _count) + _string;
                    _num_parser = '';
                    _count++;
                }
            }
            if (_number_decimals) _string += decimals_parser(_number_decimals);
            return _string;
        }
    </script>

    <script language="javascript">
        window.onload = function(){
            startsumms();
        };
    </script>
</head>
<body onload="startsumms();">
        <table>
            <tr>
                <td colspan="2" class="border_r" style="width: 8%;">
                    <p style="margin-right: 5px;">Универсальный передаточный документ</p>
                    <p>Статус: <span style="border: 3px solid black; padding: 0px 5px;">1</span></p>
                    <p class="small_text">1 — счет-фактура и передаточный документ (акт)</p>
                    <p class="small_text">2 — передаточный документ (акт)</p>
                </td>
                <td colspan="14">
                    <div class="str1_2">
                        <table class="str1_2_1">
                            <tr>
                                <th style="width: 16%;">Счет-фактура №</th>
                                <td style="width: 18%;" class="border_b_lite cut_string"></td>
                                <td style="width: 4%;">от</td>
                                <td style="width: 22%;" class="border_b_lite"></td>
                                <td style="width: 30px">(1)</td>
                            </tr>
                            <tr>
                                <th>Исправление №</th>
                                <td class="border_b_lite cut_string"></td>
                                <td>от</td>
                                <td class="border_b_lite"></td>
                                <td>(1а)</td>
                            </tr>
                        </table>
                        <div class="str1_2_2">
                            <p class="small_text">Приложение №1</p>
                            <p class="small_text">к постановлению Правительства Российской Федерации от 26 декабря 2011 г. N 1137</p>
                            <p class="small_text">(в ред. постановления Правительства РФ от 19 августа 2017 № 981)</p>
                        </div>
                    </div>
                    <table class="str1_2_3">
                        <tr> <!-- 1 -->
                            <td style="width: 15%" class="bold">Продавец</td>
                            <td colspan="6" class="border_b_lite">123</td>
                            <td style="width: 30px">(2)</td>
                        </tr> <!-- 2 -->
                        <tr>
                            <th>Адрес</th>
                            <td colspan="6" class="border_b_lite">123</td>
                            <td>(2а)</td>
                        </tr>
                        <tr> <!-- 3 -->
                            <th>ИНН/КПП продавца</th>
                            <td colspan="6" class="border_b_lite">123</td>
                            <td>(2б)</td>
                        </tr> <!-- 4 -->
                        <tr>
                            <td>Грузоотправитель и его адрес</td>
                            <td colspan="6" class="border_b_lite">123</td>
                            <td>(3)</td>
                        </tr>
                        <tr> <!-- 5 -->
                            <td>Грузополучатель и его адрес</td>
                            <td colspan="6" class="border_b">123</td>
                            <td>(4)</td>
                        </tr>
                        <tr> <!-- 6 -->
                            <td>К платежно-расчетному документу</td>
                            <td style="width: 5%">№</td>
                            <td style="width: 5%" class="border_b"></td>
                            <td style="width: 5%">от</td>
                            <td colspan="3" class="border_b"></td>
                            <td>(5)</td>
                        </tr>
                        <tr> <!-- 7 -->
                            <td>Документ об отгрузке</td>
                            <td>№ п/п</td>
                            <td class="border_b_lite"></td>
                            <td>№</td>
                            <td style="width: 5%" class="border_b_lite"></td>
                            <td style="width: 5%">от</td>
                            <td class="border_b_lite"></td>
                            <td>(5а)</td>
                        </tr>
                        <tr> <!-- 8 -->
                            <td class="bold">Покупатель</td>
                            <td colspan="6" class="border_b_lite">123</td>
                            <td>(6)</td>
                        </tr>
                        <tr> <!-- 9 -->
                            <td>Адрес</td>
                            <td colspan="6" class="border_b_lite">123</td>
                            <td>(6а)</td>
                        </tr>
                        <tr> <!-- 10 -->
                            <td>ИНН/КПП покупателя</td>
                            <td colspan="6" class="border_b_lite">123</td>
                            <td>(6б)</td>
                        </tr>
                        <tr> <!-- 11 -->
                            <td>Валюта: наименование, код</td>
                            <td colspan="6" class="border_b_lite">Российский рубль, 643</td>
                            <td>(7)</td>
                        </tr>
                        <tr> <!-- 12 -->
                            <td colspan="5">Идентификатор государственного контракта, договора (соглашения) (при наличии)</td>
                            <td colspan="2" class="border_b_lite"></td>
                            <td>(8)</td>
                        </tr>
                    </table>

                </td>
            </tr>
                    <!--table class="str2"-->
                        <tr class="border_a str2"> <!-- 1 -->
                            <td rowspan="2" style="width: 3%">№<br />п/п</td>
                            <td rowspan="2" class="border_r" style="width: 5%">Код товара/ работ, услуг</td>
                            <td rowspan="2">Наименование товара (описание выполненных работ, оказанных услуг), имущественного права</td>
                            <td rowspan="2">Код вида товара</td>
                            <td colspan="2">Единица измерения</td>
                            <td rowspan="2" style="height: 150px;" class="vertical_text">Количество (объем)</td>
                            <td rowspan="2">Цена (тариф) за единицу измерения</td>
                            <td rowspan="2" style="height: 150px;" class="vertical_text">Стоимость товаров (работ, услуг), имущественных прав без налога – всего </td>
                            <td rowspan="2">В том числе сумма акциза</td>
                            <td rowspan="2">Налоговая ставка</td>
                            <td rowspan="2" style="height: 150px;" class="vertical_text">Сумма налога, предъявляемая покупателю</td>
                            <td rowspan="2" style="height: 150px;" class="vertical_text">Стоимость товаров (работ, услуг), имущественных прав с налогом – всего</td>
                            <td colspan="2">Страна происхождения товара</td>
                            <td rowspan="2" style="height: 150px;" class="vertical_text">Регистрационный номер таможенной декларации</td>
                        </tr>
                        <tr class="border_a str2"> <!-- 2 -->
                            <td>Код</td>
                            <td>Условное обозначение (национальное)</td>
                            <td>Цифровой код</td>
                            <td>Краткое наименование</td>
                        </tr>
                        <tr class="str2"> <!-- 3 -->
                            <td>А</td>
                            <td class="border_r str2">Б</td>
                            <td>1</td>
                            <td>1а</td>
                            <td>2</td>
                            <td>2а</td>
                            <td>3</td>
                            <td>4</td>
                            <td>5</td>
                            <td>6</td>
                            <td>7</td>
                            <td>8</td>
                            <td>9</td>
                            <td>10</td>
                            <td>10а</td>
                            <td>11</td>
                        </tr>
                        <tr netixexp='[%foreach{this.Items;1;49}%]' class="str2"> <!-- 4 -->
                            <td>123</td>
                            <td class="border_r">123</td>
                            <td style="text-align: left;">123</td>
                            <td></td>
                            <td>321</td>
                            <td>321</td>
                            <td>321</td>
                            <td>321</td>
                            <td class="customPrices1">321</td>
                            <td></td>
                            <td>321</td><!---->
                            <td class="customPrices2">321</td>
                            <td class="customPrices3">321</td>
                            <td></td>
                            <td></td>
                            <td>321</td>
                        </tr>
                        <tr class="border_a str2"> <!-- 5 -->
                            <td></td>
                            <td class="border_r"></td>
                            <th colspan="6">Всего к оплате:</th>
                            <td id='summPrice1'>0,00</td>
                            <td colspan="2">X</td>
                            <td id='summPrice2'>0,00</td>
                            <td id='summPrice3'>0,00</td>
                            <td></td>
                            <td></td>
                            <td></td>
                    <!--/table-->
            </tr>
            <tr>
                <td colspan="2" class="border_r"><p>Документ составлен на <span style="border-bottom: 3px solid black; padding: 0px 5px;">3</span> листах</p></td>
                <td colspan="14">
                    <table class="str3">
                        <tr>
                            <td style="width: 20%">Руководитель организации или иное уполномоченное лицо</td>
                            <td style="width: 8%" class="border_b_lite"></td>
                            <td style="width: 20%" class="border_b_lite"></td>
                            <td style="width: 20%">Главный бухгалтер или иное уполномоченное лицо</td>
                            <td style="width: 8%" class="border_b_lite"></td>
                            <td style="width: 20%" class="border_b_lite"></td>
                        </tr>
                        <tr>
                            <td></td>
                            <td class="footnote cut_string">подпись</td>
                            <td class="footnote">Ф.И.О.</td>
                            <td></td>
                            <td class="footnote cut_string">подпись</td>
                            <td class="footnote">Ф.И.О.</td>
                        </tr>
                        <tr>
                            <td>Индивидуальный предприниматель</td>
                            <td class="border_b cut_string"></td>
                            <td class="border_b cut_string"></td>
                            <td colspan="3" class="border_b"></td>
                        </tr>
                        <tr class="border_b">
                            <td></td>
                            <td class="footnote">подпись</td>
                            <td class="footnote">Ф.И.О.</td>
                            <td colspan="3">(реквизиты свидетельства о государственной регистрации индивидуального предпринимателя)</td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
        <table class="str4">
            <tr>
                <td>Основание передачи (сдачи)/получения (приемки)</td>
                <td class="border_b_lite"></td>
                <td style="width: 30px">[8]</td>
            </tr>
            <tr>
                <td></td>
                <td class="footnote">(договор; доверенность и др.)</td>
                <td></td>
            </tr>
            <tr>
                <td>Данные о транспортировке и грузе</td>
                <td class="border_b"></td>
                <td>[9]</td>
            </tr>
            <tr>
                <td></td>
                <td class="footnote">(транспортная накладная, поручение экспедитору, экспедиторская / складская расписка и др. / масса нетто/бруттно груза, если не приведены ссылки на транспортные документы, содержащие эти сведения)</td>
                <td></td>
            </tr>
        </table>
        <div class="str5">
            <table class="str5_1">
                <tr>
                    <td colspan="4">Товар (груз) передал/услуги, результаты работ, права сдал</td>
                </tr>
                <tr>
                    <td style="width: 30%;" class="border_b_lite cut_string"></td>
                    <td style="width: 30%;" class="border_b_lite cut_string"></td>
                    <td style="width: 35%;" class="border_b_lite"></td>
                    <td style="width: 30px">[10]</td>
                </tr>
                <tr>
                    <td class="footnote cut_string">(должность)</td>
                    <td class="footnote cut_string">(подпись)</td>
                    <td class="footnote">(Ф.И.О.)</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Дата отгрузки, передачи (сдачи)</td>
                    <td colspan="2">"__" ___________ 20__ г.</td>
                    <td>[11]</td>
                </tr>
                <tr>
                    <td colspan="4">Иные сведения об отгрузке</td>
                </tr>
                <tr>
                    <td colspan="3" class="border_b_lite"></td>
                    <td>[12]</td>
                </tr>
                <tr>
                    <td colspan="3" class="footnote">(ссылки на неотъемлемые приложения, сопутствующие документы, иные документы и т.п.)</td>
                    <td></td>
                </tr>
                <tr>
                    <td colspan="4">Ответственный за правильность оформления факта хозяйственной жизни</td>
                </tr>
                <tr>
                    <td class="border_b cut_string"></td>
                    <td class="border_b cut_string"></td>
                    <td class="border_b"></td>
                    <td>[13]</td>
                </tr>
                <tr>
                    <td class="footnote cut_string">(должность)</td>
                    <td class="footnote cut_string">(подпись)</td>
                    <td class="footnote">(Ф.И.О.)</td>
                    <td></td>
                </tr>
                <tr>
                    <td colspan="4">Наименование экономического субъекта — составителя документа (в т.ч. комиссионера/агента)</td>
                </tr>
                <tr>
                    <td colspan="3" class="border_b_lite"></td>
                    <td>[14]</td>
                </tr>
                <tr>
                    <td colspan="4" class="footnote">(может не заполняться при проставлении печати в М.П., может быть указан ИНН/КПП)</td>
                </tr>
                <tr>
                    <td colspan="4">М.П.</td>
                </tr>
            </table>
            <table class="str5_2">
                <tr>
                    <td colspan="4">Товар (груз) получил/услуги, результаты работ, права принял</td>
                </tr>
                <tr>
                    <td style="width: 30%" class="border_b_lite cut_string"></td>
                    <td style="width: 30%" class="border_b_lite cut_string"></td>
                    <td style="width: 40%" class="border_b_lite"></td>
                    <td style="width: 30px">[15]</td>
                </tr>
                <tr>
                    <td class="footnote cut_string">(должность)</td>
                    <td class="footnote cut_string">(подпись)</td>
                    <td class="footnote">(Ф.И.О.)</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Дата отгрузки, передачи (сдачи)</td>
                    <td colspan="2">"__" ___________ 20__ г.</td>
                    <td>[16]</td>
                </tr>
                <tr>
                    <td colspan="4">Иные сведения о получении, приёмке</td>
                </tr>
                <tr>
                    <td colspan="3" class="border_b_lite"></td>
                    <td>[17]</td>
                </tr>
                <tr>
                    <td colspan="3" class="footnote">(информация о наличии/отсутствии претензий, ссылки на неотъемлемые приложения и другие документы и т.п.)</td>
                    <td></td>
                </tr>
                <tr>
                    <td colspan="4">Ответственный за правильность оформления факта хозяйственной жизни</td>
                </tr>
                <tr>
                    <td class="border_b cut_string"></td>
                    <td class="border_b cut_string"></td>
                    <td class="border_b"></td>
                    <td>[18]</td>
                </tr>
                <tr>
                    <td class="footnote cut_string">(должность)</td>
                    <td class="footnote cut_string">(подпись)</td>
                    <td class="footnote">(Ф.И.О.)</td>
                    <td></td>
                </tr>
                <tr>
                    <td colspan="4">Наименование экономического субъекта — составителя документа</td>
                </tr>
                <tr>
                    <td colspan="3" class="border_b_lite"></td>
                    <td>[19]</td>
                </tr>
                <tr>
                    <td colspan="4" class="footnote">(может не заполняться при проставлении печати в М.П., может быть указан ИНН/КПП)</td>
                </tr>
                <tr>
                    <td colspan="4">М.П.</td>
                </tr>
            </table>
        </div>
</body>
</html>
        Alexey
        Alexey
        31 августа 2023, 16:59
        Искал тоже. Вопрос решился за 5 минут. В ЭДО сбиса был прекрасный шаблон. Адаптивный + более компактно печатается чем выше представленные. Советую. Думаю они есть в любом ЭДО, но в некоторый могут быть более сложно сверстаны и запрятаны стили.
        Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
        9