avatar
parent
e10081a5cd
commit
412c147a0b
|
|
@ -14,6 +14,7 @@ import {
|
|||
Typography,
|
||||
notification,
|
||||
Badge,
|
||||
Popover,
|
||||
} from "antd";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import {
|
||||
|
|
@ -42,6 +43,8 @@ import { MySupsenseFallback } from "../../Components/MySupsenseFallback";
|
|||
import { linkDialogPlugin } from "@mdxeditor/editor";
|
||||
import { tablePlugin } from "@mdxeditor/editor";
|
||||
import { frontmatterPlugin } from "@mdxeditor/editor";
|
||||
import { MyAvatar } from "../../Components/MyAvatar";
|
||||
import { useAppContext } from "../../Contexts/AppContext";
|
||||
|
||||
const CRM_TYPE = {
|
||||
CUSTOMERS: 0,
|
||||
|
|
@ -55,6 +58,7 @@ function MyBadge({ count }) {
|
|||
|
||||
export default function CrmTest() {
|
||||
const { t } = useTranslation();
|
||||
const appContext = useAppContext();
|
||||
const crmContext = useCrmContext();
|
||||
|
||||
const [isRequesting, setIsRequesting] = useState(false);
|
||||
|
|
@ -94,6 +98,11 @@ export default function CrmTest() {
|
|||
|
||||
const getTableContent = () => {
|
||||
return [
|
||||
{
|
||||
title: "Assignee",
|
||||
dataIndex: "assignee",
|
||||
key: "assignee",
|
||||
},
|
||||
{
|
||||
title: t("crm.table.firstName"),
|
||||
dataIndex: "firstName",
|
||||
|
|
@ -151,6 +160,32 @@ export default function CrmTest() {
|
|||
data.forEach((item) => {
|
||||
items.push({
|
||||
key: item.Id,
|
||||
assignee: (
|
||||
<>
|
||||
<Popover
|
||||
placement="right"
|
||||
trigger="hover"
|
||||
content={
|
||||
<MyAvatar
|
||||
userId={item.AssignedEmployee}
|
||||
allUsers={appContext.users}
|
||||
avatarWidth={256}
|
||||
/>
|
||||
}
|
||||
>
|
||||
<>
|
||||
<MyAvatar
|
||||
userId={item.AssignedEmployee}
|
||||
allUsers={appContext.users}
|
||||
/>{" "}
|
||||
{
|
||||
appContext.users.find((u) => u.Id === item.AssignedEmployee)
|
||||
?.Username
|
||||
}
|
||||
</>
|
||||
</Popover>
|
||||
</>
|
||||
),
|
||||
id: item.Id,
|
||||
firstName: item.FirstName,
|
||||
lastName: item.LastName,
|
||||
|
|
@ -158,7 +193,29 @@ export default function CrmTest() {
|
|||
telephone: item.Telephone,
|
||||
email: item.Email,
|
||||
lastContact: FormatDatetime(item.LastContact),
|
||||
createdBy: item.CreatedBy,
|
||||
createdBy: (
|
||||
<>
|
||||
<Popover
|
||||
placement="right"
|
||||
trigger="hover"
|
||||
content={
|
||||
<MyAvatar
|
||||
userId={item.CreatedBy}
|
||||
allUsers={appContext.users}
|
||||
avatarWidth={256}
|
||||
/>
|
||||
}
|
||||
>
|
||||
<>
|
||||
<MyAvatar userId={item.CreatedBy} allUsers={appContext.users} />{" "}
|
||||
{
|
||||
appContext.users.find((u) => u.Id === item.CreatedBy)
|
||||
?.Username
|
||||
}
|
||||
</>
|
||||
</Popover>
|
||||
</>
|
||||
),
|
||||
});
|
||||
});
|
||||
|
||||
|
|
@ -335,6 +392,7 @@ export default function CrmTest() {
|
|||
|
||||
function CustomerDrawer({ isOpen, setIsOpen, onClose, notificationApi }) {
|
||||
const { t } = useTranslation();
|
||||
const appContext = useAppContext();
|
||||
const crmContext = useCrmContext();
|
||||
|
||||
const [formDealInfo] = Form.useForm();
|
||||
|
|
@ -441,6 +499,7 @@ function CustomerDrawer({ isOpen, setIsOpen, onClose, notificationApi }) {
|
|||
formDealInfo.setFieldsValue({
|
||||
Pipeline: 1,
|
||||
DealPhase: 1,
|
||||
AssignedEmployee: appContext.userId.current,
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
|
@ -460,8 +519,8 @@ function CustomerDrawer({ isOpen, setIsOpen, onClose, notificationApi }) {
|
|||
changedFields.push("Notes");
|
||||
}
|
||||
|
||||
// check if something has changed (length 2 = only the pipeline and deal phase)
|
||||
if (changedFields.length === 2) return;
|
||||
// check if something has changed (length 2 = only the pipeline, deal phase and assigned employee)
|
||||
if (changedFields.length === 3) return;
|
||||
|
||||
Object.keys(values).forEach((key) => {
|
||||
if (values[key] !== undefined) {
|
||||
|
|
@ -559,14 +618,36 @@ function CustomerDrawer({ isOpen, setIsOpen, onClose, notificationApi }) {
|
|||
onClose={onClose}
|
||||
width={720}
|
||||
extra={
|
||||
<Button
|
||||
onClick={() => {
|
||||
onClose();
|
||||
handleCloseDrawer();
|
||||
}}
|
||||
>
|
||||
{t("crm.buttonUndo")}
|
||||
</Button>
|
||||
<Space>
|
||||
<Form form={formDealInfo} layout="inline">
|
||||
<Form.Item name="AssignedEmployee">
|
||||
<Select>
|
||||
{appContext.users.map((user) => (
|
||||
<Select.Option key={user.Id} value={user.Id}>
|
||||
<Space>
|
||||
<MyAvatar
|
||||
userId={user.Id}
|
||||
allUsers={appContext.users}
|
||||
avatarWidth={24}
|
||||
/>
|
||||
|
||||
{user.Username}
|
||||
</Space>
|
||||
</Select.Option>
|
||||
))}
|
||||
</Select>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
|
||||
<Button
|
||||
onClick={() => {
|
||||
onClose();
|
||||
handleCloseDrawer();
|
||||
}}
|
||||
>
|
||||
{t("crm.buttonUndo")}
|
||||
</Button>
|
||||
</Space>
|
||||
}
|
||||
>
|
||||
<Tabs
|
||||
|
|
@ -609,6 +690,7 @@ function CollapseContainer({ children, label }) {
|
|||
|
||||
function TabContentDealInfo({ form }) {
|
||||
const pipeline = Form.useWatch("Pipeline", form);
|
||||
const dealPhase = Form.useWatch("DealPhase", form);
|
||||
|
||||
const FormItem = ({ name, label }) => (
|
||||
<Form.Item name={name} label={t(label)}>
|
||||
|
|
@ -647,9 +729,18 @@ function TabContentDealInfo({ form }) {
|
|||
// set deal phase to 1 when the pipeline changes
|
||||
// without this the user could set a deal phase that is not available for the selected pipeline
|
||||
useEffect(() => {
|
||||
form.setFieldsValue({
|
||||
DealPhase: 1,
|
||||
});
|
||||
const options = t(
|
||||
pipeline === 1
|
||||
? "crm.dmcPipeline.segmentedOptions"
|
||||
: "crm.setterCloser.segmentedOptions",
|
||||
{ returnObjects: true }
|
||||
);
|
||||
|
||||
if (dealPhase > options.length) {
|
||||
form.setFieldsValue({
|
||||
DealPhase: options.length,
|
||||
});
|
||||
}
|
||||
}, [pipeline]);
|
||||
|
||||
return (
|
||||
|
|
@ -829,11 +920,6 @@ function TabContentDealInfo({ form }) {
|
|||
label:
|
||||
"crm.tabContent.dealInfo.collapseDealProperties.bookedPackages",
|
||||
},
|
||||
{
|
||||
name: "AssignedEmployee",
|
||||
label:
|
||||
"crm.tabContent.dealInfo.collapseDealProperties.assignedEmployee",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</Space>
|
||||
|
|
|
|||
Loading…
Reference in New Issue