Просмотр исходного кода

now login page could be displayed.

miskson 3 лет назад
Родитель
Сommit
63ecf8ac38
2 измененных файлов с 50 добавлено и 5 удалено
  1. 9 2
      hw15-gql-cathegory-pg/GQL.html
  2. 41 3
      hw15-gql-cathegory-pg/GQL_files/index.js

+ 9 - 2
hw15-gql-cathegory-pg/GQL.html

@@ -47,8 +47,15 @@
 </head>
 
 <body>
-  <header><h1>ГДЕ Я ОКАЗАЛСЯ?</h1></header>
-  
+  <header>
+    <h1>ГДЕ Я ОКАЗАЛСЯ?</h1>
+    <div>
+      <span>Name</span>
+      <button id="logBtn">log-in/out</button>
+      <button>order</button>
+    </div>
+  </header>
+
   <div id="mainContainer">
 
     <aside id="aside"></aside>

+ 41 - 3
hw15-gql-cathegory-pg/GQL_files/index.js

@@ -118,7 +118,6 @@ function authReducer(state, {type, token}){
     return state
 }
 
-
 function combineReducers(reducers){
     return (state={}, action) => {
         const newState = {}
@@ -149,8 +148,11 @@ console.log(store.getState()) //стартовое состояние может
 store.subscribe(() => console.log(store.getState()))
 
 //ПЕРЕДЕЛАТЬ ОТОБРАЖЕНИЕ с поправкой на то, что теперь промисы не в корне state а в state.promise
-const actionLogin = (login, password) =>
-    actionPromise('login', gql(`ЗАПРОС НА ЛОГИН`, {login ,password}))
+const actionLogin = (login=undefined, password=undefined) =>
+    actionPromise('login', gql(`
+    query log($login:String, $password:String) {
+        login(login: $login, password: $password)
+      }`, {login ,password}))
 
 
 const actionFullLogin = (login, password) =>
@@ -168,6 +170,11 @@ const actionFullLogin = (login, password) =>
     //сделать actionMyOrders
     //
 
+let logBtn = document.getElementById('logBtn')
+logBtn.onclick = () => {
+    location.href = "#/login"
+    store.dispatch(actionLogin())
+}
 /********************************MY STUFFF END****************************************************** */
 const actionRootCats = () =>
     actionPromise('rootCats', gql(`query {
@@ -235,6 +242,9 @@ window.onhashchange = () => {
         good() {
             store.dispatch(actionGoodById(_id))
         },
+        login() {
+
+        }
     }
     if (route in routes)
         routes[route]()
@@ -311,6 +321,34 @@ store.subscribe(() => {
     }
 })
 
+store.subscribe(()=> {
+    const { login } = store.getState().promise
+    const [, route, _id] = location.hash.split('/')
+    
+    let passInp, logInp
+    if(!login?.payload && route === 'login') {
+        console.log('hire');
+        aside.innerHTML = ''
+        main.innerHTML = `
+            <div style="border: 1px solid black; padding: 10px">
+                <button id="returnBtnLogin">&#8656 назад</button>
+                <input  id="logInp" style="display:block; margin:10px" type="text" placeholder="login"/>
+                <input  id="passInp" style="display:block; margin:10px" type="text" placeholder="password"/>
+                <button style="display:block; margin:0 auto">LOGIN</button>
+            </div>
+        `
+        let returnBtn = document.getElementById('returnBtnLogin')
+        logInp = document.getElementById('logInp')
+        passInp = document.getElementById('passInp')
+
+        returnBtn.onclick = () => {
+            logBtn.disabled = false
+            history.back()
+        }
+        logBtn.disabled = true
+    }
+})
+
 window.onload = () => {
     location.href = "#/category/5dc49f4d5df9d670df48cc64"
 }