From 4568663ae41dad3eba4ee847060a7af2e5d6ec0d Mon Sep 17 00:00:00 2001 From: alex Date: Sat, 16 Mar 2024 17:08:11 +0100 Subject: [PATCH] link share --- public/locales/de/translation.json | 12 +- public/locales/en/translation.json | 13 +- src/Contexts/CrmContext.js | 15 ++ src/Handlers/WebSocketMessageHandler.js | 14 ++ src/Pages/CrmTest/CrmTest.js | 218 +++++++++++++++++++++++- src/utils.js | 5 + 6 files changed, 273 insertions(+), 4 deletions(-) diff --git a/public/locales/de/translation.json b/public/locales/de/translation.json index fa419cd..412c0f7 100644 --- a/public/locales/de/translation.json +++ b/public/locales/de/translation.json @@ -37,7 +37,8 @@ "yes": "Ja", "no": "Nein", "more": "Mehr", - "pleaseInput": "Bitte eingeben" + "pleaseInput": "Bitte eingeben", + "pleaseInputValidUrl": "Bitte geben Sie eine gültige URL ein" }, "request": { "inputsInvalid": { @@ -363,6 +364,15 @@ }, "emails": { "title": "E-Mails" + }, + "links": { + "title": "Links", + "buttonAddLink": "Link hinzufügen", + "addLinkModal": { + "title": "Link hinzufügen", + "name": "Name", + "link": "Link" + } } } }, diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json index 907633f..f8134d2 100644 --- a/public/locales/en/translation.json +++ b/public/locales/en/translation.json @@ -37,7 +37,8 @@ "yes": "Yes", "no": "No", "more": "More", - "pleaseInput": "Please input" + "pleaseInput": "Please input", + "pleaseInputValidUrl": "Please input a valid URL" }, "request": { "inputsInvalid": { @@ -363,7 +364,15 @@ }, "emails": { "title": "Emails" - + }, + "links": { + "title": "Links", + "buttonAddLink": "Add Link", + "addLinkModal": { + "title": "Add Link", + "name": "Name", + "link": "Link" + } } } }, diff --git a/src/Contexts/CrmContext.js b/src/Contexts/CrmContext.js index 2ec94a3..b9b05a3 100644 --- a/src/Contexts/CrmContext.js +++ b/src/Contexts/CrmContext.js @@ -12,6 +12,10 @@ const preview = { changedDrawerCustomerFieldsRef: null, currentDrawerCallProtocols: [], setCurrentDrawerCallProtocols: () => {}, + currentDrawerActivityLinks: [], + setCurrentDrawerActivityLinks: () => {}, + currentDrawerActivityLinkHistory: [], + setCurrentDrawerActivityLinkHistory: () => {}, }; const CrmContext = createContext(preview); @@ -36,6 +40,13 @@ export function CrmProvider({ children }) { const [currentDrawerCallProtocols, setCurrentDrawerCallProtocols] = useState( [] ); + const [currentDrawerActivityLinks, setCurrentDrawerActivityLinks] = useState( + [] + ); + const [ + currentDrawerActivityLinkHistory, + setCurrentDrawerActivityLinkHistory, + ] = useState([]); return ( {children} diff --git a/src/Handlers/WebSocketMessageHandler.js b/src/Handlers/WebSocketMessageHandler.js index f23e2f4..a60b47a 100644 --- a/src/Handlers/WebSocketMessageHandler.js +++ b/src/Handlers/WebSocketMessageHandler.js @@ -52,6 +52,9 @@ export const ReceivedMessagesCommands = { CrmCustomerCreated: 48, CrmCallProtocolCreated: 49, CrmCallProtocolDeleted: 50, + CrmLinkCreated: 51, + CrmLinkUsed: 52, + CrmLinkDeleted: 53, }; // commands sent to the backend server @@ -1106,6 +1109,17 @@ export function handleWebSocketMessage( ); } break; + case ReceivedMessagesCommands.CrmLinkCreated: + crmContext.setCurrentDrawerActivityLinks((arr) => [...arr, body]); + break; + case ReceivedMessagesCommands.CrmLinkUsed: + crmContext.setCurrentDrawerActivityLinkHistory((arr) => [...arr, body]); + break; + case ReceivedMessagesCommands.CrmLinkDeleted: + crmContext.setCurrentDrawerActivityLinks((arr) => + arr.filter((link) => link.Id !== body) + ); + break; default: console.error("unknown command", cmd); break; diff --git a/src/Pages/CrmTest/CrmTest.js b/src/Pages/CrmTest/CrmTest.js index dcd9db1..def7d26 100644 --- a/src/Pages/CrmTest/CrmTest.js +++ b/src/Pages/CrmTest/CrmTest.js @@ -22,6 +22,7 @@ import { Empty, Flex, Popconfirm, + List, } from "antd"; import { useTranslation } from "react-i18next"; import { @@ -65,7 +66,7 @@ import MyModal, { MyModalCloseCreateButtonFooter, } from "../../Components/MyModal"; import dayjs from "dayjs"; -import Markdown from "react-markdown"; +import { MyCopyIcon } from "../../Components/MyIcon"; const CRM_TYPE = { CUSTOMERS: 0, @@ -684,6 +685,11 @@ function CustomerDrawer({ isOpen, setIsOpen, onClose, notificationApi }) { crmContext.currentDrawerCustomerRef.current = customer; crmContext.setCurrentDrawerCallProtocols(data.CallProtocols); + crmContext.setCurrentDrawerActivityLinks(data.Links); + + if (data.LinkHistory !== null) { + crmContext.setCurrentDrawerActivityLinkHistory(data.LinkHistory); + } formDealInfo.setFieldsValue({ Pipeline: customer.Pipeline, @@ -1214,9 +1220,19 @@ function TabContentDealInfo({ form }) { function TabContentActivities({ notificationApi }) { const { t } = useTranslation(); + const [activeTab, setActiveTab] = useState(0); + return ( setActiveTab(activeKey)} + tabBarExtraContent={{ + right: + activeTab === 2 ? ( + + ) : null, + }} items={[ { key: 0, @@ -1230,6 +1246,11 @@ function TabContentActivities({ notificationApi }) { label: t("crm.tabContent.activities.emails.title"), disabled: true, }, + { + key: 2, + label: t("crm.tabContent.activities.links.title"), + children: , + }, ]} /> @@ -1313,6 +1334,7 @@ function ActivityCallProtocols({ notificationApi }) { avatarWidth={56} userId={item.CreatedBy} allUsers={appContext.users} + tooltip /> } title={ @@ -1743,6 +1765,200 @@ function CallProtocolModal({ formDealInfo, notificationApi }) { ); } +function AddLinkModal({ notificationApi }) { + const crmContext = useCrmContext(); + const { t } = useTranslation(); + + const [isOpen, setIsOpen] = useState(false); + const [form] = Form.useForm(); + + const handleCancel = () => setIsOpen(false); + + useEffect(() => { + if (isOpen) { + form.resetFields(); + } + }, [isOpen]); + + return ( + <> + + + { + form + .validateFields() + .then((values) => { + myFetch("/crm/links", "POST", { + CustomerId: crmContext.openDrawerCustomerId.current, + Name: values.name, + Url: values.link, + }) + .then(() => { + setIsOpen(false); + form.resetFields(); + }) + .catch(() => + showUnkownErrorNotification(notificationApi, t) + ); + }) + .catch(() => showInputsInvalidNotification(notificationApi, t)); + }} + /> + } + > + +
+ + + + + + + +
+ + + + ); +} + +function ActivityLinks({ notificationApi }) { + const appContext = useAppContext(); + const crmContext = useCrmContext(); + + if (crmContext.currentDrawerActivityLinks.length === 0) return ; + + return ( + + {crmContext.currentDrawerActivityLinks.map((item) => ( + + + {item.Name} + + {item.Url} + + {FormatDatetime(item.CreatedAt)} + + + + + { + crmContext.currentDrawerActivityLinkHistory.filter( + (link) => link.LinkId === item.Id + ).length + } + + + + + + + { + myFetch(`/crm/links/${item.Id}`, "DELETE").catch(() => + showUnkownErrorNotification(notificationApi, t) + ); + }} + > + + + + + ), + children: ( + link.LinkId === item.Id) + .sort((a, b) => new Date(b.UsedAt) - new Date(a.UsedAt))} + renderItem={(item) => ( + + + + + UserAgent:{" "} + + {item.UserAgent} + + + + Used at:{" "} + + {FormatDatetime(item.UsedAt)} + + + } + /> + + )} + /> + ), + }, + ]} + /> + ))} + + ); +} + function TabContentNotes({ notes }) { const crmContext = useCrmContext(); diff --git a/src/utils.js b/src/utils.js index af728c8..163a68f 100644 --- a/src/utils.js +++ b/src/utils.js @@ -16,6 +16,7 @@ let roboticsApiAddress = ""; var roboticsSwaggerAddress = ""; var telegramBotManagerAddress = ""; var telegramBotManagerStaticContentAddress = ""; +var crmLinkShareAddress = ""; if (window.location.hostname === "localhost" && window.location.port === "") { // for docker container testing on localhost @@ -27,6 +28,7 @@ if (window.location.hostname === "localhost" && window.location.port === "") { roboticsSwaggerAddress = "http://localhost/rcm/swagger/index.html"; telegramBotManagerAddress = "http://localhost/tm/v1"; telegramBotManagerStaticContentAddress = "http://localhost/tm/"; + crmLinkShareAddress = "http://localhost/crm/link/"; } else if (window.location.hostname === "localhost") { // programming on localhost apiAddress = "http://localhost:50050/v1"; @@ -37,6 +39,7 @@ if (window.location.hostname === "localhost" && window.location.port === "") { roboticsSwaggerAddress = "http://localhost:50055/swagger/index.html"; telegramBotManagerAddress = "http://localhost:50056/v1"; telegramBotManagerStaticContentAddress = "http://localhost:50056/"; + crmLinkShareAddress = "http://localhost:50050/v1/crm/link/"; /*} else if (window.location.hostname === "192.168.178.93") { apiAddress = "http://192.168.178.93:50050/v1"; staticContentAddress = "http://192.168.178.93:50050/"; @@ -51,6 +54,7 @@ if (window.location.hostname === "localhost" && window.location.port === "") { roboticsSwaggerAddress = `${window.location.protocol}${window.location.hostname}/rcm/swagger/index.html`; telegramBotManagerAddress = `${window.location.protocol}${window.location.hostname}/tm/v1`; telegramBotManagerStaticContentAddress = `${window.location.protocol}${window.location.hostname}/tm/`; + crmLinkShareAddress = `${window.location.protocol}${window.location.hostname}/api/v1/crm/link/`; } export const Constants = { @@ -76,6 +80,7 @@ export const Constants = { ROBOTICS_SWAGGER_ADDRESS: roboticsSwaggerAddress, TELEGRAM_BOT_MANAGER_ADDRESS: telegramBotManagerAddress, TELEGRAM_BOT_MANAGER_CONTENT_ADDRESS: telegramBotManagerStaticContentAddress, + CRM_LINK_SHARE_ADDRESS: crmLinkShareAddress, ROUTE_PATHS: { EQUIPMENT_DOCUMENTATION: "/equipment-documentation", EQUIPMENT_DOCUMENTATION_VIEW: "/equipment-documentation/",