Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 09.06.2018, 09:25
Новичок на форуме
Отправить личное сообщение для D-Nik Lubny Посмотреть профиль Найти все сообщения от D-Nik Lubny
 
Регистрация: 18.03.2018
Сообщений: 7

Формирование PDF файла с помощью pdfmake
Здравствуйте, используя pdfmake пытаюсь сформировать Счет-Фактуру. Но возникла проблема с добавлением изображения в PDF-файл.
Есть код:
var docDefinition = {
    info: {
		title: "Счет-Фактура",
		author: "Мебель-Сервис",
		subject: "Счет-Фактура",
		keywords: ""
	},
	
pageSize:'A4',
pageOrientation:'landscape',
pageMargins:[50,50,30,60],

header:function(curentPage,pageCount) {
	return {
	text:curentPage.toString() + 'из' + pageCount,
	alignment:'right',
	margin:[0,30,10,50]
	}
},

footer:[
{
	text:'www.mebel-service.com.ua',
	alignment:'center' //left or right
}
],
content: [
{
		image: 'img/logo.jpg',
		fit: [100, 100],
		pageBreak: 'after'
	},
{
	text:'СЧЕТ-ФАКТУРА',
	fontsize:20,
	alignment:'center'
},
{
	columns:[
	{
		width:'auto',
		text:'Наименование товара'
	},
	{
		width:'auto',
		text:'Наименование товара 2'
	},
	],
	ColumnGap: 50
},
{table:{
	widths:['*','auto',150,'*'],
	
	body:[
	['Первая','Вторая','Третья','Четвертая'],
	['Первая','Вторая','Третья','Четвертая'],
	[{text:'текстовое содержимое',bold:true},'Вторая','Третья','Четвертая']
	],
	headerRows:1
}}
]
}
pdfMake.createPdf(docDefinition).download(name.pdf);

Но файл не формируется из-за ошибки
uncaught exception: invalid image, images dictionary should contain dataURL entries (or local file paths in node.js)

Если убрать код добавления изображения, то все нормально работает.
{
		image: 'img/logo.jpg',
		fit: [100, 100],
		pageBreak: 'after'
	},

Помогите пожалуйста добавить в файл логотип компании.
Ответить с цитированием
  #2 (permalink)  
Старый 09.06.2018, 09:38
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,723

Попробуйте изображение в base64 перевести.
https://developer.mozilla.org/ru/doc...API/FileReader
Ответить с цитированием
  #3 (permalink)  
Старый 09.06.2018, 09:50
Новичок на форуме
Отправить личное сообщение для D-Nik Lubny Посмотреть профиль Найти все сообщения от D-Nik Lubny
 
Регистрация: 18.03.2018
Сообщений: 7

Увы не могу разобраться. На странице документации библиотеки приведены примеры, но я что-то не могу разобраться с ними.
Сайт: http://pdfmake.org/#/gettingstarted
Примеры вставки картинок
var docDefinition = {
  content: [
    {
      // you'll most often use dataURI images on the browser side
      // if no width/height/fit is provided, the original size will be used
      image: 'data:image/jpeg;base64,...encodedContent...'
    },
    {
      // if you specify width, image will scale proportionally
      image: 'data:image/jpeg;base64,...encodedContent...',
      width: 150
    },
    {
      // if you specify both width and height - image will be stretched
      image: 'data:image/jpeg;base64,...encodedContent...',
      width: 150,
      height: 150
    },
    {
      // you can also fit the image inside a rectangle
      image: 'data:image/jpeg;base64,...encodedContent...',
      fit: [100, 100]
    },
    {
      // if you reuse the same image in multiple nodes,
      // you should put it to to images dictionary and reference it by name
      image: 'mySuperImage'
    },
    {
      // under NodeJS (or in case you use virtual file system provided by pdfmake)
      // you can also pass file names here
      image: 'myImageDictionary/image1.jpg'
    }
  ],

  images: {
    mySuperImage: 'data:image/jpeg;base64,...content...'
  }
};
Ответить с цитированием
  #4 (permalink)  
Старый 09.06.2018, 09:59
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,723

D-Nik Lubny, я вам ссылку во втором посте оставил, по ней перейдите и ознакомьтесь с контентом, что там расположен.
Ответить с цитированием
  #5 (permalink)  
Старый 09.06.2018, 11:06
Новичок на форуме
Отправить личное сообщение для D-Nik Lubny Посмотреть профиль Найти все сообщения от D-Nik Lubny
 
Регистрация: 18.03.2018
Сообщений: 7

Увы для меня это темный лес. Посмотрел, почитал. И примеры пересмотрел. Но так ничего и не понял.
Ответить с цитированием
  #6 (permalink)  
Старый 09.06.2018, 11:15
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,723

D-Nik Lubny, там ничего сложного нет, но у меня сейчас времени недостаточно.
Как появится - помогу вам, если этого никто другой не сделает.
Ответить с цитированием
  #7 (permalink)  
Старый 09.06.2018, 11:24
Новичок на форуме
Отправить личное сообщение для D-Nik Lubny Посмотреть профиль Найти все сообщения от D-Nik Lubny
 
Регистрация: 18.03.2018
Сообщений: 7

Nexus,
Спасибо огромное. Я розобрался. Перекодировал в Base64 с помощь сервиса https://www.base64-image.de/ и вставил полученный код. Не знаю насколько это красиво и правильно, но работает.
Ответить с цитированием
  #8 (permalink)  
Старый 09.06.2018, 16:04
Новичок на форуме
Отправить личное сообщение для D-Nik Lubny Посмотреть профиль Найти все сообщения от D-Nik Lubny
 
Регистрация: 18.03.2018
Сообщений: 7

Все же нужна еще помощь.
Суть такова. Есть поля из которых данные должны быть переданы в файл PDF. Я написал для них следующий код

{table:{
	widths:[170,50,50,100,100,30,60,60,40],
	
	body:[
    [{ text: 'Наименование товара', bold: true, alignment:'center'},{ text: 'Размер', bold: true, alignment:'center'},{ text: 'Цвет', bold: true, alignment:'center'},{ text: 'Комплектация (с ящиками, без ящиков и т.д.)', bold: true, alignment:'center'},{ text: 'Дополнительная комплектация (с дополнительными бортиками и т.д.)', bold: true, alignment:'center'},{ text: 'К-тво (шт.)', bold: true, alignment:'center'},{ text: 'Доставка', bold: true, alignment:'center'},{ text: 'Упаковка', bold: true, alignment:'center'},{ text: 'Цена', bold: true, alignment:'center'}],
	[document.getElementById("ProductName").value,document.getElementById("ProductSize").value,document.getElementById("ProductColor").value,document.getElementById("ProductEquipment").value,document.getElementById("ProductAddEquipment").value,document.getElementById("ProductAmount").value,document.getElementById("ProductDelivery").value,document.getElementById("ProductPackaging").value,document.getElementById("ProductPrice").value],
	[document.getElementById("ProductName2").value,document.getElementById("ProductSize2").value,document.getElementById("ProductColor2").value,document.getElementById("ProductEquipment2").value,document.getElementById("ProductAddEquipment2").value,document.getElementById("ProductAmount2").value,document.getElementById("ProductDelivery2").value,document.getElementById("ProductPackaging2").value,document.getElementById("ProductPrice2").value],
	[document.getElementById("ProductName3").value,document.getElementById("ProductSize3").value,document.getElementById("ProductColor3").value,document.getElementById("ProductEquipment3").value,document.getElementById("ProductAddEquipment3").value,document.getElementById("ProductAmount3").value,document.getElementById("ProductDelivery3").value,document.getElementById("ProductPackaging3").value,document.getElementById("ProductPrice3").value],
	['','','','','','','','','']
	],
	headerRows:1
}},


На ПК код работает только после того как страницу перегрузить (без очистки ранее заполненных полей).
А на мобильных код не работает вообще (так как если перегрузить страницу, то все поля очищаются).

Помогите пожалуйста. Как перенести в PDF данные и полей.
Ответить с цитированием
  #9 (permalink)  
Старый 09.06.2018, 17:18
Новичок на форуме
Отправить личное сообщение для D-Nik Lubny Посмотреть профиль Найти все сообщения от D-Nik Lubny
 
Регистрация: 18.03.2018
Сообщений: 7

Все. Разобрался. Прошу прощения за то, что побеспокоил.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
как с помощью javascript взять данные из одного файла html и закинуть в другой? rusik Общие вопросы Javascript 10 08.08.2016 12:11
Вывод данных из XML файла на странице HTML с помощью JavaScript. MSDeveloper Общие вопросы Javascript 3 20.08.2014 22:11
Отправка файла с помощью JavaScript Kipetcoff Internet Explorer 4 08.02.2011 12:20
Загрузка файла в массив строк с помощью AJAX malcomoffice AJAX и COMET 2 08.06.2010 18:02
Проверка актуальности URL удаленного файла с помощью JavaScript - реально? LAPSuha Оффтопик 1 25.08.2009 09:31