Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 05.01.2019, 15:32
Профессор
Отправить личное сообщение для the_little Посмотреть профиль Найти все сообщения от the_little
 
Регистрация: 25.09.2017
Сообщений: 186

помощь с выводом данных из одного массива в другой
Здравствуйте.
И всех с Новым Годом!

Возможно я не совсем правильно сформулировал вопрос... попробую подробнее рассказать.

Сделал небольшой калькулятор.
В одном из блоков выводится информация по материалам, их стоимости и количестве.

Элементы выводятся по сути списком. Количество элементов разное и у них могут отличаться наименования используемых материалов.

В общем список эток динамический.

Выглядит он в конечном счете вот так

<ul class="materials_data_ul">
  <li class="materials_li materials_header_li">
    <span class="material_label">Наименование</span>
    <span class="material_amount">Количество</span>
    <span class="material_summ">Стоимость</span>
  </li>
  <li class="materials_li">
    <span class="material_label">Клей-пена, 600 мл</span>
    <span class="material_amount">2</span>
    <span class="material_summ">910</span>
  </li>
  <li class="materials_li">
    <span class="material_label">Герметик акрилатный, ведро/15кг</span>
    <span class="material_amount">1</span>
    <span class="material_summ">2 275</span>
  </li>
</ul>


После того как расчет сделан, мне нужно сформировать PDF файл с коммерческим предложением.

Для этого я использую pdfmaker (http://pdfmake.org)

И собственно задача вывести данные из этого списка в таблицу.
Но ничего у меня не получается.

Я написал небольшую функцию, которая перебирает все элементы списка и добавляет информацию нужного вида в массив.

var arr = [];

    $('.materials_li').each(function() {
        var printName = $(this).find('.material_label').text();
        var printAmount = Number($(this).find('.material_amount').text().replace(/\D+/g,""));
        var printSumm = Number($(this).find('.material_summ').text().replace(/\D+/g,""));
        var printPrice = printSumm/printAmount;
        var printTable = '"'+printName + '", "' + printAmount + '", "' + printSumm.toFixed(2) + '", "' + printPrice.toFixed(2) + '"';
        arr.push(printTable);
    });

    console.log(arr[2]);


console.log(arr[2]); выводит

"Герметик акрилатный, ведро/15кг", "1", "2275.00", "2275.00"

В pdfmaker данные в таблицу заносятся таким вот образом, по сути тоже массив

table: {
                    widths: ['46%', '18%', '18%', '18%'],
                    body: [
                        ["Наименование", "Кол-во", "Цена", "Сумма"],
                        [arr[2]]
                    ]
},


Содержимое arr[2] - соответсвует формату, который там должен быть.
Но [arr[2]] вызывает ошибку.

Хотя вывод определенного элемента массива тоже вариант так себе, потому что я не знаю заранее сколько элементов будет в массиве.
По хорошему прямо в таблице нужно цикл делать, но у меня ничего не получается...

В целом PDF файл задается таким вот кодом
var pdfDoc = {

        pageSize:'A4',
        pageOrientation:'portrait',//'portrait'
        pageMargins:[20,10,20,10],

        content: [
            {
                columns: [
                    {
                        fontSize: 20,
                        bold: true,
                        width: '50%',
                        text: 'HARDEK'
                    },
                    {
                        width: '50%',
                        fontSize: 12,
                        alignment: 'right',
                        margin: [0, 8, 0, 0],
                        text: '8 (3452) 93-47-22'
                    }
                ]
            },
            {
                columns: [
                    {
                        fontSize: 10,
                        width: '50%',
                        text: 'производственная компания'
                    },
                    {
                        width: '50%',
                        fontSize: 12,
                        alignment: 'right',
                        text: 'www.hardek.ru'
                    }
                ]
            },
            {
                text: '______________________________________________________________________________________________________',
                alignment: 'center' 
            },
            {
                text: 'ИСХОДНЫЕ ДАННЫЕ',
                fontSize: 12,
                bold: true,
                alignment: 'center',
                margin: [0, 100, 0, 20]
            },
            {
                table: {
                    widths: ['70%', '30%'],
                    body: [
                        ['Площадь фасада, м2', square],
                        ['Материал панелей', printMaterial],
                        ['Толщина утеплителя, мм', printUteplitel],
                        ['Модель термопанели', printModel],
                        ['Материал стен', printStena]
                    ]
                },
                layout: {
                    hLineWidth: function (i, node) {
                        return (i == 1 || i == 2 || i == 3 || i == 4 || i == 5) ? 1 : 0;
                    },
                    vLineWidth: function () {
                        return (0);
                    },
                }
            },
            {
                text: 'КОММЕРЧЕСКОЕ ПРЕДЛОЖЕНИЕ',
                fontSize: 12,
                bold: true,
                alignment: 'center',
                margin: [0, 100, 0, 20]
            },
            {
                table: {
                    widths: ['46%', '18%', '18%', '18%'],
                    body: [
                        ["Наименование", "Кол-во", "Цена", "Сумма"],
                    ]
                },
            }
        ]
    };
Ответить с цитированием
  #2 (permalink)  
Старый 05.01.2019, 16:57
Профессор
Отправить личное сообщение для the_little Посмотреть профиль Найти все сообщения от the_little
 
Регистрация: 25.09.2017
Сообщений: 186

Понял в чем проблема, но как решить пока не понял.
в этой конструкции
table: {
                    widths: ['46%', '18%', '18%', '18%'],
                    body: [
                        ["Наименование", "Кол-во", "Цена", "Сумма"],
                    ]
                },

в боди ожидается что в каждую строку будет передаваться 4 элемента

и тот элемент что я передаю соответственно считается как один, а в строке должно быть 4.
из за этого ошибка.

получается мой список нужно разбивать не на целые строки, а делать многомерный массив.
но как потом выводить - не понятно...
Ответить с цитированием
  #3 (permalink)  
Старый 05.01.2019, 17:51
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

the_little,

table.body.concat(arr);
Ответить с цитированием
  #4 (permalink)  
Старый 05.01.2019, 18:08
Профессор
Отправить личное сообщение для the_little Посмотреть профиль Найти все сообщения от the_little
 
Регистрация: 25.09.2017
Сообщений: 186

Сообщение от рони Посмотреть сообщение
the_little,

table.body.concat(arr);
Это нужно вставить внутри
body: [
      
]

?
выдает ошибку table is not defined

table: {
                    body: [
                        table.body.concat(arr)
                    ]
                },
Ответить с цитированием
  #5 (permalink)  
Старый 05.01.2019, 18:19
Профессор
Отправить личное сообщение для the_little Посмотреть профиль Найти все сообщения от the_little
 
Регистрация: 25.09.2017
Сообщений: 186

Пробую так
table: {
                    body: [
                        [
                            function() {
                                return table.body.concat(arr)
                            }
                        ]
                    ]
                },


Ошибок нет, но ничего не выдает
Ответить с цитированием
  #6 (permalink)  
Старый 05.01.2019, 18:39
Профессор
Отправить личное сообщение для the_little Посмотреть профиль Найти все сообщения от the_little
 
Регистрация: 25.09.2017
Сообщений: 186

нашел небольшой пример, и он даже рабочий, но только там выводят строки, где каждый элемент массива - отделная строка

и даже получилось.

Я сделал многомерный массив. Внутри массива идут соответсвенно тоже массивы, в каждом значения переменных.

table: {
                    body: 
                        arr.map(function(item) { 
                            return [ {text: item} ];
                        })
                },


в результате получил свои строки в таблице. Но вот как теперь эти строки разбить на ячейки в этом коде я не понимаю...

Сейчас в таблице такие строки

Наименование0NaN0
Клей-пена, 600 мл1455455
Герметик акрилатный, ведро/15кг122752275
Грунт глубокого проникновения, 10л1330330
Краска фасадная, ведро/20кг133803380
Саморез 6*60мм161.937531
Поддоны, шт.110001000

Вот эта функция как я понимаю выводит
arr.map(function(item) { 
    return [ {text: item} ];
})


здесь же item - это получается мой массив, который выводится в виде текста.

а мне надо получается что-то типа
"1","2","3","4"

вместо {text: item}
"1234"
Ответить с цитированием
  #7 (permalink)  
Старый 05.01.2019, 19:36
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

the_little,
не понимаю, слишком много букв, нужно
есть такая структура, как получить такую, исходные данные и конечные, и всё.
пока, более поста #3, мне добавить нечего.
ждите с более продвинутым скилом ванги, или попытайтесь локализовать задачу.
Ответить с цитированием
  #8 (permalink)  
Старый 05.01.2019, 22:11
Профессор
Отправить личное сообщение для the_little Посмотреть профиль Найти все сообщения от the_little
 
Регистрация: 25.09.2017
Сообщений: 186

Сообщение от рони Посмотреть сообщение
the_little,
не понимаю, слишком много букв, нужно
есть такая структура, как получить такую, исходные данные и конечные, и всё.
пока, более поста #3, мне добавить нечего.
ждите с более продвинутым скилом ванги, или попытайтесь локализовать задачу.
да собственно задача то простая.
Используя данные из HTML создать таблицу в PDF файле.
вот и вся задача.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Из одного textarea в другой Chile Элементы интерфейса 19 21.11.2017 16:13
Перетаскивание изображения из одного div-a в другой div Lera78906 Элементы интерфейса 2 01.05.2017 17:59
Перенести скрипт с одного сайта на другой Vmmix Работа 0 03.03.2017 01:12
Стягивание из html кода другой страницы данных royksopp Общие вопросы Javascript 8 22.12.2011 00:05
Копирование из одного input в другой input bar-boss Общие вопросы Javascript 7 08.04.2008 19:10