🧼
This commit is contained in:
parent
181a2bbb74
commit
1e8d655d1d
|
@ -11,22 +11,21 @@ type Client = {
|
|||
name: string
|
||||
email: string
|
||||
phone: number
|
||||
active_session: boolean
|
||||
photos: string[]
|
||||
}
|
||||
```
|
||||
|
||||
post /api/clients -> create new client
|
||||
get /api/clients -> get client list
|
||||
get /api/clients/:id -> get client
|
||||
|
||||
```ts
|
||||
type Session = string[] | null
|
||||
```
|
||||
|
||||
post /api/clients/:id/session -> begin capture
|
||||
get /api/clients/:id/session -> get active sesion (list of preview photo locations)
|
||||
delete /api/clients/:id/session -> delete all current photos (for new capture)
|
||||
|
||||
### Note Needed
|
||||
|
||||
get /api/clients -> get client list
|
||||
get /api/clients/:id/session -> get active sesion (list of preview photo locations)
|
||||
|
||||
## Create Session
|
||||
|
||||
Information gathering
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import { Client } from '../types'
|
||||
import axios from 'axios'
|
||||
import { client, clients, session } from '../data'
|
||||
import { client, clients } from '../data'
|
||||
import settings from '../settings'
|
||||
|
||||
const apiUrl = '/api'
|
||||
|
@ -20,19 +20,10 @@ export const getClient = async (id: string): Promise<Client> => {
|
|||
return res.data
|
||||
}
|
||||
export const startSession = async (clientId: string) => {
|
||||
//
|
||||
const res = await axios.post(`${apiUrl}/clients/${clientId}/session`)
|
||||
return res.data // session data
|
||||
}
|
||||
|
||||
export const getSession = async (
|
||||
clientId: string,
|
||||
): Promise<null | string[]> => {
|
||||
if (settings.env === 'jank') return session
|
||||
const res = await axios.get(`${apiUrl}/clients/${clientId}/session`)
|
||||
return res.data as null | string[]
|
||||
}
|
||||
|
||||
export const killSession = async (clientId: string) => {
|
||||
await axios.delete(`${apiUrl}/clients/${clientId}/session`)
|
||||
}
|
||||
|
|
|
@ -5,19 +5,18 @@ export const clients: Client[] = [
|
|||
name: 'Elijah',
|
||||
email: 'elijah@elijah.com',
|
||||
phone: 4039876543,
|
||||
photos: [],
|
||||
},
|
||||
{
|
||||
name: 'Tanner',
|
||||
email: 'tanner@tanner.com',
|
||||
phone: 4031234567,
|
||||
activeSession: true,
|
||||
},
|
||||
]
|
||||
export const client: Client = clients[0]
|
||||
|
||||
export const session = [
|
||||
photos: [
|
||||
'/images/1.jpg',
|
||||
'/images/2.jpg',
|
||||
'/images/3.jpg',
|
||||
'/images/4.jpg',
|
||||
],
|
||||
},
|
||||
]
|
||||
export const client: Client = clients[0]
|
||||
|
|
|
@ -1,17 +1,18 @@
|
|||
import React from 'react';
|
||||
import ReactDOM from 'react-dom';
|
||||
import './index.css';
|
||||
import App from './App';
|
||||
import reportWebVitals from './reportWebVitals';
|
||||
import React from 'react'
|
||||
import ReactDOM from 'react-dom'
|
||||
import './index.css'
|
||||
import 'antd/dist/antd.css'
|
||||
import App from './App'
|
||||
import reportWebVitals from './reportWebVitals'
|
||||
|
||||
ReactDOM.render(
|
||||
<React.StrictMode>
|
||||
<App />
|
||||
</React.StrictMode>,
|
||||
document.getElementById('root')
|
||||
);
|
||||
document.getElementById('root'),
|
||||
)
|
||||
|
||||
// If you want to start measuring performance in your app, pass a function
|
||||
// to log results (for example: reportWebVitals(console.log))
|
||||
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
|
||||
reportWebVitals();
|
||||
reportWebVitals()
|
||||
|
|
|
@ -1,3 +1,4 @@
|
|||
import { Content } from 'antd/lib/layout/layout'
|
||||
import React, { FormEvent } from 'react'
|
||||
import { useState } from 'react'
|
||||
import { useHistory } from 'react-router-dom'
|
||||
|
@ -37,7 +38,7 @@ export const Dashboard = () => {
|
|||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Content>
|
||||
<h1>Dashboard</h1>
|
||||
<form onSubmit={handleSubmit}>
|
||||
<label htmlFor="name">
|
||||
|
@ -72,6 +73,6 @@ export const Dashboard = () => {
|
|||
</button>
|
||||
{error && <p className="error">{error}</p>}
|
||||
</form>
|
||||
</div>
|
||||
</Content>
|
||||
)
|
||||
}
|
||||
|
|
|
@ -2,7 +2,8 @@ import React, { useEffect, useState } from 'react'
|
|||
import { RouteComponentProps, useHistory } from 'react-router-dom'
|
||||
import { getClient, killSession, restartSession } from '../api'
|
||||
import { SessionPictures } from './SessionPictures'
|
||||
import { Button } from 'antd'
|
||||
import { Button, message, PageHeader, Popconfirm, Row } from 'antd'
|
||||
import { Content } from 'antd/lib/layout/layout'
|
||||
|
||||
type Props = RouteComponentProps<{ clientId: string }>
|
||||
|
||||
|
@ -32,27 +33,60 @@ export const Session = (props: Props) => {
|
|||
|
||||
useEffect(() => {
|
||||
const get = async () => {
|
||||
const { activeSession } = await getClient(clientId)
|
||||
if (activeSession) setActive(true)
|
||||
const { photos } = await getClient(clientId)
|
||||
if (photos.length) setActive(true)
|
||||
else message.info("Click 'Capture' to take a photo set!")
|
||||
}
|
||||
|
||||
get()
|
||||
})
|
||||
|
||||
return (
|
||||
<div>
|
||||
<h1>Session for {clientId}</h1>
|
||||
<button onClick={handleStartSession}>Capture</button>
|
||||
<div className="controls">
|
||||
<Button disabled={!active} onClick={handleRestartSession}>
|
||||
<Content>
|
||||
<div className="site-page-header-ghost-wrapper">
|
||||
<PageHeader
|
||||
ghost={false}
|
||||
onBack={() => history.goBack()}
|
||||
title={`Session for ${clientId}`}
|
||||
subTitle={`session has ${active ? 'started' : 'not started'}`}
|
||||
extra={[
|
||||
<Button
|
||||
key="startsession"
|
||||
disabled={active}
|
||||
type="primary"
|
||||
onClick={handleStartSession}
|
||||
>
|
||||
Capture
|
||||
</Button>,
|
||||
<Popconfirm
|
||||
title="Re-capture set?"
|
||||
onConfirm={handleRestartSession}
|
||||
>
|
||||
<Button key="retry" type="default" disabled={!active}>
|
||||
Retry Capture
|
||||
</Button>
|
||||
<Button disabled={!active} onClick={handleNuke}>
|
||||
</Popconfirm>,
|
||||
<Popconfirm title="Delete all photos?" onConfirm={handleNuke}>
|
||||
<Button key="nuke" danger disabled={!active}>
|
||||
Nuke Session
|
||||
</Button>
|
||||
<Button onClick={handleExit}>Exit Session</Button>
|
||||
</Popconfirm>,
|
||||
<Button
|
||||
key="finish"
|
||||
ghost
|
||||
type="primary"
|
||||
disabled={!active}
|
||||
onClick={handleExit}
|
||||
>
|
||||
Finish Session
|
||||
</Button>,
|
||||
]}
|
||||
></PageHeader>
|
||||
</div>
|
||||
|
||||
<Row className="controls">
|
||||
{active && <SessionPictures clientId={clientId} />}
|
||||
</div>
|
||||
</div>
|
||||
</Row>
|
||||
</Content>
|
||||
)
|
||||
}
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
export type Client = {
|
||||
name: string;
|
||||
email: string;
|
||||
phone: number;
|
||||
activeSession?: boolean
|
||||
};
|
||||
name: string
|
||||
email: string
|
||||
phone: number
|
||||
photos: string[]
|
||||
}
|
||||
|
||||
export type Session = {
|
||||
timestamp: number;
|
||||
};
|
||||
timestamp: number
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue
Block a user