Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Работа с Массивами (https://javascript.ru/forum/misc/79024-rabota-s-massivami.html)

vandalv 09.12.2019 05:07

Спасибо, благодаря вам подвинулся с места. Запихал все в html. Единственное, не сообразил как цену, общую стоимость, количество, товары отдельными полями добавить. Сортировку пока не победил. Не все в один лень делается. Спасибо вы очень помогли!
<!doctype html>
<html lang="en">
<head>
	<title>JavaScript Tutorial - Arrays and Loops</title>
	<link rel="stylesheet" href="css/foundation.min.css"></link>
	<style>
    th
    {
      background: white;
      height:50px;
    }
    table,th,td
    {
      border:2px solid green;
    }
    table
    {
      width:40%;
      color:solid green;
      text-align:center;
    }
  </style>
</head>
<body>

	<!-- JAVASCRIPT -->
	<script type="text/javascript">
	function randomValueBetween(min, max) {
    return Math.random() * (max - min) + min;
}
function randomDate(date1 = '01-01-2017', date2 = new Date().toLocaleDateString()) {
  date1 = new Date(date1).getTime();
  date2 = new Date(date2).getTime();
  return new Date(randomValueBetween(date2, date1)).toLocaleDateString()
}
function getElem(arr)
{
  return arr[randomValueBetween(0, arr.length)|0]
}
var sellern = "Dogserf";
var sellernip = "2254913384";
var selleradr = "2592  Davis Place";
var sellerpost = "87918997";
var selleracc = "85090922712148335820";
var firmString="Justsurf,DietyElephant,MetaHound,CuteOx,SweetFrank,PonyMice,BoarsAndInu,KrazyRat,GlumCats,ManedPie,ZipperPuppy,AKCStew,FoxFlock,NerdyLion,SnipeSkull,KittenFur,SilentRabbit,Pupski,BearSide,Mouse17C";
var firms = firmString.split(",");
var adressString="3118  Palmer Road,4996  Watson Lane,504  Hawks Nest Lane,3432  Glory Road,157  Crosswind Drive,3063  New York Avenue,997  Jadewood Drive,1630  Mulberry Lane,1710  Jehovah Drive,409  Monroe Street,3538  Hickman Street,68  Powder House Road,2449  Eagle Drive,1143  Collins Avenue,2848  Snyder Avenue,3797  Willis Avenue,4008  Alexander Avenue,3406  Wines Lane,1610  Gorby Lane";
var adress = adressString.split(",");
var numGen = function(length) {
return Array.from({length}, _=> Math.floor(Math.random()*10)).join("");
};
var vegString=["Apple","Apricots","Avocado","Banana","Blackberries", "Blueberries","Cantaloupe","Carambola","Cherimoya","Cherries","Clementine","Coconut Meat","Durian","Grapefruit","Jackfruit","Lemon","Mango","Mangosteen","Peaches","Raspberries","Tangerine"];
var bases = [];
for (var i = 0; i < 10; )
{
  var base = new Object();
  base.pref = (++i).toString().padStart(5, "0");
  base.sellern = sellern;
  base.sellernip = sellernip;
  base.selleradr = selleradr;
  base.sellerpost = sellerpost;
  base.selleracc = selleracc;
  base.repeated = getElem(firms);
  base.repeated1 = getElem(adress);
  base.account=numGen(20);
  base.postal=numGen(8);
  base.total = 0;
  base.netto = 0;
  base.produkt = Array.from({length : 10}, _ => {
  var num = randomValueBetween(100, 999)|0,
      price = randomValueBetween(1, 100).toFixed(2),
      count = randomValueBetween(1, 100)|0;
      base.total += price * count;
      base.netto = base.total * 1.23;
      return `\nPRODUCT - ${getElem(vegString)}    PRICE - ${randomValueBetween(1, 100).toFixed(2)}$   QUANTITY - ${randomValueBetween(1, 100)|0} p.`
  }).join('\n') + `\nTOTAL BRUTTO PRICE: ${base.total.toFixed(2)}$ ` + `  \nTOTAL NETTO PRICE: ${base.netto.toFixed(2)}$ `;
  
  

  bases.push(base);
}

	document.write('<table>');
	document.write('<tr><th>Faktura№</th><th>Date</th><th>Client</th><th>Adress</th><th>Account№</th></tr>');
	for (var k = 0; k < bases.length; k++)
	{
		document.write("<tr><td>" + bases[k].pref +  "</td>" + "<td>" + randomDate() + "</td>" + "<td>" + bases[k].repeated +"</td>" + "<td>" + bases[k].repeated1 + "<td>" + bases[k].account +"</td></tr>");
	}
	
	document.write('</table>');
	</script>
	<!-- END JAVASCRIPT -->
</body>
</html>

рони 09.12.2019 09:11

Цитата:

Сообщение от vandalv
как цену, общую стоимость, количество, товары отдельными полями добавить

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.3.0/lodash.js"></script>
    <style>
      table {
        border-collapse: collapse;
        border: 1px solid gray;
      }

      td {
        border: 1px solid gray;
        padding: 2px 5px;
        text-align: center;
      }
      table td[colspan='2'] {
        padding: 0;
        box-sizing: border-box;
      }

      table table {
        width: 100%;
      }
      table table td:last-child {
        text-align: right;
      }
      table table tr:last-child td:last-child {
        color: #ff0000;
      }
    </style>
  </head>

  <body>
    <div id="grid-holder"></div>

    <script type="text/template" id="grid-template">
      <table>
          <thead>
              <tr>
                  <th>№</th>
                  <th>дата</th>
              </tr>
          </thead>
          <tbody>
              <% for(var i = 0; i < list.length; i++) { %>
                  <tr><td>
                          <%=i + 1%>
                      </td>
                      <td>
                          <%=new Date(list[i].data).toLocaleDateString()%>
                      </td>
                     </tr>
                     <tr><td colspan=2>
                       <table>
          <thead>
              <tr>
                  <th>артикул</th>
                  <th>название</th>
                  <th>цена</th>
                  <th>количество</th>
                  <th>сумма</th>
              </tr>
          </thead>
          <tbody>
                      <% for(var k = 0; k < list[i].produkt.length; k++) { %>
                       <tr>
                       <td>
                          <%=list[i].produkt[k].num%>
                       </td>
                       <td>
                          <%=list[i].produkt[k].name%>
                       </td>
                       <td>
                          <%=list[i].produkt[k].price%>
                       </td>
                       <td>
                          <%=list[i].produkt[k].count%>
                       </td>
                       <td>
                          <%=(list[i].produkt[k].price * list[i].produkt[k].count).toFixed(2)%>
                       </td>
                       </tr>
                      <% } %>
                           <tr>
                       <td colspan = 4>
                          всего
                       </td>
                       <td>
                          <%=list[i].total%>
                       </td>
                           </tr>
                           </tbody>
                         </table>
                      </td>
                  </tr>
                  <% } %>
                 </td></tr>
          </tbody>
      </table>
    </script>

    <script>
      function randomValueBetween(min, max) {
        return Math.random() * (max - min) + min;
      }
      function randomDate(
        date1 = '01-01-2017',
        date2 = new Date().toLocaleDateString()
      ) {
        date1 = new Date(date1).getTime();
        date2 = new Date(date2).getTime();
        return randomValueBetween(date2, date1);
      }
      function getElem(arr) {
        return arr[randomValueBetween(0, arr.length) | 0];
      }
      var vegString = [
        'Apple',
        'Apricots',
        'Avocado',
        'Banana',
        'Blackberries',
      ];
      var bases = Array.from({ length: 10 }, _ => {
        var total = 0,
          produkt = Array.from({ length: 5 }, _ => {
            var num = randomValueBetween(100, 999) | 0,
              name = getElem(vegString),
              price = randomValueBetween(1, 100).toFixed(2),
              count = randomValueBetween(1, 100) | 0;
            total += price * count;
            return { num, name, price, count };
          }),
          data = randomDate();
        total = total.toFixed(2);
        return { data, total, produkt };
      });

      var tmpl = document.getElementById('grid-template').innerHTML.trim();
      tmpl = _.template(tmpl);
      function appendTable(list) {
        document
          .getElementById('grid-holder')
          .insertAdjacentHTML('beforeEnd', tmpl({ list }));
      }

      function appendTitle(txt) {
        document
          .getElementById('grid-holder')
          .insertAdjacentHTML('beforeEnd', `<h1>${txt}</h1>`);
      }
      appendTitle('исходный массив фактур');
      appendTable(bases);

      appendTitle('5  фактур по найбольшей стоимости');
      var sortTotal = bases
        .slice(0)
        .sort((a, b) => a.total - b.total)
        .slice(-5);
      appendTable(sortTotal);

      appendTitle('фактуры по возрастанию стоимости, в которых есть Avocado');
      var filterAvocadoSortTotal = bases
        .filter(base => base.produkt.some(el => el.name == 'Avocado'))
        .sort((a, b) => a.total - b.total);
      appendTable(filterAvocadoSortTotal);

      appendTitle('фактуры за 2018 год, по возрастанию даты');
      var filterDataSort = bases
        .filter(base => new Date(base.data).getFullYear() == 2018)
        .sort((a, b) => a.data - b.data);
      appendTable(filterDataSort);

      appendTitle('фактуры за первые полгода 2019 год, по возрастанию даты');
      var dataStart = new Date(2019, 0, 1, 0, 0, 0, 0),
        dataEnd = new Date(2019, 6, 0, 0, 0, 0, 0);
      var filter2019Sort = bases
        .filter(base => base.data >= dataStart && base.data <= dataEnd)
        .sort((a, b) => a.data - b.data);
      appendTable(filter2019Sort);

      appendTitle(
        '3 фактуры с минимальной суммой и сортировкой товара по названию'
      );
      var filterMinSortName = bases
        .slice(0)
        .sort((a, b) => a.total - b.total)
        .slice(0, 3);
      var collator = new Intl.Collator(['en', 'ru'], { numeric: true });
      filterMinSortName.forEach(
        base =>
          (base.produkt = base.produkt
            .slice(0)
            .sort((a, b) => collator.compare(a.name, b.name)))
      );
      appendTable(filterMinSortName);

      appendTitle(
        '3 фактуры с минимальной общей суммой и сортировкой товара по сумме'
      );
      var filterMinSortAmount = bases
        .slice(0)
        .sort((a, b) => a.total - b.total)
        .slice(0, 3);
      filterMinSortAmount.forEach(
        base =>
          (base.produkt = base.produkt
            .slice(0)
            .sort((a, b) =>
              (a.price * a.count - b.price * b.count)
            ))
      );
      appendTable(filterMinSortAmount);
    </script>
  </body>
</html>

vandalv 11.12.2019 05:58

Подскажите, такой вопрос. Пытаюсь запихнуть js в внешний файл. ссылки проверил alert(1). Не выходит ничего

vandalv 11.12.2019 06:14

Основное тело удалось запустить из js файла. Скрипт с таблицей не завелся. Проблема была в размещении в теге <head>. Нужно было в конце файла размещать

рони 11.12.2019 08:39

Цитата:

Сообщение от vandalv
Нужно было в конце файла размещать

или обернуть код в DOMContentLoaded


Часовой пояс GMT +3, время: 09:55.