chincharovpc

Установил сертификат для www-data
sudo -u www-data ...
Потом вылезла ошибка "CRYPTOPRO: double free or corruption (top)" при запуске php кода
Если запустить код php сначала от имени root, а потом от имени www-data, то ошибка исчезает

<div class="layout">
   <header>...</header>
   <main>...</main>
</div>

Далее пишешь стили для .layout

Вот работающий пример смены языка, думаю, разберешься сам

Компонент Locale.vue

<template>
  <div>
    <v-select
        v-model="locale"
        :items="locales"
        item-text="locale"
        item-value="locale"
        append-icon=""
        class="locale"
    >
    </v-select>
  </div>
</template>

<script>
import {loadLanguageAsync} from "@/locales/i18n";
import config from "@/config";

export default {
  name: "Locale",
  data: function () {
    return {
      locales: config.locales
    }
  },
  computed: {
    locale: {
      get: function () {
        return {locale: this.$i18n.locale}
      },
      set: function (locale) {
        loadLanguageAsync(locale)
      }
    },
  },
  created() {
    loadLanguageAsync(localStorage.getItem('lang'))
  }
}
</script>

Скрипт i18n.js
Доступные языки беру из config.js
JS файлы с языками находятся в @/locales/lang/(en.js, ru.js)

import Vue from 'vue'
import VueI18n from 'vue-i18n'
import axios from 'axios'
import config from "@/config";
import messages from "@/locales/lang/en.js"

Vue.use(VueI18n)

export const i18n = new VueI18n({
    locale: "en",
    fallbackLocale: "en",
    messages: {
        "en": messages
    }
    })
const loadedLanguages = ["en"]

function setLanguage(lang) {
    i18n.locale = lang
    document.querySelector('html').setAttribute('lang', lang)
    return lang
}

export function loadLanguageAsync(lang) {
    let language = lang
    if (config.locales.findIndex(locale => locale.locale === lang) === -1) {
        language = config.defaultLocale
    }

    localStorage.setItem('lang', language)

    // If the same language
    if (i18n.locale === language) {
        return Promise.resolve(setLanguage(language))
    }

    // If the language was already loaded
    if (loadedLanguages.includes(language)) {
        return Promise.resolve(setLanguage(language))
    }

    // If the language hasn't been loaded yet
    return import(`@/locales/lang/${language}.js`).then(
        messages => {
            i18n.setLocaleMessage(language, messages.default)
            loadedLanguages.push(language)
            return setLanguage(language)
        }
    )
}

Скрипт main.js

import Vue from 'vue'
import App from '@/App.vue'
import {i18n} from "@/locales/i18n";


new Vue({
    render: h => h(App),
    i18n,
}).$mount('#app')

Если я правильно тебя понял, то нужно создать div с классом container в body

.container {
       width: 100%; // Ширина контейнера 100%
       max-width: 1320px; // Ширина контента 1300
       padding-left: 10px; // Отступ слева
       padding-right: 10px; // Отступ справа
       margin: 0 auto; // Расположение контейнера посередине
    }

Если я правильно тебя понял, то вот

import { Fragment, useEffect, useRef, useState } from "react";
import "./styles.css";
export default function App() {
  const firstDivRef = useRef();
  const [windowScroll, setWindowScroll] = useState(0);

  useEffect(() => {
    const onScroll = () => {
      if (windowScroll === 0) {
        setWindowScroll(window.scrollY);
      }

      firstDivRef.current.scrollTop =
        firstDivRef.current.scrollTop + (window.scrollY - windowScroll);

      setWindowScroll(window.scrollY);
    };

    window.removeEventListener("scroll", onScroll);
    window.addEventListener("scroll", onScroll);
    return () => window.removeEventListener("scroll", onScroll);
  }, [windowScroll]);

  return (
    <Fragment>
      <div className="header"></div>
      <div
        className="App"
        style={{
          display: "flex",
          marginTop: "100px"
        }}
      >
        <div
          ref={firstDivRef}
          style={{
            height: "600px",
            overflow: "scroll",
            backgroundColor: "#FFDAB9",
            position: "sticky",
            top: "100px"
          }}
        >
          <div>
            <ul className="first-scroll">
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
            </ul>
          </div>
        </div>

        <div
          style={{
            backgroundColor: "#EEE8AA"
          }}
        >
          <div>
            <ul className="first-scroll">
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
              <li>Scroll text</li>
            </ul>
          </div>
        </div>
      </div>
      <div className="about-us"></div>
      <div className="footer"></div>
    </Fragment>
  );
}

Вам нужно разрешить CORS на сервере
Вот тут пояснение

Меню для планшетов и мобильных устройств нужно сделать с абсолютным позиционированием или скрыть за страницей с помощью transform...
В верхней части шапки расположить кнопку для открытия меню.
При нажатии на кнопку слева отображается меню и при нажатии на пустое пространство или крестик, то исчезает. (нужен javascipt)
Вот пример, смотри в моб версии

Я думаю, тебе нужно сначала получить json с помощью javascript, а потом отобразить в html
Ссылка, если я правильно тебя понял

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

МОжно при нажатии на ссылку вызвать функцию и получить файл с помощью fetch, далее превратить файл в blob и перейти на ссылку blob. В catch можно перехватить ошибки

const downloadBlobFile = (id, fileName) => {
  fetch(`${API_URL}/files/download/${id}`)
      .then(response => {
        return response.blob()
      })
      .then(blob => {
        const link = window.document.createElement("a");
        link.href = window.URL.createObjectURL(blob);
        link.download = fileName || 'file';
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
      })
      .catch(() => {
        //Обработка ошибок
      });
}

const groupArr = {}
arr.map(message => ({...message, date: new Date(message.date)}))
    .sort((m1, m2) => m1.date - m2.date)
    .forEach(message => {
        const date = message.date.toISOString().split('T')[0]
        if (!groupArr.hasOwnProperty(date)) {
            groupArr[date] = []
        }
        groupArr[date].push(message)
    })

Object.keys(groupArr).forEach(key => console.log(groupArr[key]))

Смог.

1. Записывается голос с микрофона с помощью WebAudioRecorder, есть в github
   
2. Запись преобразуем в blob
   
3. blob преобразуем в base64 с помощью FileReader
   
4. base64 передаем с помощью POST к php
   
5. в php создаем файл из base64 с помощью

   file_put_contents($audioFileName, base64_decode($file));

   
   
6. Открываем файл созданный только что и передаем к Speechkit
   
7. Возвращаем ответ
   
   

e[0]['constructor']...

Кому интересно...
Сделал с v-for
v-for="item in two_data['father_data']"
<h5 class="card-title">{{item['last_name']}}</h5>