Показать сообщение отдельно
  #4 (permalink)  
Старый 08.05.2020, 13:04
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,112

CORONER,
фамилии и имена даны для примера, их нужно
генерировать на своём сервере, да и все остальные данные.
создайте массивы и выводите.
<!DOCTYPE html>
<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">
    <style type="text/css">
    tbody {
        counter-reset: n 30;
    }

    tbody tr :nth-child(2)  {
            color: #FF0000;
            font-weight: bold;
    }
    tbody tr :nth-child(1):before{
     content: counter(n)" секунд назад";
    counter-increment: n 15;
    }
    td{
        border: 1px solid #000000;
    }

    </style>

</head>
<body>
<table>
<tbody></tbody>
</table>

<script>
(async function up() {
    const randomItem = arr => arr[Math.trunc(arr.length * Math.random())];
    const randomNum = (min, max) => min + Math.trunc((max + 1 - min) * Math.random());
    const title = 'Квартира, Офис, Дом, Коммерция'.split(', ');
    const business = randomItem(title)
    const num = randomNum(300, 1000);
    const digit = num < 480 ? ' 000 000' : ' 000'
    const profit = num + digit;
    const percent = randomNum(7, 60);
    const resolution = 'Одобрено, отказано, на рассмотрении'.split(', ');
    const choice = randomItem(resolution);
    const time = randomNum(2, 60);
    //const response = await fetch("https://cors-anywhere.herokuapp.com/http://randomuser.ru/api.json");// эта строка только для примера
    //const resArr = await response.json();
    //    let {last, first} = resArr[0].user.name;
    const people = [{"first":"Георгий","last":"Емельянов"},{"first":"Елизавета","last":"Петрова"}, {"first":"Любовь","last":"Костина"}];
        let {last, first}  =  randomItem(people);
        let tr = `<tr><td></td>
        <td>${last} ${first}</td>
        <td>${business}</td>
        <td>${profit} руб.</td>
        <td>${percent}%</td>
        <td>${time} мес.</td>
        <td>${choice}</td>
        </tr>`
        const tbody = document.querySelector('table tbody');
        if(tbody.rows.length == 5) tbody.rows[4].remove();
        tbody.insertAdjacentHTML('afterBegin', tr);
        window.setTimeout(up, 3000);
})();

    </script>
</body>
</html>
Ответить с цитированием