Merge branch 'dev' into photoapi

APP/bullseyes/bullseyes/urls.py

@@ -29,6 +29,7 @@
 urlpatterns = [
     path('', include(router.urls)),
     path('admin/', admin.site.urls),
+   # path('accessusers/create', views.accessuser_edit)
     # path('users/', views.user_list),
     # path('users/<int:pk>', views.user_edit),
     # path('accessusers/', views.accessuser_list),

APP/bullseyes/bullseyes_server/views.py

@@ -22,7 +22,7 @@ def create(self, request, *args, **kwargs):
         # modify them using 
         self.perform_create(serializer)
         headers = self.get_success_headers(serializer.data)
-        return Response(serializer.data, status=status.HTTP_201_CREATED, headers=headers)
+        return Response({'data':serializer.initial_data}, status=status.HTTP_201_CREATED, headers=headers)
     # modify these taking in rank, name, other recognition
     def perform_create(self, serializer):
         serializer.save()
@@ -50,7 +50,7 @@ def update(self, request, *args, **kwargs):
             # forcibly invalidate the prefetch cache on the instance.
             instance._prefetched_objects_cache = {}
 
-        return Response(serializer.data)
+        return Response({'data':serializer.initial_data})
 
     def perform_update(self, serializer):
         serializer.save()
@@ -62,7 +62,6 @@ class UserViewSet(AccessUserViewSet):
     queryset = User.objects.all().order_by('id')
     serializer_class = UserSerializer
     filterset_class = filters.UserFilter
-    search_fields = ["name"]
     permission_classes = [permissions.AllowAny]
     parser_classes = [JSONParser, MultiPartParser, FormParser]
 
@@ -72,7 +71,6 @@ class AccessViewSet(AccessUserViewSet):
     serializer_class = AccessUserSerializer
     filterset_class = filters.AccessUserFilter
     permission_classes = [permissions.AllowAny]
-    search_fields = ["name"]
     parser_classes = [JSONParser, MultiPartParser, FormParser]
 # @api_view(['POST','GET'])
 # @parser_classes([MultiPartParser,FormParser])

WEB/web-admin/src/AccessUser.js

@@ -16,13 +16,31 @@ import {
     TextInput,
     Show,
     SimpleShowLayout,
-    useListContext
+    useListContext,
+    required,
+    CardActions,
+    CreateButton,
+    translate,
+    Toolbar,
+    SaveButton,
+    EditButton,
 } from 'react-admin';
-import { CardHeader,  Card as MuiCard, CardContent, withStyles } from '@material-ui/core';
+import { CardHeader,  Card as MuiCard, CardContent, Drawer, withStyles } from '@material-ui/core';
 import { LastVisitedFilter, HasOrderedFilter } from './sideFilter';
 // import FaceVideo from "./faceRecognition";
 import './App.css';
+import { Route } from 'react-router';
+import compose from 'recompose/compose';
+import { connect } from "react-redux";
+import { push } from "react-router-redux";
+import Button from '@material-ui/core/Button';
+import { mergeClasses } from "@material-ui/styles";
 
+const styles = {
+  drawerContent: {
+    width: 300
+  }
+};
 
 const Card = withStyles(theme => ({
     root: {
@@ -44,51 +62,114 @@ const FilterSidebar = () => (
       </CardContent>
   </Card>
 );
-export const AccessUserList = props => (
-
-  // [] = useEffect()
-    <div  className="access">
-        <div className="table">
-            <List aside={<FilterSidebar />} {...props} >
-                <Datagrid rowClick="show">
-                <TextField label="순번" source="id" />
-                <ImageField label="사진"source="photourl" />
-                <DateField label="출입시간"source="time" showTime/>
-                <TextField label="계급" source="rank"/>
-                <TextField label="이름" source="name" />
-                <TextField label="군번" source="altid"/>
-                <TextField label="소속" source="company"/>
-                </Datagrid>
-            </List>
-        </div>
-    </div>
+
+const ListActions = ({ basePath }) => (
+  <CardActions>
+    <CreateButton basePath={basePath} />
+  </CardActions>
 );
 
-export const AccessUserCreate = (props) => (
-
-    <Create {...props}>
-      <SimpleForm>
-        <TextInput label="순번" source="id" />
-        <FileInput label="사진" source="photourl">
-          <FileField source="src" title="title"/>  
-        </FileInput>
-        <DateTimeInput label="출입시간"source="time" showTime/>
-        <TextInput label="계급" source="rank" />
-        <TextInput label="이름" source="name" />
-        <TextInput label="군번" source="altid" />
-        <TextInput label="소속" source="company" />
-      </SimpleForm>
-    </Create>
-  );
+class AccessUserList extends React.Component {
+  render() {
+    const { push, classes, ...props} = this.props;
+    return (
+      <div className="access">
+           <div className="table">
+              <List aside={<FilterSidebar />} {...props} actions={<ListActions/>}>
+                  <Datagrid rowClick="show">
+                    <TextField label="순번" source="id" />
+                    <ImageField label="사진"source="photourl" />
+                    <DateField label="출입시간"source="time" showTime />
+                    <TextField label="계급" source="rank" />
+                    <TextField label="이름" source="name" />
+                    <TextField label="군번" source="altid" />
+                    <TextField label="소속" source="company" />
+                    <EditButton />
+                  </Datagrid>
+              </List>
+              <Route path="/accessusers/create">
+                {({match}) => (
+                  <Drawer open={!!match} anchor="left" onClose={this.handleClose}>
+                    <AccessUserCreate className={classes.drawerContent} onCancel={this.handleClose} {...props} />
+                  </Drawer>
+                )}
+              </Route>
+              <Route path="/accessusers/:id">
+                {({ match }) => {
+                  const isMatch = match && match.params && match.params.id !== "create";
+
+                  return (
+                    <Drawer open={isMatch} anchor="left" onClose={this.handleClose}>
+                      {/* To avoid any errors if the route does not match, we don't render at all the component in this case */}
+                      {isMatch ? (
+                        <AccessUserEdit
+                          className={classes.drawerContent}
+                          id={match.params.id}
+                          onCancel={this.handleClose}
+                          {...props}
+                        />
+                      ) : (
+                          <div className={classes.drawerContent} />
+                      )}
+                      </Drawer>
+                  );
+                }}
+              </Route>
+          </div>
+          <div>
+              <Card className="face">
+                  <CardHeader title="Welcome to the administration" />
+                  <CardContent>Lorem ipsum sic dolor amet...</CardContent>
+              </Card>
+          </div>
+      </div>
+    );
+  }
+
+  handleClose = () => {
+    this.props.push("/accessusers");
+  };
+}
+
+export default compose(
+  connect(
+    undefined,
+    { push }
+  ),
+  withStyles(styles)
+)(AccessUserList);
+
+const AccessUserCreateToolbar = translate(({ onCancel, translate, ...props }) => (
+  <Toolbar {...props}>
+    <SaveButton />
+    <Button onClick={onCancel}>{translate('ra.action.cancel')}</Button>
+  </Toolbar>
+));
+
+const AccessUserCreate = ({ onCancel, ...props }) => (
+  <Create title=" " {...props}>
+    <SimpleForm toolbar={<AccessUserCreateToolbar onCancel={onCancel} />}>
+      <TextInput label="순번" source="id" />
+      <FileInput label="사진" source="photourl" >
+        <FileField source="src" title="title"/>  
+      </FileInput>
+      <DateTimeInput label="출입시간"source="time" showTime />
+      <TextInput label="계급" source="rank" />
+      <TextInput label="이름" source="name" />
+      <TextInput label="군번" source="altid" />
+      <TextInput label="소속" source="company" />
+    </SimpleForm>
+  </Create>
+);
 
   export const AccessUserEdit = (props) => (
     <Edit {...props}>
       <SimpleForm>
       <TextInput label="순번" source="id" />
-        <ImageInput label="사진" source="photourl">
-        <ImageField source="src" title="title" />  
-        </ImageInput>
-        <DateField label="출입시간"source="time" showTime/>
+      <FileInput label="사진" source="photourl" >
+        <FileField source="src" title="title"/>  
+      </FileInput>
+        <DateField label="출입시간"source="time" />
         <TextInput label="계급" source="rank" />
         <TextInput label="이름" source="name" />
         <TextInput label="군번" source="altid" />
@@ -109,4 +190,5 @@ export const AccessUserCreate = (props) => (
         <TextField label="소속" source="company"/>
       </SimpleShowLayout>
     </Show>
-  );
+  );
+

WEB/web-admin/src/App.css

@@ -4,10 +4,10 @@
 }
 
 .table {
-  width : 1000px;
+  width: 1000px;
 }
 
 .face {
-  width : 600px;
-  height : 800px;
+  width: 600px;
+  height: 800px;
 }

WEB/web-admin/src/App.js

@@ -1,7 +1,8 @@
 import * as React from "react";
 import { Admin, Resource } from "react-admin";
 import { UserList, UserEdit, UserCreate, UserShow } from "./users";
-import { AccessUserList, AccessUserEdit, AccessUserCreate, AccessUserShow } from "./AccessUser";
+import { AccessUserEdit, AccessUserCreate, AccessUserShow } from "./AccessUser";
+import AccessUser from "./AccessUser";
 import UserIcon from "@material-ui/icons/Group";
 import AccessUserIcon from "@material-ui/icons/ContactMail";
 import Dashboard from "./Dashboard";
@@ -25,7 +26,7 @@ const App = () => (
     />
     <Resource
       name="accessusers"
-      list={AccessUserList} create={AccessUserCreate} edit={AccessUserEdit} show={AccessUserShow} icon={AccessUserIcon}
+      list={AccessUser} show={AccessUserShow} icon={AccessUserIcon}
       options={{ label: "출입한 사용자" }}
     />
     <Resource

WEB/web-admin/src/myDataProvider.js

@@ -1,12 +1,14 @@
 import drfProvider from 'ra-data-django-rest-framework';
+
 const INITIAL = "https://osamhack2021-ai-web-bullseyes-bullseyes-pjw6w945935xx-8000.githubpreview.dev"
+
 const dataProvider = drfProvider(INITIAL);
 
 const myDataProvider = {
     ...dataProvider,
     create: (resource, params) => {
 
-        if (!params.data.photourl  ) {
+        if (!params.data.photourl) {
             // fallback to the default implementation
             return dataProvider.create(resource, params);
         }
@@ -30,6 +32,33 @@ const myDataProvider = {
                     },
                 })))
             )
+    },  
+    update: (resource, params) => {
+
+        if (!params.data.photourl) {
+            // fallback to the default implementation
+            return dataProvider.update(resource, params);
+        }
+        /**
+         * For posts update only, convert uploaded image in base 64 and attach it to
+         * the `picture` sent property, with `src` and `title` attributes.
+         */
+        let pictures = [params.data.photourl];
+        // Freshly dropped pictures are File objects and must be converted to base64 strings
+        const newPictures = pictures.filter(
+            p => p.rawFile instanceof File
+        );
+
+        return Promise.all(newPictures.map(convertFileToBase64))
+            .then(base64Pictures =>
+                base64Pictures.map(picture64 => (dataProvider.update(resource, {
+                    ...params,
+                    data: {
+                        ...params.data,
+                        photourl: picture64
+                    },
+                })))
+            )
     },   
 };