merge

src/global-styles/base.scss

@@ -66,5 +66,22 @@ img {
 		font-family: monospace;
 		padding: 0 32px 16px;
 		color: #ccdde8;
+		font-size: 16px;
 	}
 }
+
+.log-block {
+	background: #ccdde8;
+	div {
+		white-space: pre;
+		font-family: monospace;
+		padding: 0 32px 16px;
+		color: #194965;
+		font-size: 14px;
+	}
+}
+
+.test-request-block {
+	padding: 0 32px 16px;
+
+}
\ No newline at end of file

src/main.jsx

@@ -22,6 +22,12 @@ export default function() {
       }, {})
     )}
   </div>;
+  const w = window;
+  w.addEventListener('resize', function() {
+    store.set({
+      isMobile: w.innerWidth < 1025
+    });
+  });
 };
 
 

src/model/Store.js

 let latest;
 const store = new Store(latest = {
   commit: window.CommitID,
+  isMobile: false,
   'navigation': {
     current: 'Login'
   },

src/view/block/account/Account.jsx

@@ -8,11 +8,23 @@ const AccountBlock = D.declare('view.block.AccountBlock', () => {
         <div class="account__info">
             <h3 class="account__name">
                 <User width="32" height="32"/>
-                <span>{'Ким Ир Сен Константин Му Константинович Константинопольский'.split(/\s/).map(word => <div
-                    cls="title-name-word">{word}</div>)}</span>
+                <span>
+                    {(update)=>store.sub([
+                        'account.data.firstname',
+                        'account.data.middlename',
+                        'account.data.lastname'
+                    ], (f, m, l)=>
+                      update(
+                        [l,f,m]
+                            .join(' ')
+                            .split(/\s+/)
+                            .map(word => <div class="title-name-word">{word}</div>)
+                      )
+                    )}
+                </span>
             </h3>
-            <p>Химки-2</p>
-            <p>Кассир</p>
+            <p>{store.val('account.data.location')}</p>
+            <p>{store.val('account.data.position.title')}</p>
         </div>
         <div class="account__rating">
             <Rating/>

src/view/block/header/Header.jsx

@@ -8,6 +8,27 @@ import { Page } from "../../page/Page";
 const {IF, NOT} = Store;
 const Header = D.declare('view.block.Header', () => {
     const tempPageMenuHidden = new Store.Value.Boolean(true);
+    const actions = {
+        logo: 'Account',
+        logout: function() {
+            store.set('account.token', false);
+            store.set('account.data', false);
+        },
+        profile: 'Profile'
+    };
+    store.sub('isMobile', (is)=> actions.profile = is ? 'Profile': 'Account');
+
+    const action = function(name) {
+        if(store.get('isTesting')){
+            // TODO SHOW MODAL
+        }else{
+            if(typeof actions[name] === 'function'){
+                actions[name]();
+            }else{
+                store.set( 'navigation.current', actions[name]);
+            }
+        }
+    };
     return <header class={D.cls(
         "page-header", {
             "page-header--inner": (NOT(store.valEqual( 'navigation.current', 'Login')))
@@ -32,20 +53,25 @@ const Header = D.declare('view.block.Header', () => {
         </div>
         <IF condition={NOT(store.valEqual( 'navigation.current', 'Login'))}>
             <div className="page-header__wrapper">
-                <a href="#" class="page-header__logo" aria-label={"Логотип ВкусВилл"}>
+                <Button class={"button page-header__logo-link page-header__logo"}
+                        aria-label={"Перейти на главную страницу"}
+                        onClick={()=>action('logo')}>
                     <Logo width="116" height="41"/>
-                </a>
+                </Button>
+
                 <div class="page-header__user-block">
                     <Button class={"button page-header__profile-link"}
-                            type={"button"}
                             aria-label={"Перейти на страницу профиля"}
-                            >
-                        <User width="32" height="32"/><span>Иванов Иван</span>
+                            onClick={()=>action('profile')}>
+                        <User width="32" height="32"/>
+                        <span>
+                        {store.val('account.data.lastname')}{' '}
+                        {store.val('account.data.firstname')}
+                        </span>
                     </Button>
                     <Button class={"button page-header__logout-link"}
-                            type={"button"}
                             aria-label={"Выйти из аккаунта"}
-                    >
+                            onClick={()=>action('logout')}>
                         <Logout width="18" height="18"/><span>Выйти</span>
                     </Button>
                 </div>

src/view/cmp/button/Button.jsx

 import './button.scss';
 
 export default D.declare('view.cmp.Button', function(cfg, children) {
-  return <button type={'button' || cfg.type} class={'button'} {...cfg}>{children}</button>
+  return <button type={cfg.type || 'button'} class={'button'} {...cfg}>{children}</button>
 });

src/view/cmp/field/LabeledField.jsx

 import './Field.scss';
 import Input from './Input.jsx';
 
-export default D.declare('view.cmp.field.LabeledField', (cfg, children)=> {
+const LabeledField = D.declare('view.cmp.field.LabeledField', (cfg, children)=> {
   return <div class={D.cls( "field", cfg.cls, { "field--invalid": cfg.invalid } )}>
     <label class="field__label">
       <span class="field__label-text">{cfg.label}</span>
@@ -9,4 +9,7 @@ export default D.declare('view.cmp.field.LabeledField', (cfg, children)=> {
     </label>
     {children}
   </div>
-})
+});
+
+export default LabeledField;
+export {LabeledField};
\ No newline at end of file

src/view/page/account/Account.jsx

@@ -5,6 +5,13 @@ import Eye from '/svg/eye.svg';
 import '../../block/card/card.scss';
 
 const Account = D.declare('view.page.Account', () => {
+    store.sub([
+      'isMobile', 'navigation.current'
+    ], (is, page)=>{
+        if(!is && page === 'Profile')
+            store.set('navigation.current', 'Account');
+    });
+
     return <div class="account-page">
         <h1 class="readers-only">Страница личного кабинета сотрудника</h1>
         <div class="account-page__wrapper">

src/view/page/login/Login.jsx

@@ -39,6 +39,10 @@ const Login = D.declare('view.page.Login', () => {
             loginStore.set({phone})
         }else{
             const result = await AsyncAuthAjax.get( API.ENDPOINTS.GET_USER( store.get( 'account.userID' ) ) );
+            if(store.get('account.data') &&
+                store.get('navigation.current') !== 'Login'){
+
+            }else{
                 store.set( 'account.data', result );
                 if( result.lastLoginAt ){
                     store.set( 'navigation.current', 'Account' );
@@ -46,6 +50,7 @@ const Login = D.declare('view.page.Login', () => {
                     store.set( 'navigation.current', 'Welcome' );
                 }
             }
+        }
     });
 
     return <div className={"login-page"}>

src/view/page/tmp/TestRequests.jsx

@@ -5,14 +5,38 @@ import Input from "../../cmp/field/Input";
 import { AsyncAuthAjax } from "../../../controller/Ajax";
 import {API} from "../../../dict/Consts";
 const TestRequests = D.declare('view.page.tmp.TestRequests', () => {
-  let response;
-  return <div>
-        Курвалол
-    <button onclick={async()=>{
-      const result = await AsyncAuthAjax.get(API.ENDPOINTS.GET_USER(store.get('account.userID')));
-      response.innerText = JSON.stringify(result, null, 2);
-    }}>Get user</button>
-    <div className='error-block'>{response = <div></div>}</div>
+
+  return <div style={{padding: '16px'}}>
+        <h1>Testing requests</h1>
+
+
+      {((response, s = new Store({id: store.get('account.userID')}))=>
+        <div class='test-request-block'>
+          <LabeledField bind={s.bind('id')} label={'User ID'}/>
+          <button onClick={async() => {
+            const result = await AsyncAuthAjax.get( API.ENDPOINTS.GET_USER( s.get( 'id' ) ) );
+            response.innerText = JSON.stringify( result, null, 2 );
+          }}>
+            Get user
+          </button>
+          <div className='log-block'>{response = <div/>}</div>
+      </div>)()}
+
+    {((response)=>
+      <div class='test-request-block'>
+        <button onClick={async() => {
+          const result = await AsyncAuthAjax.get( API.ENDPOINTS.GET_USER_NEW_CARDS() );
+          response.innerText = `${result.length} new cards.
+`+JSON.stringify( result.slice(0,3), null, 2 )+'\n\n   . . . . .\n\n'+
+  JSON.stringify( result.slice(result.length-3), null, 2 );
+        }}>
+          New cards
+        </button>
+        <div className='log-block'>{response = <div/>}</div>
+      </div>)()}
+
+
+
   </div>
 });