Профиль: рабочие переключатели official/shine и подтверждение блокчейн-записи
This commit is contained in:
ai5590
parent
525627c972
commit
f3e4651bd5
@ -1,7 +1,12 @@
|
||||
import { renderHeader } from '../components/header.js?v=20260403081123';
|
||||
import { profile } from '../mock-data.js?v=20260403081123';
|
||||
import { state } from '../state.js?v=20260403081123';
|
||||
import { loadProfileParams, profileFieldDefs, saveProfileParams } from '../services/user-profile-params.js?v=20260403081123';
|
||||
import {
|
||||
loadProfileSnapshot,
|
||||
profileFieldDefs,
|
||||
saveProfileParams,
|
||||
saveProfileToggle,
|
||||
} from '../services/user-profile-params.js?v=20260403081123';
|
||||
|
||||
export const pageMeta = { id: 'profile-view', title: 'Профиль' };
|
||||
|
||||
@ -17,6 +22,10 @@ function getDisplayName(fieldMap) {
|
||||
return fullName || profile.name;
|
||||
}
|
||||
|
||||
function toggleText(enabled) {
|
||||
return enabled ? 'yes' : 'no';
|
||||
}
|
||||
|
||||
export function render({ navigate }) {
|
||||
const login = state.session.login || profile.login;
|
||||
|
||||
@ -49,11 +58,18 @@ export function render({ navigate }) {
|
||||
<button class="primary-btn" type="button" data-open-edit="true">Обновить</button>
|
||||
`;
|
||||
|
||||
const badgesRow = document.createElement('div');
|
||||
badgesRow.className = 'row';
|
||||
badgesRow.innerHTML = `
|
||||
<button class="badge profile-toggle-btn" type="button" data-toggle="official">✔ Официальный: no</button>
|
||||
<button class="badge alt profile-toggle-btn" type="button" data-toggle="shine">✨ Сияющий: no</button>
|
||||
`;
|
||||
|
||||
const hint = document.createElement('div');
|
||||
hint.className = 'card profile-data-help';
|
||||
hint.innerHTML = `
|
||||
<div class="meta-muted">Личные данные пользователя</div>
|
||||
<p>Поля ниже читаются из реальных пользовательских параметров сервера (ListUserParams). Кнопка «Обновить» отправляет UpsertUserParam, что добавляет новую запись в блокчейн.</p>
|
||||
<p>Поля ниже читаются из реальных пользовательских параметров сервера (ListUserParams). Любое изменение отправляется как блокчейн-запись параметра и требует подпись ключом пользователя.</p>
|
||||
`;
|
||||
|
||||
const status = document.createElement('div');
|
||||
@ -76,7 +92,7 @@ export function render({ navigate }) {
|
||||
</div>
|
||||
<button class="icon-btn profile-help-close" type="button" aria-label="Закрыть">✕</button>
|
||||
</div>
|
||||
<p class="profile-help-text">После сохранения по каждому полю отправляется `UpsertUserParam`. Сервер хранит историю, а на экране показывается самое свежее значение по времени.</p>
|
||||
<p class="profile-help-text">После сохранения по каждому полю отправляется запись параметра в блокчейн. Для подписи используется ключ пользователя на устройстве.</p>
|
||||
<form class="stack" data-profile-form="true"></form>
|
||||
<div class="row">
|
||||
<button class="ghost-btn" type="button" data-cancel-edit="true">Отмена</button>
|
||||
@ -87,13 +103,27 @@ export function render({ navigate }) {
|
||||
|
||||
const profileNameEl = topRow.querySelector('[data-profile-name="true"]');
|
||||
const openEditBtn = topRow.querySelector('[data-open-edit="true"]');
|
||||
const officialBtn = badgesRow.querySelector('[data-toggle="official"]');
|
||||
const shineBtn = badgesRow.querySelector('[data-toggle="shine"]');
|
||||
const formEl = editModal.querySelector('[data-profile-form="true"]');
|
||||
const dialogEl = editModal.querySelector('.profile-help-dialog');
|
||||
const saveBtn = editModal.querySelector('[data-save-profile="true"]');
|
||||
|
||||
let currentFields = profileFieldDefs.map((field) => ({ ...field, value: '', timeMs: 0 }));
|
||||
let currentToggles = [
|
||||
{ key: 'official', enabled: false, timeMs: 0 },
|
||||
{ key: 'shine', enabled: false, timeMs: 0 },
|
||||
];
|
||||
|
||||
function renderParams(fields) {
|
||||
function updateTogglesUi() {
|
||||
const official = currentToggles.find((item) => item.key === 'official') || { enabled: false };
|
||||
const shine = currentToggles.find((item) => item.key === 'shine') || { enabled: false };
|
||||
|
||||
officialBtn.textContent = `✔ Официальный: ${toggleText(official.enabled)}`;
|
||||
shineBtn.textContent = `✨ Сияющий: ${toggleText(shine.enabled)}`;
|
||||
}
|
||||
|
||||
function renderFields(fields) {
|
||||
const fieldMap = new Map(fields.map((field) => [field.key, field]));
|
||||
profileNameEl.textContent = getDisplayName(fieldMap);
|
||||
|
||||
@ -113,23 +143,30 @@ export function render({ navigate }) {
|
||||
});
|
||||
}
|
||||
|
||||
async function refreshParams() {
|
||||
async function refreshProfileSnapshot() {
|
||||
status.className = 'status-line';
|
||||
status.textContent = 'Загрузка параметров...';
|
||||
openEditBtn.disabled = true;
|
||||
officialBtn.disabled = true;
|
||||
shineBtn.disabled = true;
|
||||
|
||||
try {
|
||||
const fields = await loadProfileParams(login);
|
||||
currentFields = fields;
|
||||
renderParams(fields);
|
||||
const snapshot = await loadProfileSnapshot(login);
|
||||
currentFields = snapshot.fields;
|
||||
currentToggles = snapshot.toggles;
|
||||
renderFields(snapshot.fields);
|
||||
updateTogglesUi();
|
||||
status.className = 'status-line is-available';
|
||||
status.textContent = 'Актуальные параметры загружены с сервера.';
|
||||
} catch (error) {
|
||||
renderParams(currentFields);
|
||||
renderFields(currentFields);
|
||||
updateTogglesUi();
|
||||
status.className = 'status-line is-unavailable';
|
||||
status.textContent = `Не удалось загрузить параметры: ${error.message || 'ошибка сети'}`;
|
||||
} finally {
|
||||
openEditBtn.disabled = false;
|
||||
officialBtn.disabled = false;
|
||||
shineBtn.disabled = false;
|
||||
}
|
||||
}
|
||||
|
||||
@ -165,7 +202,7 @@ export function render({ navigate }) {
|
||||
try {
|
||||
await saveProfileParams(login, valuesByKey);
|
||||
closeEditModal();
|
||||
await refreshParams();
|
||||
await refreshProfileSnapshot();
|
||||
} catch (error) {
|
||||
status.className = 'status-line is-unavailable';
|
||||
status.textContent = `Не удалось сохранить: ${error.message || 'ошибка сети'}`;
|
||||
@ -174,8 +211,34 @@ export function render({ navigate }) {
|
||||
}
|
||||
}
|
||||
|
||||
async function onToggleClick(toggleKey) {
|
||||
const toggle = currentToggles.find((item) => item.key === toggleKey) || { enabled: false };
|
||||
const nextEnabled = !toggle.enabled;
|
||||
const title = toggleKey === 'official' ? 'Официальный аккаунт' : 'Сияющий аккаунт';
|
||||
|
||||
const confirmed = window.confirm(
|
||||
`Изменить параметр «${title}» на ${toggleText(nextEnabled)}?\n\n` +
|
||||
'Внимание: изменение будет записано как блокчейн-параметр пользователя и требует подписи ключом блокчейна/пользователя на устройстве.',
|
||||
);
|
||||
|
||||
if (!confirmed) return;
|
||||
|
||||
status.className = 'status-line';
|
||||
status.textContent = 'Отправка изменения в блокчейн...';
|
||||
|
||||
try {
|
||||
await saveProfileToggle(login, toggleKey, nextEnabled);
|
||||
await refreshProfileSnapshot();
|
||||
} catch (error) {
|
||||
status.className = 'status-line is-unavailable';
|
||||
status.textContent = `Не удалось изменить ${toggleKey}: ${error.message || 'ошибка сети'}`;
|
||||
}
|
||||
}
|
||||
|
||||
openEditBtn.addEventListener('click', openEditModal);
|
||||
saveBtn.addEventListener('click', saveChanges);
|
||||
officialBtn.addEventListener('click', () => onToggleClick('official'));
|
||||
shineBtn.addEventListener('click', () => onToggleClick('shine'));
|
||||
editModal.querySelector('[data-cancel-edit="true"]').addEventListener('click', closeEditModal);
|
||||
|
||||
editModal.addEventListener('click', (event) => {
|
||||
@ -189,10 +252,10 @@ export function render({ navigate }) {
|
||||
if (event.key === 'Escape') closeEditModal();
|
||||
});
|
||||
|
||||
card.append(topRow, hint, status, listWrap);
|
||||
card.append(topRow, badgesRow, hint, status, listWrap);
|
||||
screen.append(card, editModal);
|
||||
|
||||
refreshParams();
|
||||
refreshProfileSnapshot();
|
||||
|
||||
return screen;
|
||||
}
|
||||
|
||||
@ -8,6 +8,11 @@ export const profileFieldDefs = [
|
||||
{ key: 'phone', readKeys: ['phone'], label: 'Phone', placeholder: '+7 ...' },
|
||||
];
|
||||
|
||||
export const profileToggleDefs = [
|
||||
{ key: 'official', label: 'Официальный' },
|
||||
{ key: 'shine', label: 'Сияющий' },
|
||||
];
|
||||
|
||||
function normalizeItems(responsePayload) {
|
||||
const params = responsePayload?.params;
|
||||
if (!Array.isArray(params)) return [];
|
||||
@ -31,11 +36,24 @@ function getLatestByAliases(items, aliases) {
|
||||
return latest;
|
||||
}
|
||||
|
||||
export async function loadProfileParams(login) {
|
||||
function parseToggleValue(value) {
|
||||
const normalized = String(value || '').trim().toLowerCase();
|
||||
return normalized === 'true' || normalized === 'yes' || normalized === '1';
|
||||
}
|
||||
|
||||
async function getStoragePwd() {
|
||||
const storagePwd = state.session.storagePwdInMemory;
|
||||
if (!storagePwd) {
|
||||
throw new Error('Нет storagePwd в памяти сессии. Выполните вход заново.');
|
||||
}
|
||||
return storagePwd;
|
||||
}
|
||||
|
||||
export async function loadProfileSnapshot(login) {
|
||||
const payload = await authService.listUserParams(login);
|
||||
const items = normalizeItems(payload);
|
||||
|
||||
return profileFieldDefs.map((field) => {
|
||||
const fields = profileFieldDefs.map((field) => {
|
||||
const latest = getLatestByAliases(items, field.readKeys);
|
||||
return {
|
||||
key: field.key,
|
||||
@ -45,14 +63,23 @@ export async function loadProfileParams(login) {
|
||||
timeMs: latest?.timeMs || 0,
|
||||
};
|
||||
});
|
||||
|
||||
const toggles = profileToggleDefs.map((toggle) => {
|
||||
const latest = getLatestByAliases(items, [toggle.key]);
|
||||
return {
|
||||
key: toggle.key,
|
||||
label: toggle.label,
|
||||
enabled: latest ? parseToggleValue(latest.value) : false,
|
||||
rawValue: latest?.value || 'no',
|
||||
timeMs: latest?.timeMs || 0,
|
||||
};
|
||||
});
|
||||
|
||||
return { fields, toggles };
|
||||
}
|
||||
|
||||
export async function saveProfileParams(login, valuesByKey) {
|
||||
const storagePwd = state.session.storagePwdInMemory;
|
||||
if (!storagePwd) {
|
||||
throw new Error('Нет storagePwd в памяти сессии. Выполните вход заново.');
|
||||
}
|
||||
|
||||
const storagePwd = await getStoragePwd();
|
||||
const baseTime = Date.now();
|
||||
|
||||
for (let i = 0; i < profileFieldDefs.length; i += 1) {
|
||||
@ -66,3 +93,14 @@ export async function saveProfileParams(login, valuesByKey) {
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
export async function saveProfileToggle(login, key, enabled) {
|
||||
const storagePwd = await getStoragePwd();
|
||||
await authService.upsertUserParam({
|
||||
login,
|
||||
param: key,
|
||||
value: enabled ? 'yes' : 'no',
|
||||
timeMs: Date.now(),
|
||||
storagePwd,
|
||||
});
|
||||
}
|
||||
|
||||
36
task/2.md
36
task/2.md
@ -1,27 +1,31 @@
|
||||
# Задача 2 — Проверка работы личных данных на правой вкладке профиля
|
||||
# Задача 2 — Проверка работы личных данных и статусов профиля (правая вкладка)
|
||||
|
||||
## Что реализовано
|
||||
- На правой вкладке `Профиль` отображаются реальные пользовательские параметры, загружаемые с сервера через `ListUserParams`.
|
||||
- Добавлены поля профиля:
|
||||
- На правой вкладке `Профиль` отображаются реальные пользовательские параметры, загружаемые через `ListUserParams`.
|
||||
- Поля профиля:
|
||||
- `first_name` (чтение с обратной совместимостью с `name`)
|
||||
- `last_name`
|
||||
- `address_physical`
|
||||
- `address_web`
|
||||
- `phone`
|
||||
- Добавлена кнопка `Обновить`, которая открывает форму редактирования.
|
||||
- При сохранении UI отправляет `UpsertUserParam` по каждому полю; сервер добавляет новые записи в блокчейн-историю параметров.
|
||||
- После сохранения экран заново запрашивает данные и показывает актуальные значения.
|
||||
- Кнопка `Обновить` открывает форму редактирования и сохраняет изменения в пользовательские параметры блокчейна.
|
||||
- Добавлены рабочие переключатели:
|
||||
- `official`
|
||||
- `shine`
|
||||
- Для `official`/`shine` используется подтверждение перед записью, с предупреждением, что изменение идёт через блокчейн-параметры и требует подписи ключом пользователя.
|
||||
- Если `official`/`shine` отсутствуют в параметрах, они считаются `no` по умолчанию.
|
||||
|
||||
## Что проверить вручную
|
||||
1. Авторизоваться пользователем и открыть правую вкладку `Профиль`.
|
||||
2. Убедиться, что поля загрузились не из заглушек, а из `ListUserParams`.
|
||||
3. Нажать `Обновить`, заполнить поля и нажать `Сохранить`.
|
||||
4. Убедиться, что после сохранения значения обновились на экране.
|
||||
5. Повторно изменить, например, `phone`.
|
||||
6. Убедиться, что отображается последнее значение (`самая новая запись` по времени).
|
||||
7. Перезайти на страницу профиля и убедиться, что значения сохраняются и снова читаются с сервера.
|
||||
1. Авторизоваться и открыть правую вкладку `Профиль`.
|
||||
2. Убедиться, что поля профиля читаются из `ListUserParams`, а не из заглушек.
|
||||
3. Нажать `Обновить`, изменить `first_name/last_name/address_physical/address_web/phone`, нажать `Сохранить`.
|
||||
4. Убедиться, что после сохранения данные перечитались и обновились на экране.
|
||||
5. Нажать `Официальный`, подтвердить изменение и проверить смену `no -> yes` (или `yes -> no`).
|
||||
6. Нажать `Сияющий`, подтвердить изменение и проверить смену `no -> yes` (или `yes -> no`).
|
||||
7. Обновить страницу и убедиться, что состояния `official/shine` и личные поля сохраняются.
|
||||
8. Проверить кейс отсутствия `official/shine` в истории: UI должен показывать `no`.
|
||||
|
||||
## Ожидаемый результат
|
||||
- Правая вкладка профиля работает по-настоящему через API пользователя.
|
||||
- Данные не зависят от мок-заглушек старой версии страницы.
|
||||
- Сценарий повторного изменения поля корректно показывает последнее актуальное значение.
|
||||
- Правая вкладка профиля работает с реальными данными пользователя.
|
||||
- `official` и `shine` работают как настоящие параметры (yes/no), а не заглушки.
|
||||
- После каждой записи UI делает повторный `ListUserParams` и показывает актуальное состояние.
|
||||
|
||||
Loading…
Reference in New Issue
Block a user