JSFiddle - React, Tailwind, and code Playground

HTML

<pre></pre>

JavaScript

const al   = "АБВГДЕЁЖЗИКЛМНОПРСТУФХЦЧШЩЫЬЭЮЯ "; // Алфавит
let key1 = "ПЕРВЫЙ"; // первый ключ
let key2 = "БУКВА"; // второй ключ
let open_str = "ЭТО СТРОКА ОТКРЫТОГО ИСХОДНОГО ТЕКСТА"; // кодируемый текст

// т.к. в алфавите нет букв Й и Ъ, то производим соответствующую замену:
key1 = key1.replace("Й","И").replace("Ъ","Ь");
key2 = key2.replace("Й","И").replace("Ъ","Ь");
open_str = open_str.replace("Й","И").replace("Ъ","Ь");

// кодируем текст
let encoded_str = ([...open_str]).map( (e,i) => al[(al.indexOf(e) + al.indexOf(key1[i%key1.length]) + al.indexOf(key2[i%key2.length])) % 32] ).join("");

console.log(encoded_str);
document.body.children[0].textContent = open_str+"\n"+encoded_str;