updated at

package.json

@@ -19,6 +19,7 @@
     "react-dom": "^18.2.0",
     "react-highlight-words": "^0.20.0",
     "react-i18next": "^13.0.1",
+    "react-markdown": "^9.0.1",
     "react-qr-scanner": "^1.0.0-alpha.11",
     "react-router-dom": "^6.10.0",
     "react-scripts": "5.0.1",

public/locales/de/translation.json

@@ -295,6 +295,7 @@
       "email": "E-Mail",
       "lastContact": "Letzter Kontakt",
       "createdBy": "Erstellt von",
+      "updatedAt": "Aktualisiert am",
       "notes": "Notizen"
     },
     "placeholderSearch": "Suche nach",

public/locales/en/translation.json

@@ -295,6 +295,7 @@
       "email": "Email",
       "lastContact": "Last Contact",
       "createdBy": "Created by",
+      "updatedAt":"Updated at",
       "notes": "Notes"
     },
     "placeholderSearch": "Search for",

src/Handlers/WebSocketMessageHandler.js

@@ -1036,25 +1036,21 @@ export function handleWebSocketMessage(
       break;
     case ReceivedMessagesCommands.CrmCustomerUpdated:
       // update drawer customer if it is the same customer
-      if (crmContext.currentDrawerCustomerRef.current !== null) {
+      if (crmContext.openDrawerCustomerId.current === body.Id) {
-        if (crmContext.currentDrawerCustomerRef.current.Id === body.Id) {
+        for (const property in body) {
-          for (const property in body) {
+          if (
-            if (
+            crmContext.changedDrawerCustomerFieldsRef.current.includes(property)
-              crmContext.changedDrawerCustomerFieldsRef.current.includes(
+          )
-                property
+            continue;
-              )
-            )
-              continue;
 
-            if (body[property] !== undefined && property !== "Id") {
+          if (body[property] !== undefined && property !== "Id") {
-              crmContext.setCurrentDrawerCustomer((obj) => {
+            crmContext.setCurrentDrawerCustomer((obj) => {
-                const newObj = { ...obj };
+              const newObj = { ...obj };
 
-                newObj[property] = body[property];
+              newObj[property] = body[property];
 
-                return newObj;
+              return newObj;
-              });
+            });
-            }
           }
         }
       }
@@ -1082,23 +1078,32 @@ export function handleWebSocketMessage(
       crmContext.setCustomers((arr) => [...arr, body]);
       break;
     case ReceivedMessagesCommands.CrmCallProtocolCreated:
-      if (crmContext.currentDrawerCustomerRef.current !== null) {
+      if (crmContext.openDrawerCustomerId.current === body.Customer.Id) {
-        if (
+        crmContext.setCurrentDrawerCallProtocols((arr) => [
-          crmContext.currentDrawerCustomerRef.current.Id === body.CustomerId
+          ...arr,
-        ) {
+          body.CallProtocol,
-          crmContext.setCurrentDrawerCallProtocols((arr) => [...arr, body]);
+        ]);
-        }
       }
+
+      crmContext.setCustomers((arr) => {
+        const newArr = [...arr];
+
+        const arrIndex = arr.findIndex(
+          (customer) => customer.Id === body.Customer.Id
+        );
+
+        if (arrIndex !== -1) {
+          newArr[arrIndex].LastContact = body.Customer.LastContact;
+        }
+
+        return newArr;
+      });
       break;
     case ReceivedMessagesCommands.CrmCallProtocolDeleted:
-      if (crmContext.currentDrawerCustomerRef.current !== null) {
+      if (crmContext.openDrawerCustomerId.current === body.CustomerId) {
-        if (
+        crmContext.setCurrentDrawerCallProtocols((arr) =>
-          crmContext.currentDrawerCustomerRef.current.Id === body.CustomerId
+          arr.filter((callProtocol) => callProtocol.Id !== body.Id)
-        ) {
+        );
-          crmContext.setCurrentDrawerCallProtocols((arr) =>
-            arr.filter((callProtocol) => callProtocol.Id !== body.Id)
-          );
-        }
       }
       break;
     default:

src/Pages/CrmTest/CrmTest.js

@@ -22,7 +22,6 @@ import {
   Empty,
   Flex,
   Popconfirm,
-  Affix,
 } from "antd";
 import { useTranslation } from "react-i18next";
 import {
@@ -66,6 +65,7 @@ import MyModal, {
   MyModalCloseCreateButtonFooter,
 } from "../../Components/MyModal";
 import dayjs from "dayjs";
+import Markdown from "react-markdown";
 
 const CRM_TYPE = {
   CUSTOMERS: 0,
@@ -153,6 +153,14 @@ export default function CrmTest() {
     return 0;
   };
 
+  const sorterDates = (a, b) => {
+    return a === Constants.TEXT_EMPTY_PLACEHOLDER
+      ? 0
+      : new Date(a) - b === Constants.TEXT_EMPTY_PLACEHOLDER
+      ? 0
+      : new Date(b);
+  };
+
   const handleSearch = (selectedKeys, confirm, dataIndex) => {
     confirm();
     setSearchText(selectedKeys[0]);
@@ -315,14 +323,7 @@ export default function CrmTest() {
         title: t("crm.table.createdAt"),
         dataIndex: "createdAt",
         key: "createdAt",
-        sorter: (a, b) => {
+        sorter: (a, b) => sorterDates(a.createdAt, b.createdAt),
-          return a.createdAt === Constants.TEXT_EMPTY_PLACEHOLDER
-            ? 0
-            : new Date(a.createdAt) - b.createdAt ===
-              Constants.TEXT_EMPTY_PLACEHOLDER
-            ? 0
-            : new Date(b.createdAt);
-        },
         sortDirections: ["descend"],
       },
       {
@@ -343,7 +344,14 @@ export default function CrmTest() {
         title: t("crm.table.lastContact"),
         dataIndex: "lastContact",
         key: "lastContact",
-        sorter: (a, b) => a.lastContact.length - b.lastContact.length,
+        sorter: (a, b) => sorterDates(a.lastContact, b.lastContact),
+        sortDirections: ["descend"],
+      },
+      {
+        title: t("crm.table.updatedAt"),
+        dataIndex: "updatedAt",
+        key: "updatedAt",
+        sorter: (a, b) => sorterDates(a.updatedAt, b.updatedAt),
         sortDirections: ["descend"],
       },
       {
@@ -410,6 +418,7 @@ export default function CrmTest() {
         telephone: item.Telephone,
         email: item.Email,
         lastContact: FormatDatetime(item.LastContact),
+        updatedAt: FormatDatetime(item.UpdatedAt),
         createdBy: (
           <>
             <Popover
@@ -1268,6 +1277,32 @@ function ActivityCallProtocols({ notificationApi }) {
           }
         });
 
+        const notes = [];
+
+        notes.push(`${FormatDatetime(item.CalledAt)} Uhr`);
+
+        if (item.Telephone !== "") {
+          notes.push(`Tel: ${item.Telephone}`);
+        }
+
+        if (item.Notes !== "") {
+          notes.push(`${t("crm.callProtocolModal.notes")}: ${item.Notes}`);
+        }
+
+        /*
+ {`${FormatDatetime(item.CalledAt)} Uhr${
+                    item.Telephone !== "" ? ` - Tel: ${item.Telephone}` : ""
+                  } ${
+                    item.Notes !== ""
+                      ? `- ${t("crm.callProtocolModal.notes")}: ${(
+                          <>
+                            <Markdown>{item.Notes}</Markdown>
+                          </>
+                        )}`
+                      : ""
+                  }`}
+        */
+
         return (
           <Card key={item.Id}>
             <Card.Meta
@@ -1294,16 +1329,12 @@ function ActivityCallProtocols({ notificationApi }) {
                     cancelText={t("common.button.cancel")}
                     okText={t("common.button.confirm")}
                     onConfirm={() => {
-                      myFetch(`/crm/calls/delete/${item.Id}`, "DELETE")
+                      myFetch(`/crm/calls/delete/${item.Id}`, "DELETE").catch(
-                        .then(() => {
+                        () => showUnkownErrorNotification(notificationApi, t)
-                          console.log("deleted");
+                      );
-                        })
-                        .catch(() => {
-                          showUnkownErrorNotification(notificationApi, t);
-                        });
                     }}
                   >
-                    <DeleteOutlined />
+                    <DeleteOutlined style={{ color: "darkred" }} />
                   </Popconfirm>
                 </Flex>
               }
@@ -1316,13 +1347,7 @@ function ActivityCallProtocols({ notificationApi }) {
                     symbol: t("common.text.more"),
                   }}
                 >
-                  {`${FormatDatetime(item.CalledAt)} Uhr${
+                  {notes.join(" - ")}
-                    item.Telephone !== "" ? ` - ${item.Telephone}` : ""
-                  } ${
-                    item.Notes !== ""
-                      ? `- ${t("crm.callProtocolModal.notes")}: ${item.Notes}`
-                      : ""
-                  }`}
                 </Typography.Paragraph>
               }
             />
@@ -1351,14 +1376,25 @@ function CallProtocolModal({ formDealInfo, notificationApi }) {
 
   const telephone = Form.useWatch("telephone", form);
 
-  const handleCancel = () => {
+  // used to check if the customer has changed and reset the form
-    setIsOpen(false);
+  const lastCustomerIdRef = useRef(null);
-  };
+
+  const handleCancel = () => setIsOpen(false);
 
   useEffect(() => {
     if (isOpen) {
       const currentDate = new Date();
 
+      // check if the customer has changed and reset the form
+      if (
+        lastCustomerIdRef.current !== crmContext.openDrawerCustomerId.current
+      ) {
+        lastCustomerIdRef.current = crmContext.openDrawerCustomerId.current;
+        setCallResult(typeCallResult);
+
+        form.resetFields();
+      }
+
       form.setFieldsValue({
         callType: 1,
         reached: "Ja",

src/utils.js

@@ -1293,7 +1293,15 @@ export function FormatDatetime(datetime) {
     return Constants.TEXT_EMPTY_PLACEHOLDER;
   }
 
-  return new Date(datetime).toLocaleString("de-DE");
+  const date = new Date(datetime);
+  const day = String(date.getDate()).padStart(2, "0");
+  const month = String(date.getMonth() + 1).padStart(2, "0");
+  const year = date.getFullYear();
+  const hours = String(date.getHours()).padStart(2, "0");
+  const minutes = String(date.getMinutes()).padStart(2, "0");
+  const seconds = String(date.getSeconds()).padStart(2, "0");
+
+  return `${day}.${month}.${year} ${hours}:${minutes}:${seconds}`;
 }
 
 export function GetDuration(startTime, endTime) {