diff --git a/shine-UI/js/pages/profile-view.js b/shine-UI/js/pages/profile-view.js index 3b46420..debdeff 100644 --- a/shine-UI/js/pages/profile-view.js +++ b/shine-UI/js/pages/profile-view.js @@ -3,27 +3,21 @@ import { profile } from '../mock-data.js?v=20260405171816'; import { state } from '../state.js?v=20260405171816'; import { loadProfileSnapshot, - profileFieldDefs, - saveProfileParams, + saveProfileParamBlock, saveProfileToggle, } from '../services/user-profile-params.js?v=20260405171816'; export const pageMeta = { id: 'profile-view', title: 'Профиль' }; -function formatDateTime(timeMs) { - if (!timeMs) return 'ещё не заполнено'; - return new Date(timeMs).toLocaleString('ru-RU'); -} - -function getDisplayName(fieldMap) { - const firstName = fieldMap.get('first_name')?.value?.trim() || ''; - const lastName = fieldMap.get('last_name')?.value?.trim() || ''; +function getDisplayName(fields) { + const firstName = fields.find((field) => field.key === 'first_name')?.value?.trim() || ''; + const lastName = fields.find((field) => field.key === 'last_name')?.value?.trim() || ''; const fullName = `${firstName} ${lastName}`.trim(); return fullName || profile.name; } function toggleText(enabled) { - return enabled ? 'yes' : 'no'; + return enabled ? 'Yes' : 'No'; } export function render({ navigate }) { @@ -55,21 +49,21 @@ export function render({ navigate }) {

${login}

- + `; const badgesRow = document.createElement('div'); badgesRow.className = 'row'; badgesRow.innerHTML = ` - - + + `; const hint = document.createElement('div'); hint.className = 'card profile-data-help'; hint.innerHTML = `
Личные данные пользователя
-

Поля ниже читаются из реальных пользовательских параметров сервера (ListUserParams). Любое изменение отправляется как блокчейн-запись параметра и требует подпись ключом пользователя.

+

Параметры читаются через API GetUserParam. Изменения записываются через ADD-блок с подписью blockchain key.

`; const status = document.createElement('div'); @@ -79,65 +73,57 @@ export function render({ navigate }) { const listWrap = document.createElement('div'); listWrap.className = 'stack profile-param-list'; - const editModal = document.createElement('div'); - editModal.className = 'profile-help-modal'; - editModal.hidden = true; - editModal.innerHTML = ` -
- - `; - const profileNameEl = topRow.querySelector('[data-profile-name="true"]'); - const openEditBtn = topRow.querySelector('[data-open-edit="true"]'); + const reloadBtn = topRow.querySelector('[data-reload="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 }, - ]; + let currentFields = []; + let currentToggles = []; + + function updateToggleButton(button, prefix, enabled) { + button.textContent = `${prefix}: ${toggleText(enabled)}`; + button.classList.remove('is-no', 'is-yes-official', 'is-yes-shine'); + + if (!enabled) { + button.classList.add('is-no'); + return; + } + + if (prefix === 'Официальный') { + button.classList.add('is-yes-official'); + } else { + button.classList.add('is-yes-shine'); + } + } 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)}`; + updateToggleButton(officialBtn, 'Официальный', official.enabled); + updateToggleButton(shineBtn, 'Сияющий', shine.enabled); } function renderFields(fields) { - const fieldMap = new Map(fields.map((field) => [field.key, field])); - profileNameEl.textContent = getDisplayName(fieldMap); + profileNameEl.textContent = getDisplayName(fields); + const readyFields = fields.filter((field) => String(field.value || '').trim()); listWrap.innerHTML = ''; - fields.forEach((field) => { + + if (!readyFields.length) { + const emptyState = document.createElement('div'); + emptyState.className = 'meta-muted'; + emptyState.textContent = 'Пока нет заполненных персональных параметров.'; + listWrap.append(emptyState); + return; + } + + readyFields.forEach((field) => { const row = document.createElement('div'); - row.className = 'card profile-param-item'; + row.className = 'card profile-param-item row'; row.innerHTML = ` -
- ${field.label} - ${field.key} -
-
${field.value || '—'}
-
Обновлено: ${formatDateTime(field.timeMs)}
+
${field.label}: ${field.value}
+ `; listWrap.append(row); }); @@ -146,7 +132,7 @@ export function render({ navigate }) { async function refreshProfileSnapshot() { status.className = 'status-line'; status.textContent = 'Загрузка параметров...'; - openEditBtn.disabled = true; + reloadBtn.disabled = true; officialBtn.disabled = true; shineBtn.disabled = true; @@ -154,77 +140,35 @@ export function render({ navigate }) { 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) { + renderFields(currentFields); updateTogglesUi(); + + status.className = 'status-line is-available'; + status.textContent = 'Актуальные параметры загружены.'; + } catch (error) { status.className = 'status-line is-unavailable'; status.textContent = `Не удалось загрузить параметры: ${error.message || 'ошибка сети'}`; } finally { - openEditBtn.disabled = false; + reloadBtn.disabled = false; officialBtn.disabled = false; shineBtn.disabled = false; } } - function closeEditModal() { - editModal.hidden = true; - } - - function openEditModal() { - formEl.innerHTML = ''; - - currentFields.forEach((field) => { - const fieldWrap = document.createElement('label'); - fieldWrap.className = 'stack'; - fieldWrap.innerHTML = ` - ${field.label} - - `; - formEl.append(fieldWrap); - }); - - editModal.hidden = false; - dialogEl.focus(); - } - - async function saveChanges() { - const valuesByKey = {}; - currentFields.forEach((field) => { - const input = formEl.querySelector(`input[name="${field.key}"]`); - valuesByKey[field.key] = input instanceof HTMLInputElement ? input.value : ''; - }); - - saveBtn.disabled = true; - try { - await saveProfileParams(login, valuesByKey); - closeEditModal(); - await refreshProfileSnapshot(); - } catch (error) { - status.className = 'status-line is-unavailable'; - status.textContent = `Не удалось сохранить: ${error.message || 'ошибка сети'}`; - } finally { - saveBtn.disabled = false; - } - } - async function onToggleClick(toggleKey) { const toggle = currentToggles.find((item) => item.key === toggleKey) || { enabled: false }; const nextEnabled = !toggle.enabled; - const title = toggleKey === 'official' ? 'Официальный аккаунт' : 'Сияющий аккаунт'; + const title = toggleKey === 'official' ? 'официальный' : 'сияющий'; const confirmed = window.confirm( - `Изменить параметр «${title}» на ${toggleText(nextEnabled)}?\n\n` + - 'Внимание: изменение будет записано как блокчейн-параметр пользователя и требует подписи ключом блокчейна/пользователя на устройстве.', + `Хотите изменить «${title}» на ${toggleText(nextEnabled)}?\n` + + 'Будет создана запись в блокчейне (ADD-блок).', ); - if (!confirmed) return; status.className = 'status-line'; - status.textContent = 'Отправка изменения в блокчейн...'; + status.textContent = 'Сохранение в блокчейн...'; try { await saveProfileToggle(login, toggleKey, nextEnabled); @@ -235,25 +179,44 @@ export function render({ navigate }) { } } - openEditBtn.addEventListener('click', openEditModal); - saveBtn.addEventListener('click', saveChanges); + async function onEditFieldClick(fieldKey) { + const field = currentFields.find((item) => item.key === fieldKey); + if (!field) return; + + const entered = window.prompt(`Введите новое значение для «${field.label}»:`, field.value || ''); + if (entered === null) return; + + const confirmed = window.confirm( + `Записать новое значение параметра «${field.label}» в блокчейн?`, + ); + if (!confirmed) return; + + status.className = 'status-line'; + status.textContent = 'Сохранение в блокчейн...'; + + try { + await saveProfileParamBlock(login, field.key, entered); + await refreshProfileSnapshot(); + } catch (error) { + status.className = 'status-line is-unavailable'; + status.textContent = `Не удалось изменить ${field.key}: ${error.message || 'ошибка сети'}`; + } + } + + listWrap.addEventListener('click', (event) => { + const target = event.target; + if (!(target instanceof HTMLElement)) return; + const fieldKey = target.dataset.editField; + if (!fieldKey) return; + onEditFieldClick(fieldKey); + }); + + reloadBtn.addEventListener('click', refreshProfileSnapshot); officialBtn.addEventListener('click', () => onToggleClick('official')); shineBtn.addEventListener('click', () => onToggleClick('shine')); - editModal.querySelector('[data-cancel-edit="true"]').addEventListener('click', closeEditModal); - - editModal.addEventListener('click', (event) => { - const target = event.target; - if (target instanceof HTMLElement && (target.dataset.close === 'true' || target.classList.contains('profile-help-close'))) { - closeEditModal(); - } - }); - - editModal.addEventListener('keydown', (event) => { - if (event.key === 'Escape') closeEditModal(); - }); card.append(topRow, badgesRow, hint, status, listWrap); - screen.append(card, editModal); + screen.append(card); refreshProfileSnapshot(); diff --git a/shine-UI/js/services/auth-service.js b/shine-UI/js/services/auth-service.js index 1bae7cc..2d0ab83 100644 --- a/shine-UI/js/services/auth-service.js +++ b/shine-UI/js/services/auth-service.js @@ -289,6 +289,52 @@ export class AuthService { return response.payload?.logins || []; } + + + async getUserParam(login, param) { + const cleanLogin = (login || '').trim(); + const cleanParam = (param || '').trim(); + if (!cleanLogin || !cleanParam) throw new Error('Не переданы login/param'); + + const response = await this.ws.request('GetUserParam', { login: cleanLogin, param: cleanParam }); + if (response.status === 200) return response.payload || {}; + + if (response.status === 404 || response.status === 204) return {}; + + throw opError('GetUserParam', response); + } + + async addUserParamBlock({ login, param, value, timeMs = Date.now(), storagePwd }) { + const cleanLogin = (login || '').trim(); + const cleanParam = (param || '').trim(); + if (!cleanLogin || !cleanParam) throw new Error('Не переданы login/param'); + if (!storagePwd) throw new Error('Не передан storagePwd для подписи блокчейна'); + + const user = await this.getUser(cleanLogin); + const blockchainKey = String(user?.blockchainKey || '').trim(); + if (!blockchainKey) throw new Error('GetUser не вернул blockchainKey'); + + const savedKeys = await loadEncryptedUserSecrets(cleanLogin, storagePwd); + const blockchainPrivatePkcs8 = savedKeys?.blockchainKey; + if (!blockchainPrivatePkcs8) throw new Error('На устройстве нет сохраненного приватного blockchainKey'); + + const privateKey = await importPkcs8Ed25519(blockchainPrivatePkcs8); + const cleanValue = String(value ?? ''); + const signText = `${USER_PARAMETER_PREFIX}${cleanLogin}${cleanParam}${timeMs}${cleanValue}`; + const signature = await signBase64(privateKey, signText); + + const response = await this.ws.request('AddUserParamBlock', { + login: cleanLogin, + param: cleanParam, + time_ms: Number(timeMs), + value: cleanValue, + blockchain_key: blockchainKey, + signature, + }); + + if (response.status !== 200) throw opError('AddUserParamBlock', response); + return response.payload || {}; + } async listUserParams(login) { const cleanLogin = (login || '').trim(); if (!cleanLogin) throw new Error('Не передан login'); diff --git a/shine-UI/js/services/user-profile-params.js b/shine-UI/js/services/user-profile-params.js index f007a5d..40cdf75 100644 --- a/shine-UI/js/services/user-profile-params.js +++ b/shine-UI/js/services/user-profile-params.js @@ -1,11 +1,11 @@ import { authService, state } from '../state.js?v=20260403081123'; export const profileFieldDefs = [ - { key: 'first_name', readKeys: ['first_name', 'name'], label: 'First name', placeholder: 'Введите имя' }, - { key: 'last_name', readKeys: ['last_name'], label: 'Last name', placeholder: 'Введите фамилию' }, - { key: 'address_physical', readKeys: ['address_physical'], label: 'Address physical', placeholder: 'Город, улица, дом' }, - { key: 'address_web', readKeys: ['address_web'], label: 'Address web', placeholder: 'Сайт или профиль' }, - { key: 'phone', readKeys: ['phone'], label: 'Phone', placeholder: '+7 ...' }, + { key: 'first_name', readKeys: ['first_name', 'ашкые_name'], label: 'Имя', placeholder: 'Введите имя' }, + { key: 'last_name', readKeys: ['last_name'], label: 'Фамилия', placeholder: 'Введите фамилию' }, + { key: 'address_physical', readKeys: ['address_physical'], label: 'Физический адрес', placeholder: 'Город, улица, дом' }, + { key: 'address_web', readKeys: ['address_web'], label: 'Веб-адрес', placeholder: 'Сайт или профиль' }, + { key: 'phone', readKeys: ['phone'], label: 'Телефон', placeholder: '+7 ...' }, ]; export const profileToggleDefs = [ @@ -13,27 +13,29 @@ export const profileToggleDefs = [ { key: 'shine', label: 'Сияющий' }, ]; -function normalizeItems(responsePayload) { - const params = responsePayload?.params; - if (!Array.isArray(params)) return []; - return params - .map((item) => ({ - param: String(item?.param || '').trim(), - value: String(item?.value || ''), - timeMs: Number(item?.time_ms || 0), - })) - .filter((item) => item.param); -} +function normalizeItem(param, payload) { + if (!param) return null; -function getLatestByAliases(items, aliases) { - let latest = null; - items.forEach((item) => { - if (!aliases.includes(item.param)) return; - if (!latest || item.timeMs >= latest.timeMs) { - latest = item; - } - }); - return latest; + if (Array.isArray(payload?.params)) { + const latest = payload.params + .map((item) => ({ + value: String(item?.value || ''), + timeMs: Number(item?.time_ms || 0), + })) + .sort((a, b) => b.timeMs - a.timeMs)[0]; + + if (!latest) return null; + return { param, value: latest.value, timeMs: latest.timeMs }; + } + + if (payload && typeof payload === 'object') { + const value = String(payload?.value || payload?.param_value || ''); + const timeMs = Number(payload?.time_ms || payload?.timeMs || 0); + if (!value && !timeMs) return null; + return { param, value, timeMs }; + } + + return null; } function parseToggleValue(value) { @@ -49,54 +51,68 @@ async function getStoragePwd() { return storagePwd; } -export async function loadProfileSnapshot(login) { - const payload = await authService.listUserParams(login); - const items = normalizeItems(payload); +async function loadLatestByAliases(login, aliases) { + const collected = []; - const fields = profileFieldDefs.map((field) => { - const latest = getLatestByAliases(items, field.readKeys); - return { + for (let i = 0; i < aliases.length; i += 1) { + const alias = aliases[i]; + try { + const payload = await authService.getUserParam(login, alias); + const normalized = normalizeItem(alias, payload); + if (normalized) collected.push(normalized); + } catch { + // Пусто — параметр ещё не создан или endpoint не отвечает для конкретного ключа. + } + } + + if (!collected.length) return null; + return collected.sort((a, b) => b.timeMs - a.timeMs)[0]; +} + +export async function loadProfileSnapshot(login) { + const fields = []; + for (let i = 0; i < profileFieldDefs.length; i += 1) { + const field = profileFieldDefs[i]; + const latest = await loadLatestByAliases(login, field.readKeys); + fields.push({ key: field.key, label: field.label, placeholder: field.placeholder, value: latest?.value || '', timeMs: latest?.timeMs || 0, - }; - }); + }); + } - const toggles = profileToggleDefs.map((toggle) => { - const latest = getLatestByAliases(items, [toggle.key]); - return { + const toggles = []; + for (let i = 0; i < profileToggleDefs.length; i += 1) { + const toggle = profileToggleDefs[i]; + const latest = await loadLatestByAliases(login, [toggle.key]); + toggles.push({ 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) { +export async function saveProfileParamBlock(login, key, value) { const storagePwd = await getStoragePwd(); - const baseTime = Date.now(); - - for (let i = 0; i < profileFieldDefs.length; i += 1) { - const field = profileFieldDefs[i]; - await authService.upsertUserParam({ - login, - param: field.key, - value: String(valuesByKey[field.key] || '').trim(), - timeMs: baseTime + i, - storagePwd, - }); - } + await authService.addUserParamBlock({ + login, + param: key, + value: String(value ?? '').trim(), + timeMs: Date.now(), + storagePwd, + }); } export async function saveProfileToggle(login, key, enabled) { const storagePwd = await getStoragePwd(); - await authService.upsertUserParam({ + await authService.addUserParamBlock({ login, param: key, value: enabled ? 'yes' : 'no', diff --git a/shine-UI/styles/components.css b/shine-UI/styles/components.css index 25751f9..6459e5e 100644 --- a/shine-UI/styles/components.css +++ b/shine-UI/styles/components.css @@ -97,6 +97,24 @@ background: rgba(83, 216, 251, 0.11); } +.badge.profile-toggle-btn.is-no { + border-color: rgba(170, 180, 205, 0.3); + color: #c5cedd; + background: rgba(152, 164, 190, 0.14); +} + +.badge.profile-toggle-btn.is-yes-official { + border-color: rgba(132, 244, 161, 0.5); + color: #ddffe7; + background: rgba(132, 244, 161, 0.2); +} + +.badge.profile-toggle-btn.is-yes-shine { + border-color: rgba(183, 122, 255, 0.6); + color: #f4e7ff; + background: rgba(176, 102, 255, 0.22); +} + .profile-help-modal[hidden] { display: none; }