From 920ad6ffdbadc218c1c7d38f4f5e88b12ddfd4e4 Mon Sep 17 00:00:00 2001
From: Peter Hoppe <p.hoppe@gmx.de>
Date: Fri, 13 Jan 2023 00:27:12 +0100
Subject: [PATCH] createqr

---
 package-lock.json         | 14 +++++++++++
 package.json              |  1 +
 php/php-dog/upload.php    | 11 +++++++--
 src/components/Profil.tsx | 10 +++++++-
 src/services/CreateQr.ts  | 49 +++++++++++++++++++++++++++++++++++++++
 5 files changed, 82 insertions(+), 3 deletions(-)
 create mode 100644 src/services/CreateQr.ts

diff --git a/package-lock.json b/package-lock.json
index 1800c8e..0257d05 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -18,6 +18,7 @@
         "axios": "^1.2.1",
         "bootstrap": "^5.2.3",
         "env-cmd": "^10.1.0",
+        "qr-code-styling": "^1.6.0-rc.1",
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
         "react-repeatable": "^2.0.1",
@@ -13756,6 +13757,19 @@
         "teleport": ">=0.2.0"
       }
     },
+    "node_modules/qr-code-styling": {
+      "version": "1.6.0-rc.1",
+      "resolved": "https://registry.npmjs.org/qr-code-styling/-/qr-code-styling-1.6.0-rc.1.tgz",
+      "integrity": "sha512-ModRIiW6oUnsP18QzrRYZSc/CFKFKIdj7pUs57AEVH20ajlglRpN3HukjHk0UbNMTlKGuaYl7Gt6/O5Gg2NU2Q==",
+      "dependencies": {
+        "qrcode-generator": "^1.4.3"
+      }
+    },
+    "node_modules/qrcode-generator": {
+      "version": "1.4.4",
+      "resolved": "https://registry.npmjs.org/qrcode-generator/-/qrcode-generator-1.4.4.tgz",
+      "integrity": "sha512-HM7yY8O2ilqhmULxGMpcHSF1EhJJ9yBj8gvDEuZ6M+KGJ0YY2hKpnXvRD+hZPLrDVck3ExIGhmPtSdcjC+guuw=="
+    },
     "node_modules/qs": {
       "version": "6.11.0",
       "resolved": "https://registry.npmjs.org/qs/-/qs-6.11.0.tgz",
diff --git a/package.json b/package.json
index 9019284..20f2077 100644
--- a/package.json
+++ b/package.json
@@ -13,6 +13,7 @@
     "axios": "^1.2.1",
     "bootstrap": "^5.2.3",
     "env-cmd": "^10.1.0",
+    "qr-code-styling": "^1.6.0-rc.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-repeatable": "^2.0.1",
diff --git a/php/php-dog/upload.php b/php/php-dog/upload.php
index d09d5a1..8a340a7 100644
--- a/php/php-dog/upload.php
+++ b/php/php-dog/upload.php
@@ -97,8 +97,15 @@ try {
             $conn = $db_connection->dbConnection();
 //            echo var_dump($conn);
             // Insert image file name into database
-            $statement = $conn->prepare("UPDATE dogs SET picture = :filePic WHERE qr_id = :user_qr_id");
-            $update = $statement->execute(array('filePic' => $newPathFilename, 'user_qr_id' => $user["qr_id"]));
+            if(isset($_POST["qr"]))
+            {
+                $statement = $conn->prepare("UPDATE dogs SET qr_code = :filePath WHERE qr_id = :user_qr_id");
+            }
+            else
+            {
+                $statement = $conn->prepare("UPDATE dogs SET picture = :filePath WHERE qr_id = :user_qr_id");
+            }
+            $update = $statement->execute(array('filePath' => $newPathFilename, 'user_qr_id' => $user["qr_id"]));
 //            echo var_dump($update);
             $count = $statement->rowCount();
 //            echo 'rowcount   ' . $count . '\n';
diff --git a/src/components/Profil.tsx b/src/components/Profil.tsx
index 475844d..f4bbceb 100644
--- a/src/components/Profil.tsx
+++ b/src/components/Profil.tsx
@@ -1,6 +1,7 @@
 import React, { useContext, useState } from 'react'
 import { Link } from 'react-router-dom';
 import { Axios, ResponseT, UserCtx, UserCtxT } from '../context/UserContext';
+import CreateQr from '../services/CreateQr';
 import Img from './Img';
 import './Profil.css';
 
@@ -30,7 +31,14 @@ function Profil()
                     email: resDog.data.data.email, 
                     name: resDog.data.data.name,
                     phone: resDog.data.data.phone
-                });   
+                });
+            if(resDog.data.data.qr_code === null)
+            {
+                // qrcode generieren und in der Datenbank speichern
+                CreateQr({qr_id: user.qr_id});
+            }
+              
+                 
         })
         .catch((err) => console.error(err));
     }
diff --git a/src/services/CreateQr.ts b/src/services/CreateQr.ts
new file mode 100644
index 0000000..f40f5c8
--- /dev/null
+++ b/src/services/CreateQr.ts
@@ -0,0 +1,49 @@
+import { Axios } from '../context/UserContext';
+
+import React from 'react'
+import QRCodeStyling from 'qr-code-styling';
+
+
+const upload = (file: File): Promise<any> => 
+{
+    let formData = new FormData();
+  
+    formData.append("file", file);
+    formData.append("submit", "1");
+    formData.append("qr", "1");
+  
+    let uploadRes = Axios.post("upload.php", formData, {
+      headers: 
+      {
+        "Content-Type": "multipart/form-data",
+      }
+    });
+  
+    // let a: number = 1+3;
+    // a++;
+    return uploadRes;
+  };
+
+export default function CreateQr({qr_id}:{qr_id: string | undefined}) 
+{
+    const qrCode = new QRCodeStyling(
+    {
+        width: 200,
+        height: 200,
+        image:
+            "",
+            data: 'https://hope-fly.de/dog/'+ qr_id,
+            dotsOptions: 
+            {
+                color: "#000",
+                type: "square"
+            },
+        imageOptions: 
+            {
+                crossOrigin: "anonymous",
+                margin: 0
+            }
+    });    
+//    upload(qrCode._svg as File);
+    console.log(qrCode);
+}