Compare commits
142 Commits
revert-pr-
...
rrScratch1
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
c3bc29fa9b | ||
|
|
34f45379a6 | ||
|
|
e20ef4374c | ||
|
|
43dc760c95 | ||
|
|
cfd5aaff87 | ||
|
|
6162e7f18d | ||
|
|
cdee754042 | ||
|
|
a8fb16122a | ||
|
|
a88be98d45 | ||
|
|
e44bc07ffe | ||
|
|
60e8aadd8c | ||
|
|
daf9f197eb | ||
|
|
5848daef72 | ||
|
|
bc77bec610 | ||
|
|
c655badae2 | ||
|
|
7af70f7512 | ||
|
|
a8dcc542cc | ||
|
|
e4c87dd06d | ||
|
|
16899007d8 | ||
|
|
9cb1b25b1d | ||
|
|
4c250f6189 | ||
|
|
9c2c0b665d | ||
|
|
09ea6dff2b | ||
|
|
577c3bec04 | ||
|
|
90f653c0b7 | ||
|
|
556cd993b9 | ||
|
|
e3b4620d0c | ||
|
|
cbfda822c6 | ||
|
|
52811f5f45 | ||
|
|
29049cf1b0 | ||
|
|
b517f3966d | ||
|
|
91f419f4b3 | ||
|
|
a5f8fbacc1 | ||
|
|
8bb58df32e | ||
|
|
1e3b3b853e | ||
|
|
02eb212758 | ||
|
|
d45d557a81 | ||
|
|
c0157454e1 | ||
|
|
00e6d31a88 | ||
|
|
e5ed11287d | ||
|
|
fa250f10a2 | ||
|
|
5a8a5bf7ab | ||
|
|
9ce022b5e8 | ||
|
|
b0b73f1af8 | ||
|
|
a788beaa19 | ||
|
|
d6b295855d | ||
|
|
e36baaa682 | ||
|
|
35f00df77e | ||
|
|
286c49deb1 | ||
|
|
a16c680d04 | ||
|
|
9341806b0f | ||
|
|
da28fe8592 | ||
|
|
f2faa5b686 | ||
|
|
bedca60744 | ||
|
|
5344a2031d | ||
|
|
c60dfa4319 | ||
|
|
aa692d4d05 | ||
|
|
5bbda89fb9 | ||
|
|
ccf3d7df5b | ||
|
|
eeb685802e | ||
|
|
ea14606538 | ||
|
|
3d24d44274 | ||
|
|
65e26ed5c9 | ||
|
|
a73617fd3c | ||
|
|
32a0e89467 | ||
|
|
e06f0f9918 | ||
|
|
319f3220ed | ||
|
|
a4da874a1a | ||
|
|
2f4c0e329a | ||
|
|
c6d083ce02 | ||
|
|
e514cf8d6a | ||
|
|
6671db1724 | ||
|
|
5a9381ebdb | ||
|
|
6bab792b5e | ||
|
|
64207ef76c | ||
|
|
de02b34a63 | ||
|
|
2ffc4b81f4 | ||
|
|
ec30e73b3e | ||
|
|
c149d457e7 | ||
|
|
88c00cf34f | ||
|
|
d16c8d5bd5 | ||
|
|
92b05a290e | ||
|
|
6421fc8002 | ||
|
|
0d9a7dda53 | ||
|
|
601eed6db8 | ||
|
|
9b708d5e8e | ||
|
|
6b4bc27205 | ||
|
|
0eb0e335fe | ||
|
|
71b08855b8 | ||
|
|
67b1a7f9f4 | ||
|
|
24f017bfd2 | ||
|
|
42027f0858 | ||
|
|
3b663d7954 | ||
|
|
e737af2d41 | ||
|
|
10d3b4a485 | ||
|
|
99b79126c3 | ||
|
|
d0eeb7d55d | ||
|
|
d95c5ce8f9 | ||
|
|
b995e1f35d | ||
|
|
3d112ed2cd | ||
|
|
e978a5a561 | ||
|
|
cd1e8b0b15 | ||
|
|
3d910aa246 | ||
|
|
f7799ffd03 | ||
|
|
57baa3d9fd | ||
|
|
c6cd6d0f4e | ||
|
|
f796dd0f89 | ||
|
|
517c30787d | ||
|
|
c8771275ce | ||
|
|
7c8260685e | ||
|
|
2fec9fd16e | ||
|
|
0f1348496c | ||
|
|
de26979e44 | ||
|
|
661678eb1c | ||
|
|
1728982b2b | ||
|
|
8aa747edc5 | ||
|
|
544494ce0d | ||
|
|
2e25324ae9 | ||
|
|
f525ec6fb8 | ||
|
|
8296d914c5 | ||
|
|
3d691568ff | ||
|
|
7ab070e2bc | ||
|
|
47a974e3cb | ||
|
|
eac81cdffb | ||
|
|
77c3e6f7e7 | ||
|
|
7f07da4360 | ||
|
|
c47144df72 | ||
|
|
163eaac110 | ||
|
|
19ce1c66ad | ||
|
|
e2b4b408ed | ||
|
|
567171c722 | ||
|
|
03acb78ab2 | ||
|
|
e7c4797fef | ||
|
|
88c35e8c48 | ||
|
|
8623172aa1 | ||
|
|
6ecc67184d | ||
|
|
09973ecb3b | ||
|
|
db9e86e4c8 | ||
|
|
85c446bc57 | ||
|
|
5cf6f47bdc | ||
|
|
1db4cbeeb8 | ||
|
|
c88bf4065e |
346
Fortellis Notes.md
Normal file
346
Fortellis Notes.md
Normal file
@@ -0,0 +1,346 @@
|
||||
Fortellis Notes
|
||||
|
||||
Subscription ID
|
||||
|
||||
- Appears to give us a list of all dealerships we have access to, and `apiDmsInfo` contains the integrations that are enabled for that dealership.
|
||||
- Will likely need to filter based on the DMS ID or something?
|
||||
- Should store the whole subscription object. Contains department information needed in subsequent calls.
|
||||
|
||||
Department ID
|
||||
|
||||
- May have multiple departments. Appears that financial stuff goes to Accounting, History will go to Service.
|
||||
- TODO: How do we handle the multiple departments that may come up.
|
||||
|
||||
###Internal Questions
|
||||
|
||||
* Overview of the redis storing mechanism to cache this data.
|
||||
*
|
||||
|
||||
# GL Wip Posting
|
||||
|
||||
## Org Helper Return Data
|
||||
|
||||
```json
|
||||
[
|
||||
{
|
||||
"acctgLgnID": "DEVWB-A",
|
||||
"applCode": "V",
|
||||
"coID": "77",
|
||||
"companyName": "TEST SYS C187092 DEVWB",
|
||||
"lgnDesc": "DEV WRITE BACK VMS",
|
||||
"logon": "DEVWB-V"
|
||||
},
|
||||
{
|
||||
"acctgLgnID": "DEVWB-A",
|
||||
"applCode": "F",
|
||||
"coID": "77",
|
||||
"companyName": "TEST SYS C187092 DEVWB",
|
||||
"lgnDesc": "DEV WRITE BACK F&I SALES",
|
||||
"logon": "DEVWB-FI"
|
||||
},
|
||||
{
|
||||
"acctgLgnID": "DEVWB-A",
|
||||
"applCode": "CS",
|
||||
"coID": "77",
|
||||
"companyName": "TEST SYS C187092 DEVWB",
|
||||
"lgnDesc": "DEV WRITE BACK SERVICE",
|
||||
"logon": "DEVWB-S"
|
||||
},
|
||||
{
|
||||
"acctgLgnID": "DEVWB-A",
|
||||
"applCode": "A",
|
||||
"coID": "77",
|
||||
"companyName": "TEST SYS C187092 DEVWB",
|
||||
"lgnDesc": "DEV WRITE BACK ACCTG",
|
||||
"logon": "DEVWB-A"
|
||||
},
|
||||
{
|
||||
"acctgLgnID": "DEVWB-A",
|
||||
"applCode": "SL",
|
||||
"coID": "77",
|
||||
"companyName": "TEST SYS C187092 DEVWB",
|
||||
"lgnDesc": "DEV WRTIE BACK SLS MGMT",
|
||||
"logon": "DEVWB-SL"
|
||||
},
|
||||
{
|
||||
"acctgLgnID": "DEVWB-A",
|
||||
"applCode": "O",
|
||||
"coID": "77",
|
||||
"companyName": "TEST SYS C187092 DEVWB",
|
||||
"lgnDesc": "DEV WRITE BACK PARTS",
|
||||
"logon": "DEVWB-I"
|
||||
}
|
||||
]
|
||||
```
|
||||
|
||||
## Journal Helper Return Data
|
||||
|
||||
```json
|
||||
[
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "32",
|
||||
"jrnlName": "PARTS SALES",
|
||||
"jrnlType": "S",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "4",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "92",
|
||||
"jrnlName": "YTD ADJUSTMENTS",
|
||||
"jrnlType": "Y",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "3",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "12",
|
||||
"jrnlName": "FLEET SALES",
|
||||
"jrnlType": "S",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "9",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "57",
|
||||
"jrnlName": "CASH RECEIPTS (OPEN-ITEM)",
|
||||
"jrnlType": "R",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "1",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "93",
|
||||
"jrnlName": "SET UP HISTORY",
|
||||
"jrnlType": "H",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "10",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "88",
|
||||
"jrnlName": "F/S STATISCAL DATA",
|
||||
"jrnlType": "F",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "10",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "58",
|
||||
"jrnlName": "WARRANTY CREDITS",
|
||||
"jrnlType": "G",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "3",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "FC",
|
||||
"jrnlName": "FINANCE CHARGE",
|
||||
"jrnlType": "A",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "12",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "94",
|
||||
"jrnlName": "SET UP SCHEDULES",
|
||||
"jrnlType": "C",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "3",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "95",
|
||||
"jrnlName": "SET UP GENERAL LEDGER",
|
||||
"jrnlType": "B",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "3",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "20",
|
||||
"jrnlName": "USED VEHICLE SALES",
|
||||
"jrnlType": "S",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "9",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "60",
|
||||
"jrnlName": "CASH DISBURSEMENTS",
|
||||
"jrnlType": "G",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "2",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "30",
|
||||
"jrnlName": "SERVICE SALES",
|
||||
"jrnlType": "S",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "7",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "40",
|
||||
"jrnlName": "PAYROLL",
|
||||
"jrnlType": "G",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "11",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "15",
|
||||
"jrnlName": "DEALER TRADES",
|
||||
"jrnlType": "S",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "9",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "70",
|
||||
"jrnlName": "NEW VEHICLE PURCHASES",
|
||||
"jrnlType": "G",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "8",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "25",
|
||||
"jrnlName": "USED WHOLESALE",
|
||||
"jrnlType": "S",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "9",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "75",
|
||||
"jrnlName": "GENERAL PURCHASES",
|
||||
"jrnlType": "G",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "5",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "10",
|
||||
"jrnlName": "NEW VEHICLE SALES",
|
||||
"jrnlType": "S",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "9",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "80",
|
||||
"jrnlName": "GENERAL JOURNAL",
|
||||
"jrnlType": "G",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "3",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "11",
|
||||
"jrnlName": "WORK IN PROGRESS",
|
||||
"jrnlType": "G",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "10",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "56",
|
||||
"jrnlName": "CASH RECEIPTS (BALANCE FWD)",
|
||||
"jrnlType": "G",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "1",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "81",
|
||||
"jrnlName": "STANDARD ENTRIES",
|
||||
"jrnlType": "G",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "6",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "51",
|
||||
"jrnlName": "CASH RECEIPTS JOURNAL - EFT",
|
||||
"jrnlType": "G",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "10",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "61",
|
||||
"jrnlName": "CASH DISBURSMENTS -EFT",
|
||||
"jrnlType": "G",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "10",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
},
|
||||
{
|
||||
"companyNo": "77",
|
||||
"jrnlID": "71",
|
||||
"jrnlName": "USED VEHICLE PURCHASES",
|
||||
"jrnlType": "G",
|
||||
"intercoFlag": "0",
|
||||
"defaultDocType": "8",
|
||||
"errCode": "",
|
||||
"errMsg": ""
|
||||
}
|
||||
]
|
||||
```
|
||||
|
||||
# Feedback
|
||||
|
||||
- Receiving bad request errors, with no details. API errors page doesn't indicate what's wrong for certain types of error codes.
|
||||
- API Error page works on a several minute delay.
|
||||
708
client/package-lock.json
generated
708
client/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -8,41 +8,41 @@
|
||||
"private": true,
|
||||
"proxy": "http://localhost:4000",
|
||||
"dependencies": {
|
||||
"@amplitude/analytics-browser": "^2.25.2",
|
||||
"@amplitude/analytics-browser": "^2.30.1",
|
||||
"@ant-design/pro-layout": "^7.22.6",
|
||||
"@apollo/client": "^3.13.9",
|
||||
"@emotion/is-prop-valid": "^1.4.0",
|
||||
"@fingerprintjs/fingerprintjs": "^4.6.1",
|
||||
"@firebase/analytics": "^0.10.17",
|
||||
"@firebase/app": "^0.14.3",
|
||||
"@firebase/auth": "^1.10.8",
|
||||
"@firebase/analytics": "^0.10.19",
|
||||
"@firebase/app": "^0.14.6",
|
||||
"@firebase/auth": "^1.11.1",
|
||||
"@firebase/firestore": "^4.9.2",
|
||||
"@firebase/messaging": "^0.12.22",
|
||||
"@jsreport/browser-client": "^3.1.0",
|
||||
"@reduxjs/toolkit": "^2.9.0",
|
||||
"@sentry/cli": "^2.56.0",
|
||||
"@reduxjs/toolkit": "^2.10.1",
|
||||
"@sentry/cli": "^2.58.2",
|
||||
"@sentry/react": "^9.43.0",
|
||||
"@sentry/vite-plugin": "^4.3.0",
|
||||
"@splitsoftware/splitio-react": "^2.5.0",
|
||||
"@tanem/react-nprogress": "^5.0.53",
|
||||
"antd": "^5.27.4",
|
||||
"@sentry/vite-plugin": "^4.6.0",
|
||||
"@splitsoftware/splitio-react": "^2.6.0",
|
||||
"@tanem/react-nprogress": "^5.0.56",
|
||||
"antd": "^5.28.1",
|
||||
"apollo-link-logger": "^2.0.1",
|
||||
"apollo-link-sentry": "^4.4.0",
|
||||
"autosize": "^6.0.1",
|
||||
"axios": "^1.12.2",
|
||||
"axios": "^1.13.2",
|
||||
"classnames": "^2.5.1",
|
||||
"css-box-model": "^1.2.1",
|
||||
"dayjs": "^1.11.18",
|
||||
"dayjs-business-days2": "^1.3.0",
|
||||
"dayjs": "^1.11.19",
|
||||
"dayjs-business-days2": "^1.3.1",
|
||||
"dinero.js": "^1.9.1",
|
||||
"dotenv": "^17.2.3",
|
||||
"env-cmd": "^10.1.0",
|
||||
"exifr": "^7.1.3",
|
||||
"graphql": "^16.11.0",
|
||||
"i18next": "^25.5.3",
|
||||
"graphql": "^16.12.0",
|
||||
"i18next": "^25.6.2",
|
||||
"i18next-browser-languagedetector": "^8.2.0",
|
||||
"immutability-helper": "^3.1.1",
|
||||
"libphonenumber-js": "^1.12.23",
|
||||
"libphonenumber-js": "^1.12.26",
|
||||
"lightningcss": "^1.30.2",
|
||||
"logrocket": "^9.0.2",
|
||||
"markerjs2": "^2.32.7",
|
||||
@@ -50,7 +50,7 @@
|
||||
"normalize-url": "^8.1.0",
|
||||
"object-hash": "^3.0.0",
|
||||
"phone": "^3.1.67",
|
||||
"posthog-js": "^1.271.0",
|
||||
"posthog-js": "^1.294.0",
|
||||
"prop-types": "^15.8.1",
|
||||
"query-string": "^9.3.1",
|
||||
"raf-schd": "^4.0.3",
|
||||
@@ -68,7 +68,7 @@
|
||||
"react-markdown": "^10.1.0",
|
||||
"react-number-format": "^5.4.3",
|
||||
"react-popopo": "^2.1.9",
|
||||
"react-product-fruits": "^2.2.61",
|
||||
"react-product-fruits": "^2.2.62",
|
||||
"react-redux": "^9.2.0",
|
||||
"react-resizable": "^3.0.5",
|
||||
"react-router-dom": "^6.30.0",
|
||||
@@ -78,10 +78,10 @@
|
||||
"redux": "^5.0.1",
|
||||
"redux-actions": "^3.0.3",
|
||||
"redux-persist": "^6.0.0",
|
||||
"redux-saga": "^1.3.0",
|
||||
"redux-saga": "^1.4.2",
|
||||
"redux-state-sync": "^3.1.4",
|
||||
"reselect": "^5.1.1",
|
||||
"sass": "^1.93.2",
|
||||
"sass": "^1.94.0",
|
||||
"socket.io-client": "^4.8.1",
|
||||
"styled-components": "^6.1.19",
|
||||
"subscriptions-transport-ws": "^0.11.0",
|
||||
@@ -135,35 +135,35 @@
|
||||
"devDependencies": {
|
||||
"@ant-design/icons": "^6.1.0",
|
||||
"@babel/plugin-proposal-private-property-in-object": "^7.21.11",
|
||||
"@babel/preset-react": "^7.27.1",
|
||||
"@dotenvx/dotenvx": "^1.51.0",
|
||||
"@babel/preset-react": "^7.28.5",
|
||||
"@dotenvx/dotenvx": "^1.51.1",
|
||||
"@emotion/babel-plugin": "^11.13.5",
|
||||
"@emotion/react": "^11.14.0",
|
||||
"@eslint/js": "^9.37.0",
|
||||
"@playwright/test": "^1.56.0",
|
||||
"@sentry/webpack-plugin": "^4.3.0",
|
||||
"@eslint/js": "^9.39.1",
|
||||
"@playwright/test": "^1.56.1",
|
||||
"@sentry/webpack-plugin": "^4.6.0",
|
||||
"@testing-library/dom": "^10.4.1",
|
||||
"@testing-library/jest-dom": "^6.9.1",
|
||||
"@testing-library/react": "^16.3.0",
|
||||
"@vitejs/plugin-react": "^4.6.0",
|
||||
"browserslist": "^4.26.3",
|
||||
"browserslist": "^4.28.0",
|
||||
"browserslist-to-esbuild": "^2.1.1",
|
||||
"chalk": "^5.6.2",
|
||||
"eslint": "^9.37.0",
|
||||
"eslint": "^9.39.1",
|
||||
"eslint-plugin-react": "^7.37.5",
|
||||
"globals": "^15.15.0",
|
||||
"jsdom": "^26.0.0",
|
||||
"memfs": "^4.48.1",
|
||||
"memfs": "^4.51.0",
|
||||
"os-browserify": "^0.3.0",
|
||||
"playwright": "^1.56.0",
|
||||
"playwright": "^1.56.1",
|
||||
"react-error-overlay": "^6.1.0",
|
||||
"redux-logger": "^3.0.6",
|
||||
"source-map-explorer": "^2.5.3",
|
||||
"vite": "^7.1.9",
|
||||
"vite": "^7.2.2",
|
||||
"vite-plugin-babel": "^1.3.2",
|
||||
"vite-plugin-eslint": "^1.8.1",
|
||||
"vite-plugin-node-polyfills": "^0.24.0",
|
||||
"vite-plugin-pwa": "^1.0.3",
|
||||
"vite-plugin-pwa": "^1.1.0",
|
||||
"vite-plugin-style-import": "^2.0.0",
|
||||
"vitest": "^3.2.4",
|
||||
"workbox-window": "^7.3.0"
|
||||
|
||||
@@ -138,7 +138,7 @@ export function App({
|
||||
);
|
||||
}
|
||||
|
||||
if (!isPartsEntry && currentEula && !currentUser.eulaIsAccepted) {
|
||||
if (currentEula && !currentUser.eulaIsAccepted) {
|
||||
return <Eula />;
|
||||
}
|
||||
|
||||
|
||||
@@ -1,3 +1,5 @@
|
||||
@use "react-big-calendar/lib/sass/styles" as rbc;
|
||||
|
||||
:root {
|
||||
--table-stripe-bg: #f4f4f4; /* Light mode table stripe */
|
||||
--menu-divider-color: #74695c; /* Light mode menu divider */
|
||||
@@ -211,9 +213,6 @@
|
||||
--svg-background: #FFF; /* Dark mode SVG background */
|
||||
}
|
||||
|
||||
// Global Styles
|
||||
@import "react-big-calendar/lib/sass/styles";
|
||||
|
||||
.ant-menu-item-divider {
|
||||
border-bottom: 1px solid var(--menu-divider-color) !important;
|
||||
}
|
||||
@@ -428,4 +427,4 @@
|
||||
|
||||
//.rbc-time-header-gutter {
|
||||
// padding: 0;
|
||||
//}
|
||||
//}
|
||||
|
||||
@@ -180,7 +180,7 @@ export function AccountingReceivablesTableComponent({ bodyshop, loading, jobs, r
|
||||
<Card
|
||||
extra={
|
||||
<Space wrap>
|
||||
{!bodyshop.cdk_dealerid && !bodyshop.pbs_serialnumber && (
|
||||
{!bodyshop.cdk_dealerid && !bodyshop.pbs_serialnumber && !bodyshop.rr_dealerid && (
|
||||
<>
|
||||
<JobMarkSelectedExported
|
||||
jobIds={selectedJobs}
|
||||
@@ -198,7 +198,7 @@ export function AccountingReceivablesTableComponent({ bodyshop, loading, jobs, r
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
{bodyshop.accountingconfig && bodyshop.accountingconfig.qbo && <QboAuthorizeComponent />}
|
||||
{bodyshop.accountingconfig?.qbo && <QboAuthorizeComponent />}
|
||||
<Input.Search
|
||||
value={state.search}
|
||||
onChange={handleSearch}
|
||||
|
||||
@@ -26,7 +26,6 @@ import { CalculateBillTotal } from "../bill-form/bill-form.totals.utility";
|
||||
import { handleUpload as handleLocalUpload } from "../documents-local-upload/documents-local-upload.utility";
|
||||
import { handleUpload } from "../documents-upload/documents-upload.utility";
|
||||
import { handleUpload as handleUploadToImageProxy } from "../documents-upload-imgproxy/documents-upload-imgproxy.utility";
|
||||
import RbacWrapper from "../../components/rbac-wrapper/rbac-wrapper.component";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
billEnterModal: selectBillEnterModal,
|
||||
@@ -451,9 +450,7 @@ function BillEnterModalContainer({ billEnterModal, toggleModalVisible, bodyshop,
|
||||
setEnterAgain(false);
|
||||
}}
|
||||
>
|
||||
<RbacWrapper action="bills:enter">
|
||||
<BillFormContainer form={form} disableInvNumber={billEnterModal.context.disableInvNumber} />
|
||||
</RbacWrapper>
|
||||
<BillFormContainer form={form} disableInvNumber={billEnterModal.context.disableInvNumber} />
|
||||
</Form>
|
||||
</Modal>
|
||||
);
|
||||
|
||||
@@ -7,6 +7,7 @@ import { createStructuredSelector } from "reselect";
|
||||
import { selectBodyshop } from "../../redux/user/user.selectors";
|
||||
import CurrencyInput from "../form-items-formatted/currency-form-item.component";
|
||||
import CiecaSelect from "../../utils/Ciecaselect";
|
||||
import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
bodyshop: selectBodyshop
|
||||
@@ -44,7 +45,7 @@ export function BillFormItemsExtendedFormItem({
|
||||
quantity: record.part_qty || 1,
|
||||
actual_price: record.act_price,
|
||||
cost_center: record.part_type
|
||||
? bodyshop.pbs_serialnumber || bodyshop.cdk_dealerid
|
||||
? bodyshopHasDmsKey(bodyshop)
|
||||
? record.part_type
|
||||
: responsibilityCenters.defaults && (responsibilityCenters.defaults.costs[record.part_type] || null)
|
||||
: null
|
||||
@@ -100,7 +101,7 @@ export function BillFormItemsExtendedFormItem({
|
||||
</Form.Item>
|
||||
<Form.Item label={t("billlines.fields.cost_center")} name={["billlineskeys", record.id, "cost_center"]}>
|
||||
<Select showSearch style={{ minWidth: "3rem" }} disabled={disabled}>
|
||||
{bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber
|
||||
{bodyshopHasDmsKey(bodyshop)
|
||||
? CiecaSelect(true, false)
|
||||
: responsibilityCenters.costs.map((item) => <Select.Option key={item.name}>{item.name}</Select.Option>)}
|
||||
</Select>
|
||||
|
||||
@@ -22,6 +22,7 @@ import VendorSearchSelect from "../vendor-search-select/vendor-search-select.com
|
||||
import BillFormLines from "./bill-form.lines.component";
|
||||
import { CalculateBillTotal } from "./bill-form.totals.utility";
|
||||
import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
|
||||
import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
bodyshop: selectBodyshop
|
||||
@@ -354,7 +355,7 @@ export function BillFormComponent({
|
||||
<Form.Item span={3} label={t("bills.fields.local_tax_rate")} name="local_tax_rate">
|
||||
<CurrencyInput min={0} />
|
||||
</Form.Item>
|
||||
{bodyshop.pbs_serialnumber || bodyshop.cdk_dealerid ? (
|
||||
{bodyshopHasDmsKey(bodyshop) ? (
|
||||
<Form.Item span={2} label={t("bills.labels.federal_tax_exempt")} name="federal_tax_exempt">
|
||||
<Switch onChange={handleFederalTaxExemptSwitchToggle} />
|
||||
</Form.Item>
|
||||
|
||||
@@ -10,6 +10,7 @@ import InstanceRenderManager from "../../utils/instanceRenderMgr";
|
||||
import BillLineSearchSelect from "../bill-line-search-select/bill-line-search-select.component";
|
||||
import BilllineAddInventory from "../billline-add-inventory/billline-add-inventory.component";
|
||||
import CurrencyInput from "../form-items-formatted/currency-form-item.component";
|
||||
import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
//currentUser: selectCurrentUser
|
||||
@@ -90,7 +91,7 @@ export function BillEnterModalLinesComponent({
|
||||
actual_price: opt.cost,
|
||||
original_actual_price: opt.cost,
|
||||
cost_center: opt.part_type
|
||||
? bodyshop.pbs_serialnumber || bodyshop.cdk_dealerid
|
||||
? bodyshopHasDmsKey(bodyshop)
|
||||
? opt.part_type !== "PAE"
|
||||
? opt.part_type
|
||||
: null
|
||||
@@ -322,7 +323,7 @@ export function BillEnterModalLinesComponent({
|
||||
},
|
||||
formInput: () => (
|
||||
<Select showSearch style={{ minWidth: "3rem" }} disabled={disabled}>
|
||||
{bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber
|
||||
{bodyshopHasDmsKey(bodyshop)
|
||||
? CiecaSelect(true, false)
|
||||
: responsibilityCenters.costs.map((item) => <Select.Option key={item.name}>{item.name}</Select.Option>)}
|
||||
</Select>
|
||||
|
||||
@@ -2,6 +2,7 @@ import { useApolloClient } from "@apollo/client";
|
||||
import { getToken } from "@firebase/messaging";
|
||||
import axios from "axios";
|
||||
import { useEffect } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { messaging, requestForToken } from "../../firebase/firebase.utils";
|
||||
import ChatPopupComponent from "../chat-popup/chat-popup.component";
|
||||
import "./chat-affix.styles.scss";
|
||||
@@ -9,14 +10,14 @@ import { registerMessagingHandlers, unregisterMessagingHandlers } from "./regist
|
||||
import { useSocket } from "../../contexts/SocketIO/useSocket.js";
|
||||
|
||||
export function ChatAffixContainer({ bodyshop, chatVisible, currentUser }) {
|
||||
const { t } = useTranslation();
|
||||
const client = useApolloClient();
|
||||
const { socket } = useSocket();
|
||||
|
||||
// 1) FCM subscription (independent of socket handler registration)
|
||||
useEffect(() => {
|
||||
if (!bodyshop?.messagingservicesid) return;
|
||||
|
||||
async function subscribeToTopicForFCMNotification() {
|
||||
async function SubscribeToTopicForFCMNotification() {
|
||||
try {
|
||||
await requestForToken();
|
||||
await axios.post("/notifications/subscribe", {
|
||||
@@ -31,35 +32,17 @@ export function ChatAffixContainer({ bodyshop, chatVisible, currentUser }) {
|
||||
}
|
||||
}
|
||||
|
||||
subscribeToTopicForFCMNotification();
|
||||
}, [bodyshop?.messagingservicesid, bodyshop?.imexshopid]);
|
||||
SubscribeToTopicForFCMNotification();
|
||||
|
||||
// 2) Register socket handlers as soon as socket is connected (regardless of chatVisible)
|
||||
useEffect(() => {
|
||||
if (!socket) return;
|
||||
if (!bodyshop?.messagingservicesid) return;
|
||||
if (!bodyshop?.id) return;
|
||||
// Register WebSocket handlers
|
||||
if (socket?.connected) {
|
||||
registerMessagingHandlers({ socket, client, currentUser, bodyshop, t });
|
||||
|
||||
// If socket isn't connected yet, ensure no stale handlers remain.
|
||||
if (!socket.connected) {
|
||||
unregisterMessagingHandlers({ socket });
|
||||
return;
|
||||
return () => {
|
||||
unregisterMessagingHandlers({ socket });
|
||||
};
|
||||
}
|
||||
|
||||
// Prevent duplicate listeners if this effect runs more than once.
|
||||
unregisterMessagingHandlers({ socket });
|
||||
|
||||
registerMessagingHandlers({
|
||||
socket,
|
||||
client,
|
||||
currentUser,
|
||||
bodyshop
|
||||
});
|
||||
|
||||
return () => {
|
||||
unregisterMessagingHandlers({ socket });
|
||||
};
|
||||
}, [socket, socket?.connected, bodyshop?.id, bodyshop?.messagingservicesid, client, currentUser?.email]);
|
||||
}, [bodyshop, socket, t, client]);
|
||||
|
||||
if (!bodyshop?.messagingservicesid) return <></>;
|
||||
|
||||
|
||||
@@ -13,241 +13,68 @@ const logLocal = (message, ...args) => {
|
||||
}
|
||||
};
|
||||
|
||||
const safeIsoNow = () => new Date().toISOString();
|
||||
const isSystemMsid = (msid) => typeof msid === "string" && msid.startsWith("SYS_");
|
||||
|
||||
const normalizeConversationForList = (raw, { isoutbound, isSystem } = {}) => {
|
||||
const c = raw || {};
|
||||
const id = c.id;
|
||||
|
||||
return {
|
||||
__typename: "conversations",
|
||||
id,
|
||||
phone_num: c.phone_num ?? null,
|
||||
updated_at: c.updated_at ?? safeIsoNow(),
|
||||
unreadcnt: typeof c.unreadcnt === "number" ? c.unreadcnt : 0,
|
||||
archived: c.archived ?? false,
|
||||
label: c.label ?? null,
|
||||
|
||||
job_conversations: Array.isArray(c.job_conversations)
|
||||
? c.job_conversations.map((jc) => {
|
||||
const job = jc?.job || {};
|
||||
const jobId = jc?.jobid ?? job?.id ?? null;
|
||||
|
||||
return {
|
||||
__typename: "job_conversations",
|
||||
jobid: jobId,
|
||||
conversationid: jc?.conversationid ?? id ?? null,
|
||||
job: {
|
||||
__typename: "jobs",
|
||||
id: jobId,
|
||||
ro_number: job?.ro_number ?? null,
|
||||
ownr_fn: job?.ownr_fn ?? null,
|
||||
ownr_ln: job?.ownr_ln ?? null,
|
||||
ownr_co_nm: job?.ownr_co_nm ?? null
|
||||
}
|
||||
};
|
||||
})
|
||||
: [],
|
||||
|
||||
messages_aggregate: c.messages_aggregate || {
|
||||
__typename: "messages_aggregate",
|
||||
aggregate: {
|
||||
__typename: "messages_aggregate_fields",
|
||||
count: isoutbound || isSystem ? 0 : 1
|
||||
}
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
const CONVERSATION_LIST_ITEM_FRAGMENT = gql`
|
||||
fragment _ConversationListItem on conversations {
|
||||
id
|
||||
phone_num
|
||||
updated_at
|
||||
unreadcnt
|
||||
archived
|
||||
label
|
||||
job_conversations {
|
||||
jobid
|
||||
conversationid
|
||||
job {
|
||||
id
|
||||
ro_number
|
||||
ownr_fn
|
||||
ownr_ln
|
||||
ownr_co_nm
|
||||
}
|
||||
}
|
||||
messages_aggregate(where: { read: { _eq: false }, isoutbound: { _eq: false }, is_system: { _eq: false } }) {
|
||||
aggregate {
|
||||
count
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const normalizeMessageForCache = (raw, fallbackConversationId) => {
|
||||
const m = raw || {};
|
||||
|
||||
return {
|
||||
__typename: "messages",
|
||||
id: m.id,
|
||||
conversationid: m.conversationid ?? m.conversation?.id ?? fallbackConversationId,
|
||||
|
||||
status: m.status ?? null,
|
||||
text: m.text ?? "",
|
||||
is_system: typeof m.is_system === "boolean" ? m.is_system : false,
|
||||
isoutbound: typeof m.isoutbound === "boolean" ? m.isoutbound : false,
|
||||
image: typeof m.image === "boolean" ? m.image : false,
|
||||
image_path: m.image_path ?? null,
|
||||
userid: m.userid ?? null,
|
||||
created_at: m.created_at ?? safeIsoNow(),
|
||||
read: typeof m.read === "boolean" ? m.read : false
|
||||
};
|
||||
};
|
||||
|
||||
const isConversationDetailsCached = (client, conversationId) => {
|
||||
try {
|
||||
return !!client.cache.readQuery({
|
||||
query: GET_CONVERSATION_DETAILS,
|
||||
variables: { conversationId }
|
||||
})?.conversations_by_pk;
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
const conversationDetailsCached = (client, conversationId) => {
|
||||
try {
|
||||
const res = client.cache.readQuery({
|
||||
query: GET_CONVERSATION_DETAILS,
|
||||
variables: { conversationId }
|
||||
});
|
||||
return !!res?.conversations_by_pk;
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
const messageEntityCached = (client, messageId) => {
|
||||
const cacheId = client.cache.identify({ __typename: "messages", id: messageId });
|
||||
if (!cacheId) return false;
|
||||
|
||||
try {
|
||||
client.cache.readFragment({
|
||||
id: cacheId,
|
||||
fragment: gql`
|
||||
fragment _MsgExists on messages {
|
||||
id
|
||||
}
|
||||
`
|
||||
});
|
||||
return true;
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
const enrichConversation = (conversation, { isoutbound, isSystem }) => ({
|
||||
// Utility function to enrich conversation data
|
||||
const enrichConversation = (conversation, isOutbound) => ({
|
||||
...conversation,
|
||||
updated_at: conversation.updated_at || safeIsoNow(),
|
||||
unreadcnt: typeof conversation.unreadcnt === "number" ? conversation.unreadcnt : 0,
|
||||
archived: conversation.archived ?? false,
|
||||
label: conversation.label ?? null,
|
||||
updated_at: conversation.updated_at || new Date().toISOString(),
|
||||
unreadcnt: conversation.unreadcnt || 0,
|
||||
archived: conversation.archived || false,
|
||||
label: conversation.label || null,
|
||||
job_conversations: conversation.job_conversations || [],
|
||||
messages_aggregate: conversation.messages_aggregate || {
|
||||
__typename: "messages_aggregate",
|
||||
aggregate: {
|
||||
__typename: "messages_aggregate_fields",
|
||||
count: isoutbound || isSystem ? 0 : 1
|
||||
count: isOutbound ? 0 : 1
|
||||
}
|
||||
},
|
||||
__typename: "conversations"
|
||||
});
|
||||
|
||||
const upsertConversationIntoOffsetZeroList = (client, conversationObj, { isoutbound, isSystem } = {}) => {
|
||||
const normalized = normalizeConversationForList(conversationObj, { isoutbound, isSystem });
|
||||
if (!normalized?.id) return;
|
||||
|
||||
const convCacheId = client.cache.identify(normalized);
|
||||
if (!convCacheId) return;
|
||||
|
||||
client.cache.writeFragment({
|
||||
id: convCacheId,
|
||||
fragment: CONVERSATION_LIST_ITEM_FRAGMENT,
|
||||
data: normalized
|
||||
});
|
||||
|
||||
client.cache.modify({
|
||||
id: "ROOT_QUERY",
|
||||
fields: {
|
||||
conversations(existing = [], { args, readField }) {
|
||||
if (!args || args.offset !== 0) return existing;
|
||||
|
||||
const archivedEq = args?.where?.archived?._eq;
|
||||
if (archivedEq === true) return existing;
|
||||
|
||||
const without = existing.filter((c) => readField("id", c) !== normalized.id);
|
||||
return [{ __ref: convCacheId }, ...without];
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
// Can be uncommonted to test the playback of the notification sound
|
||||
// window.testTone = () => {
|
||||
// const notificationSound = new Audio(newMessageSound);
|
||||
// notificationSound.play().catch((error) => {
|
||||
// console.error("Error playing notification sound:", error);
|
||||
// });
|
||||
// };
|
||||
|
||||
export const registerMessagingHandlers = ({ socket, client, currentUser, bodyshop }) => {
|
||||
if (!(socket && client)) return;
|
||||
|
||||
// Coalesce unread refetches (avoid spamming during bursts)
|
||||
let unreadRefetchInFlight = null;
|
||||
const refetchUnreadCount = () => {
|
||||
if (unreadRefetchInFlight) return;
|
||||
|
||||
unreadRefetchInFlight = client
|
||||
.refetchQueries({
|
||||
include: ["UNREAD_CONVERSATION_COUNT"]
|
||||
})
|
||||
.catch(() => {
|
||||
// best-effort
|
||||
})
|
||||
.finally(() => {
|
||||
unreadRefetchInFlight = null;
|
||||
});
|
||||
};
|
||||
|
||||
const handleNewMessageSummary = async (message) => {
|
||||
const { conversationId, newConversation, existingConversation, isoutbound, msid, updated_at } = message;
|
||||
const isSystem = isSystemMsid(msid);
|
||||
const { conversationId, newConversation, existingConversation, isoutbound } = message;
|
||||
|
||||
const isNewMessageSoundEnabled = (clientInstance) => {
|
||||
// True only when DB value is strictly true; falls back to true on cache miss
|
||||
const isNewMessageSoundEnabled = (client) => {
|
||||
try {
|
||||
const email = currentUser?.email;
|
||||
if (!email) return true;
|
||||
const res = clientInstance.readQuery({
|
||||
if (!email) return true; // default allow if we can't resolve user
|
||||
const res = client.readQuery({
|
||||
query: QUERY_ACTIVE_ASSOCIATION_SOUND,
|
||||
variables: { email }
|
||||
});
|
||||
const flag = res?.associations?.[0]?.new_message_sound;
|
||||
return flag === true;
|
||||
return flag === true; // strictly true => enabled
|
||||
} catch {
|
||||
// If the query hasn't been seeded in cache yet, default ON
|
||||
return true;
|
||||
}
|
||||
};
|
||||
|
||||
logLocal("handleNewMessageSummary - Start", { message, isNew: !existingConversation });
|
||||
|
||||
const queryVariables = { offset: 0 };
|
||||
|
||||
if (!isoutbound) {
|
||||
// Play notification sound for new inbound message (scoped to bodyshop)
|
||||
if (isLeaderTab(bodyshop.id) && isNewMessageSoundEnabled(client)) {
|
||||
playNewMessageSound(bodyshop.id);
|
||||
}
|
||||
|
||||
// Real-time badge update for affix (best-effort, coalesced)
|
||||
if (!isSystem) {
|
||||
refetchUnreadCount();
|
||||
}
|
||||
}
|
||||
|
||||
if (!existingConversation && conversationId) {
|
||||
// Attempt to read from the cache to determine if this is actually a new conversation
|
||||
try {
|
||||
const cachedConversation = client.cache.readFragment({
|
||||
id: client.cache.identify({ __typename: "conversations", id: conversationId }),
|
||||
@@ -259,54 +86,75 @@ export const registerMessagingHandlers = ({ socket, client, currentUser, bodysho
|
||||
});
|
||||
|
||||
if (cachedConversation) {
|
||||
logLocal("handleNewMessageSummary - Existing Conversation inferred from cache", { conversationId });
|
||||
return handleNewMessageSummary({ ...message, existingConversation: true });
|
||||
logLocal("handleNewMessageSummary - Existing Conversation inferred from cache", {
|
||||
conversationId
|
||||
});
|
||||
return handleNewMessageSummary({
|
||||
...message,
|
||||
existingConversation: true
|
||||
});
|
||||
}
|
||||
} catch {
|
||||
// Cache miss is normal
|
||||
logLocal("handleNewMessageSummary - Cache miss", { conversationId });
|
||||
}
|
||||
}
|
||||
|
||||
// Handle new conversation
|
||||
if (!existingConversation && newConversation?.phone_num) {
|
||||
logLocal("handleNewMessageSummary - New Conversation", newConversation);
|
||||
|
||||
try {
|
||||
upsertConversationIntoOffsetZeroList(client, newConversation, { isoutbound, isSystem });
|
||||
const queryResults = client.cache.readQuery({
|
||||
query: CONVERSATION_LIST_QUERY,
|
||||
variables: queryVariables
|
||||
});
|
||||
|
||||
const existingConversations = queryResults?.conversations || [];
|
||||
const enrichedConversation = enrichConversation(newConversation, isoutbound);
|
||||
|
||||
if (!existingConversations.some((conv) => conv.id === enrichedConversation.id)) {
|
||||
client.cache.modify({
|
||||
id: "ROOT_QUERY",
|
||||
fields: {
|
||||
conversations(existingConversations = []) {
|
||||
return [enrichedConversation, ...existingConversations];
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error updating cache for new conversation:", error);
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
if (existingConversation && conversationId) {
|
||||
// Handle existing conversation
|
||||
if (existingConversation) {
|
||||
try {
|
||||
client.cache.modify({
|
||||
id: client.cache.identify({ __typename: "conversations", id: conversationId }),
|
||||
fields: {
|
||||
updated_at: () => updated_at || safeIsoNow(),
|
||||
updated_at: () => new Date().toISOString(),
|
||||
archived: () => false,
|
||||
|
||||
messages_aggregate(cached = null) {
|
||||
if (isoutbound || isSystem) return cached;
|
||||
|
||||
const currentCount = cached?.aggregate?.count ?? 0;
|
||||
return {
|
||||
__typename: "messages_aggregate",
|
||||
aggregate: {
|
||||
__typename: "messages_aggregate_fields",
|
||||
count: currentCount + 1
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
unreadcnt(cached) {
|
||||
if (isoutbound || isSystem) return cached;
|
||||
const n = typeof cached === "number" ? cached : 0;
|
||||
return n + 1;
|
||||
messages_aggregate(cached = { aggregate: { count: 0 } }) {
|
||||
const currentCount = cached.aggregate?.count || 0;
|
||||
if (!isoutbound) {
|
||||
return {
|
||||
__typename: "messages_aggregate",
|
||||
aggregate: {
|
||||
__typename: "messages_aggregate_fields",
|
||||
count: currentCount + 1
|
||||
}
|
||||
};
|
||||
}
|
||||
return cached;
|
||||
}
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
console.error("Error updating cache for existing conversation:", error);
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -318,78 +166,88 @@ export const registerMessagingHandlers = ({ socket, client, currentUser, bodysho
|
||||
|
||||
logLocal("handleNewMessageDetailed - Start", message);
|
||||
|
||||
if (!conversationId || !isConversationDetailsCached(client, conversationId)) return;
|
||||
|
||||
try {
|
||||
const normalized = normalizeMessageForCache(newMessage, conversationId);
|
||||
// Check if the conversation exists in the cache
|
||||
const queryResults = client.cache.readQuery({
|
||||
query: GET_CONVERSATION_DETAILS,
|
||||
variables: { conversationId }
|
||||
});
|
||||
|
||||
const messageCacheId = client.cache.identify(normalized);
|
||||
if (!messageCacheId) {
|
||||
console.warn("handleNewMessageDetailed - Could not identify message for cache", {
|
||||
conversationId,
|
||||
newMessageId: newMessage?.id
|
||||
});
|
||||
if (!queryResults?.conversations_by_pk) {
|
||||
console.warn("Conversation not found in cache:", { conversationId });
|
||||
return;
|
||||
}
|
||||
|
||||
client.cache.writeFragment({
|
||||
id: messageCacheId,
|
||||
fragment: gql`
|
||||
fragment _IncomingMessage on messages {
|
||||
id
|
||||
conversationid
|
||||
status
|
||||
text
|
||||
is_system
|
||||
isoutbound
|
||||
image
|
||||
image_path
|
||||
userid
|
||||
created_at
|
||||
read
|
||||
}
|
||||
`,
|
||||
data: normalized
|
||||
});
|
||||
|
||||
// Append the new message to the conversation's message list using cache.modify
|
||||
client.cache.modify({
|
||||
id: client.cache.identify({ __typename: "conversations", id: conversationId }),
|
||||
fields: {
|
||||
messages(existing = [], { readField }) {
|
||||
const already = existing.some((ref) => readField("id", ref) === normalized.id);
|
||||
if (already) return existing;
|
||||
return [...existing, { __ref: messageCacheId }];
|
||||
},
|
||||
updated_at() {
|
||||
return normalized.created_at || safeIsoNow();
|
||||
messages(existingMessages = []) {
|
||||
return [...existingMessages, newMessage];
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
logLocal("handleNewMessageDetailed - Message appended successfully", { conversationId });
|
||||
logLocal("handleNewMessageDetailed - Message appended successfully", {
|
||||
conversationId,
|
||||
newMessage
|
||||
});
|
||||
} catch (error) {
|
||||
console.error("Error updating conversation messages in cache:", error);
|
||||
}
|
||||
};
|
||||
|
||||
const handleMessageChanged = (message) => {
|
||||
if (!message?.id) return;
|
||||
if (!message) {
|
||||
logLocal("handleMessageChanged - No message provided", message);
|
||||
return;
|
||||
}
|
||||
|
||||
logLocal("handleMessageChanged - Start", message);
|
||||
|
||||
if (!messageEntityCached(client, message.id)) return;
|
||||
|
||||
try {
|
||||
const msgCacheId = client.cache.identify({ __typename: "messages", id: message.id });
|
||||
|
||||
client.cache.modify({
|
||||
id: msgCacheId,
|
||||
id: client.cache.identify({ __typename: "conversations", id: message.conversationid }),
|
||||
fields: {
|
||||
status(existing) {
|
||||
return message.type === "status-changed" ? (message.status ?? existing) : existing;
|
||||
},
|
||||
text(existing) {
|
||||
return message.type === "text-updated" ? (message.text ?? existing) : existing;
|
||||
messages(existingMessages = [], { readField }) {
|
||||
return existingMessages.map((messageRef) => {
|
||||
// Check if this is the message to update
|
||||
if (readField("id", messageRef) === message.id) {
|
||||
const currentStatus = readField("status", messageRef);
|
||||
|
||||
// Handle known types of message changes
|
||||
switch (message.type) {
|
||||
case "status-changed":
|
||||
// Prevent overwriting if the current status is already "delivered"
|
||||
if (currentStatus === "delivered") {
|
||||
logLocal("handleMessageChanged - Status already delivered, skipping update", {
|
||||
messageId: message.id
|
||||
});
|
||||
return messageRef;
|
||||
}
|
||||
|
||||
// Update the status field
|
||||
return {
|
||||
...messageRef,
|
||||
status: message.status
|
||||
};
|
||||
|
||||
case "text-updated":
|
||||
// Handle changes to the message text
|
||||
return {
|
||||
...messageRef,
|
||||
text: message.text
|
||||
};
|
||||
|
||||
default:
|
||||
// Log a warning for unhandled message types
|
||||
logLocal("handleMessageChanged - Unhandled message type", { type: message.type });
|
||||
return messageRef;
|
||||
}
|
||||
}
|
||||
|
||||
return messageRef;
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -404,140 +262,149 @@ export const registerMessagingHandlers = ({ socket, client, currentUser, bodysho
|
||||
};
|
||||
|
||||
const handleConversationChanged = async (data) => {
|
||||
if (!data?.conversationId) return;
|
||||
|
||||
const {
|
||||
conversationId,
|
||||
type,
|
||||
job_conversations,
|
||||
messageIds,
|
||||
messageIdsMarkedRead,
|
||||
lastUnreadMessageId,
|
||||
unreadCount,
|
||||
...fields
|
||||
} = data;
|
||||
if (!data) {
|
||||
logLocal("handleConversationChanged - No data provided", data);
|
||||
return;
|
||||
}
|
||||
|
||||
const { conversationId, type, job_conversations, messageIds, ...fields } = data;
|
||||
logLocal("handleConversationChanged - Start", data);
|
||||
|
||||
const updatedAt = safeIsoNow();
|
||||
const detailsCached = conversationDetailsCached(client, conversationId);
|
||||
const updatedAt = new Date().toISOString();
|
||||
|
||||
const updateConversationList = (newConversation) => {
|
||||
try {
|
||||
const existingList = client.cache.readQuery({
|
||||
query: CONVERSATION_LIST_QUERY,
|
||||
variables: { offset: 0 }
|
||||
});
|
||||
|
||||
const updatedList = existingList?.conversations
|
||||
? [newConversation, ...existingList.conversations.filter((conv) => conv.id !== newConversation.id)]
|
||||
: [newConversation]; // Prevent duplicates
|
||||
|
||||
client.cache.writeQuery({
|
||||
query: CONVERSATION_LIST_QUERY,
|
||||
variables: { offset: 0 },
|
||||
data: {
|
||||
conversations: updatedList
|
||||
}
|
||||
});
|
||||
|
||||
logLocal("handleConversationChanged - Conversation list updated successfully", newConversation);
|
||||
} catch (error) {
|
||||
console.error("Error updating conversation list in the cache:", error);
|
||||
}
|
||||
};
|
||||
|
||||
// Handle specific types
|
||||
try {
|
||||
switch (type) {
|
||||
case "conversation-marked-read": {
|
||||
refetchUnreadCount();
|
||||
|
||||
if (detailsCached && Array.isArray(messageIds)) {
|
||||
messageIds.forEach((id) => {
|
||||
if (!messageEntityCached(client, id)) return;
|
||||
client.cache.modify({
|
||||
id: client.cache.identify({ __typename: "messages", id }),
|
||||
fields: { read: () => true }
|
||||
});
|
||||
case "conversation-marked-read":
|
||||
if (conversationId && messageIds?.length > 0) {
|
||||
client.cache.modify({
|
||||
id: client.cache.identify({ __typename: "conversations", id: conversationId }),
|
||||
fields: {
|
||||
messages(existingMessages = [], { readField }) {
|
||||
return existingMessages.map((message) => {
|
||||
if (messageIds.includes(readField("id", message))) {
|
||||
return { ...message, read: true };
|
||||
}
|
||||
return message;
|
||||
});
|
||||
},
|
||||
messages_aggregate: () => ({
|
||||
__typename: "messages_aggregate",
|
||||
aggregate: { __typename: "messages_aggregate_fields", count: 0 }
|
||||
})
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
client.cache.modify({
|
||||
id: client.cache.identify({ __typename: "conversations", id: conversationId }),
|
||||
fields: {
|
||||
messages_aggregate: () => ({
|
||||
__typename: "messages_aggregate",
|
||||
aggregate: { __typename: "messages_aggregate_fields", count: 0 }
|
||||
}),
|
||||
unreadcnt: () => 0,
|
||||
updated_at: () => updatedAt
|
||||
}
|
||||
});
|
||||
|
||||
break;
|
||||
}
|
||||
|
||||
case "conversation-marked-unread": {
|
||||
refetchUnreadCount();
|
||||
|
||||
const safeUnreadCount = typeof unreadCount === "number" ? unreadCount : 1;
|
||||
const idsMarkedRead = Array.isArray(messageIdsMarkedRead) ? messageIdsMarkedRead : [];
|
||||
|
||||
if (detailsCached) {
|
||||
idsMarkedRead.forEach((id) => {
|
||||
if (!messageEntityCached(client, id)) return;
|
||||
client.cache.modify({
|
||||
id: client.cache.identify({ __typename: "messages", id }),
|
||||
fields: { read: () => true }
|
||||
});
|
||||
});
|
||||
|
||||
if (lastUnreadMessageId && messageEntityCached(client, lastUnreadMessageId)) {
|
||||
client.cache.modify({
|
||||
id: client.cache.identify({ __typename: "messages", id: lastUnreadMessageId }),
|
||||
fields: { read: () => false }
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
client.cache.modify({
|
||||
id: client.cache.identify({ __typename: "conversations", id: conversationId }),
|
||||
fields: {
|
||||
updated_at: () => updatedAt,
|
||||
messages_aggregate: () => ({
|
||||
__typename: "messages_aggregate",
|
||||
aggregate: {
|
||||
__typename: "messages_aggregate_fields",
|
||||
count: safeUnreadCount
|
||||
}
|
||||
}),
|
||||
unreadcnt: () => safeUnreadCount
|
||||
}
|
||||
});
|
||||
|
||||
case "conversation-created":
|
||||
updateConversationList({ ...fields, job_conversations, updated_at: updatedAt });
|
||||
break;
|
||||
}
|
||||
|
||||
case "conversation-created": {
|
||||
// New conversation likely implies new unread inbound message(s)
|
||||
refetchUnreadCount();
|
||||
|
||||
const conv = enrichConversation(
|
||||
{ id: conversationId, job_conversations, ...fields, updated_at: updatedAt },
|
||||
{ isoutbound: false, isSystem: false }
|
||||
);
|
||||
upsertConversationIntoOffsetZeroList(client, conv);
|
||||
break;
|
||||
}
|
||||
|
||||
case "conversation-unarchived":
|
||||
case "conversation-archived": {
|
||||
// Keep unread badge correct even if archiving affects counts
|
||||
refetchUnreadCount();
|
||||
case "conversation-archived":
|
||||
try {
|
||||
const listQueryVariables = { offset: 0 };
|
||||
const detailsQueryVariables = { conversationId };
|
||||
|
||||
await client.refetchQueries({
|
||||
include: [CONVERSATION_LIST_QUERY, GET_CONVERSATION_DETAILS]
|
||||
});
|
||||
// Check if conversation details exist in the cache
|
||||
const detailsExist = !!client.cache.readQuery({
|
||||
query: GET_CONVERSATION_DETAILS,
|
||||
variables: detailsQueryVariables
|
||||
});
|
||||
|
||||
// Refetch conversation list
|
||||
await client.refetchQueries({
|
||||
include: [CONVERSATION_LIST_QUERY, ...(detailsExist ? [GET_CONVERSATION_DETAILS] : [])],
|
||||
variables: [
|
||||
{ query: CONVERSATION_LIST_QUERY, variables: listQueryVariables },
|
||||
...(detailsExist
|
||||
? [
|
||||
{
|
||||
query: GET_CONVERSATION_DETAILS,
|
||||
variables: detailsQueryVariables
|
||||
}
|
||||
]
|
||||
: [])
|
||||
]
|
||||
});
|
||||
|
||||
logLocal("handleConversationChanged - Refetched queries after state change", {
|
||||
conversationId,
|
||||
type
|
||||
});
|
||||
} catch (error) {
|
||||
console.error("Error refetching queries after conversation state change:", error);
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
case "tag-added": {
|
||||
const formattedJobConversations = (job_conversations || []).map((jc) => ({
|
||||
// Ensure `job_conversations` is properly formatted
|
||||
const formattedJobConversations = job_conversations.map((jc) => ({
|
||||
__typename: "job_conversations",
|
||||
jobid: jc.jobid || jc.job?.id,
|
||||
conversationid: conversationId,
|
||||
job: {
|
||||
job: jc.job || {
|
||||
__typename: "jobs",
|
||||
id: jc.job?.id,
|
||||
ro_number: jc.job?.ro_number,
|
||||
ownr_co_nm: jc.job?.ownr_co_nm,
|
||||
ownr_fn: jc.job?.ownr_fn,
|
||||
ownr_ln: jc.job?.ownr_ln
|
||||
id: data.selectedJob.id,
|
||||
ro_number: data.selectedJob.ro_number,
|
||||
ownr_co_nm: data.selectedJob.ownr_co_nm,
|
||||
ownr_fn: data.selectedJob.ownr_fn,
|
||||
ownr_ln: data.selectedJob.ownr_ln
|
||||
}
|
||||
}));
|
||||
|
||||
client.cache.modify({
|
||||
id: client.cache.identify({ __typename: "conversations", id: conversationId }),
|
||||
fields: {
|
||||
job_conversations(existing = [], { readField }) {
|
||||
const seen = new Set(existing.map((x) => readField("jobid", x)).filter(Boolean));
|
||||
const incoming = formattedJobConversations.filter((x) => x.jobid && !seen.has(x.jobid));
|
||||
return [...existing, ...incoming];
|
||||
job_conversations: (existing = []) => {
|
||||
// Ensure no duplicates based on both `conversationid` and `jobid`
|
||||
const existingLinks = new Set(
|
||||
existing.map((jc) => {
|
||||
const jobId = client.cache.readFragment({
|
||||
id: client.cache.identify(jc),
|
||||
fragment: gql`
|
||||
fragment JobConversationLinkAdded on job_conversations {
|
||||
jobid
|
||||
conversationid
|
||||
}
|
||||
`
|
||||
})?.jobid;
|
||||
return `${jobId}:${conversationId}`; // Unique identifier for a job-conversation link
|
||||
})
|
||||
);
|
||||
|
||||
const newItems = formattedJobConversations.filter((jc) => {
|
||||
const uniqueLink = `${jc.jobid}:${jc.conversationid}`;
|
||||
return !existingLinks.has(uniqueLink);
|
||||
});
|
||||
|
||||
return [...existing, ...newItems];
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -545,31 +412,46 @@ export const registerMessagingHandlers = ({ socket, client, currentUser, bodysho
|
||||
break;
|
||||
}
|
||||
|
||||
case "tag-removed": {
|
||||
const conversationCacheId = client.cache.identify({ __typename: "conversations", id: conversationId });
|
||||
case "tag-removed":
|
||||
try {
|
||||
const conversationCacheId = client.cache.identify({ __typename: "conversations", id: conversationId });
|
||||
|
||||
// Evict the specific cache entry for job_conversations
|
||||
client.cache.evict({
|
||||
id: conversationCacheId,
|
||||
fieldName: "job_conversations"
|
||||
});
|
||||
|
||||
// Garbage collect evicted entries
|
||||
client.cache.gc();
|
||||
|
||||
logLocal("handleConversationChanged - tag removed - Refetched conversation list after state change", {
|
||||
conversationId,
|
||||
type
|
||||
});
|
||||
} catch (error) {
|
||||
console.error("Error refetching queries after conversation state change: (Tag Removed)", error);
|
||||
}
|
||||
|
||||
client.cache.evict({
|
||||
id: conversationCacheId,
|
||||
fieldName: "job_conversations"
|
||||
});
|
||||
client.cache.gc();
|
||||
break;
|
||||
}
|
||||
|
||||
default: {
|
||||
default:
|
||||
logLocal("handleConversationChanged - Unhandled type", { type });
|
||||
client.cache.modify({
|
||||
id: client.cache.identify({ __typename: "conversations", id: conversationId }),
|
||||
fields: Object.fromEntries(
|
||||
Object.entries(fields).map(([key, value]) => [key, (cached) => (value !== undefined ? value : cached)])
|
||||
)
|
||||
fields: {
|
||||
...Object.fromEntries(
|
||||
Object.entries(fields).map(([key, value]) => [key, (cached) => (value !== undefined ? value : cached)])
|
||||
)
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error handling conversation changes:", { type, error });
|
||||
}
|
||||
};
|
||||
|
||||
// Existing handler for phone number opt-out
|
||||
const handlePhoneNumberOptedOut = async (data) => {
|
||||
const { bodyshopid, phone_number } = data;
|
||||
logLocal("handlePhoneNumberOptedOut - Start", data);
|
||||
@@ -579,18 +461,22 @@ export const registerMessagingHandlers = ({ socket, client, currentUser, bodysho
|
||||
id: "ROOT_QUERY",
|
||||
fields: {
|
||||
phone_number_opt_out(existing = [], { readField }) {
|
||||
const exists = existing.some(
|
||||
const phoneNumberExists = existing.some(
|
||||
(ref) => readField("phone_number", ref) === phone_number && readField("bodyshopid", ref) === bodyshopid
|
||||
);
|
||||
if (exists) return existing;
|
||||
|
||||
if (phoneNumberExists) {
|
||||
logLocal("handlePhoneNumberOptedOut - Phone number already in cache", { phone_number, bodyshopid });
|
||||
return existing;
|
||||
}
|
||||
|
||||
const newOptOut = {
|
||||
__typename: "phone_number_opt_out",
|
||||
id: `temporary-${phone_number}-${Date.now()}`,
|
||||
bodyshopid,
|
||||
phone_number,
|
||||
created_at: safeIsoNow(),
|
||||
updated_at: safeIsoNow()
|
||||
created_at: new Date().toISOString(),
|
||||
updated_at: new Date().toISOString()
|
||||
};
|
||||
|
||||
return [...existing, newOptOut];
|
||||
@@ -605,36 +491,46 @@ export const registerMessagingHandlers = ({ socket, client, currentUser, bodysho
|
||||
args: { bodyshopid, search: phone_number }
|
||||
});
|
||||
client.cache.gc();
|
||||
|
||||
logLocal("handlePhoneNumberOptedOut - Cache updated successfully", data);
|
||||
} catch (error) {
|
||||
console.error("Error updating cache for phone number opt-out:", error);
|
||||
logLocal("handlePhoneNumberOptedOut - Error", { error: error.message });
|
||||
}
|
||||
};
|
||||
|
||||
// New handler for phone number opt-in
|
||||
const handlePhoneNumberOptedIn = async (data) => {
|
||||
const { bodyshopid, phone_number } = data;
|
||||
logLocal("handlePhoneNumberOptedIn - Start", data);
|
||||
|
||||
try {
|
||||
// Update the Apollo cache for GET_PHONE_NUMBER_OPT_OUTS by removing the phone number
|
||||
client.cache.modify({
|
||||
id: "ROOT_QUERY",
|
||||
fields: {
|
||||
phone_number_opt_out(existing = [], { readField }) {
|
||||
// Filter out the phone number from the opt-out list
|
||||
return existing.filter(
|
||||
(ref) => !(readField("phone_number", ref) === phone_number && readField("bodyshopid", ref) === bodyshopid)
|
||||
);
|
||||
}
|
||||
},
|
||||
broadcast: true
|
||||
broadcast: true // Trigger UI updates
|
||||
});
|
||||
|
||||
// Evict the cache entry to force a refetch on next query
|
||||
client.cache.evict({
|
||||
id: "ROOT_QUERY",
|
||||
fieldName: "phone_number_opt_out",
|
||||
args: { bodyshopid, search: phone_number }
|
||||
});
|
||||
client.cache.gc();
|
||||
|
||||
logLocal("handlePhoneNumberOptedIn - Cache updated successfully", data);
|
||||
} catch (error) {
|
||||
console.error("Error updating cache for phone number opt-in:", error);
|
||||
logLocal("handlePhoneNumberOptedIn - Error", { error: error.message });
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@@ -12,7 +12,7 @@ import _ from "lodash";
|
||||
import { ExclamationCircleOutlined } from "@ant-design/icons";
|
||||
import "./chat-conversation-list.styles.scss";
|
||||
import { useQuery } from "@apollo/client";
|
||||
import { GET_PHONE_NUMBER_OPT_OUTS_BY_NUMBERS } from "../../graphql/phone-number-opt-out.queries.js";
|
||||
import { GET_PHONE_NUMBER_OPT_OUTS } from "../../graphql/phone-number-opt-out.queries.js";
|
||||
import { phone } from "phone";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { selectBodyshop } from "../../redux/user/user.selectors";
|
||||
@@ -29,26 +29,13 @@ const mapDispatchToProps = (dispatch) => ({
|
||||
function ChatConversationListComponent({ conversationList, selectedConversation, setSelectedConversation, bodyshop }) {
|
||||
const { t } = useTranslation();
|
||||
const [, forceUpdate] = useState(false);
|
||||
|
||||
const phoneNumbers = useMemo(() => {
|
||||
return (conversationList || [])
|
||||
.map((item) => {
|
||||
try {
|
||||
const p = phone(item.phone_num, "CA")?.phoneNumber;
|
||||
return p ? p.replace(/^\+1/, "") : null;
|
||||
} catch {
|
||||
return null;
|
||||
}
|
||||
})
|
||||
.filter(Boolean);
|
||||
}, [conversationList]);
|
||||
|
||||
const { data: optOutData } = useQuery(GET_PHONE_NUMBER_OPT_OUTS_BY_NUMBERS, {
|
||||
const phoneNumbers = conversationList.map((item) => phone(item.phone_num, "CA").phoneNumber.replace(/^\+1/, ""));
|
||||
const { data: optOutData } = useQuery(GET_PHONE_NUMBER_OPT_OUTS, {
|
||||
variables: {
|
||||
bodyshopid: bodyshop?.id,
|
||||
bodyshopid: bodyshop.id,
|
||||
phone_numbers: phoneNumbers
|
||||
},
|
||||
skip: !bodyshop?.id || phoneNumbers.length === 0,
|
||||
skip: !conversationList.length,
|
||||
fetchPolicy: "cache-and-network"
|
||||
});
|
||||
|
||||
@@ -71,25 +58,15 @@ function ChatConversationListComponent({ conversationList, selectedConversation,
|
||||
return _.orderBy(conversationList, ["updated_at"], ["desc"]);
|
||||
}, [conversationList]);
|
||||
|
||||
const renderConversation = (index) => {
|
||||
const renderConversation = (index, t) => {
|
||||
const item = sortedConversationList[index];
|
||||
|
||||
const normalizedPhone = (() => {
|
||||
try {
|
||||
return phone(item.phone_num, "CA")?.phoneNumber?.replace(/^\+1/, "") || "";
|
||||
} catch {
|
||||
return "";
|
||||
}
|
||||
})();
|
||||
|
||||
const hasOptOutEntry = normalizedPhone ? optOutMap.has(normalizedPhone) : false;
|
||||
|
||||
const normalizedPhone = phone(item.phone_num, "CA").phoneNumber.replace(/^\+1/, "");
|
||||
const hasOptOutEntry = optOutMap.has(normalizedPhone);
|
||||
const cardContentRight = <TimeAgoFormatter>{item.updated_at}</TimeAgoFormatter>;
|
||||
const cardContentLeft =
|
||||
item.job_conversations.length > 0
|
||||
? item.job_conversations.map((j, idx) => <Tag key={idx}>{j.job.ro_number}</Tag>)
|
||||
: null;
|
||||
|
||||
const names = <>{_.uniq(item.job_conversations.map((j) => OwnerNameDisplayFunction(j.job)))}</>;
|
||||
const cardTitle = (
|
||||
<>
|
||||
@@ -103,10 +80,9 @@ function ChatConversationListComponent({ conversationList, selectedConversation,
|
||||
)}
|
||||
</>
|
||||
);
|
||||
|
||||
const cardExtra = (
|
||||
<>
|
||||
<Badge count={item.messages_aggregate?.aggregate?.count || 0} />
|
||||
<Badge count={item.messages_aggregate.aggregate.count} />
|
||||
{hasOptOutEntry && (
|
||||
<Tooltip title={t("consent.text_body")}>
|
||||
<Tag color="red" icon={<ExclamationCircleOutlined />}>
|
||||
@@ -116,7 +92,6 @@ function ChatConversationListComponent({ conversationList, selectedConversation,
|
||||
)}
|
||||
</>
|
||||
);
|
||||
|
||||
const getCardStyle = () =>
|
||||
item.id === selectedConversation
|
||||
? { backgroundColor: "var(--card-selected-bg)" }
|
||||
@@ -129,8 +104,24 @@ function ChatConversationListComponent({ conversationList, selectedConversation,
|
||||
className={`chat-list-item ${item.id === selectedConversation ? "chat-list-selected-conversation" : ""}`}
|
||||
>
|
||||
<Card style={getCardStyle()} variant={true} size="small" extra={cardExtra} title={cardTitle}>
|
||||
<div style={{ display: "inline-block", width: "70%", textAlign: "left" }}>{cardContentLeft}</div>
|
||||
<div style={{ display: "inline-block", width: "30%", textAlign: "right" }}>{cardContentRight}</div>
|
||||
<div
|
||||
style={{
|
||||
display: "inline-block",
|
||||
width: "70%",
|
||||
textAlign: "left"
|
||||
}}
|
||||
>
|
||||
{cardContentLeft}
|
||||
</div>
|
||||
<div
|
||||
style={{
|
||||
display: "inline-block",
|
||||
width: "30%",
|
||||
textAlign: "right"
|
||||
}}
|
||||
>
|
||||
{cardContentRight}
|
||||
</div>
|
||||
</Card>
|
||||
</List.Item>
|
||||
);
|
||||
@@ -140,7 +131,7 @@ function ChatConversationListComponent({ conversationList, selectedConversation,
|
||||
<div className="chat-list-container">
|
||||
<Virtuoso
|
||||
data={sortedConversationList}
|
||||
itemContent={(index) => renderConversation(index)}
|
||||
itemContent={(index) => renderConversation(index, t)}
|
||||
style={{ height: "100%", width: "100%" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -5,24 +5,24 @@ import ChatConversationTitleTags from "../chat-conversation-title-tags/chat-conv
|
||||
import ChatLabelComponent from "../chat-label/chat-label.component";
|
||||
import ChatPrintButton from "../chat-print-button/chat-print-button.component";
|
||||
import ChatTagRoContainer from "../chat-tag-ro/chat-tag-ro.container";
|
||||
import ChatMarkUnreadButton from "../chat-mark-unread-button/chat-mark-unread-button.component";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { connect } from "react-redux";
|
||||
|
||||
export function ChatConversationTitle({ conversation, onMarkUnread, markUnreadDisabled, markUnreadLoading }) {
|
||||
const mapStateToProps = createStructuredSelector({});
|
||||
|
||||
const mapDispatchToProps = () => ({});
|
||||
|
||||
export function ChatConversationTitle({ conversation }) {
|
||||
return (
|
||||
<Space className="chat-title" wrap>
|
||||
<PhoneNumberFormatter>{conversation?.phone_num}</PhoneNumberFormatter>
|
||||
|
||||
<ChatLabelComponent conversation={conversation} />
|
||||
<ChatPrintButton conversation={conversation} />
|
||||
|
||||
<ChatConversationTitleTags jobConversations={conversation?.job_conversations || []} />
|
||||
<ChatTagRoContainer conversation={conversation || []} />
|
||||
|
||||
<ChatMarkUnreadButton disabled={markUnreadDisabled} loading={markUnreadLoading} onMarkUnread={onMarkUnread} />
|
||||
|
||||
<ChatArchiveButton conversation={conversation} />
|
||||
</Space>
|
||||
);
|
||||
}
|
||||
|
||||
export default ChatConversationTitle;
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(ChatConversationTitle);
|
||||
|
||||
@@ -19,9 +19,7 @@ export function ChatConversationComponent({
|
||||
conversation,
|
||||
messages,
|
||||
handleMarkConversationAsRead,
|
||||
handleMarkLastMessageAsUnread,
|
||||
markingAsUnreadInProgress,
|
||||
canMarkUnread
|
||||
bodyshop
|
||||
}) {
|
||||
const [loading, error] = subState;
|
||||
|
||||
@@ -35,12 +33,7 @@ export function ChatConversationComponent({
|
||||
onMouseDown={handleMarkConversationAsRead}
|
||||
onKeyDown={handleMarkConversationAsRead}
|
||||
>
|
||||
<ChatConversationTitle
|
||||
conversation={conversation}
|
||||
onMarkUnread={handleMarkLastMessageAsUnread}
|
||||
markUnreadDisabled={!canMarkUnread}
|
||||
markUnreadLoading={markingAsUnreadInProgress}
|
||||
/>
|
||||
<ChatConversationTitle conversation={conversation} bodyshop={bodyshop} />
|
||||
<ChatMessageListComponent messages={messages} />
|
||||
<ChatSendMessage conversation={conversation} />
|
||||
</div>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { gql, useApolloClient, useQuery, useSubscription } from "@apollo/client";
|
||||
import axios from "axios";
|
||||
import { useCallback, useEffect, useMemo, useState } from "react";
|
||||
import { useCallback, useEffect, useState } from "react";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { CONVERSATION_SUBSCRIPTION_BY_PK, GET_CONVERSATION_DETAILS } from "../../graphql/conversations.queries";
|
||||
@@ -18,8 +18,8 @@ function ChatConversationContainer({ bodyshop, selectedConversation }) {
|
||||
const client = useApolloClient();
|
||||
const { socket } = useSocket();
|
||||
const [markingAsReadInProgress, setMarkingAsReadInProgress] = useState(false);
|
||||
const [markingAsUnreadInProgress, setMarkingAsUnreadInProgress] = useState(false);
|
||||
|
||||
// Fetch conversation details
|
||||
const {
|
||||
loading: convoLoading,
|
||||
error: convoError,
|
||||
@@ -27,23 +27,24 @@ function ChatConversationContainer({ bodyshop, selectedConversation }) {
|
||||
} = useQuery(GET_CONVERSATION_DETAILS, {
|
||||
variables: { conversationId: selectedConversation },
|
||||
fetchPolicy: "network-only",
|
||||
nextFetchPolicy: "network-only",
|
||||
skip: !selectedConversation
|
||||
nextFetchPolicy: "network-only"
|
||||
});
|
||||
|
||||
const conversation = convoData?.conversations_by_pk;
|
||||
|
||||
// Subscription for conversation updates (used when socket is NOT connected)
|
||||
// Subscription for conversation updates
|
||||
useSubscription(CONVERSATION_SUBSCRIPTION_BY_PK, {
|
||||
skip: socket?.connected || !selectedConversation,
|
||||
skip: socket?.connected,
|
||||
variables: { conversationId: selectedConversation },
|
||||
onData: ({ data: subscriptionResult, client }) => {
|
||||
// Extract the messages array from the result
|
||||
const messages = subscriptionResult?.data?.messages;
|
||||
if (!messages || messages.length === 0) return;
|
||||
if (!messages || messages.length === 0) {
|
||||
console.warn("No messages found in subscription result.");
|
||||
return;
|
||||
}
|
||||
|
||||
messages.forEach((message) => {
|
||||
const messageRef = client.cache.identify(message);
|
||||
|
||||
// Write the new message to the cache
|
||||
client.cache.writeFragment({
|
||||
id: messageRef,
|
||||
fragment: gql`
|
||||
@@ -63,6 +64,7 @@ function ChatConversationContainer({ bodyshop, selectedConversation }) {
|
||||
data: message
|
||||
});
|
||||
|
||||
// Update the conversation cache to include the new message
|
||||
client.cache.modify({
|
||||
id: client.cache.identify({ __typename: "conversations", id: selectedConversation }),
|
||||
fields: {
|
||||
@@ -80,28 +82,6 @@ function ChatConversationContainer({ bodyshop, selectedConversation }) {
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* Best-effort badge update:
|
||||
* This assumes your list query uses messages_aggregate.aggregate.count as UNREAD inbound count.
|
||||
* If it’s total messages, rename/create a dedicated unread aggregate in the list query and update that field instead.
|
||||
*/
|
||||
const setConversationUnreadCountBestEffort = useCallback(
|
||||
(conversationId, unreadCount) => {
|
||||
if (!conversationId) return;
|
||||
|
||||
client.cache.modify({
|
||||
id: client.cache.identify({ __typename: "conversations", id: conversationId }),
|
||||
fields: {
|
||||
messages_aggregate(existing) {
|
||||
if (!existing?.aggregate) return existing;
|
||||
return { ...existing, aggregate: { ...existing.aggregate, count: unreadCount } };
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
[client.cache]
|
||||
);
|
||||
|
||||
const updateCacheWithReadMessages = useCallback(
|
||||
(conversationId, messageIds) => {
|
||||
if (!conversationId || !messageIds?.length) return;
|
||||
@@ -109,34 +89,13 @@ function ChatConversationContainer({ bodyshop, selectedConversation }) {
|
||||
messageIds.forEach((messageId) => {
|
||||
client.cache.modify({
|
||||
id: client.cache.identify({ __typename: "messages", id: messageId }),
|
||||
fields: { read: () => true }
|
||||
fields: {
|
||||
read: () => true
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
setConversationUnreadCountBestEffort(conversationId, 0);
|
||||
},
|
||||
[client.cache, setConversationUnreadCountBestEffort]
|
||||
);
|
||||
|
||||
const applyUnreadStateWithMaxOneUnread = useCallback(
|
||||
({ conversationId, lastUnreadMessageId, messageIdsMarkedRead = [], unreadCount = 1 }) => {
|
||||
if (!conversationId || !lastUnreadMessageId) return;
|
||||
|
||||
messageIdsMarkedRead.forEach((id) => {
|
||||
client.cache.modify({
|
||||
id: client.cache.identify({ __typename: "messages", id }),
|
||||
fields: { read: () => true }
|
||||
});
|
||||
});
|
||||
|
||||
client.cache.modify({
|
||||
id: client.cache.identify({ __typename: "messages", id: lastUnreadMessageId }),
|
||||
fields: { read: () => false }
|
||||
});
|
||||
|
||||
setConversationUnreadCountBestEffort(conversationId, unreadCount);
|
||||
},
|
||||
[client.cache, setConversationUnreadCountBestEffort]
|
||||
[client.cache]
|
||||
);
|
||||
|
||||
// WebSocket event handlers
|
||||
@@ -144,25 +103,20 @@ function ChatConversationContainer({ bodyshop, selectedConversation }) {
|
||||
if (!socket?.connected) return;
|
||||
|
||||
const handleConversationChange = (data) => {
|
||||
if (data?.type === "conversation-marked-read") {
|
||||
updateCacheWithReadMessages(data.conversationId, data.messageIds);
|
||||
}
|
||||
|
||||
if (data?.type === "conversation-marked-unread") {
|
||||
applyUnreadStateWithMaxOneUnread({
|
||||
conversationId: data.conversationId,
|
||||
lastUnreadMessageId: data.lastUnreadMessageId,
|
||||
messageIdsMarkedRead: data.messageIdsMarkedRead,
|
||||
unreadCount: data.unreadCount
|
||||
});
|
||||
if (data.type === "conversation-marked-read") {
|
||||
const { conversationId, messageIds } = data;
|
||||
updateCacheWithReadMessages(conversationId, messageIds);
|
||||
}
|
||||
};
|
||||
|
||||
socket.on("conversation-changed", handleConversationChange);
|
||||
return () => socket.off("conversation-changed", handleConversationChange);
|
||||
}, [socket, updateCacheWithReadMessages, applyUnreadStateWithMaxOneUnread]);
|
||||
|
||||
// Join/leave conversation via WebSocket
|
||||
return () => {
|
||||
socket.off("conversation-changed", handleConversationChange);
|
||||
};
|
||||
}, [socket, updateCacheWithReadMessages]);
|
||||
|
||||
// Join and leave conversation via WebSocket
|
||||
useEffect(() => {
|
||||
if (!socket?.connected || !selectedConversation || !bodyshop?.id) return;
|
||||
|
||||
@@ -179,21 +133,15 @@ function ChatConversationContainer({ bodyshop, selectedConversation }) {
|
||||
};
|
||||
}, [socket, bodyshop, selectedConversation]);
|
||||
|
||||
const inboundNonSystemMessages = useMemo(() => {
|
||||
const msgs = conversation?.messages || [];
|
||||
return msgs
|
||||
.filter((m) => m && !m.isoutbound && !m.is_system)
|
||||
.slice()
|
||||
.sort((a, b) => new Date(a.created_at).getTime() - new Date(b.created_at).getTime());
|
||||
}, [conversation?.messages]);
|
||||
|
||||
const canMarkUnread = inboundNonSystemMessages.length > 0;
|
||||
|
||||
// Mark conversation as read
|
||||
const handleMarkConversationAsRead = async () => {
|
||||
if (!conversation || markingAsReadInProgress) return;
|
||||
if (!convoData || markingAsReadInProgress) return;
|
||||
|
||||
const conversation = convoData.conversations_by_pk;
|
||||
if (!conversation) return;
|
||||
|
||||
const unreadMessageIds = conversation.messages
|
||||
?.filter((message) => !message.read && !message.isoutbound && !message.is_system)
|
||||
?.filter((message) => !message.read && !message.isoutbound)
|
||||
.map((message) => message.id);
|
||||
|
||||
if (unreadMessageIds?.length > 0) {
|
||||
@@ -214,48 +162,12 @@ function ChatConversationContainer({ bodyshop, selectedConversation }) {
|
||||
}
|
||||
};
|
||||
|
||||
const handleMarkLastMessageAsUnread = async () => {
|
||||
if (!conversation || markingAsUnreadInProgress) return;
|
||||
if (!bodyshop?.id || !bodyshop?.imexshopid) return;
|
||||
|
||||
const lastInbound = inboundNonSystemMessages[inboundNonSystemMessages.length - 1];
|
||||
if (!lastInbound?.id) return;
|
||||
|
||||
setMarkingAsUnreadInProgress(true);
|
||||
try {
|
||||
const res = await axios.post("/sms/markLastMessageUnread", {
|
||||
conversationId: conversation.id,
|
||||
imexshopid: bodyshop.imexshopid,
|
||||
bodyshopid: bodyshop.id
|
||||
});
|
||||
|
||||
const payload = res?.data || {};
|
||||
if (payload.lastUnreadMessageId) {
|
||||
applyUnreadStateWithMaxOneUnread({
|
||||
conversationId: conversation.id,
|
||||
lastUnreadMessageId: payload.lastUnreadMessageId,
|
||||
messageIdsMarkedRead: payload.messageIdsMarkedRead || [],
|
||||
unreadCount: typeof payload.unreadCount === "number" ? payload.unreadCount : 1
|
||||
});
|
||||
} else {
|
||||
setConversationUnreadCountBestEffort(conversation.id, 0);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error marking last message unread:", error.message);
|
||||
} finally {
|
||||
setMarkingAsUnreadInProgress(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<ChatConversationComponent
|
||||
subState={[convoLoading, convoError]}
|
||||
conversation={conversation || {}}
|
||||
messages={conversation?.messages || []}
|
||||
conversation={convoData?.conversations_by_pk || {}}
|
||||
messages={convoData?.conversations_by_pk?.messages || []}
|
||||
handleMarkConversationAsRead={handleMarkConversationAsRead}
|
||||
handleMarkLastMessageAsUnread={handleMarkLastMessageAsUnread}
|
||||
markingAsUnreadInProgress={markingAsUnreadInProgress}
|
||||
canMarkUnread={canMarkUnread}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,24 +0,0 @@
|
||||
import { Button, Tooltip } from "antd";
|
||||
import { useTranslation } from "react-i18next";
|
||||
|
||||
export default function ChatMarkUnreadButton({ disabled, loading, onMarkUnread }) {
|
||||
const { t } = useTranslation();
|
||||
|
||||
return (
|
||||
<Tooltip title={t("messaging.labels.mark_unread")}>
|
||||
<Button
|
||||
size="small"
|
||||
className="unread-button"
|
||||
type="primary"
|
||||
children={t("messaging.labels.mark_unread")}
|
||||
loading={loading}
|
||||
disabled={disabled}
|
||||
onMouseDown={(e) => e.stopPropagation()} // prevent parent mark-read handler
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
onMarkUnread?.();
|
||||
}}
|
||||
/>
|
||||
</Tooltip>
|
||||
);
|
||||
}
|
||||
@@ -10,11 +10,6 @@
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.unread-button {
|
||||
height: 20px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.chat-title {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
@@ -19,35 +19,30 @@ const mapDispatchToProps = (dispatch) => ({
|
||||
openChatByPhone: (phone) => dispatch(openChatByPhone(phone))
|
||||
});
|
||||
|
||||
export function ChatOpenButton({ bodyshop, searchingForConversation, phone, type, jobid, openChatByPhone }) {
|
||||
export function ChatOpenButton({ bodyshop, searchingForConversation, phone, jobid, openChatByPhone }) {
|
||||
const { t } = useTranslation();
|
||||
const { socket } = useSocket();
|
||||
const notification = useNotification();
|
||||
|
||||
if (!phone) return <></>;
|
||||
|
||||
if (!bodyshop.messagingservicesid) {
|
||||
return <PhoneNumberFormatter type={type}>{phone}</PhoneNumberFormatter>;
|
||||
}
|
||||
if (!bodyshop.messagingservicesid) return <PhoneNumberFormatter>{phone}</PhoneNumberFormatter>;
|
||||
|
||||
return (
|
||||
<a
|
||||
href="# "
|
||||
onClick={(e) => {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
|
||||
if (searchingForConversation) return; // Prevent finding the same thing twice.
|
||||
|
||||
const p = parsePhoneNumber(phone, "CA");
|
||||
if (searchingForConversation) return; //This is to prevent finding the same thing twice.
|
||||
if (p && p.isValid()) {
|
||||
openChatByPhone({ phone_num: p.formatInternational(), jobid, socket });
|
||||
openChatByPhone({ phone_num: p.formatInternational(), jobid: jobid, socket });
|
||||
} else {
|
||||
notification["error"]({ message: t("messaging.error.invalidphone") });
|
||||
}
|
||||
}}
|
||||
>
|
||||
<PhoneNumberFormatter type={type}>{phone}</PhoneNumberFormatter>
|
||||
<PhoneNumberFormatter>{phone}</PhoneNumberFormatter>
|
||||
</a>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -133,9 +133,6 @@ export function ContractConvertToRo({ bodyshop, currentUser, contract, disabled
|
||||
ownr_ln: contract.job.owner.ownr_ln,
|
||||
ownr_co_nm: contract.job.owner.ownr_co_nm,
|
||||
ownr_ph1: contract.job.owner.ownr_ph1,
|
||||
ownr_ph2: contract.job.owner.ownr_ph2,
|
||||
ownr_ph1_ty: contract.job.owner.ownr_ph1_ty,
|
||||
ownr_ph2_ty: contract.job.owner.ownr_ph2_ty,
|
||||
ownr_ea: contract.job.owner.ownr_ea,
|
||||
v_model_desc: contract.job.vehicle && contract.job.vehicle.v_model_desc,
|
||||
v_model_yr: contract.job.vehicle && contract.job.vehicle.v_model_yr,
|
||||
@@ -256,10 +253,6 @@ export function ContractConvertToRo({ bodyshop, currentUser, contract, disabled
|
||||
}
|
||||
};
|
||||
|
||||
if (currentUser?.email) {
|
||||
newJob.created_user_email = currentUser.email;
|
||||
}
|
||||
|
||||
//Calcualte the new job totals.
|
||||
|
||||
const newTotals = (
|
||||
|
||||
@@ -142,37 +142,17 @@ export default function JobLifecycleDashboardComponent({ data, bodyshop, ...card
|
||||
title={t("job_lifecycle.content.legend_title")}
|
||||
style={{ marginTop: "10px" }}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
flexWrap: "wrap",
|
||||
gap: 8
|
||||
}}
|
||||
>
|
||||
<div>
|
||||
{lifecycleData.summations.map((key) => (
|
||||
<Tag
|
||||
key={key.status}
|
||||
color={key.color}
|
||||
style={{
|
||||
// IMPORTANT: let the tag grow with its content
|
||||
width: "auto",
|
||||
padding: 0,
|
||||
margin: 0,
|
||||
display: "inline-flex",
|
||||
alignItems: "center",
|
||||
justifyContent: "center",
|
||||
boxSizing: "border-box"
|
||||
}}
|
||||
>
|
||||
<Tag key={key.status} color={key.color} style={{ width: "13vh", padding: "4px", margin: "4px" }}>
|
||||
<div
|
||||
aria-label={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`}
|
||||
title={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`}
|
||||
style={{
|
||||
backgroundColor: "var(--tag-wrapper-bg)",
|
||||
color: "var(--tag-wrapper-text)",
|
||||
padding: "4px 8px",
|
||||
textAlign: "center",
|
||||
whiteSpace: "nowrap" // keep it on one line while letting the pill expand
|
||||
padding: "4px",
|
||||
textAlign: "center"
|
||||
}}
|
||||
>
|
||||
{key.status} [{lifecycleData.statusCounts[key.status]}] ({key.roundedPercentage})
|
||||
|
||||
@@ -256,9 +256,9 @@ export default function DashboardScheduledDeliveryToday({ data, ...cardProps })
|
||||
responsive: ["md"],
|
||||
render: (text, record) => (
|
||||
<Space size="small" wrap>
|
||||
<ChatOpenButton type={record.ownr_ph1_ty} phone={record.ownr_ph1} jobid={record.jobid} />
|
||||
<ChatOpenButton phone={record.ownr_ph1} jobid={record.jobid} />
|
||||
|
||||
<ChatOpenButton type={record.ownr_ph2_ty} phone={record.ownr_ph2} jobid={record.jobid} />
|
||||
<ChatOpenButton phone={record.ownr_ph2} jobid={record.jobid} />
|
||||
</Space>
|
||||
)
|
||||
},
|
||||
@@ -397,8 +397,6 @@ export const DashboardScheduledDeliveryTodayGql = `
|
||||
ownr_ln
|
||||
ownr_ph1
|
||||
ownr_ph2
|
||||
ownr_ph1_ty
|
||||
ownr_ph2_ty
|
||||
production_vars
|
||||
ro_number
|
||||
scheduled_delivery
|
||||
|
||||
@@ -48,8 +48,6 @@ export default function DashboardScheduledInToday({ data, ...cardProps }) {
|
||||
ownr_ln: item.job.ownr_ln,
|
||||
ownr_ph1: item.job.ownr_ph1,
|
||||
ownr_ph2: item.job.ownr_ph2,
|
||||
ownr_ph1_ty: item.job.ownr_ph1_ty,
|
||||
ownr_ph2_ty: item.job.ownr_ph2_ty,
|
||||
production_vars: item.job.production_vars,
|
||||
ro_number: item.job.ro_number,
|
||||
suspended: item.job.suspended,
|
||||
@@ -266,8 +264,8 @@ export default function DashboardScheduledInToday({ data, ...cardProps }) {
|
||||
responsive: ["md"],
|
||||
render: (text, record) => (
|
||||
<Space size="small" wrap>
|
||||
<ChatOpenButton type={record.ownr_ph1_ty} phone={record.ownr_ph1} jobid={record.jobid} />
|
||||
<ChatOpenButton type={record.ownr_ph2_ty} phone={record.ownr_ph2} jobid={record.jobid} />
|
||||
<ChatOpenButton phone={record.ownr_ph1} jobid={record.jobid} />
|
||||
<ChatOpenButton phone={record.ownr_ph2} jobid={record.jobid} />
|
||||
</Space>
|
||||
)
|
||||
},
|
||||
@@ -402,8 +400,6 @@ export const DashboardScheduledInTodayGql = `
|
||||
ownr_ln
|
||||
ownr_ph1
|
||||
ownr_ph2
|
||||
ownr_ph1_ty
|
||||
ownr_ph2_ty
|
||||
production_vars
|
||||
ro_number
|
||||
suspended
|
||||
|
||||
@@ -256,9 +256,9 @@ export default function DashboardScheduledOutToday({ data, ...cardProps }) {
|
||||
responsive: ["md"],
|
||||
render: (text, record) => (
|
||||
<Space size="small" wrap>
|
||||
<ChatOpenButton type={record.ownr_ph1_ty} phone={record.ownr_ph1} jobid={record.jobid} />
|
||||
<ChatOpenButton phone={record.ownr_ph1} jobid={record.jobid} />
|
||||
|
||||
<ChatOpenButton type={record.ownr_ph2_ty} phone={record.ownr_ph2} jobid={record.jobid} />
|
||||
<ChatOpenButton phone={record.ownr_ph2} jobid={record.jobid} />
|
||||
</Space>
|
||||
)
|
||||
},
|
||||
@@ -397,8 +397,6 @@ export const DashboardScheduledOutTodayGql = `
|
||||
ownr_ln
|
||||
ownr_ph1
|
||||
ownr_ph2
|
||||
ownr_ph1_ty
|
||||
ownr_ph2_ty
|
||||
production_vars
|
||||
ro_number
|
||||
scheduled_completion
|
||||
|
||||
@@ -55,7 +55,7 @@ export function DmsAllocationsSummaryAp({ socket, bodyshop, billids, title }) {
|
||||
});
|
||||
}
|
||||
}, [socket, socket.connected, billids]);
|
||||
console.log(allocationsSummary);
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: t("general.labels.status"),
|
||||
@@ -122,7 +122,7 @@ export function DmsAllocationsSummaryAp({ socket, bodyshop, billids, title }) {
|
||||
<Form.Item
|
||||
name="journal"
|
||||
label={t("jobs.fields.dms.journal")}
|
||||
initialValue={bodyshop.cdk_configuration && bodyshop.cdk_configuration.default_journal}
|
||||
initialValue={bodyshop.cdk_configuration?.default_journal}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
|
||||
@@ -1,72 +1,97 @@
|
||||
import { Alert, Button, Card, Table, Typography } from "antd";
|
||||
import { useEffect, useState } from "react";
|
||||
import { SyncOutlined } from "@ant-design/icons";
|
||||
import { useCallback, useEffect, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { selectBodyshop } from "../../redux/user/user.selectors";
|
||||
import Dinero from "dinero.js";
|
||||
import { SyncOutlined } from "@ant-design/icons";
|
||||
import { DMS_MAP } from "../../utils/dmsUtils";
|
||||
|
||||
import { selectBodyshop } from "../../redux/user/user.selectors";
|
||||
import { pageLimit } from "../../utils/config";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
//currentUser: selectCurrentUser
|
||||
bodyshop: selectBodyshop
|
||||
});
|
||||
|
||||
const mapDispatchToProps = () => ({
|
||||
//setUserLanguage: language => dispatch(setUserLanguage(language))
|
||||
});
|
||||
const mapDispatchToProps = () => ({});
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(DmsAllocationsSummary);
|
||||
|
||||
export function DmsAllocationsSummary({ socket, bodyshop, jobId, title }) {
|
||||
/**
|
||||
* DMS Allocations Summary component
|
||||
* @param mode
|
||||
* @param socket
|
||||
* @param bodyshop
|
||||
* @param jobId
|
||||
* @param title
|
||||
* @returns {JSX.Element}
|
||||
* @constructor
|
||||
*/
|
||||
export function DmsAllocationsSummary({ mode, socket, bodyshop, jobId, title }) {
|
||||
const { t } = useTranslation();
|
||||
const [allocationsSummary, setAllocationsSummary] = useState([]);
|
||||
|
||||
useEffect(() => {
|
||||
if (socket.connected) {
|
||||
socket.emit("cdk-calculate-allocations", jobId, (ack) => {
|
||||
setAllocationsSummary(ack);
|
||||
socket.allocationsSummary = ack;
|
||||
// Resolve event name by mode (PBS reuses the CDK event per existing behavior)
|
||||
const allocationsEvent =
|
||||
mode === DMS_MAP.reynolds
|
||||
? "rr-calculate-allocations"
|
||||
: mode === DMS_MAP.fortellis
|
||||
? "fortellis-calculate-allocations"
|
||||
: /* "cdk" | "pbs" (legacy) */ "cdk-calculate-allocations";
|
||||
|
||||
const fetchAllocations = useCallback(() => {
|
||||
if (!socket || !jobId || !mode) return;
|
||||
|
||||
try {
|
||||
socket.emit(allocationsEvent, jobId, (ack) => {
|
||||
const list = Array.isArray(ack) ? ack : [];
|
||||
setAllocationsSummary(list);
|
||||
// Preserve side-channel used by the post form for discrepancy checks
|
||||
socket.allocationsSummary = list;
|
||||
});
|
||||
} catch {
|
||||
// Best-effort; leave table empty on error
|
||||
setAllocationsSummary([]);
|
||||
socket && (socket.allocationsSummary = []);
|
||||
}
|
||||
}, [socket, socket.connected, jobId]);
|
||||
}, [socket, jobId, mode, allocationsEvent]);
|
||||
|
||||
// Initial + whenever mode/socket/jobId changes
|
||||
useEffect(() => {
|
||||
fetchAllocations();
|
||||
}, [fetchAllocations]);
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: t("jobs.fields.dms.center"),
|
||||
dataIndex: "center",
|
||||
key: "center"
|
||||
},
|
||||
{ title: t("jobs.fields.dms.center"), dataIndex: "center", key: "center" },
|
||||
{
|
||||
title: t("jobs.fields.dms.sale"),
|
||||
dataIndex: "sale",
|
||||
key: "sale",
|
||||
render: (text, record) => Dinero(record.sale).toFormat()
|
||||
render: (_text, record) => Dinero(record.sale).toFormat()
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.dms.cost"),
|
||||
dataIndex: "cost",
|
||||
key: "cost",
|
||||
render: (text, record) => Dinero(record.cost).toFormat()
|
||||
render: (_text, record) => Dinero(record.cost).toFormat()
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.dms.sale_dms_acctnumber"),
|
||||
dataIndex: "sale_dms_acctnumber",
|
||||
key: "sale_dms_acctnumber",
|
||||
render: (text, record) => record.profitCenter?.dms_acctnumber
|
||||
render: (_text, record) => record.profitCenter?.dms_acctnumber
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.dms.cost_dms_acctnumber"),
|
||||
dataIndex: "cost_dms_acctnumber",
|
||||
key: "cost_dms_acctnumber",
|
||||
render: (text, record) => record.costCenter?.dms_acctnumber
|
||||
render: (_text, record) => record.costCenter?.dms_acctnumber
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.dms.dms_wip_acctnumber"),
|
||||
dataIndex: "dms_wip_acctnumber",
|
||||
key: "dms_wip_acctnumber",
|
||||
render: (text, record) => record.costCenter?.dms_wip_acctnumber
|
||||
render: (_text, record) => record.costCenter?.dms_wip_acctnumber
|
||||
}
|
||||
];
|
||||
|
||||
@@ -74,11 +99,7 @@ export function DmsAllocationsSummary({ socket, bodyshop, jobId, title }) {
|
||||
<Card
|
||||
title={title}
|
||||
extra={
|
||||
<Button
|
||||
onClick={() => {
|
||||
socket.emit("cdk-calculate-allocations", jobId, (ack) => setAllocationsSummary(ack));
|
||||
}}
|
||||
>
|
||||
<Button onClick={fetchAllocations} aria-label={t("general.actions.refresh")}>
|
||||
<SyncOutlined />
|
||||
</Button>
|
||||
}
|
||||
@@ -86,6 +107,7 @@ export function DmsAllocationsSummary({ socket, bodyshop, jobId, title }) {
|
||||
{bodyshop.pbs_configuration?.disablebillwip && (
|
||||
<Alert type="warning" message={t("jobs.labels.dms.disablebillwip")} />
|
||||
)}
|
||||
|
||||
<Table
|
||||
pagination={{ position: "top", defaultPageSize: pageLimit }}
|
||||
columns={columns}
|
||||
@@ -94,34 +116,23 @@ export function DmsAllocationsSummary({ socket, bodyshop, jobId, title }) {
|
||||
locale={{ emptyText: t("dms.labels.refreshallocations") }}
|
||||
scroll={{ x: true }}
|
||||
summary={() => {
|
||||
const totals =
|
||||
allocationsSummary &&
|
||||
allocationsSummary.reduce(
|
||||
(acc, val) => {
|
||||
return {
|
||||
totalSale: acc.totalSale.add(Dinero(val.sale)),
|
||||
totalCost: acc.totalCost.add(Dinero(val.cost))
|
||||
};
|
||||
},
|
||||
{
|
||||
totalSale: Dinero(),
|
||||
totalCost: Dinero()
|
||||
}
|
||||
);
|
||||
const totals = allocationsSummary?.reduce(
|
||||
(acc, val) => ({
|
||||
totalSale: acc.totalSale.add(Dinero(val.sale)),
|
||||
totalCost: acc.totalCost.add(Dinero(val.cost))
|
||||
}),
|
||||
{ totalSale: Dinero(), totalCost: Dinero() }
|
||||
) || { totalSale: Dinero(), totalCost: Dinero() };
|
||||
|
||||
return (
|
||||
<Table.Summary.Row>
|
||||
<Table.Summary.Cell>
|
||||
<Typography.Title level={4}>{t("general.labels.totals")}</Typography.Title>
|
||||
</Table.Summary.Cell>
|
||||
<Table.Summary.Cell>{totals && totals.totalSale.toFormat()}</Table.Summary.Cell>
|
||||
<Table.Summary.Cell>
|
||||
{
|
||||
// totals.totalCost.toFormat()
|
||||
}
|
||||
</Table.Summary.Cell>
|
||||
<Table.Summary.Cell></Table.Summary.Cell>
|
||||
<Table.Summary.Cell></Table.Summary.Cell>
|
||||
<Table.Summary.Cell>{totals.totalSale.toFormat()}</Table.Summary.Cell>
|
||||
<Table.Summary.Cell />
|
||||
<Table.Summary.Cell />
|
||||
<Table.Summary.Cell />
|
||||
</Table.Summary.Row>
|
||||
);
|
||||
}}
|
||||
|
||||
@@ -5,6 +5,7 @@ import { useTranslation } from "react-i18next";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { selectBodyshop, selectCurrentUser } from "../../redux/user/user.selectors";
|
||||
import { useSplitTreatments } from "@splitsoftware/splitio-react";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
currentUser: selectCurrentUser,
|
||||
@@ -18,15 +19,26 @@ export default connect(mapStateToProps, mapDispatchToProps)(DmsCdkMakesRefetch);
|
||||
export function DmsCdkMakesRefetch({ currentUser, bodyshop }) {
|
||||
const [loading, setLoading] = useState(false);
|
||||
const { t } = useTranslation();
|
||||
const {
|
||||
treatments: { Fortellis }
|
||||
} = useSplitTreatments({
|
||||
attributes: {},
|
||||
names: ["Fortellis"],
|
||||
splitKey: bodyshop.imexshopid
|
||||
});
|
||||
|
||||
if (!currentUser.email.includes("@imex.")) return null;
|
||||
|
||||
const handleRefetch = async () => {
|
||||
setLoading(true);
|
||||
await axios.post("/cdk/getvehicles", {
|
||||
cdk_dealerid: bodyshop.cdk_dealerid,
|
||||
bodyshopid: bodyshop.id
|
||||
});
|
||||
try {
|
||||
setLoading(true);
|
||||
await axios.post(`cdk${Fortellis.treatment === "on" ? "/fortellis" : ""}/getvehicles`, {
|
||||
cdk_dealerid: bodyshop.cdk_dealerid,
|
||||
bodyshopid: bodyshop.id
|
||||
});
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
|
||||
setLoading(false);
|
||||
};
|
||||
|
||||
@@ -0,0 +1,102 @@
|
||||
import { Button, Checkbox, Col, Table } from "antd";
|
||||
import { useEffect, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { alphaSort } from "../../utils/sorters";
|
||||
|
||||
export default function CDKCustomerSelector({ bodyshop, socket }) {
|
||||
const { t } = useTranslation();
|
||||
const [open, setOpen] = useState(false);
|
||||
const [customerList, setCustomerList] = useState([]);
|
||||
const [selectedCustomer, setSelectedCustomer] = useState(null);
|
||||
|
||||
useEffect(() => {
|
||||
if (!socket) return;
|
||||
const handleCdkSelectCustomer = (list) => {
|
||||
setOpen(true);
|
||||
setCustomerList(Array.isArray(list) ? list : []);
|
||||
setSelectedCustomer(null);
|
||||
};
|
||||
socket.on("cdk-select-customer", handleCdkSelectCustomer);
|
||||
return () => {
|
||||
socket.off("cdk-select-customer", handleCdkSelectCustomer);
|
||||
};
|
||||
}, [socket]);
|
||||
|
||||
const onUseSelected = () => {
|
||||
if (!selectedCustomer) return;
|
||||
setOpen(false);
|
||||
socket.emit("cdk-selected-customer", selectedCustomer);
|
||||
setSelectedCustomer(null);
|
||||
};
|
||||
|
||||
const onUseGeneric = () => {
|
||||
const generic = bodyshop.cdk_configuration?.generic_customer_number || null;
|
||||
setOpen(false);
|
||||
socket.emit("cdk-selected-customer", generic);
|
||||
setSelectedCustomer(null);
|
||||
};
|
||||
|
||||
const onCreateNew = () => {
|
||||
setOpen(false);
|
||||
socket.emit("cdk-selected-customer", null);
|
||||
setSelectedCustomer(null);
|
||||
};
|
||||
|
||||
if (!open) return null;
|
||||
|
||||
const columns = [
|
||||
{ title: t("jobs.fields.dms.id"), dataIndex: ["id", "value"], key: "id" },
|
||||
{
|
||||
title: t("jobs.fields.dms.vinowner"),
|
||||
dataIndex: "vinOwner",
|
||||
key: "vinOwner",
|
||||
render: (_t, r) => <Checkbox disabled checked={r.vinOwner} />
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.dms.name1"),
|
||||
dataIndex: ["name1", "fullName"],
|
||||
key: "name1",
|
||||
sorter: (a, b) => alphaSort(a.name1?.fullName, b.name1?.fullName)
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.dms.address"),
|
||||
key: "address",
|
||||
render: (record) =>
|
||||
`${record.address?.addressLine && record.address.addressLine[0]}, ${record.address?.city} ${
|
||||
record.address?.stateOrProvince
|
||||
} ${record.address?.postalCode}`
|
||||
}
|
||||
];
|
||||
|
||||
const rowKey = (r) => r.id?.value || r.customerId;
|
||||
|
||||
return (
|
||||
<Col span={24}>
|
||||
<Table
|
||||
title={() => (
|
||||
<div style={{ display: "flex", gap: 8, flexWrap: "wrap" }}>
|
||||
<Button onClick={onUseSelected} disabled={!selectedCustomer}>
|
||||
{t("jobs.actions.dms.useselected")}
|
||||
</Button>
|
||||
<Button onClick={onUseGeneric} disabled={!bodyshop.cdk_configuration?.generic_customer_number}>
|
||||
{t("jobs.actions.dms.usegeneric")}
|
||||
</Button>
|
||||
<Button onClick={onCreateNew}>{t("jobs.actions.dms.createnewcustomer")}</Button>
|
||||
</div>
|
||||
)}
|
||||
pagination={{ position: "top" }}
|
||||
columns={columns}
|
||||
rowKey={rowKey}
|
||||
dataSource={customerList}
|
||||
rowSelection={{
|
||||
onSelect: (r) => {
|
||||
const key = r.id?.value || r.customerId;
|
||||
setSelectedCustomer(key ? String(key) : null);
|
||||
},
|
||||
type: "radio",
|
||||
selectedRowKeys: selectedCustomer ? [selectedCustomer] : []
|
||||
}}
|
||||
/>
|
||||
</Col>
|
||||
);
|
||||
}
|
||||
@@ -1,134 +1,54 @@
|
||||
import { Button, Checkbox, Col, Table } from "antd";
|
||||
import { useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useMemo } from "react";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { socket } from "../../pages/dms/dms.container";
|
||||
|
||||
import { selectBodyshop } from "../../redux/user/user.selectors";
|
||||
import { alphaSort } from "../../utils/sorters";
|
||||
|
||||
import RRCustomerSelector from "./rr-customer-selector";
|
||||
import FortellisCustomerSelector from "./fortellis-customer-selector";
|
||||
import CDKCustomerSelector from "./cdk-customer-selector";
|
||||
import PBSCustomerSelector from "./pbs-customer-selector";
|
||||
import { DMS_MAP } from "../../utils/dmsUtils";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
bodyshop: selectBodyshop
|
||||
});
|
||||
const mapDispatchToProps = () => ({
|
||||
//setUserLanguage: language => dispatch(setUserLanguage(language))
|
||||
});
|
||||
const mapDispatchToProps = () => ({});
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(DmsCustomerSelector);
|
||||
|
||||
export function DmsCustomerSelector({ bodyshop }) {
|
||||
const { t } = useTranslation();
|
||||
const [customerList, setcustomerList] = useState([]);
|
||||
const [open, setOpen] = useState(false);
|
||||
const [selectedCustomer, setSelectedCustomer] = useState(null);
|
||||
const [dmsType, setDmsType] = useState("cdk");
|
||||
/**
|
||||
* DMS Customer Selector component that renders the appropriate customer selector
|
||||
* @param props
|
||||
* @returns {JSX.Element|null}
|
||||
* @constructor
|
||||
*/
|
||||
export function DmsCustomerSelector(props) {
|
||||
const { bodyshop, jobid, socket, rrOptions = {} } = props;
|
||||
|
||||
socket.on("cdk-select-customer", (customerList) => {
|
||||
setOpen(true);
|
||||
setDmsType("cdk");
|
||||
setcustomerList(customerList);
|
||||
});
|
||||
socket.on("pbs-select-customer", (customerList) => {
|
||||
setOpen(true);
|
||||
setDmsType("pbs");
|
||||
setcustomerList(customerList);
|
||||
});
|
||||
// Centralized "mode" (provider + transport)
|
||||
const mode = props.mode;
|
||||
|
||||
const onUseSelected = () => {
|
||||
setOpen(false);
|
||||
socket.emit(`${dmsType}-selected-customer`, selectedCustomer);
|
||||
setSelectedCustomer(null);
|
||||
};
|
||||
// Stable base props for children
|
||||
const base = useMemo(() => ({ bodyshop, jobid, socket }), [bodyshop, jobid, socket]);
|
||||
|
||||
const onUseGeneric = () => {
|
||||
setOpen(false);
|
||||
socket.emit(`${dmsType}-selected-customer`, bodyshop.cdk_configuration.generic_customer_number);
|
||||
setSelectedCustomer(null);
|
||||
};
|
||||
|
||||
const onCreateNew = () => {
|
||||
setOpen(false);
|
||||
socket.emit(`${dmsType}-selected-customer`, null);
|
||||
setSelectedCustomer(null);
|
||||
};
|
||||
|
||||
const cdkColumns = [
|
||||
{
|
||||
title: t("jobs.fields.dms.id"),
|
||||
dataIndex: ["id", "value"],
|
||||
key: "id"
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.dms.vinowner"),
|
||||
dataIndex: "vinOwner",
|
||||
key: "vinOwner",
|
||||
render: (text, record) => <Checkbox disabled checked={record.vinOwner} />
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.dms.name1"),
|
||||
dataIndex: ["name1", "fullName"],
|
||||
key: "name1",
|
||||
sorter: (a, b) => alphaSort(a.name1?.fullName, b.name1?.fullName)
|
||||
},
|
||||
|
||||
{
|
||||
title: t("jobs.fields.dms.address"),
|
||||
//dataIndex: ["name2", "fullName"],
|
||||
key: "address",
|
||||
render: (record) =>
|
||||
`${record.address?.addressLine && record.address.addressLine[0]}, ${record.address?.city} ${
|
||||
record.address?.stateOrProvince
|
||||
} ${record.address?.postalCode}`
|
||||
switch (mode) {
|
||||
case DMS_MAP.reynolds: {
|
||||
// Map rrOptions to current RR prop shape (you can also just pass rrOptions through and unpack in RR)
|
||||
const rrProps = {
|
||||
rrOpenRoLimit: rrOptions.openRoLimit,
|
||||
onRrOpenRoFinished: rrOptions.onOpenRoFinished,
|
||||
rrValidationPending: rrOptions.validationPending,
|
||||
onValidationFinished: rrOptions.onValidationFinished
|
||||
};
|
||||
return <RRCustomerSelector {...base} {...rrProps} />;
|
||||
}
|
||||
];
|
||||
|
||||
const pbsColumns = [
|
||||
{
|
||||
title: t("jobs.fields.dms.id"),
|
||||
dataIndex: "ContactId",
|
||||
key: "ContactId"
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.dms.name1"),
|
||||
key: "name1",
|
||||
sorter: (a, b) => alphaSort(a.LastName, b.LastName),
|
||||
render: (text, record) => `${record.FirstName || ""} ${record.LastName || ""}`
|
||||
},
|
||||
|
||||
{
|
||||
title: t("jobs.fields.dms.address"),
|
||||
key: "address",
|
||||
render: (record) => `${record.Address}, ${record.City} ${record.State} ${record.ZipCode}`
|
||||
}
|
||||
];
|
||||
|
||||
if (!open) return null;
|
||||
return (
|
||||
<Col span={24}>
|
||||
<Table
|
||||
title={() => (
|
||||
<div>
|
||||
<Button onClick={onUseSelected} disabled={!selectedCustomer}>
|
||||
{t("jobs.actions.dms.useselected")}
|
||||
</Button>
|
||||
<Button onClick={onUseGeneric} disabled={!bodyshop.cdk_configuration?.generic_customer_number}>
|
||||
{t("jobs.actions.dms.usegeneric")}
|
||||
</Button>
|
||||
<Button onClick={onCreateNew}>{t("jobs.actions.dms.createnewcustomer")}</Button>
|
||||
</div>
|
||||
)}
|
||||
pagination={{ position: "top" }}
|
||||
columns={dmsType === "cdk" ? cdkColumns : pbsColumns}
|
||||
rowKey={(record) => (dmsType === "cdk" ? record.id.value : record.ContactId)}
|
||||
dataSource={customerList}
|
||||
//onChange={handleTableChange}
|
||||
rowSelection={{
|
||||
onSelect: (record) => {
|
||||
setSelectedCustomer(dmsType === "cdk" ? record.id.value : record.ContactId);
|
||||
},
|
||||
type: "radio",
|
||||
selectedRowKeys: [selectedCustomer]
|
||||
}}
|
||||
/>
|
||||
</Col>
|
||||
);
|
||||
case DMS_MAP.fortellis:
|
||||
return <FortellisCustomerSelector {...base} />;
|
||||
case DMS_MAP.cdk:
|
||||
return <CDKCustomerSelector {...base} />;
|
||||
case DMS_MAP.pbs:
|
||||
return <PBSCustomerSelector {...base} />;
|
||||
default:
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,105 @@
|
||||
import { Button, Checkbox, Col, Table } from "antd";
|
||||
import { useEffect, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { alphaSort } from "../../utils/sorters";
|
||||
|
||||
export default function FortellisCustomerSelector({ bodyshop, jobid, socket }) {
|
||||
const { t } = useTranslation();
|
||||
const [open, setOpen] = useState(false);
|
||||
const [customerList, setCustomerList] = useState([]);
|
||||
const [selectedCustomer, setSelectedCustomer] = useState(null);
|
||||
|
||||
useEffect(() => {
|
||||
if (!socket) return;
|
||||
const handleFortellisSelectCustomer = (list) => {
|
||||
setOpen(true);
|
||||
setCustomerList(Array.isArray(list) ? list : []);
|
||||
setSelectedCustomer(null);
|
||||
};
|
||||
socket.on("fortellis-select-customer", handleFortellisSelectCustomer);
|
||||
return () => {
|
||||
socket.off("fortellis-select-customer", handleFortellisSelectCustomer);
|
||||
};
|
||||
}, [socket]);
|
||||
|
||||
const onUseSelected = () => {
|
||||
if (!selectedCustomer) return;
|
||||
setOpen(false);
|
||||
socket.emit("fortellis-selected-customer", { selectedCustomerId: selectedCustomer, jobid });
|
||||
setSelectedCustomer(null);
|
||||
};
|
||||
|
||||
const onUseGeneric = () => {
|
||||
const generic = bodyshop.cdk_configuration?.generic_customer_number || null;
|
||||
setOpen(false);
|
||||
socket.emit("fortellis-selected-customer", { selectedCustomerId: generic, jobid });
|
||||
setSelectedCustomer(null);
|
||||
};
|
||||
|
||||
const onCreateNew = () => {
|
||||
setOpen(false);
|
||||
socket.emit("fortellis-selected-customer", { selectedCustomerId: null, jobid });
|
||||
setSelectedCustomer(null);
|
||||
};
|
||||
|
||||
if (!open) return null;
|
||||
|
||||
const columns = [
|
||||
{ title: t("jobs.fields.dms.id"), dataIndex: "customerId", key: "id" },
|
||||
{
|
||||
title: t("jobs.fields.dms.vinowner"),
|
||||
dataIndex: "vinOwner",
|
||||
key: "vinOwner",
|
||||
render: (_t, r) => <Checkbox disabled checked={r.vinOwner} />
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.dms.name1"),
|
||||
dataIndex: ["customerName", "firstName"],
|
||||
key: "firstName",
|
||||
sorter: (a, b) => alphaSort(a.customerName?.firstName, b.customerName?.firstName)
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.dms.name1"),
|
||||
dataIndex: ["customerName", "lastName"],
|
||||
key: "lastName",
|
||||
sorter: (a, b) => alphaSort(a.customerName?.lastName, b.customerName?.lastName)
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.dms.address"),
|
||||
key: "address",
|
||||
render: (record) =>
|
||||
`${record.postalAddress?.addressLine1 || ""}${
|
||||
record.postalAddress?.addressLine2 ? `, ${record.postalAddress.addressLine2}` : ""
|
||||
}, ${record.postalAddress?.city || ""} ${record.postalAddress?.state || ""} ${
|
||||
record.postalAddress?.postalCode || ""
|
||||
} ${record.postalAddress?.country || ""}`
|
||||
}
|
||||
];
|
||||
|
||||
return (
|
||||
<Col span={24}>
|
||||
<Table
|
||||
title={() => (
|
||||
<div style={{ display: "flex", gap: 8, flexWrap: "wrap" }}>
|
||||
<Button onClick={onUseSelected} disabled={!selectedCustomer}>
|
||||
{t("jobs.actions.dms.useselected")}
|
||||
</Button>
|
||||
<Button onClick={onUseGeneric} disabled={!bodyshop.cdk_configuration?.generic_customer_number}>
|
||||
{t("jobs.actions.dms.usegeneric")}
|
||||
</Button>
|
||||
<Button onClick={onCreateNew}>{t("jobs.actions.dms.createnewcustomer")}</Button>
|
||||
</div>
|
||||
)}
|
||||
pagination={{ position: "top" }}
|
||||
columns={columns}
|
||||
rowKey={(r) => r.customerId}
|
||||
dataSource={customerList}
|
||||
rowSelection={{
|
||||
onSelect: (r) => setSelectedCustomer(r?.customerId ? String(r.customerId) : null),
|
||||
type: "radio",
|
||||
selectedRowKeys: selectedCustomer ? [selectedCustomer] : []
|
||||
}}
|
||||
/>
|
||||
</Col>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,93 @@
|
||||
import { Button, Col, Table } from "antd";
|
||||
import { useEffect, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { alphaSort } from "../../utils/sorters";
|
||||
|
||||
export default function PBSCustomerSelector({ bodyshop, socket }) {
|
||||
const { t } = useTranslation();
|
||||
const [open, setOpen] = useState(false);
|
||||
const [customerList, setCustomerList] = useState([]);
|
||||
const [selectedCustomer, setSelectedCustomer] = useState(null);
|
||||
|
||||
useEffect(() => {
|
||||
if (!socket) return;
|
||||
const handlePbsSelectCustomer = (list) => {
|
||||
setOpen(true);
|
||||
setCustomerList(Array.isArray(list) ? list : []);
|
||||
setSelectedCustomer(null);
|
||||
};
|
||||
socket.on("pbs-select-customer", handlePbsSelectCustomer);
|
||||
return () => {
|
||||
socket.off("pbs-select-customer", handlePbsSelectCustomer);
|
||||
};
|
||||
}, [socket]);
|
||||
|
||||
const onUseSelected = () => {
|
||||
if (!selectedCustomer) return;
|
||||
setOpen(false);
|
||||
socket.emit("pbs-selected-customer", selectedCustomer);
|
||||
setSelectedCustomer(null);
|
||||
};
|
||||
|
||||
// Restores old behavior: reuse the CDK-named generic number for PBS too,
|
||||
// matching the previous single-component implementation.
|
||||
const onUseGeneric = () => {
|
||||
const generic = bodyshop?.cdk_configuration?.generic_customer_number || null;
|
||||
if (!generic) return;
|
||||
setOpen(false);
|
||||
socket.emit("pbs-selected-customer", generic);
|
||||
setSelectedCustomer(null);
|
||||
};
|
||||
|
||||
const onCreateNew = () => {
|
||||
setOpen(false);
|
||||
socket.emit("pbs-selected-customer", null);
|
||||
setSelectedCustomer(null);
|
||||
};
|
||||
|
||||
if (!open) return null;
|
||||
|
||||
const columns = [
|
||||
{ title: t("jobs.fields.dms.id"), dataIndex: "ContactId", key: "ContactId" },
|
||||
{
|
||||
title: t("jobs.fields.dms.name1"),
|
||||
key: "name1",
|
||||
sorter: (a, b) => alphaSort(a.LastName, b.LastName),
|
||||
render: (_t, r) => `${r.FirstName || ""} ${r.LastName || ""}`
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.dms.address"),
|
||||
key: "address",
|
||||
render: (r) => `${r.Address}, ${r.City} ${r.State} ${r.ZipCode}`
|
||||
}
|
||||
];
|
||||
|
||||
const hasGeneric = !!bodyshop?.cdk_configuration?.generic_customer_number;
|
||||
|
||||
return (
|
||||
<Col span={24}>
|
||||
<Table
|
||||
title={() => (
|
||||
<div style={{ display: "flex", gap: 8, flexWrap: "wrap" }}>
|
||||
<Button onClick={onUseSelected} disabled={!selectedCustomer}>
|
||||
{t("jobs.actions.dms.useselected")}
|
||||
</Button>
|
||||
<Button onClick={onUseGeneric} disabled={!hasGeneric}>
|
||||
{t("jobs.actions.dms.usegeneric")}
|
||||
</Button>
|
||||
<Button onClick={onCreateNew}>{t("jobs.actions.dms.createnewcustomer")}</Button>
|
||||
</div>
|
||||
)}
|
||||
pagination={{ position: "top" }}
|
||||
columns={columns}
|
||||
rowKey={(r) => r.ContactId}
|
||||
dataSource={customerList}
|
||||
rowSelection={{
|
||||
onSelect: (r) => setSelectedCustomer(r?.ContactId ? String(r.ContactId) : null),
|
||||
type: "radio",
|
||||
selectedRowKeys: selectedCustomer ? [selectedCustomer] : []
|
||||
}}
|
||||
/>
|
||||
</Col>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,267 @@
|
||||
import { Alert, Button, Checkbox, Col, message, Space, Table } from "antd";
|
||||
import { useEffect, useMemo, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { alphaSort } from "../../utils/sorters";
|
||||
|
||||
const normalizeRrList = (list) => {
|
||||
if (!Array.isArray(list)) return [];
|
||||
return list
|
||||
.map((row) => {
|
||||
const custNo = row.custNo || row.CustomerId || row.customerId || null;
|
||||
const name =
|
||||
row.name ||
|
||||
[row.CustomerName?.FirstName, row.CustomerName?.LastName].filter(Boolean).join(" ").trim() ||
|
||||
(custNo ? String(custNo) : "");
|
||||
if (!custNo) return null;
|
||||
const vinOwner = !!(row.vinOwner ?? row.isVehicleOwner);
|
||||
|
||||
const address =
|
||||
row.address && typeof row.address === "object"
|
||||
? {
|
||||
line1: row.address.line1 ?? row.address.addr1 ?? row.address.Address1 ?? undefined,
|
||||
line2: row.address.line2 ?? row.address.addr2 ?? row.address.Address2 ?? undefined,
|
||||
city: row.address.city ?? undefined,
|
||||
state: row.address.state ?? row.address.stateOrProvince ?? undefined,
|
||||
postalCode: row.address.postalCode ?? row.address.zip ?? undefined,
|
||||
country: row.address.country ?? row.address.countryCode ?? undefined
|
||||
}
|
||||
: undefined;
|
||||
|
||||
return { custNo: String(custNo), name, vinOwner, address };
|
||||
})
|
||||
.filter(Boolean);
|
||||
};
|
||||
|
||||
const rrAddressToString = (addr) => {
|
||||
if (!addr) return "";
|
||||
const parts = [
|
||||
addr.line1,
|
||||
addr.line2,
|
||||
[addr.city, addr.state].filter(Boolean).join(" "),
|
||||
addr.postalCode,
|
||||
addr.country
|
||||
].filter(Boolean);
|
||||
return parts.join(", ");
|
||||
};
|
||||
|
||||
export default function RRCustomerSelector({
|
||||
jobid,
|
||||
socket,
|
||||
rrOpenRoLimit = false,
|
||||
onRrOpenRoFinished,
|
||||
rrValidationPending = false,
|
||||
onValidationFinished
|
||||
}) {
|
||||
const { t } = useTranslation();
|
||||
const [open, setOpen] = useState(false);
|
||||
const [customerList, setCustomerList] = useState([]);
|
||||
const [selectedCustomer, setSelectedCustomer] = useState(null);
|
||||
const [refreshing, setRefreshing] = useState(false);
|
||||
|
||||
// Show dialog automatically when validation is pending
|
||||
useEffect(() => {
|
||||
if (rrValidationPending) setOpen(true);
|
||||
}, [rrValidationPending]);
|
||||
|
||||
// Listen for RR customer selection list
|
||||
useEffect(() => {
|
||||
if (!socket) return;
|
||||
const handleRrSelectCustomer = (list) => {
|
||||
const normalized = normalizeRrList(list);
|
||||
setOpen(true);
|
||||
setCustomerList(normalized);
|
||||
const firstOwner = normalized.find((r) => r.vinOwner)?.custNo;
|
||||
setSelectedCustomer(firstOwner ? String(firstOwner) : null);
|
||||
setRefreshing(false);
|
||||
};
|
||||
socket.on("rr-select-customer", handleRrSelectCustomer);
|
||||
return () => {
|
||||
socket.off("rr-select-customer", handleRrSelectCustomer);
|
||||
};
|
||||
}, [socket]);
|
||||
|
||||
// VIN owner set
|
||||
const rrOwnerSet = useMemo(() => {
|
||||
return new Set(customerList.filter((c) => c?.vinOwner || c?.isVehicleOwner).map((c) => String(c.custNo)));
|
||||
}, [customerList]);
|
||||
const rrHasVinOwner = rrOwnerSet.size > 0;
|
||||
|
||||
// Enforce VIN owner stays selected if present
|
||||
useEffect(() => {
|
||||
if (!rrHasVinOwner) return;
|
||||
const firstOwner = (customerList.find((c) => c.vinOwner) || {}).custNo;
|
||||
if (firstOwner && String(selectedCustomer) !== String(firstOwner)) {
|
||||
setSelectedCustomer(String(firstOwner));
|
||||
}
|
||||
}, [rrHasVinOwner, customerList, selectedCustomer]);
|
||||
|
||||
const onUseSelected = () => {
|
||||
if (!selectedCustomer) {
|
||||
message.warning(t("general.actions.select"));
|
||||
return;
|
||||
}
|
||||
if (rrHasVinOwner && !rrOwnerSet.has(String(selectedCustomer))) {
|
||||
message.warning(
|
||||
"This VIN is already assigned in Reynolds. Only the VIN owner can be selected. To choose a different customer, change ownership in Reynolds first."
|
||||
);
|
||||
return;
|
||||
}
|
||||
socket.emit("rr-selected-customer", { jobId: jobid, custNo: String(selectedCustomer) }, (ack) => {
|
||||
if (ack?.ok) {
|
||||
message.success(t("dms.messages.customerSelected"));
|
||||
} else if (ack?.error) {
|
||||
message.error(ack.error);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const onCreateNew = () => {
|
||||
if (rrHasVinOwner) return;
|
||||
socket.emit("rr-selected-customer", { jobId: jobid, create: true }, (ack) => {
|
||||
if (ack?.ok) {
|
||||
if (ack.custNo) setSelectedCustomer(String(ack.custNo));
|
||||
message.success(t("dms.messages.customerCreated"));
|
||||
} else if (ack?.error) {
|
||||
message.error(ack.error);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const refreshRrSearch = () => {
|
||||
setRefreshing(true);
|
||||
const to = setTimeout(() => setRefreshing(false), 12000);
|
||||
const stop = () => {
|
||||
clearTimeout(to);
|
||||
setRefreshing(false);
|
||||
socket.off("export-failed", stop);
|
||||
socket.off("rr-select-customer", stop);
|
||||
};
|
||||
socket.once("rr-select-customer", stop);
|
||||
socket.once("export-failed", stop);
|
||||
socket.emit("rr-export-job", { jobId: jobid });
|
||||
};
|
||||
|
||||
if (!open) return null;
|
||||
|
||||
const columns = [
|
||||
{ title: t("jobs.fields.dms.id"), dataIndex: "custNo", key: "custNo" },
|
||||
{
|
||||
title: t("jobs.fields.dms.vinowner"),
|
||||
dataIndex: "vinOwner",
|
||||
key: "vinOwner",
|
||||
render: (_t, r) => <Checkbox disabled checked={!!(r.vinOwner ?? r.isVehicleOwner)} />
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.dms.name1"),
|
||||
dataIndex: "name",
|
||||
key: "name",
|
||||
sorter: (a, b) => alphaSort(a?.name, b?.name)
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.dms.address"),
|
||||
key: "address",
|
||||
render: (record) => rrAddressToString(record.address)
|
||||
}
|
||||
];
|
||||
|
||||
const rrDisableRow = (record) => {
|
||||
if (!rrHasVinOwner) return false;
|
||||
return !rrOwnerSet.has(String(record.custNo));
|
||||
};
|
||||
|
||||
return (
|
||||
<Col span={24}>
|
||||
<Table
|
||||
title={() => (
|
||||
<div style={{ display: "flex", flexDirection: "column", gap: 8 }}>
|
||||
{/* Open RO limit banner */}
|
||||
{rrOpenRoLimit && (
|
||||
<Alert
|
||||
type="error"
|
||||
showIcon
|
||||
message="Open RO limit reached in Reynolds"
|
||||
description={
|
||||
<div style={{ display: "flex", flexDirection: "column", gap: 8 }}>
|
||||
<div>
|
||||
Reynolds has reached the maximum number of open Repair Orders for this Customer. Close or finalize
|
||||
an RO in Reynolds, then click <strong>Finished</strong> to continue.
|
||||
</div>
|
||||
<div>
|
||||
<Button type="primary" danger onClick={onRrOpenRoFinished}>
|
||||
Finished
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
/>
|
||||
)}
|
||||
|
||||
{/* Validation step banner */}
|
||||
{rrValidationPending && (
|
||||
<Alert
|
||||
type="info"
|
||||
showIcon
|
||||
message="Complete Validation in Reynolds"
|
||||
description={
|
||||
<div style={{ display: "flex", flexDirection: "column", gap: 8 }}>
|
||||
<div>
|
||||
We created the Repair Order. Please validate the totals and taxes in the DMS system. When done,
|
||||
click <strong>Finished</strong> to finalize and mark this export as complete.
|
||||
</div>
|
||||
<div>
|
||||
<Space>
|
||||
<Button type="primary" onClick={onValidationFinished}>
|
||||
Finished
|
||||
</Button>
|
||||
</Space>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
/>
|
||||
)}
|
||||
|
||||
<div style={{ display: "flex", gap: 8, flexWrap: "wrap" }}>
|
||||
<Button onClick={onUseSelected} disabled={!selectedCustomer || rrOpenRoLimit}>
|
||||
{t("jobs.actions.dms.useselected")}
|
||||
</Button>
|
||||
{/* No generic in RR */}
|
||||
<Button onClick={onCreateNew} disabled={rrHasVinOwner}>
|
||||
{t("jobs.actions.dms.createnewcustomer")}
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
{rrHasVinOwner && (
|
||||
<Alert
|
||||
type="warning"
|
||||
showIcon
|
||||
message="VIN ownership enforced"
|
||||
description={
|
||||
<div style={{ display: "flex", justifyContent: "space-between", alignItems: "center", gap: 12 }}>
|
||||
<div>
|
||||
This VIN is already assigned in Reynolds. Only the VIN owner is selectable here. To use a
|
||||
different customer, please change the vehicle ownership in Reynolds first, then return to complete
|
||||
the export.
|
||||
</div>
|
||||
<Button onClick={refreshRrSearch} loading={refreshing}>
|
||||
Refresh
|
||||
</Button>
|
||||
</div>
|
||||
}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
pagination={{ position: "top" }}
|
||||
columns={columns}
|
||||
rowKey={(r) => r.custNo}
|
||||
dataSource={customerList}
|
||||
rowSelection={{
|
||||
onSelect: (record) => setSelectedCustomer(record?.custNo ? String(record.custNo) : null),
|
||||
type: "radio",
|
||||
selectedRowKeys: selectedCustomer ? [selectedCustomer] : [],
|
||||
getCheckboxProps: (record) => ({ disabled: rrDisableRow(record) })
|
||||
}}
|
||||
/>
|
||||
</Col>
|
||||
);
|
||||
}
|
||||
@@ -1,50 +1,225 @@
|
||||
import { Divider, Space, Tag, Timeline } from "antd";
|
||||
import { useEffect, useMemo, useState } from "react";
|
||||
import dayjs from "../../utils/day";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { setBreadcrumbs, setSelectedHeader } from "../../redux/application/application.actions";
|
||||
import { selectDarkMode } from "../../redux/application/application.selectors.js";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({});
|
||||
|
||||
const mapDispatchToProps = (dispatch) => ({
|
||||
setBreadcrumbs: (breadcrumbs) => dispatch(setBreadcrumbs(breadcrumbs)),
|
||||
setSelectedHeader: (key) => dispatch(setSelectedHeader(key))
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
isDarkMode: selectDarkMode
|
||||
});
|
||||
|
||||
const mapDispatchToProps = () => ({});
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(DmsLogEvents);
|
||||
|
||||
export function DmsLogEvents({ logs }) {
|
||||
return (
|
||||
<Timeline
|
||||
pending
|
||||
reverse={true}
|
||||
items={logs.map((log, idx) => ({
|
||||
key: idx,
|
||||
color: LogLevelHierarchy(log.level),
|
||||
children: (
|
||||
<Space wrap align="start" style={{}}>
|
||||
<Tag color={LogLevelHierarchy(log.level)}>{log.level}</Tag>
|
||||
<span>{dayjs(log.timestamp).format("MM/DD/YYYY HH:mm:ss")}</span>
|
||||
<Divider type="vertical" />
|
||||
<span>{log.message}</span>
|
||||
</Space>
|
||||
)
|
||||
}))}
|
||||
/>
|
||||
export function DmsLogEvents({ logs, detailsOpen, detailsNonce, isDarkMode, colorizeJson = false }) {
|
||||
const [openSet, setOpenSet] = useState(() => new Set());
|
||||
|
||||
// Inject JSON highlight styles once (only when colorize is enabled)
|
||||
useEffect(() => {
|
||||
if (!colorizeJson) return;
|
||||
if (typeof document === "undefined") return;
|
||||
if (document.getElementById("json-highlight-styles")) return;
|
||||
const style = document.createElement("style");
|
||||
style.id = "json-highlight-styles";
|
||||
style.textContent = `
|
||||
.json-key { color: #fa8c16; }
|
||||
.json-string { color: #52c41a; }
|
||||
.json-number { color: #722ed1; }
|
||||
.json-boolean { color: #1890ff; }
|
||||
.json-null { color: #faad14; }
|
||||
`;
|
||||
document.head.appendChild(style);
|
||||
}, [colorizeJson]);
|
||||
|
||||
// Trim openSet if logs shrink
|
||||
useEffect(() => {
|
||||
const len = (logs || []).length;
|
||||
setOpenSet((prev) => {
|
||||
const next = new Set();
|
||||
for (let i = 0; i < len; i++) if (prev.has(i)) next.add(i);
|
||||
return next;
|
||||
});
|
||||
}, [logs?.length]);
|
||||
|
||||
// Respond to global toggle button
|
||||
useEffect(() => {
|
||||
if (detailsNonce == null) return;
|
||||
const len = (logs || []).length;
|
||||
setOpenSet(detailsOpen ? new Set(Array.from({ length: len }, (_, i) => i)) : new Set());
|
||||
}, [detailsNonce, detailsOpen, logs?.length]);
|
||||
|
||||
const items = useMemo(
|
||||
() =>
|
||||
(logs || []).map((raw, idx) => {
|
||||
const { level, message, timestamp, meta } = normalizeLog(raw);
|
||||
const hasMeta = !isEmpty(meta);
|
||||
const isOpen = openSet.has(idx);
|
||||
|
||||
return {
|
||||
key: idx,
|
||||
color: logLevelColor(level),
|
||||
children: (
|
||||
<Space direction="vertical" size={4} style={{ display: "flex" }}>
|
||||
{/* Row 1: summary + inline "Details" toggle */}
|
||||
<Space wrap align="start">
|
||||
<Tag color={logLevelColor(level)}>{level}</Tag>
|
||||
<Divider type="vertical" />
|
||||
<span>{dayjs(timestamp).format("MM/DD/YYYY HH:mm:ss")}</span>
|
||||
<Divider type="vertical" />
|
||||
<span>{message}</span>
|
||||
{hasMeta && (
|
||||
<>
|
||||
<Divider type="vertical" />
|
||||
<a
|
||||
role="button"
|
||||
aria-expanded={isOpen}
|
||||
onClick={() =>
|
||||
setOpenSet((prev) => {
|
||||
const next = new Set(prev);
|
||||
if (isOpen) next.delete(idx);
|
||||
else next.add(idx);
|
||||
return next;
|
||||
})
|
||||
}
|
||||
style={{ cursor: "pointer", userSelect: "none" }}
|
||||
>
|
||||
{isOpen ? "Hide details" : "Details"}
|
||||
</a>
|
||||
</>
|
||||
)}
|
||||
</Space>
|
||||
|
||||
{/* Row 2: details body (only when open) */}
|
||||
{hasMeta && isOpen && (
|
||||
<div style={{ marginLeft: 6 }}>
|
||||
<JsonBlock isDarkMode={isDarkMode} data={meta} colorize={colorizeJson} />
|
||||
</div>
|
||||
)}
|
||||
</Space>
|
||||
)
|
||||
};
|
||||
}),
|
||||
[logs, openSet, colorizeJson]
|
||||
);
|
||||
|
||||
return <Timeline pending reverse items={items} />;
|
||||
}
|
||||
|
||||
function LogLevelHierarchy(level) {
|
||||
switch (level) {
|
||||
/**
|
||||
* Normalize various log input formats into a standard structure.
|
||||
* @param input
|
||||
* @returns {{level: string, message: *|string, timestamp: Date, meta: *}}
|
||||
*/
|
||||
const normalizeLog = (input) => {
|
||||
const n = input?.normalized || input || {};
|
||||
const level = (n.level || input?.level || "INFO").toString().toUpperCase();
|
||||
const message = n.message ?? input?.message ?? "";
|
||||
const meta = input?.meta != null ? input.meta : n.meta != null ? n.meta : undefined;
|
||||
const tsRaw = input?.timestamp ?? n.timestamp ?? input?.ts ?? Date.now();
|
||||
const timestamp = typeof tsRaw === "number" ? new Date(tsRaw) : new Date(tsRaw);
|
||||
return { level, message, timestamp, meta };
|
||||
};
|
||||
|
||||
/**
|
||||
* Map log level to tag color.
|
||||
* @param level
|
||||
* @returns {string}
|
||||
*/
|
||||
const logLevelColor = (level) => {
|
||||
switch ((level || "").toUpperCase()) {
|
||||
case "SILLY":
|
||||
return "purple";
|
||||
case "DEBUG":
|
||||
return "orange";
|
||||
case "INFO":
|
||||
return "blue";
|
||||
case "WARN":
|
||||
case "WARNING":
|
||||
return "yellow";
|
||||
case "ERROR":
|
||||
return "red";
|
||||
default:
|
||||
return 0;
|
||||
return "default";
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Check if a value is "empty" (null/undefined, empty array, or empty object).
|
||||
* @param v
|
||||
*/
|
||||
const isEmpty = (v) => {
|
||||
if (v == null) return true;
|
||||
if (Array.isArray(v)) return v.length === 0;
|
||||
if (typeof v === "object") return Object.keys(v).length === 0;
|
||||
return false;
|
||||
};
|
||||
|
||||
/**
|
||||
* Safely stringify an object to JSON, falling back to String() on failure.
|
||||
* @param obj
|
||||
* @param spaces
|
||||
* @returns {string}
|
||||
*/
|
||||
const safeStringify = (obj, spaces = 2) => {
|
||||
try {
|
||||
return JSON.stringify(obj, null, spaces);
|
||||
} catch {
|
||||
return String(obj);
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* JSON display block with optional syntax highlighting.
|
||||
* @param data
|
||||
* @param colorize
|
||||
* @param isDarkMode
|
||||
* @returns {JSX.Element}
|
||||
* @constructor
|
||||
*/
|
||||
const JsonBlock = ({ data, colorize, isDarkMode }) => {
|
||||
const jsonText = safeStringify(data, 2);
|
||||
const preStyle = {
|
||||
margin: "6px 0 0",
|
||||
maxWidth: 720,
|
||||
overflowX: "auto",
|
||||
fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace',
|
||||
fontSize: 12,
|
||||
lineHeight: 1.45,
|
||||
padding: 8,
|
||||
borderRadius: 6,
|
||||
background: isDarkMode ? "rgba(255,255,255,0.1)" : "rgba(0,0,0,0.04)",
|
||||
border: isDarkMode ? "1px solid rgba(255,255,255,0.12)" : "1px solid rgba(0,0,0,0.08)",
|
||||
color: isDarkMode ? "var(--card-text-fallback)" : "#141414"
|
||||
};
|
||||
|
||||
if (colorize) {
|
||||
const html = syntaxHighlight(jsonText);
|
||||
return <pre style={preStyle} dangerouslySetInnerHTML={{ __html: html }} />;
|
||||
}
|
||||
return <pre style={preStyle}>{jsonText}</pre>;
|
||||
};
|
||||
|
||||
/**
|
||||
* Syntax highlight JSON text for HTML display.
|
||||
* @param jsonText
|
||||
* @returns {*}
|
||||
*/
|
||||
const syntaxHighlight = (jsonText) => {
|
||||
const esc = jsonText.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">");
|
||||
return esc.replace(
|
||||
/("(?:\\u[\da-fA-F]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(?:true|false|null)\b|-?\d+(?:\.\d+)?(?:[eE][+-]?\d+)?)/g,
|
||||
(match) => {
|
||||
let cls = "json-number";
|
||||
if (match.startsWith('"')) {
|
||||
cls = match.endsWith(":") ? "json-key" : "json-string";
|
||||
} else if (match === "true" || match === "false") {
|
||||
cls = "json-boolean";
|
||||
} else if (match === "null") {
|
||||
cls = "json-null";
|
||||
}
|
||||
return `<span class="${cls}">${match}</span>`;
|
||||
}
|
||||
);
|
||||
};
|
||||
|
||||
403
client/src/components/dms-post-form/cdklike-dms-post-form.jsx
Normal file
403
client/src/components/dms-post-form/cdklike-dms-post-form.jsx
Normal file
@@ -0,0 +1,403 @@
|
||||
import { DeleteFilled, DownOutlined } from "@ant-design/icons";
|
||||
import {
|
||||
Button,
|
||||
Card,
|
||||
Col,
|
||||
Divider,
|
||||
Dropdown,
|
||||
Form,
|
||||
Input,
|
||||
InputNumber,
|
||||
Row,
|
||||
Select,
|
||||
Space,
|
||||
Statistic,
|
||||
Switch,
|
||||
Tooltip,
|
||||
Typography
|
||||
} from "antd";
|
||||
import Dinero from "dinero.js";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useMemo, useState } from "react";
|
||||
import i18n from "../../translations/i18n";
|
||||
import dayjs from "../../utils/day";
|
||||
import DmsCdkMakes from "../dms-cdk-makes/dms-cdk-makes.component";
|
||||
import DmsCdkMakesRefetch from "../dms-cdk-makes/dms-cdk-makes.refetch.component";
|
||||
import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
|
||||
import CurrencyInput from "../form-items-formatted/currency-form-item.component";
|
||||
import { DMS_MAP } from "../../utils/dmsUtils";
|
||||
|
||||
/**
|
||||
* CDK-like DMS post form:
|
||||
* - CDK / Fortellis / PBS
|
||||
* - CDK vehicle details + make/model selection
|
||||
* - Payer list with discrepancy gating
|
||||
* - Submit: "{mode}-export-job"
|
||||
* @param bodyshop
|
||||
* @param socket
|
||||
* @param job
|
||||
* @param logsRef
|
||||
* @param mode
|
||||
* @returns {JSX.Element}
|
||||
* @constructor
|
||||
*/
|
||||
export default function CdkLikePostForm({ bodyshop, socket, job, logsRef, mode }) {
|
||||
const [form] = Form.useForm();
|
||||
const { t } = useTranslation();
|
||||
const [, /*unused*/ setTick] = useState(0); // handy if you need a forceUpdate later
|
||||
|
||||
const initialValues = useMemo(
|
||||
() => ({
|
||||
story: `${t("jobs.labels.dms.defaultstory", {
|
||||
ro_number: job.ro_number,
|
||||
ownr_nm: `${job.ownr_fn || ""} ${job.ownr_ln || ""} ${job.ownr_co_nm || ""}`.trim(),
|
||||
ins_co_nm: job.ins_co_nm || "N/A",
|
||||
clm_po: `${job.clm_no ? `${job.clm_no} ` : ""}${job.po_number || ""}`
|
||||
}).trim()}.${
|
||||
job.area_of_damage?.impact1
|
||||
? " " +
|
||||
t("jobs.labels.dms.damageto", {
|
||||
area_of_damage: (job.area_of_damage && job.area_of_damage.impact1.padStart(2, "0")) || "UNKNOWN"
|
||||
})
|
||||
: ""
|
||||
}`.slice(0, 239),
|
||||
inservicedate: dayjs(
|
||||
`${
|
||||
(job.v_model_yr &&
|
||||
(job.v_model_yr < 100
|
||||
? job.v_model_yr >= (dayjs().year() + 1) % 100
|
||||
? 1900 + parseInt(job.v_model_yr, 10)
|
||||
: 2000 + parseInt(job.v_model_yr, 10)
|
||||
: job.v_model_yr)) ||
|
||||
2019
|
||||
}-01-01`
|
||||
),
|
||||
journal: bodyshop.cdk_configuration?.default_journal
|
||||
}),
|
||||
[job, bodyshop, t]
|
||||
);
|
||||
|
||||
// Payers helpers
|
||||
const handlePayerSelect = (value, index) => {
|
||||
form.setFieldsValue({
|
||||
payers: (form.getFieldValue("payers") || []).map((payer, mapIndex) => {
|
||||
if (index !== mapIndex) return payer;
|
||||
const cdkPayer =
|
||||
bodyshop.cdk_configuration.payers && bodyshop.cdk_configuration.payers.find((i) => i.name === value);
|
||||
if (!cdkPayer) return payer;
|
||||
return {
|
||||
...cdkPayer,
|
||||
dms_acctnumber: cdkPayer.dms_acctnumber,
|
||||
controlnumber: job?.[cdkPayer.control_type]
|
||||
};
|
||||
})
|
||||
});
|
||||
setTick((n) => n + 1);
|
||||
};
|
||||
|
||||
const handleFinish = (values) => {
|
||||
if (!socket) return;
|
||||
|
||||
if (mode === DMS_MAP.fortellis) {
|
||||
socket.emit("fortellis-export-job", {
|
||||
jobid: job.id,
|
||||
txEnvelope: { ...values, SubscriptionID: bodyshop.cdk_dealerid }
|
||||
});
|
||||
} else {
|
||||
socket.emit(`${mode}-export-job`, { jobid: job.id, txEnvelope: values });
|
||||
}
|
||||
|
||||
logsRef?.current?.scrollIntoView({ behavior: "smooth" });
|
||||
};
|
||||
|
||||
// Totals & discrepancy
|
||||
const totals = socket?.allocationsSummary
|
||||
? socket.allocationsSummary.reduce(
|
||||
(acc, val) => ({
|
||||
totalSale: acc.totalSale.add(Dinero(val.sale)),
|
||||
totalCost: acc.totalCost.add(Dinero(val.cost))
|
||||
}),
|
||||
{ totalSale: Dinero(), totalCost: Dinero() }
|
||||
)
|
||||
: { totalSale: Dinero(), totalCost: Dinero() };
|
||||
|
||||
return (
|
||||
<Card title={t("jobs.labels.dms.postingform")}>
|
||||
<Form
|
||||
form={form}
|
||||
layout="vertical"
|
||||
onFinish={handleFinish}
|
||||
style={{ width: "100%" }}
|
||||
initialValues={initialValues}
|
||||
>
|
||||
{/* TOP ROW */}
|
||||
<Row gutter={[16, 12]} align="bottom">
|
||||
<Col xs={24} sm={12} md={8} lg={6}>
|
||||
<Form.Item name="journal" label={t("jobs.fields.dms.journal")} rules={[{ required: true }]}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
|
||||
<Col xs={12} sm={8} md={6} lg={4}>
|
||||
<Form.Item name="kmin" label={t("jobs.fields.kmin")} initialValue={job?.kmin} rules={[{ required: true }]}>
|
||||
<InputNumber style={{ width: "100%" }} disabled />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
|
||||
<Col xs={12} sm={8} md={6} lg={4}>
|
||||
<Form.Item
|
||||
name="kmout"
|
||||
label={t("jobs.fields.kmout")}
|
||||
initialValue={job?.kmout}
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
<InputNumber style={{ width: "100%" }} disabled />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
{/* CDK vehicle details (kept for CDK/Fortellis paths when dealer id exists) */}
|
||||
{bodyshop.cdk_dealerid && (
|
||||
<>
|
||||
<Row gutter={[16, 12]}>
|
||||
<Col xs={24} sm={12} md={8}>
|
||||
<Form.Item name="dms_make" label={t("jobs.fields.dms.dms_make")} rules={[{ required: true }]}>
|
||||
<Input disabled />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col xs={24} sm={12} md={8}>
|
||||
<Form.Item name="dms_model" label={t("jobs.fields.dms.dms_model")} rules={[{ required: true }]}>
|
||||
<Input disabled />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col xs={24} sm={12} md={8}>
|
||||
<Form.Item name="inservicedate" label={t("jobs.fields.dms.inservicedate")}>
|
||||
<DateTimePicker isDateOnly />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
<Row gutter={[16, 12]} align="middle">
|
||||
<Col>
|
||||
<DmsCdkMakes form={form} job={job} />
|
||||
</Col>
|
||||
<Col>
|
||||
<DmsCdkMakesRefetch />
|
||||
</Col>
|
||||
<Col>
|
||||
<Form.Item name="dms_unsold" label={t("jobs.fields.dms.dms_unsold")} initialValue={false}>
|
||||
<Switch />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col>
|
||||
<Form.Item
|
||||
name="dms_model_override"
|
||||
label={t("jobs.fields.dms.dms_model_override")}
|
||||
initialValue={false}
|
||||
>
|
||||
<Switch />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
</>
|
||||
)}
|
||||
|
||||
<Row gutter={[16, 12]}>
|
||||
<Col span={24}>
|
||||
<Form.Item name="story" label={t("jobs.fields.dms.story")} rules={[{ required: true }]}>
|
||||
<Input.TextArea maxLength={240} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
<Divider />
|
||||
|
||||
{/* Totals */}
|
||||
<Space size="large" wrap align="center" style={{ marginBottom: 16 }}>
|
||||
<Statistic
|
||||
title={t("jobs.fields.ded_amt")}
|
||||
value={Dinero(job.job_totals.totals.custPayable.deductible).toFormat()}
|
||||
/>
|
||||
<Statistic
|
||||
title={t("jobs.labels.total_cust_payable")}
|
||||
value={Dinero(job.job_totals.totals.custPayable.total).toFormat()}
|
||||
/>
|
||||
<Statistic
|
||||
title={t("jobs.labels.net_repairs")}
|
||||
value={Dinero(job.job_totals.totals.net_repairs).toFormat()}
|
||||
/>
|
||||
</Space>
|
||||
|
||||
{/* Payers list */}
|
||||
<Divider />
|
||||
<Form.List name={["payers"]}>
|
||||
{(fields, { add, remove }) => (
|
||||
<div>
|
||||
{fields.map((field, index) => (
|
||||
<Card
|
||||
key={field.key}
|
||||
size="small"
|
||||
style={{ marginBottom: 12 }}
|
||||
title={`${t("jobs.fields.dms.payer.payer_type")} #${index + 1}`}
|
||||
extra={
|
||||
<Tooltip title={t("general.actions.remove", "Remove")}>
|
||||
<Button
|
||||
type="text"
|
||||
danger
|
||||
icon={<DeleteFilled />}
|
||||
aria-label={t("general.actions.remove", "Remove")}
|
||||
onClick={() => remove(field.name)}
|
||||
/>
|
||||
</Tooltip>
|
||||
}
|
||||
>
|
||||
<Row gutter={[16, 8]} align="middle">
|
||||
<Col xs={24} sm={12} md={8} lg={6}>
|
||||
<Form.Item
|
||||
label={t("jobs.fields.dms.payer.name")}
|
||||
name={[field.name, "name"]}
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
<Select style={{ minWidth: "15rem" }} onSelect={(value) => handlePayerSelect(value, index)}>
|
||||
{bodyshop.cdk_configuration?.payers?.map((payer) => (
|
||||
<Select.Option key={payer.name}>{payer.name}</Select.Option>
|
||||
))}
|
||||
</Select>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
|
||||
<Col xs={24} sm={12} md={8} lg={6}>
|
||||
<Form.Item
|
||||
label={t("jobs.fields.dms.payer.dms_acctnumber")}
|
||||
name={[field.name, "dms_acctnumber"]}
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
<Input disabled />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
|
||||
<Col xs={24} sm={12} md={8} lg={5}>
|
||||
<Form.Item
|
||||
label={t("jobs.fields.dms.payer.amount")}
|
||||
name={[field.name, "amount"]}
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
<CurrencyInput min={0} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
|
||||
<Col xs={24} sm={12} md={10} lg={7}>
|
||||
<Form.Item
|
||||
label={
|
||||
<div>
|
||||
{t("jobs.fields.dms.payer.controlnumber")}{" "}
|
||||
<Dropdown
|
||||
trigger={["click"]}
|
||||
menu={{
|
||||
items:
|
||||
bodyshop.cdk_configuration.controllist?.map((key, idx) => ({
|
||||
key: idx,
|
||||
label: key.name,
|
||||
onClick: () => {
|
||||
form.setFieldsValue({
|
||||
payers: (form.getFieldValue("payers") || []).map((row, mapIndex) => {
|
||||
if (index !== mapIndex) return row;
|
||||
return { ...row, controlnumber: key.controlnumber };
|
||||
})
|
||||
});
|
||||
}
|
||||
})) ?? []
|
||||
}}
|
||||
>
|
||||
<a href="#" onClick={(e) => e.preventDefault()}>
|
||||
<DownOutlined />
|
||||
</a>
|
||||
</Dropdown>
|
||||
</div>
|
||||
}
|
||||
name={[field.name, "controlnumber"]}
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
|
||||
<Col xs={24}>
|
||||
<Form.Item shouldUpdate noStyle>
|
||||
{() => {
|
||||
const payers = form.getFieldValue("payers");
|
||||
const row = payers?.[index];
|
||||
const cdkPayer =
|
||||
bodyshop.cdk_configuration.payers &&
|
||||
bodyshop.cdk_configuration.payers.find((i) => i && row && i.name === row.name);
|
||||
if (i18n.exists(`jobs.fields.${cdkPayer?.control_type}`))
|
||||
return <div>{cdkPayer && t(`jobs.fields.${cdkPayer?.control_type}`)}</div>;
|
||||
else if (i18n.exists(`jobs.fields.dms.control_type.${cdkPayer?.control_type}`)) {
|
||||
return <div>{cdkPayer && t(`jobs.fields.dms.control_type.${cdkPayer?.control_type}`)}</div>;
|
||||
} else {
|
||||
return null;
|
||||
}
|
||||
}}
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
</Card>
|
||||
))}
|
||||
<Form.Item>
|
||||
<Button
|
||||
disabled={!(fields.length < 3)}
|
||||
onClick={() => {
|
||||
if (fields.length < 3) add();
|
||||
}}
|
||||
style={{ width: "100%" }}
|
||||
>
|
||||
{t("jobs.actions.dms.addpayer")}
|
||||
</Button>
|
||||
</Form.Item>
|
||||
</div>
|
||||
)}
|
||||
</Form.List>
|
||||
|
||||
{/* Validation gates & summary */}
|
||||
<Form.Item shouldUpdate>
|
||||
{() => {
|
||||
let totalAllocated = Dinero();
|
||||
const payers = form.getFieldValue("payers") || [];
|
||||
payers.forEach((payer) => {
|
||||
totalAllocated = totalAllocated.add(Dinero({ amount: Math.round((payer?.amount || 0) * 100) }));
|
||||
});
|
||||
|
||||
const discrep = totals ? totals.totalSale.subtract(totalAllocated) : Dinero();
|
||||
|
||||
// gate: must have payers filled + zero discrepancy when we have a summary
|
||||
const payersOk =
|
||||
payers.length > 0 &&
|
||||
payers.every((p) => p?.name && p.dms_acctnumber && (p.amount ?? "") !== "" && p.controlnumber);
|
||||
const nonRrDiscrepancyGate = socket?.allocationsSummary ? discrep.getAmount() !== 0 : true;
|
||||
const disablePost = !payersOk || nonRrDiscrepancyGate;
|
||||
|
||||
return (
|
||||
<Space size="large" wrap align="center">
|
||||
<Statistic
|
||||
title={t("jobs.labels.subtotal")}
|
||||
value={(totals ? totals.totalSale : Dinero()).toFormat()}
|
||||
/>
|
||||
<Typography.Title>-</Typography.Title>
|
||||
<Statistic title={t("jobs.labels.dms.totalallocated")} value={totalAllocated.toFormat()} />
|
||||
<Typography.Title>=</Typography.Title>
|
||||
<Statistic
|
||||
title={t("jobs.labels.dms.notallocated")}
|
||||
valueStyle={{ color: discrep.getAmount() === 0 ? "green" : "red" }}
|
||||
value={discrep.toFormat()}
|
||||
/>
|
||||
<Button disabled={disablePost} htmlType="submit">
|
||||
{t("jobs.actions.dms.post")}
|
||||
</Button>
|
||||
</Space>
|
||||
);
|
||||
}}
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
@@ -1,396 +1,40 @@
|
||||
import { DeleteFilled, DownOutlined } from "@ant-design/icons";
|
||||
import {
|
||||
Button,
|
||||
Card,
|
||||
Divider,
|
||||
Dropdown,
|
||||
Form,
|
||||
Input,
|
||||
InputNumber,
|
||||
Select,
|
||||
Space,
|
||||
Statistic,
|
||||
Switch,
|
||||
Typography
|
||||
} from "antd";
|
||||
import Dinero from "dinero.js";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { determineDmsType } from "../../pages/dms/dms.container";
|
||||
import { selectBodyshop } from "../../redux/user/user.selectors";
|
||||
import i18n from "../../translations/i18n";
|
||||
import dayjs from "../../utils/day";
|
||||
import DmsCdkMakes from "../dms-cdk-makes/dms-cdk-makes.component";
|
||||
import DmsCdkMakesRefetch from "../dms-cdk-makes/dms-cdk-makes.refetch.component";
|
||||
import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
|
||||
import CurrencyInput from "../form-items-formatted/currency-form-item.component";
|
||||
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
|
||||
import { DMS_MAP } from "../../utils/dmsUtils";
|
||||
import RRPostForm from "./rr-dms-post-form";
|
||||
import CdkLikePostForm from "./cdklike-dms-post-form";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
bodyshop: selectBodyshop
|
||||
});
|
||||
const mapDispatchToProps = () => ({
|
||||
//setUserLanguage: language => dispatch(setUserLanguage(language))
|
||||
});
|
||||
const mapDispatchToProps = () => ({});
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(DmsPostForm);
|
||||
|
||||
export function DmsPostForm({ bodyshop, socket, job, logsRef }) {
|
||||
const [form] = Form.useForm();
|
||||
const { t } = useTranslation();
|
||||
/**
|
||||
* DMS Post Form component that renders the appropriate post form
|
||||
* @param mode
|
||||
* @param bodyshop
|
||||
* @param socket
|
||||
* @param job
|
||||
* @param logsRef
|
||||
* @returns {JSX.Element|null}
|
||||
* @constructor
|
||||
*/
|
||||
export function DmsPostForm({ mode, bodyshop, socket, job, logsRef }) {
|
||||
switch (mode) {
|
||||
case DMS_MAP.reynolds:
|
||||
return <RRPostForm bodyshop={bodyshop} socket={socket} job={job} logsRef={logsRef} />;
|
||||
|
||||
const handlePayerSelect = (value, index) => {
|
||||
form.setFieldsValue({
|
||||
payers: form.getFieldValue("payers").map((payer, mapIndex) => {
|
||||
if (index !== mapIndex) return payer;
|
||||
const cdkPayer =
|
||||
bodyshop.cdk_configuration.payers && bodyshop.cdk_configuration.payers.find((i) => i.name === value);
|
||||
// CDK (legacy /ws), Fortellis (CDK-over-WSS), and PBS share the same UI;
|
||||
// we pass mode down so the child can choose the correct event name.
|
||||
case DMS_MAP.fortellis:
|
||||
case DMS_MAP.cdk:
|
||||
case DMS_MAP.pbs:
|
||||
return <CdkLikePostForm mode={mode} bodyshop={bodyshop} socket={socket} job={job} logsRef={logsRef} />;
|
||||
|
||||
if (!cdkPayer) return payer;
|
||||
|
||||
return {
|
||||
...cdkPayer,
|
||||
dms_acctnumber: cdkPayer.dms_acctnumber,
|
||||
controlnumber: job && job[cdkPayer.control_type]
|
||||
};
|
||||
})
|
||||
});
|
||||
};
|
||||
|
||||
const handleFinish = (values) => {
|
||||
socket.emit(`${determineDmsType(bodyshop)}-export-job`, {
|
||||
jobid: job.id,
|
||||
txEnvelope: values
|
||||
});
|
||||
console.log(logsRef);
|
||||
if (logsRef) {
|
||||
console.log("executing", logsRef);
|
||||
logsRef.curent &&
|
||||
logsRef.current.scrollIntoView({
|
||||
behavior: "smooth"
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Card title={t("jobs.labels.dms.postingform")}>
|
||||
<Form
|
||||
form={form}
|
||||
layout="vertical"
|
||||
onFinish={handleFinish}
|
||||
initialValues={{
|
||||
story: `${t("jobs.labels.dms.defaultstory", {
|
||||
ro_number: job.ro_number,
|
||||
ownr_nm: `${job.ownr_fn || ""} ${job.ownr_ln || ""} ${job.ownr_co_nm || ""}`.trim(),
|
||||
ins_co_nm: job.ins_co_nm || "N/A",
|
||||
clm_po: `${job.clm_no ? `${job.clm_no} ` : ""}${job.po_number || ""}`
|
||||
}).trim()}.${
|
||||
job.area_of_damage && job.area_of_damage.impact1
|
||||
? " " +
|
||||
t("jobs.labels.dms.damageto", {
|
||||
area_of_damage: (job.area_of_damage && job.area_of_damage.impact1.padStart(2, "0")) || "UNKNOWN"
|
||||
})
|
||||
: ""
|
||||
}`.slice(0, 239),
|
||||
inservicedate: dayjs(
|
||||
`${(job.v_model_yr && (job.v_model_yr < 100 ? (job.v_model_yr >= (dayjs().year() + 1) % 100 ? 1900 + parseInt(job.v_model_yr) : 2000 + parseInt(job.v_model_yr)) : job.v_model_yr)) || 2019}-01-01`
|
||||
)
|
||||
}}
|
||||
>
|
||||
<LayoutFormRow grow>
|
||||
<Form.Item
|
||||
name="journal"
|
||||
label={t("jobs.fields.dms.journal")}
|
||||
initialValue={bodyshop.cdk_configuration && bodyshop.cdk_configuration.default_journal}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
//message: t("general.validation.required"),
|
||||
}
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
name="kmin"
|
||||
label={t("jobs.fields.kmin")}
|
||||
initialValue={job && job.kmin}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
//message: t("general.validation.required"),
|
||||
}
|
||||
]}
|
||||
>
|
||||
<InputNumber disabled />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
name="kmout"
|
||||
label={t("jobs.fields.kmout")}
|
||||
initialValue={job && job.kmout}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
//message: t("general.validation.required"),
|
||||
}
|
||||
]}
|
||||
>
|
||||
<InputNumber disabled />
|
||||
</Form.Item>
|
||||
</LayoutFormRow>
|
||||
|
||||
{bodyshop.cdk_dealerid && (
|
||||
<div>
|
||||
<LayoutFormRow style={{ justifyContent: "center" }} grow>
|
||||
<Form.Item
|
||||
name="dms_make"
|
||||
label={t("jobs.fields.dms.dms_make")}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
}
|
||||
]}
|
||||
>
|
||||
<Input disabled />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
name="dms_model"
|
||||
label={t("jobs.fields.dms.dms_model")}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
}
|
||||
]}
|
||||
>
|
||||
<Input disabled />
|
||||
</Form.Item>
|
||||
<Form.Item name="inservicedate" label={t("jobs.fields.dms.inservicedate")}>
|
||||
<DateTimePicker isDateOnly />
|
||||
</Form.Item>
|
||||
</LayoutFormRow>
|
||||
<Space>
|
||||
<DmsCdkMakes form={form} socket={socket} job={job} />
|
||||
<DmsCdkMakesRefetch />
|
||||
<Form.Item name="dms_unsold" label={t("jobs.fields.dms.dms_unsold")} initialValue={false}>
|
||||
<Switch />
|
||||
</Form.Item>
|
||||
<Form.Item name="dms_model_override" label={t("jobs.fields.dms.dms_model_override")} initialValue={false}>
|
||||
<Switch />
|
||||
</Form.Item>
|
||||
</Space>
|
||||
</div>
|
||||
)}
|
||||
<Form.Item
|
||||
name="story"
|
||||
label={t("jobs.fields.dms.story")}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
}
|
||||
]}
|
||||
>
|
||||
<Input.TextArea maxLength={240} />
|
||||
</Form.Item>
|
||||
|
||||
<Divider />
|
||||
<Space size="large" wrap align="center">
|
||||
<Statistic
|
||||
title={t("jobs.fields.ded_amt")}
|
||||
value={Dinero(job.job_totals.totals.custPayable.deductible).toFormat()}
|
||||
/>
|
||||
<Statistic
|
||||
title={t("jobs.labels.total_cust_payable")}
|
||||
value={Dinero(job.job_totals.totals.custPayable.total).toFormat()}
|
||||
/>
|
||||
<Statistic
|
||||
title={t("jobs.labels.net_repairs")}
|
||||
value={Dinero(job.job_totals.totals.net_repairs).toFormat()}
|
||||
/>
|
||||
</Space>
|
||||
<Form.List name={["payers"]}>
|
||||
{(fields, { add, remove }) => {
|
||||
return (
|
||||
<div>
|
||||
{fields.map((field, index) => (
|
||||
<Form.Item key={field.key}>
|
||||
<Space wrap>
|
||||
<Form.Item
|
||||
label={t("jobs.fields.dms.payer.name")}
|
||||
key={`${index}name`}
|
||||
name={[field.name, "name"]}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
}
|
||||
]}
|
||||
>
|
||||
<Select style={{ minWidth: "15rem" }} onSelect={(value) => handlePayerSelect(value, index)}>
|
||||
{bodyshop.cdk_configuration &&
|
||||
bodyshop.cdk_configuration.payers &&
|
||||
bodyshop.cdk_configuration.payers.map((payer) => (
|
||||
<Select.Option key={payer.name}>{payer.name}</Select.Option>
|
||||
))}
|
||||
</Select>
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item
|
||||
label={t("jobs.fields.dms.payer.dms_acctnumber")}
|
||||
key={`${index}dms_acctnumber`}
|
||||
name={[field.name, "dms_acctnumber"]}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
}
|
||||
]}
|
||||
>
|
||||
<Input disabled />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item
|
||||
label={t("jobs.fields.dms.payer.amount")}
|
||||
key={`${index}amount`}
|
||||
name={[field.name, "amount"]}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
}
|
||||
]}
|
||||
>
|
||||
<CurrencyInput min={0} />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item
|
||||
label={
|
||||
<div>
|
||||
{t("jobs.fields.dms.payer.controlnumber")}{" "}
|
||||
<Dropdown
|
||||
menu={{
|
||||
items: bodyshop.cdk_configuration.controllist?.map((key, idx) => ({
|
||||
key: idx,
|
||||
label: key.name,
|
||||
onClick: () => {
|
||||
form.setFieldsValue({
|
||||
payers: form.getFieldValue("payers").map((row, mapIndex) => {
|
||||
if (index !== mapIndex) return row;
|
||||
return {
|
||||
...row,
|
||||
controlnumber: key.controlnumber
|
||||
};
|
||||
})
|
||||
});
|
||||
}
|
||||
}))
|
||||
}}
|
||||
>
|
||||
<a href=" #" onClick={(e) => e.preventDefault()}>
|
||||
<DownOutlined />
|
||||
</a>
|
||||
</Dropdown>
|
||||
</div>
|
||||
}
|
||||
key={`${index}controlnumber`}
|
||||
name={[field.name, "controlnumber"]}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
}
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item shouldUpdate>
|
||||
{() => {
|
||||
const payers = form.getFieldValue("payers");
|
||||
|
||||
const row = payers && payers[index];
|
||||
|
||||
const cdkPayer =
|
||||
bodyshop.cdk_configuration.payers &&
|
||||
bodyshop.cdk_configuration.payers.find((i) => i && row && i.name === row.name);
|
||||
if (i18n.exists(`jobs.fields.${cdkPayer?.control_type}`))
|
||||
return <div>{cdkPayer && t(`jobs.fields.${cdkPayer?.control_type}`)}</div>;
|
||||
else if (i18n.exists(`jobs.fields.dms.control_type.${cdkPayer?.control_type}`)) {
|
||||
return <div>{cdkPayer && t(`jobs.fields.dms.control_type.${cdkPayer?.control_type}`)}</div>;
|
||||
} else {
|
||||
return null;
|
||||
}
|
||||
}}
|
||||
</Form.Item>
|
||||
|
||||
<DeleteFilled
|
||||
onClick={() => {
|
||||
remove(field.name);
|
||||
}}
|
||||
/>
|
||||
</Space>
|
||||
</Form.Item>
|
||||
))}
|
||||
<Form.Item>
|
||||
<Button
|
||||
disabled={!(fields.length < 3)}
|
||||
onClick={() => {
|
||||
if (fields.length < 3) add();
|
||||
}}
|
||||
style={{ width: "100%" }}
|
||||
>
|
||||
{t("jobs.actions.dms.addpayer")}
|
||||
</Button>
|
||||
</Form.Item>
|
||||
</div>
|
||||
);
|
||||
}}
|
||||
</Form.List>
|
||||
<Form.Item shouldUpdate>
|
||||
{() => {
|
||||
//Perform Calculation to determine discrepancy.
|
||||
let totalAllocated = Dinero();
|
||||
|
||||
const payers = form.getFieldValue("payers");
|
||||
payers &&
|
||||
payers.forEach((payer) => {
|
||||
totalAllocated = totalAllocated.add(Dinero({ amount: Math.round((payer?.amount || 0) * 100) }));
|
||||
});
|
||||
|
||||
const totals =
|
||||
socket.allocationsSummary &&
|
||||
socket.allocationsSummary.reduce(
|
||||
(acc, val) => {
|
||||
return {
|
||||
totalSale: acc.totalSale.add(Dinero(val.sale)),
|
||||
totalCost: acc.totalCost.add(Dinero(val.cost))
|
||||
};
|
||||
},
|
||||
{
|
||||
totalSale: Dinero(),
|
||||
totalCost: Dinero()
|
||||
}
|
||||
);
|
||||
const discrep = totals ? totals.totalSale.subtract(totalAllocated) : Dinero();
|
||||
return (
|
||||
<Space size="large" wrap align="center">
|
||||
<Statistic
|
||||
title={t("jobs.labels.subtotal")}
|
||||
value={(totals ? totals.totalSale : Dinero()).toFormat()}
|
||||
/>
|
||||
<Typography.Title>-</Typography.Title>
|
||||
<Statistic title={t("jobs.labels.dms.totalallocated")} value={totalAllocated.toFormat()} />
|
||||
<Typography.Title>=</Typography.Title>
|
||||
<Statistic
|
||||
title={t("jobs.labels.dms.notallocated")}
|
||||
valueStyle={{
|
||||
color: discrep.getAmount() === 0 ? "green" : "red"
|
||||
}}
|
||||
value={discrep.toFormat()}
|
||||
/>
|
||||
<Button disabled={!socket.allocationsSummary || discrep.getAmount() !== 0} htmlType="submit">
|
||||
{t("jobs.actions.dms.post")}
|
||||
</Button>
|
||||
</Space>
|
||||
);
|
||||
}}
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</Card>
|
||||
);
|
||||
default:
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
242
client/src/components/dms-post-form/rr-dms-post-form.jsx
Normal file
242
client/src/components/dms-post-form/rr-dms-post-form.jsx
Normal file
@@ -0,0 +1,242 @@
|
||||
import { ReloadOutlined } from "@ant-design/icons";
|
||||
import {
|
||||
Button,
|
||||
Card,
|
||||
Col,
|
||||
Divider,
|
||||
Form,
|
||||
Input,
|
||||
InputNumber,
|
||||
Row,
|
||||
Select,
|
||||
Space,
|
||||
Statistic,
|
||||
Tooltip,
|
||||
Typography
|
||||
} from "antd";
|
||||
import Dinero from "dinero.js";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useEffect, useMemo, useState } from "react";
|
||||
import dayjs from "../../utils/day";
|
||||
|
||||
/**
|
||||
* RR DMS Post Form component
|
||||
* Submit: "rr-export-job"
|
||||
* @param bodyshop
|
||||
* @param socket
|
||||
* @param job
|
||||
* @param logsRef
|
||||
* @returns {JSX.Element}
|
||||
* @constructor
|
||||
*/
|
||||
export default function RRPostForm({ bodyshop, socket, job, logsRef }) {
|
||||
const [form] = Form.useForm();
|
||||
const { t } = useTranslation();
|
||||
|
||||
// Advisors
|
||||
const [advisors, setAdvisors] = useState([]);
|
||||
const [advLoading, setAdvLoading] = useState(false);
|
||||
|
||||
const getAdvisorNumber = (a) => a?.advisorId;
|
||||
|
||||
const getAdvisorLabel = (a) => `${a?.firstName || ""} ${a?.lastName || ""}`.trim();
|
||||
|
||||
const fetchRrAdvisors = (refresh = false) => {
|
||||
if (!socket) return;
|
||||
setAdvLoading(true);
|
||||
|
||||
const onResult = (payload) => {
|
||||
try {
|
||||
const list = payload?.result ?? payload ?? [];
|
||||
setAdvisors(Array.isArray(list) ? list : []);
|
||||
} finally {
|
||||
setAdvLoading(false);
|
||||
socket.off("rr-get-advisors:result", onResult);
|
||||
}
|
||||
};
|
||||
|
||||
socket.once("rr-get-advisors:result", onResult);
|
||||
socket.emit("rr-get-advisors", { departmentType: "B", refresh }, (ack) => {
|
||||
if (ack?.ok) {
|
||||
const list = ack.result ?? [];
|
||||
setAdvisors(Array.isArray(list) ? list : []);
|
||||
} else if (ack) {
|
||||
console.error("Something went wrong fetching DMS Advisors");
|
||||
}
|
||||
setAdvLoading(false);
|
||||
socket.off("rr-get-advisors:result", onResult);
|
||||
});
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
fetchRrAdvisors(false);
|
||||
}, [bodyshop?.id, socket]);
|
||||
|
||||
const initialValues = useMemo(
|
||||
() => ({
|
||||
story: `${t("jobs.labels.dms.defaultstory", {
|
||||
ro_number: job.ro_number,
|
||||
ownr_nm: `${job.ownr_fn || ""} ${job.ownr_ln || ""} ${job.ownr_co_nm || ""}`.trim(),
|
||||
ins_co_nm: job.ins_co_nm || "N/A",
|
||||
clm_po: `${job.clm_no ? `${job.clm_no} ` : ""}${job.po_number || ""}`
|
||||
}).trim()}.${
|
||||
job.area_of_damage?.impact1
|
||||
? " " +
|
||||
t("jobs.labels.dms.damageto", {
|
||||
area_of_damage: (job.area_of_damage && job.area_of_damage.impact1.padStart(2, "0")) || "UNKNOWN"
|
||||
})
|
||||
: ""
|
||||
}`.slice(0, 239),
|
||||
inservicedate: dayjs(
|
||||
`${
|
||||
(job.v_model_yr &&
|
||||
(job.v_model_yr < 100
|
||||
? job.v_model_yr >= (dayjs().year() + 1) % 100
|
||||
? 1900 + parseInt(job.v_model_yr, 10)
|
||||
: 2000 + parseInt(job.v_model_yr, 10)
|
||||
: job.v_model_yr)) ||
|
||||
2019
|
||||
}-01-01`
|
||||
)
|
||||
}),
|
||||
[job, t]
|
||||
);
|
||||
|
||||
const handleFinish = (values) => {
|
||||
if (!socket) return;
|
||||
socket.emit("rr-export-job", {
|
||||
bodyshopId: bodyshop?.id,
|
||||
jobId: job.id,
|
||||
job,
|
||||
txEnvelope: values
|
||||
});
|
||||
logsRef?.current?.scrollIntoView({ behavior: "smooth" });
|
||||
};
|
||||
|
||||
// Discrepancy is ignored for RR; we still show totals for operator context
|
||||
const totals = socket?.allocationsSummary
|
||||
? socket.allocationsSummary.reduce(
|
||||
(acc, val) => ({
|
||||
totalSale: acc.totalSale.add(Dinero(val.sale)),
|
||||
totalCost: acc.totalCost.add(Dinero(val.cost))
|
||||
}),
|
||||
{ totalSale: Dinero(), totalCost: Dinero() }
|
||||
)
|
||||
: { totalSale: Dinero(), totalCost: Dinero() };
|
||||
|
||||
return (
|
||||
<Card title={t("jobs.labels.dms.postingform")}>
|
||||
<Form
|
||||
form={form}
|
||||
layout="vertical"
|
||||
onFinish={handleFinish}
|
||||
style={{ width: "100%" }}
|
||||
initialValues={initialValues}
|
||||
>
|
||||
<Row gutter={[16, 12]} align="bottom">
|
||||
{/* Advisor + inline Refresh */}
|
||||
<Col xs={24} sm={24} md={12} lg={8}>
|
||||
<Form.Item label={t("jobs.fields.dms.advisor")} required>
|
||||
<Space.Compact block>
|
||||
<Form.Item
|
||||
name="advisorNo"
|
||||
noStyle
|
||||
rules={[{ required: true, message: t("general.validation.required") }]}
|
||||
>
|
||||
<Select
|
||||
style={{ flex: 1 }}
|
||||
loading={advLoading}
|
||||
allowClear
|
||||
placeholder={t("general.actions.select", "Select...")}
|
||||
popupMatchSelectWidth
|
||||
options={advisors
|
||||
.map((a) => {
|
||||
const value = getAdvisorNumber(a);
|
||||
if (value == null) return null;
|
||||
return { value: String(value), label: getAdvisorLabel(a) || String(value) };
|
||||
})
|
||||
.filter(Boolean)}
|
||||
notFoundContent={advLoading ? t("general.labels.loading") : t("general.labels.none")}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Tooltip title={t("general.actions.refresh")}>
|
||||
<Button
|
||||
aria-label={t("general.actions.refresh")}
|
||||
icon={<ReloadOutlined />}
|
||||
onClick={() => fetchRrAdvisors(true)}
|
||||
loading={advLoading}
|
||||
/>
|
||||
</Tooltip>
|
||||
</Space.Compact>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
|
||||
{/* Make Override */}
|
||||
<Col xs={24} sm={12} md={12} lg={8}>
|
||||
<Form.Item name="makeOverride" label={t("jobs.fields.dms.make_override")}>
|
||||
<Input allowClear placeholder={t("general.actions.optional")} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
|
||||
<Col xs={12} sm={8} md={6} lg={4}>
|
||||
<Form.Item name="kmin" label={t("jobs.fields.kmin")} initialValue={job?.kmin} rules={[{ required: true }]}>
|
||||
<InputNumber style={{ width: "100%" }} disabled />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
|
||||
<Col xs={12} sm={8} md={6} lg={4}>
|
||||
<Form.Item
|
||||
name="kmout"
|
||||
label={t("jobs.fields.kmout")}
|
||||
initialValue={job?.kmout}
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
<InputNumber style={{ width: "100%" }} disabled />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
<Row gutter={[16, 12]}>
|
||||
<Col span={24}>
|
||||
<Form.Item name="story" label={t("jobs.fields.dms.story")} rules={[{ required: true }]}>
|
||||
<Input.TextArea maxLength={240} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
<Divider />
|
||||
|
||||
<Space size="large" wrap align="center" style={{ marginBottom: 16 }}>
|
||||
<Statistic
|
||||
title={t("jobs.fields.ded_amt")}
|
||||
value={Dinero(job.job_totals.totals.custPayable.deductible).toFormat()}
|
||||
/>
|
||||
<Statistic
|
||||
title={t("jobs.labels.total_cust_payable")}
|
||||
value={Dinero(job.job_totals.totals.custPayable.total).toFormat()}
|
||||
/>
|
||||
<Statistic
|
||||
title={t("jobs.labels.net_repairs")}
|
||||
value={Dinero(job.job_totals.totals.net_repairs).toFormat()}
|
||||
/>
|
||||
</Space>
|
||||
|
||||
{/* Validation */}
|
||||
<Form.Item shouldUpdate>
|
||||
{() => {
|
||||
const advisorOk = !!form.getFieldValue("advisorNo");
|
||||
return (
|
||||
<Space size="large" wrap align="center">
|
||||
<Statistic title={t("jobs.labels.subtotal")} value={totals.totalSale.toFormat()} />
|
||||
<Typography.Title>=</Typography.Title>
|
||||
<Button disabled={!advisorOk} htmlType="submit">
|
||||
{t("jobs.actions.dms.post")}
|
||||
</Button>
|
||||
</Space>
|
||||
);
|
||||
}}
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
@@ -1,166 +0,0 @@
|
||||
import axios from "axios";
|
||||
import { Result } from "antd";
|
||||
import * as markerjs2 from "markerjs2";
|
||||
import { useCallback, useEffect, useRef, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { selectBodyshop, selectCurrentUser } from "../../redux/user/user.selectors";
|
||||
import { handleUpload } from "../documents-local-upload/documents-local-upload.utility";
|
||||
import LoadingSpinner from "../loading-spinner/loading-spinner.component";
|
||||
import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
currentUser: selectCurrentUser,
|
||||
bodyshop: selectBodyshop
|
||||
});
|
||||
const mapDispatchToProps = () => ({});
|
||||
|
||||
export function DocumentEditorLocalComponent({ imageUrl, filename, jobid }) {
|
||||
const imgRef = useRef(null);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [uploaded, setuploaded] = useState(false);
|
||||
const [loadedImageUrl, setLoadedImageUrl] = useState(null);
|
||||
const [imageLoaded, setImageLoaded] = useState(false);
|
||||
const [imageLoading, setImageLoading] = useState(true);
|
||||
const markerArea = useRef(null);
|
||||
const { t } = useTranslation();
|
||||
const notification = useNotification();
|
||||
const [uploading, setUploading] = useState(false);
|
||||
|
||||
const triggerUpload = useCallback(
|
||||
async (dataUrl) => {
|
||||
if (uploading) return;
|
||||
setUploading(true);
|
||||
const blob = await b64toBlob(dataUrl);
|
||||
const nameWithoutExt = filename.split(".").slice(0, -1).join(".").trim();
|
||||
const parts = nameWithoutExt.split("-");
|
||||
const baseParts = [];
|
||||
for (let i = 0; i < parts.length; i++) {
|
||||
if (/^\d+$/.test(parts[i])) {
|
||||
break;
|
||||
}
|
||||
baseParts.push(parts[i]);
|
||||
}
|
||||
const adjustedBase = baseParts.length > 0 ? baseParts.join("-") : "edited";
|
||||
const adjustedFilename = `${adjustedBase}.jpg`;
|
||||
const file = new File([blob], adjustedFilename, { type: "image/jpeg" });
|
||||
|
||||
handleUpload({
|
||||
ev: {
|
||||
file: file,
|
||||
filename: adjustedFilename,
|
||||
onSuccess: () => {
|
||||
setUploading(false);
|
||||
setLoading(false);
|
||||
setuploaded(true);
|
||||
},
|
||||
onError: () => {
|
||||
setUploading(false);
|
||||
setLoading(false);
|
||||
}
|
||||
},
|
||||
context: {
|
||||
jobid: jobid,
|
||||
callback: () => {} // Optional callback
|
||||
},
|
||||
notification
|
||||
});
|
||||
},
|
||||
[filename, jobid, notification, uploading]
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
if (imgRef.current !== null && imageLoaded && !markerArea.current) {
|
||||
// create a marker.js MarkerArea
|
||||
markerArea.current = new markerjs2.MarkerArea(imgRef.current);
|
||||
|
||||
// attach an event handler to assign annotated image back to our image element
|
||||
markerArea.current.addEventListener("close", () => {
|
||||
// NO OP
|
||||
});
|
||||
|
||||
markerArea.current.addEventListener("render", (event) => {
|
||||
const dataUrl = event.dataUrl;
|
||||
imgRef.current.src = dataUrl;
|
||||
markerArea.current.close();
|
||||
triggerUpload(dataUrl);
|
||||
});
|
||||
// launch marker.js
|
||||
|
||||
markerArea.current.renderAtNaturalSize = true;
|
||||
markerArea.current.renderImageType = "image/jpeg";
|
||||
markerArea.current.renderImageQuality = 1;
|
||||
//markerArea.current.settings.displayMode = "inline";
|
||||
markerArea.current.show();
|
||||
}
|
||||
}, [triggerUpload, imageLoaded]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!imageUrl) return;
|
||||
const controller = new AbortController();
|
||||
|
||||
const loadImage = async () => {
|
||||
setImageLoaded(false);
|
||||
setImageLoading(true);
|
||||
try {
|
||||
const response = await axios.get(imageUrl, { responseType: "blob", signal: controller.signal });
|
||||
const blobUrl = URL.createObjectURL(response.data);
|
||||
setLoadedImageUrl((prevUrl) => {
|
||||
if (prevUrl) URL.revokeObjectURL(prevUrl);
|
||||
return blobUrl;
|
||||
});
|
||||
} catch (error) {
|
||||
if (axios.isCancel?.(error) || error.name === "CanceledError") {
|
||||
// request was aborted — safe to ignore
|
||||
return;
|
||||
}
|
||||
console.error("Failed to fetch image blob", error);
|
||||
} finally {
|
||||
if (!controller.signal.aborted) {
|
||||
setImageLoading(false);
|
||||
}
|
||||
}
|
||||
};
|
||||
loadImage();
|
||||
return () => {
|
||||
controller.abort();
|
||||
};
|
||||
}, [imageUrl]);
|
||||
|
||||
useEffect(() => {
|
||||
return () => {
|
||||
if (loadedImageUrl) {
|
||||
URL.revokeObjectURL(loadedImageUrl);
|
||||
}
|
||||
};
|
||||
}, [loadedImageUrl]);
|
||||
|
||||
async function b64toBlob(url) {
|
||||
const res = await fetch(url);
|
||||
return await res.blob();
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
{!loading && !uploaded && loadedImageUrl && (
|
||||
<img
|
||||
ref={imgRef}
|
||||
src={loadedImageUrl}
|
||||
alt="sample"
|
||||
onLoad={() => setImageLoaded(true)}
|
||||
onError={(error) => {
|
||||
console.error("Failed to load image", error);
|
||||
}}
|
||||
style={{ maxWidth: "90vw", maxHeight: "90vh" }}
|
||||
/>
|
||||
)}
|
||||
{(loading || imageLoading || !imageLoaded) && !uploaded && (
|
||||
<LoadingSpinner message={t("documents.labels.uploading")} />
|
||||
)}
|
||||
{uploaded && <Result status="success" title={t("documents.successes.edituploaded")} />}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(DocumentEditorLocalComponent);
|
||||
@@ -1,5 +1,4 @@
|
||||
//import "tui-image-editor/dist/tui-image-editor.css";
|
||||
import axios from "axios";
|
||||
import { Result } from "antd";
|
||||
import * as markerjs2 from "markerjs2";
|
||||
import { useCallback, useEffect, useRef, useState } from "react";
|
||||
@@ -7,7 +6,8 @@ import { useTranslation } from "react-i18next";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { selectBodyshop, selectCurrentUser } from "../../redux/user/user.selectors";
|
||||
import { handleUpload } from "../documents-upload-imgproxy/documents-upload-imgproxy.utility.js";
|
||||
import { handleUpload } from "../documents-upload/documents-upload.utility";
|
||||
import { GenerateSrcUrl } from "../jobs-documents-gallery/job-documents.utility";
|
||||
import LoadingSpinner from "../loading-spinner/loading-spinner.component";
|
||||
import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
|
||||
|
||||
@@ -23,9 +23,6 @@ export function DocumentEditorComponent({ currentUser, bodyshop, document }) {
|
||||
const imgRef = useRef(null);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [uploaded, setuploaded] = useState(false);
|
||||
const [imageUrl, setImageUrl] = useState(null);
|
||||
const [imageLoaded, setImageLoaded] = useState(false);
|
||||
const [imageLoading, setImageLoading] = useState(true);
|
||||
const markerArea = useRef(null);
|
||||
const { t } = useTranslation();
|
||||
const notification = useNotification();
|
||||
@@ -58,7 +55,7 @@ export function DocumentEditorComponent({ currentUser, bodyshop, document }) {
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
if (imgRef.current !== null && imageLoaded && !markerArea.current) {
|
||||
if (imgRef.current !== null) {
|
||||
// create a marker.js MarkerArea
|
||||
markerArea.current = new markerjs2.MarkerArea(imgRef.current);
|
||||
|
||||
@@ -81,52 +78,7 @@ export function DocumentEditorComponent({ currentUser, bodyshop, document }) {
|
||||
//markerArea.current.settings.displayMode = "inline";
|
||||
markerArea.current.show();
|
||||
}
|
||||
}, [triggerUpload, imageLoaded]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!document?.id) return;
|
||||
const controller = new AbortController();
|
||||
|
||||
const loadImage = async () => {
|
||||
setImageLoaded(false);
|
||||
setImageLoading(true);
|
||||
try {
|
||||
const response = await axios.post(
|
||||
"/media/imgproxy/original",
|
||||
{ documentId: document.id },
|
||||
{
|
||||
responseType: "blob",
|
||||
signal: controller.signal
|
||||
}
|
||||
);
|
||||
const blobUrl = URL.createObjectURL(response.data);
|
||||
setImageUrl((prevUrl) => {
|
||||
if (prevUrl) URL.revokeObjectURL(prevUrl);
|
||||
return blobUrl;
|
||||
});
|
||||
} catch (error) {
|
||||
if (axios.isCancel?.(error) || error.name === "CanceledError") {
|
||||
// request was aborted — safe to ignore
|
||||
return;
|
||||
}
|
||||
console.error("Failed to fetch original image blob", error);
|
||||
} finally {
|
||||
setImageLoading(false);
|
||||
}
|
||||
};
|
||||
loadImage();
|
||||
return () => {
|
||||
controller.abort();
|
||||
};
|
||||
}, [document]);
|
||||
|
||||
useEffect(() => {
|
||||
return () => {
|
||||
if (imageUrl) {
|
||||
URL.revokeObjectURL(imageUrl);
|
||||
}
|
||||
};
|
||||
}, [imageUrl]);
|
||||
}, [triggerUpload]);
|
||||
|
||||
async function b64toBlob(url) {
|
||||
const res = await fetch(url);
|
||||
@@ -135,21 +87,16 @@ export function DocumentEditorComponent({ currentUser, bodyshop, document }) {
|
||||
|
||||
return (
|
||||
<div>
|
||||
{!loading && !uploaded && imageUrl && (
|
||||
{!loading && !uploaded && (
|
||||
<img
|
||||
ref={imgRef}
|
||||
src={imageUrl}
|
||||
src={GenerateSrcUrl(document)}
|
||||
alt="sample"
|
||||
onLoad={() => setImageLoaded(true)}
|
||||
onError={(error) => {
|
||||
console.error("Failed to load original image", error);
|
||||
}}
|
||||
crossOrigin="anonymous"
|
||||
style={{ maxWidth: "90vw", maxHeight: "90vh" }}
|
||||
/>
|
||||
)}
|
||||
{(loading || imageLoading || !imageLoaded) && !uploaded && (
|
||||
<LoadingSpinner message={t("documents.labels.uploading")} />
|
||||
)}
|
||||
{loading && <LoadingSpinner message={t("documents.labels.uploading")} />}
|
||||
{uploaded && <Result status="success" title={t("documents.successes.edituploaded")} />}
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -11,7 +11,6 @@ import { setBodyshop } from "../../redux/user/user.actions";
|
||||
import AlertComponent from "../alert/alert.component";
|
||||
import LoadingSpinner from "../loading-spinner/loading-spinner.component";
|
||||
import DocumentEditor from "./document-editor.component";
|
||||
import { DocumentEditorLocalComponent } from "./document-editor-local.component";
|
||||
|
||||
const mapDispatchToProps = (dispatch) => ({
|
||||
setBodyshop: (bs) => dispatch(setBodyshop(bs))
|
||||
@@ -22,7 +21,7 @@ export default connect(null, mapDispatchToProps)(DocumentEditorContainer);
|
||||
export function DocumentEditorContainer({ setBodyshop }) {
|
||||
//Get the image details for the image to be saved.
|
||||
//Get the document id from the search string.
|
||||
const { documentId, imageUrl, filename, jobid } = queryString.parse(useLocation().search);
|
||||
const { documentId } = queryString.parse(useLocation().search);
|
||||
const { t } = useTranslation();
|
||||
const {
|
||||
loading: loadingShop,
|
||||
@@ -33,45 +32,24 @@ export function DocumentEditorContainer({ setBodyshop }) {
|
||||
nextFetchPolicy: "network-only"
|
||||
});
|
||||
|
||||
const isLocalMedia = !!dataShop?.bodyshops?.[0]?.uselocalmediaserver;
|
||||
|
||||
const {
|
||||
loading: loadingDoc,
|
||||
error: errorDoc,
|
||||
data: dataDoc
|
||||
} = useQuery(GET_DOCUMENT_BY_PK, {
|
||||
variables: { documentId },
|
||||
skip: !documentId || isLocalMedia,
|
||||
fetchPolicy: "network-only",
|
||||
nextFetchPolicy: "network-only"
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
if (dataShop) setBodyshop(dataShop.bodyshops[0]);
|
||||
}, [dataShop, setBodyshop]);
|
||||
|
||||
if (loadingShop) return <LoadingSpinner />;
|
||||
if (errorShop) return <AlertComponent message={errorShop.message} type="error" />;
|
||||
const { loading, error, data } = useQuery(GET_DOCUMENT_BY_PK, {
|
||||
variables: { documentId },
|
||||
skip: !documentId,
|
||||
fetchPolicy: "network-only",
|
||||
nextFetchPolicy: "network-only"
|
||||
});
|
||||
|
||||
if (isLocalMedia) {
|
||||
if (imageUrl && filename && jobid) {
|
||||
return (
|
||||
<div>
|
||||
<DocumentEditorLocalComponent imageUrl={imageUrl} filename={filename} jobid={jobid} />
|
||||
</div>
|
||||
);
|
||||
} else {
|
||||
return <Result status="404" title={t("general.errors.notfound")} />;
|
||||
}
|
||||
}
|
||||
if (loading || loadingShop) return <LoadingSpinner />;
|
||||
if (error || errorShop) return <AlertComponent message={error.message || errorShop.message} type="error" />;
|
||||
|
||||
if (loadingDoc) return <LoadingSpinner />;
|
||||
if (errorDoc) return <AlertComponent message={errorDoc.message} type="error" />;
|
||||
|
||||
if (!dataDoc || !dataDoc.documents_by_pk) return <Result status="404" title={t("general.errors.notfound")} />;
|
||||
if (!data || !data.documents_by_pk) return <Result status="404" title={t("general.errors.notfound")} />;
|
||||
return (
|
||||
<div>
|
||||
<DocumentEditor document={dataDoc ? dataDoc.documents_by_pk : null} />
|
||||
<DocumentEditor document={data ? data.documents_by_pk : null} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -55,8 +55,7 @@ const Eula = ({ currentEula, currentUser, acceptEula }) => {
|
||||
const useremail = currentUser.email;
|
||||
|
||||
try {
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
const { accepted_terms, ...otherFormValues } = formValues;
|
||||
const { ...otherFormValues } = formValues;
|
||||
|
||||
// Trim the values of the fields before submitting
|
||||
const trimmedFormValues = Object.entries(otherFormValues).reduce((acc, [key, value]) => {
|
||||
|
||||
@@ -73,8 +73,8 @@ export default function GlobalSearchOs() {
|
||||
<span>
|
||||
<OwnerNameDisplay ownerObject={owner} />
|
||||
</span>
|
||||
<PhoneNumberFormatter type={owner?.ownr_ph1_ty}>{owner.ownr_ph1}</PhoneNumberFormatter>
|
||||
<PhoneNumberFormatter type={owner?.ownr_ph2_ty}>{owner.ownr_ph2}</PhoneNumberFormatter>
|
||||
<PhoneNumberFormatter>{owner.ownr_ph1}</PhoneNumberFormatter>
|
||||
<PhoneNumberFormatter>{owner.ownr_ph2}</PhoneNumberFormatter>
|
||||
</Space>
|
||||
</Link>
|
||||
)
|
||||
|
||||
@@ -63,8 +63,8 @@ export default function GlobalSearch() {
|
||||
<span>
|
||||
<OwnerNameDisplay ownerObject={owner} />
|
||||
</span>
|
||||
<PhoneNumberFormatter type={owner.ownr_ph1_ty}>{owner.ownr_ph1}</PhoneNumberFormatter>
|
||||
<PhoneNumberFormatter type={owner.ownr_ph2_ty}>{owner.ownr_ph2}</PhoneNumberFormatter>
|
||||
<PhoneNumberFormatter>{owner.ownr_ph1}</PhoneNumberFormatter>
|
||||
<PhoneNumberFormatter>{owner.ownr_ph2}</PhoneNumberFormatter>
|
||||
</Space>
|
||||
</Link>
|
||||
)
|
||||
|
||||
@@ -141,7 +141,7 @@ const buildAccountingChildren = ({
|
||||
</Link>
|
||||
)
|
||||
},
|
||||
...(!((bodyshop && bodyshop.cdk_dealerid) || (bodyshop && bodyshop.pbs_serialnumber)) || DmsAp.treatment === "on"
|
||||
...(!(bodyshop?.cdk_dealerid || bodyshop?.pbs_serialnumber || bodyshop?.rr_dealerid) || DmsAp.treatment === "on"
|
||||
? [
|
||||
{
|
||||
key: "payables",
|
||||
@@ -156,7 +156,7 @@ const buildAccountingChildren = ({
|
||||
}
|
||||
]
|
||||
: []),
|
||||
...(!((bodyshop && bodyshop.cdk_dealerid) || (bodyshop && bodyshop.pbs_serialnumber))
|
||||
...(!(bodyshop?.cdk_dealerid || bodyshop?.pbs_serialnumber || bodyshop?.rr_dealerid) || DmsAp.treatment === "on"
|
||||
? [
|
||||
{
|
||||
key: "payments",
|
||||
|
||||
@@ -220,10 +220,10 @@ export function ScheduleEventComponent({
|
||||
</DataLabel>
|
||||
<DataLabel label={t("jobs.fields.ownr_ea")}>{(event.job && event.job.ownr_ea) || ""}</DataLabel>
|
||||
<DataLabel label={t("jobs.fields.ownr_ph1")}>
|
||||
<ChatOpenButton phone={event?.job?.ownr_ph1} type={event?.job?.ownr_ph1_ty} jobid={event.job.id} />
|
||||
<ChatOpenButton phone={event.job && event.job.ownr_ph1} jobid={event.job.id} />
|
||||
</DataLabel>
|
||||
<DataLabel label={t("jobs.fields.ownr_ph2")}>
|
||||
<ChatOpenButton phone={event?.job?.ownr_ph2} type={event?.job?.ownr_ph2_ty} jobid={event.job.id} />
|
||||
<ChatOpenButton phone={event.job && event.job.ownr_ph2} jobid={event.job.id} />
|
||||
</DataLabel>
|
||||
<DataLabel hideIfNull label={t("jobs.fields.loss_of_use")}>
|
||||
{(event.job && event.job.loss_of_use) || ""}
|
||||
|
||||
@@ -43,18 +43,16 @@ export function JobCreateIOU({ bodyshop, currentUser, job, selectedJobLines, tec
|
||||
const handleCreateIou = async () => {
|
||||
setLoading(true);
|
||||
//Query all of the job details to recreate.
|
||||
const iouId = await CreateIouForJob({
|
||||
apolloClient: client,
|
||||
jobLinesToKeep: selectedJobLines,
|
||||
jobId: job.id,
|
||||
config: {
|
||||
const iouId = await CreateIouForJob(
|
||||
client,
|
||||
job.id,
|
||||
{
|
||||
status: bodyshop.md_ro_statuses.default_open,
|
||||
bodyshopid: bodyshop.id,
|
||||
useremail: currentUser.email
|
||||
},
|
||||
currentUser
|
||||
});
|
||||
|
||||
selectedJobLines
|
||||
);
|
||||
notification.open({
|
||||
type: "success",
|
||||
message: t("jobs.successes.ioucreated"),
|
||||
|
||||
@@ -9,10 +9,10 @@ import {
|
||||
WarningFilled
|
||||
} from "@ant-design/icons";
|
||||
import { PageHeader } from "@ant-design/pro-layout";
|
||||
import { gql, useMutation } from "@apollo/client";
|
||||
import { Button, Dropdown, Input, Modal, Select, Space, Table, Tag, Typography } from "antd";
|
||||
import { useMutation } from "@apollo/client";
|
||||
import { Button, Dropdown, Input, Space, Table, Tag } from "antd";
|
||||
import axios from "axios";
|
||||
import { useMemo, useState } from "react";
|
||||
import { useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
@@ -47,19 +47,6 @@ import JobLinesExpander from "./job-lines-expander.component";
|
||||
import JobLinesPartPriceChange from "./job-lines-part-price-change.component";
|
||||
import JobLinesExpanderSimple from "./jobs-lines-expander-simple.component";
|
||||
import { logImEXEvent } from "../../firebase/firebase.utils";
|
||||
import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
|
||||
|
||||
const UPDATE_JOB_LINES_LOCATION_BULK = gql`
|
||||
mutation UPDATE_JOB_LINES_LOCATION_BULK($ids: [uuid!]!, $location: String!) {
|
||||
update_joblines(where: { id: { _in: $ids } }, _set: { location: $location }) {
|
||||
affected_rows
|
||||
returning {
|
||||
id
|
||||
location
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
bodyshop: selectBodyshop,
|
||||
@@ -96,9 +83,6 @@ export function JobLinesComponent({
|
||||
isPartsEntry
|
||||
}) {
|
||||
const [deleteJobLine] = useMutation(DELETE_JOB_LINE_BY_PK);
|
||||
const [bulkUpdateLocations] = useMutation(UPDATE_JOB_LINES_LOCATION_BULK);
|
||||
const notification = useNotification();
|
||||
|
||||
const {
|
||||
treatments: { Enhanced_Payroll }
|
||||
} = useSplitTreatments({
|
||||
@@ -119,83 +103,9 @@ export function JobLinesComponent({
|
||||
}
|
||||
});
|
||||
|
||||
// Bulk location modal state
|
||||
const [bulkLocationOpen, setBulkLocationOpen] = useState(false);
|
||||
const [bulkLocation, setBulkLocation] = useState(null);
|
||||
const [bulkLocationSaving, setBulkLocationSaving] = useState(false);
|
||||
|
||||
const { t } = useTranslation();
|
||||
const jobIsPrivate = bodyshop.md_ins_cos.find((c) => c.name === job.ins_co_nm)?.private;
|
||||
|
||||
const selectedLineIds = useMemo(() => selectedLines.map((l) => l?.id).filter(Boolean), [selectedLines]);
|
||||
|
||||
const commonSelectedLocation = useMemo(() => {
|
||||
const locs = selectedLines
|
||||
.map((l) => (typeof l?.location === "string" ? l.location : ""))
|
||||
.map((x) => x.trim())
|
||||
.filter(Boolean);
|
||||
|
||||
if (locs.length === 0) return null;
|
||||
|
||||
const uniq = _.uniq(locs);
|
||||
return uniq.length === 1 ? uniq[0] : null;
|
||||
}, [selectedLines]);
|
||||
|
||||
const openBulkLocationModal = () => {
|
||||
setBulkLocation(commonSelectedLocation);
|
||||
setBulkLocationOpen(true);
|
||||
logImEXEvent("joblines_bulk_location_open", { count: selectedLineIds.length });
|
||||
};
|
||||
|
||||
const closeBulkLocationModal = () => {
|
||||
setBulkLocationOpen(false);
|
||||
setBulkLocation(null);
|
||||
};
|
||||
|
||||
const saveBulkLocation = async () => {
|
||||
if (selectedLineIds.length === 0) return;
|
||||
|
||||
setBulkLocationSaving(true);
|
||||
|
||||
try {
|
||||
const locationToSave = (bulkLocation ?? "").toString();
|
||||
|
||||
const result = await bulkUpdateLocations({
|
||||
variables: {
|
||||
ids: selectedLineIds,
|
||||
location: locationToSave
|
||||
}
|
||||
});
|
||||
|
||||
if (!result?.errors) {
|
||||
// Keep UI selection consistent without waiting for refetch
|
||||
setSelectedLines((prev) =>
|
||||
prev.map((l) => (l && selectedLineIds.includes(l.id) ? { ...l, location: locationToSave } : l))
|
||||
);
|
||||
|
||||
notification["success"]({ message: t("joblines.successes.saved") });
|
||||
|
||||
logImEXEvent("joblines_bulk_location_saved", {
|
||||
count: selectedLineIds.length,
|
||||
location: locationToSave
|
||||
});
|
||||
|
||||
closeBulkLocationModal();
|
||||
if (refetch) refetch();
|
||||
} else {
|
||||
notification["error"]({
|
||||
message: t("joblines.errors.saving", { error: JSON.stringify(result.errors) })
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
notification["error"]({
|
||||
message: t("joblines.errors.saving", { error: error?.message || String(error) })
|
||||
});
|
||||
} finally {
|
||||
setBulkLocationSaving(false);
|
||||
}
|
||||
};
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: "#",
|
||||
@@ -261,16 +171,46 @@ export function JobLinesComponent({
|
||||
? ["PAN", "PAC", "PAR", "PAL", "PAA", "PAM", "PAP", "PAS", "PASL", "PAG", "PAO"]
|
||||
: ["PAN", "PAC", "PAR", "PAL", "PAA", "PAM", "PAP", "PAS", "PASL", "PAG"]
|
||||
},
|
||||
{ text: t("joblines.fields.part_types.PAN"), value: ["PAN"] },
|
||||
{ text: t("joblines.fields.part_types.PAP"), value: ["PAP"] },
|
||||
{ text: t("joblines.fields.part_types.PAL"), value: ["PAL"] },
|
||||
{ text: t("joblines.fields.part_types.PAA"), value: ["PAA"] },
|
||||
{ text: t("joblines.fields.part_types.PAG"), value: ["PAG"] },
|
||||
{ text: t("joblines.fields.part_types.PAS"), value: ["PAS"] },
|
||||
{ text: t("joblines.fields.part_types.PASL"), value: ["PASL"] },
|
||||
{ text: t("joblines.fields.part_types.PAC"), value: ["PAC"] },
|
||||
{ text: t("joblines.fields.part_types.PAR"), value: ["PAR"] },
|
||||
{ text: t("joblines.fields.part_types.PAM"), value: ["PAM"] },
|
||||
{
|
||||
text: t("joblines.fields.part_types.PAN"),
|
||||
value: ["PAN"]
|
||||
},
|
||||
{
|
||||
text: t("joblines.fields.part_types.PAP"),
|
||||
value: ["PAP"]
|
||||
},
|
||||
{
|
||||
text: t("joblines.fields.part_types.PAL"),
|
||||
value: ["PAL"]
|
||||
},
|
||||
{
|
||||
text: t("joblines.fields.part_types.PAA"),
|
||||
value: ["PAA"]
|
||||
},
|
||||
{
|
||||
text: t("joblines.fields.part_types.PAG"),
|
||||
value: ["PAG"]
|
||||
},
|
||||
{
|
||||
text: t("joblines.fields.part_types.PAS"),
|
||||
value: ["PAS"]
|
||||
},
|
||||
{
|
||||
text: t("joblines.fields.part_types.PASL"),
|
||||
value: ["PASL"]
|
||||
},
|
||||
{
|
||||
text: t("joblines.fields.part_types.PAC"),
|
||||
value: ["PAC"]
|
||||
},
|
||||
{
|
||||
text: t("joblines.fields.part_types.PAR"),
|
||||
value: ["PAR"]
|
||||
},
|
||||
{
|
||||
text: t("joblines.fields.part_types.PAM"),
|
||||
value: ["PAM"]
|
||||
},
|
||||
...(isPartsEntry
|
||||
? [
|
||||
{
|
||||
@@ -280,6 +220,7 @@ export function JobLinesComponent({
|
||||
]
|
||||
: [])
|
||||
],
|
||||
|
||||
onFilter: (value, record) => value.includes(record.part_type),
|
||||
render: (text, record) => (record.part_type ? t(`joblines.fields.part_types.${record.part_type}`) : null)
|
||||
},
|
||||
@@ -305,6 +246,7 @@ export function JobLinesComponent({
|
||||
title: t("joblines.fields.mod_lbr_ty"),
|
||||
dataIndex: "mod_lbr_ty",
|
||||
key: "mod_lbr_ty",
|
||||
|
||||
sorter: (a, b) => alphaSort(a.mod_lbr_ty, b.mod_lbr_ty),
|
||||
sortOrder: state.sortedInfo.columnKey === "mod_lbr_ty" && state.sortedInfo.order,
|
||||
render: (text, record) => (record.mod_lbr_ty ? t(`joblines.fields.lbr_types.${record.mod_lbr_ty}`) : null)
|
||||
@@ -313,6 +255,7 @@ export function JobLinesComponent({
|
||||
title: t("joblines.fields.mod_lb_hrs"),
|
||||
dataIndex: "mod_lb_hrs",
|
||||
key: "mod_lb_hrs",
|
||||
|
||||
sorter: (a, b) => a.mod_lb_hrs - b.mod_lb_hrs,
|
||||
sortOrder: state.sortedInfo.columnKey === "mod_lb_hrs" && state.sortedInfo.order
|
||||
},
|
||||
@@ -367,12 +310,18 @@ export function JobLinesComponent({
|
||||
sorter: (a, b) => alphaSort(a.status, b.status),
|
||||
sortOrder: state.sortedInfo.columnKey === "status" && state.sortedInfo.order,
|
||||
filteredValue: state.filteredInfo.status || null,
|
||||
|
||||
filters:
|
||||
(jobLines &&
|
||||
jobLines
|
||||
.map((l) => l.status)
|
||||
.filter(onlyUnique)
|
||||
.map((s) => ({ text: s || t("dashboard.errors.status"), value: [s] }))) ||
|
||||
.map((s) => {
|
||||
return {
|
||||
text: s || t("dashboard.errors.status"),
|
||||
value: [s]
|
||||
};
|
||||
})) ||
|
||||
[],
|
||||
onFilter: (value, record) => value.includes(record.status),
|
||||
render: (text, record) => <JobLineStatusPopup jobline={record} disabled={jobRO} />
|
||||
@@ -427,7 +376,9 @@ export function JobLinesComponent({
|
||||
});
|
||||
}
|
||||
});
|
||||
await axios.post("/job/totalsssu", { id: job.id });
|
||||
await axios.post("/job/totalsssu", {
|
||||
id: job.id
|
||||
});
|
||||
if (refetch) refetch();
|
||||
}}
|
||||
>
|
||||
@@ -497,36 +448,6 @@ export function JobLinesComponent({
|
||||
return (
|
||||
<div>
|
||||
<PartsOrderModalContainer />
|
||||
|
||||
<Modal
|
||||
open={bulkLocationOpen}
|
||||
title={t("joblines.actions.updatelocation")}
|
||||
onCancel={closeBulkLocationModal}
|
||||
onOk={saveBulkLocation}
|
||||
okButtonProps={{
|
||||
disabled: jobRO || technician || selectedLineIds.length === 0,
|
||||
loading: bulkLocationSaving
|
||||
}}
|
||||
destroyOnHidden
|
||||
>
|
||||
<Space direction="vertical" style={{ width: "100%" }}>
|
||||
<Typography.Text type="secondary">
|
||||
{t("general.labels.selected")}: {selectedLineIds.length}
|
||||
</Typography.Text>
|
||||
|
||||
<Select
|
||||
allowClear
|
||||
placeholder={t("joblines.fields.location")}
|
||||
value={bulkLocation}
|
||||
style={{ width: "100%" }}
|
||||
popupMatchSelectWidth={false}
|
||||
onChange={(val) => setBulkLocation(val ?? null)}
|
||||
options={(bodyshop?.md_parts_locations || []).map((loc) => ({ label: loc, value: loc }))}
|
||||
/>
|
||||
<Typography.Text type="secondary">{t("joblines.labels.bulk_location_help")}</Typography.Text>
|
||||
</Space>
|
||||
</Modal>
|
||||
|
||||
{!technician && (
|
||||
<PartsOrderDrawer
|
||||
job={job}
|
||||
@@ -536,7 +457,6 @@ export function JobLinesComponent({
|
||||
setTaskUpsertContext={setTaskUpsertContext}
|
||||
/>
|
||||
)}
|
||||
|
||||
<PageHeader
|
||||
title={t("jobs.labels.estimatelines")}
|
||||
extra={
|
||||
@@ -545,16 +465,6 @@ export function JobLinesComponent({
|
||||
<SyncOutlined />
|
||||
</Button>
|
||||
|
||||
{/* Bulk Update Location */}
|
||||
<Button
|
||||
id="job-lines-bulk-update-location-button"
|
||||
disabled={jobRO || technician || selectedLineIds.length === 0}
|
||||
onClick={openBulkLocationModal}
|
||||
>
|
||||
{t("joblines.actions.updatelocation")}
|
||||
{selectedLineIds.length > 0 && ` (${selectedLineIds.length})`}
|
||||
</Button>
|
||||
|
||||
{job.special_coverage_policy && (
|
||||
<Tag color="tomato">
|
||||
<Space>
|
||||
@@ -563,7 +473,6 @@ export function JobLinesComponent({
|
||||
</Space>
|
||||
</Tag>
|
||||
)}
|
||||
|
||||
{!isPartsEntry && (
|
||||
<JobLineDispatchButton
|
||||
selectedLines={selectedLines}
|
||||
@@ -572,11 +481,9 @@ export function JobLinesComponent({
|
||||
disabled={technician}
|
||||
/>
|
||||
)}
|
||||
|
||||
{Enhanced_Payroll.treatment === "on" && (
|
||||
<JobLineBulkAssignComponent selectedLines={selectedLines} setSelectedLines={setSelectedLines} job={job} />
|
||||
)}
|
||||
|
||||
{!isPartsEntry && (
|
||||
<Button
|
||||
disabled={(job && !job.converted) || (selectedLines.length > 0 ? false : true) || jobRO || technician}
|
||||
@@ -592,20 +499,27 @@ export function JobLinesComponent({
|
||||
isinhouse: true,
|
||||
date: dayjs(),
|
||||
total: 0,
|
||||
billlines: selectedLines.map((p) => ({
|
||||
joblineid: p.id,
|
||||
actual_price: p.act_price,
|
||||
actual_cost: 0,
|
||||
line_desc: p.line_desc,
|
||||
line_remarks: p.line_remarks,
|
||||
part_type: p.part_type,
|
||||
quantity: p.quantity || 1,
|
||||
applicable_taxes: { local: false, state: false, federal: false }
|
||||
}))
|
||||
billlines: selectedLines.map((p) => {
|
||||
return {
|
||||
joblineid: p.id,
|
||||
actual_price: p.act_price,
|
||||
actual_cost: 0, //p.act_price,
|
||||
line_desc: p.line_desc,
|
||||
line_remarks: p.line_remarks,
|
||||
part_type: p.part_type,
|
||||
quantity: p.quantity || 1,
|
||||
applicable_taxes: {
|
||||
local: false,
|
||||
state: false,
|
||||
federal: false
|
||||
}
|
||||
};
|
||||
})
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
//Clear out the selected lines. IO-785
|
||||
setSelectedLines([]);
|
||||
}}
|
||||
>
|
||||
@@ -614,7 +528,6 @@ export function JobLinesComponent({
|
||||
{selectedLines.length > 0 && ` (${selectedLines.length})`}
|
||||
</Button>
|
||||
)}
|
||||
|
||||
<Button
|
||||
id="job-lines-order-parts-button"
|
||||
disabled={(job && !job.converted) || (selectedLines.length > 0 ? false : true) || jobRO || technician}
|
||||
@@ -631,13 +544,13 @@ export function JobLinesComponent({
|
||||
}
|
||||
});
|
||||
|
||||
//Clear out the selected lines. IO-785
|
||||
setSelectedLines([]);
|
||||
}}
|
||||
>
|
||||
{t("parts.actions.order")}
|
||||
{selectedLines.length > 0 && ` (${selectedLines.length})`}
|
||||
</Button>
|
||||
|
||||
{!isPartsEntry && (
|
||||
<Button
|
||||
id="job-lines-filter-parts-only-button"
|
||||
@@ -654,11 +567,9 @@ export function JobLinesComponent({
|
||||
<FilterFilled /> {t("jobs.actions.filterpartsonly")}
|
||||
</Button>
|
||||
)}
|
||||
|
||||
<Dropdown menu={markMenu} trigger={["click"]}>
|
||||
<Button id="repair-data-mark-button">{t("jobs.actions.mark")}</Button>
|
||||
</Dropdown>
|
||||
|
||||
{!isPartsEntry && (
|
||||
<Button
|
||||
disabled={jobRO || technician}
|
||||
@@ -672,12 +583,9 @@ export function JobLinesComponent({
|
||||
{t("joblines.actions.new")}
|
||||
</Button>
|
||||
)}
|
||||
|
||||
{!isPartsEntry &&
|
||||
InstanceRenderManager({ rome: <JobSendPartPriceChangeComponent job={job} disabled={technician} /> })}
|
||||
|
||||
<JobCreateIOU job={job} selectedJobLines={selectedLines} />
|
||||
|
||||
<Input.Search
|
||||
placeholder={t("general.labels.search")}
|
||||
onChange={(e) => {
|
||||
@@ -688,7 +596,6 @@ export function JobLinesComponent({
|
||||
</Space>
|
||||
}
|
||||
/>
|
||||
|
||||
<Table
|
||||
columns={columns}
|
||||
rowKey="id"
|
||||
@@ -696,7 +603,9 @@ export function JobLinesComponent({
|
||||
pagination={false}
|
||||
dataSource={jobLines}
|
||||
onChange={handleTableChange}
|
||||
scroll={{ x: true }}
|
||||
scroll={{
|
||||
x: true
|
||||
}}
|
||||
expandable={{
|
||||
expandedRowRender: (record) =>
|
||||
isPartsEntry ? (
|
||||
@@ -705,6 +614,7 @@ export function JobLinesComponent({
|
||||
<JobLinesExpander jobline={record} jobid={job.id} />
|
||||
),
|
||||
rowExpandable: () => true,
|
||||
//expandRowByClick: true,
|
||||
expandIcon: ({ expanded, onExpand, record }) =>
|
||||
expanded ? (
|
||||
<MinusCircleTwoTone onClick={(e) => onExpand(record, e)} />
|
||||
@@ -717,15 +627,17 @@ export function JobLinesComponent({
|
||||
/>
|
||||
)
|
||||
}}
|
||||
onRow={(record) => ({
|
||||
onDoubleClick: () => {
|
||||
logImEXEvent("joblines_double_click_select", {});
|
||||
const notMatchingLines = selectedLines.filter((i) => i.id !== record.id);
|
||||
notMatchingLines.length !== selectedLines.length
|
||||
? setSelectedLines(notMatchingLines)
|
||||
: setSelectedLines([...selectedLines, record]);
|
||||
}
|
||||
})}
|
||||
onRow={(record) => {
|
||||
return {
|
||||
onDoubleClick: () => {
|
||||
logImEXEvent("joblines_double_click_select", {});
|
||||
const notMatchingLines = selectedLines.filter((i) => i.id !== record.id);
|
||||
notMatchingLines.length !== selectedLines.length
|
||||
? setSelectedLines(notMatchingLines)
|
||||
: setSelectedLines([...selectedLines, record]);
|
||||
} // double click row
|
||||
};
|
||||
}}
|
||||
rowSelection={{
|
||||
selectedRowKeys: selectedLines.map((item) => item && item.id),
|
||||
onSelectAll: (selected, selectedRows) => {
|
||||
|
||||
@@ -222,37 +222,17 @@ export function JobLifecycleComponent({ bodyshop, job, statuses }) {
|
||||
</div>
|
||||
</BlurWrapperComponent>
|
||||
<Card type="inner" title={t("job_lifecycle.content.legend_title")} style={{ marginTop: "10px" }}>
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
flexWrap: "wrap",
|
||||
gap: 8
|
||||
}}
|
||||
>
|
||||
<div>
|
||||
{lifecycleData.durations.summations.map((key) => (
|
||||
<Tag
|
||||
key={key.status}
|
||||
color={key.color}
|
||||
style={{
|
||||
// let the tag grow with its content
|
||||
width: "auto",
|
||||
padding: 0,
|
||||
margin: 0,
|
||||
display: "inline-flex",
|
||||
alignItems: "center",
|
||||
justifyContent: "center",
|
||||
boxSizing: "border-box"
|
||||
}}
|
||||
>
|
||||
<Tag key={key.status} color={key.color} style={{ width: "13vh", padding: "4px", margin: "4px" }}>
|
||||
<div
|
||||
aria-label={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`}
|
||||
title={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`}
|
||||
style={{
|
||||
backgroundColor: "var(--tag-wrapper-bg)",
|
||||
color: "var(--tag-wrapper-text)",
|
||||
padding: "4px 8px",
|
||||
textAlign: "center",
|
||||
whiteSpace: "nowrap" // single line; tag gets wider instead of text escaping
|
||||
padding: "4px",
|
||||
textAlign: "center"
|
||||
}}
|
||||
>
|
||||
{key.status} (
|
||||
|
||||
@@ -1,23 +1,25 @@
|
||||
import { useMutation } from "@apollo/client";
|
||||
import { Select, Space, Tag } from "antd";
|
||||
import { useEffect, useMemo, useState } from "react";
|
||||
import { Select, Space } from "antd";
|
||||
import { useEffect, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { UPDATE_JOB_LINE } from "../../graphql/jobs-lines.queries";
|
||||
import { selectBodyshop } from "../../redux/user/user.selectors";
|
||||
import LoadingSpinner from "../loading-spinner/loading-spinner.component";
|
||||
import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
//currentUser: selectCurrentUser
|
||||
bodyshop: selectBodyshop
|
||||
});
|
||||
const mapDispatchToProps = () => ({});
|
||||
|
||||
const CLEAR_VALUE = "__CLEAR_LOCATION__";
|
||||
const mapDispatchToProps = () => ({
|
||||
//setUserLanguage: language => dispatch(setUserLanguage(language))
|
||||
});
|
||||
|
||||
export function JobLineLocationPopup({ bodyshop, jobline, disabled }) {
|
||||
const [editing, setEditing] = useState(false);
|
||||
const [saving, setSaving] = useState(false);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [location, setLocation] = useState(jobline.location);
|
||||
const [updateJob] = useMutation(UPDATE_JOB_LINE);
|
||||
const { t } = useTranslation();
|
||||
@@ -27,78 +29,55 @@ export function JobLineLocationPopup({ bodyshop, jobline, disabled }) {
|
||||
if (editing) setLocation(jobline.location);
|
||||
}, [editing, jobline.location]);
|
||||
|
||||
const options = useMemo(() => {
|
||||
const locs = bodyshop?.md_parts_locations || [];
|
||||
return [
|
||||
{ label: t("general.labels.none", "No location"), value: CLEAR_VALUE },
|
||||
...locs.map((loc) => ({ label: loc, value: loc }))
|
||||
];
|
||||
}, [bodyshop?.md_parts_locations, t]);
|
||||
const handleChange = (e) => {
|
||||
setLocation(e);
|
||||
};
|
||||
|
||||
const saveLocation = async (nextLocation) => {
|
||||
setSaving(true);
|
||||
const handleSave = async () => {
|
||||
setLoading(true);
|
||||
const result = await updateJob({
|
||||
variables: { lineId: jobline.id, line: { location: location || "" } }
|
||||
});
|
||||
|
||||
try {
|
||||
const result = await updateJob({
|
||||
variables: { lineId: jobline.id, line: { location: nextLocation || "" } }
|
||||
});
|
||||
|
||||
if (!result.errors) {
|
||||
notification["success"]({ message: t("joblines.successes.saved") });
|
||||
} else {
|
||||
notification["error"]({
|
||||
message: t("joblines.errors.saving", {
|
||||
error: JSON.stringify(result.errors)
|
||||
})
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
if (!result.errors) {
|
||||
notification["success"]({ message: t("joblines.successes.saved") });
|
||||
} else {
|
||||
notification["error"]({
|
||||
message: t("joblines.errors.saving", { error: error?.message || String(error) })
|
||||
message: t("joblines.errors.saving", {
|
||||
error: JSON.stringify(result.errors)
|
||||
})
|
||||
});
|
||||
} finally {
|
||||
setSaving(false);
|
||||
setEditing(false);
|
||||
}
|
||||
setLoading(false);
|
||||
setEditing(false);
|
||||
};
|
||||
|
||||
const handleChange = async (value) => {
|
||||
const next = value === CLEAR_VALUE ? null : value;
|
||||
setLocation(next);
|
||||
await saveLocation(next);
|
||||
};
|
||||
|
||||
if (editing) {
|
||||
if (editing)
|
||||
return (
|
||||
<div style={{ width: "100%", display: "flex", alignItems: "center" }}>
|
||||
<Select
|
||||
autoFocus
|
||||
size="small"
|
||||
value={location ?? undefined}
|
||||
loading={saving}
|
||||
disabled={saving}
|
||||
style={{ flex: 1, minWidth: 0 }}
|
||||
popupMatchSelectWidth={false}
|
||||
getPopupContainer={(triggerNode) => triggerNode.parentNode}
|
||||
onChange={handleChange}
|
||||
onBlur={() => !saving && setEditing(false)}
|
||||
options={options}
|
||||
/>
|
||||
<div>
|
||||
<LoadingSpinner loading={loading}>
|
||||
<Select
|
||||
autoFocus
|
||||
allowClear
|
||||
popupMatchSelectWidth={100}
|
||||
value={location}
|
||||
onClear={() => setLocation(null)}
|
||||
onSelect={handleChange}
|
||||
onBlur={handleSave}
|
||||
>
|
||||
{bodyshop.md_parts_locations.map((loc, idx) => (
|
||||
<Select.Option key={idx} value={loc}>
|
||||
{loc}
|
||||
</Select.Option>
|
||||
))}
|
||||
</Select>
|
||||
</LoadingSpinner>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div
|
||||
style={{ width: "100%", minHeight: "2rem", cursor: disabled ? "default" : "pointer" }}
|
||||
onClick={() => !disabled && setEditing(true)}
|
||||
>
|
||||
<div style={{ width: "100%", minHeight: "2rem", cursor: "pointer" }} onClick={() => !disabled && setEditing(true)}>
|
||||
<Space wrap>
|
||||
{jobline.location ? (
|
||||
<Tag>{jobline.location}</Tag>
|
||||
) : (
|
||||
<span style={{ opacity: 0.6 }}>{t("general.labels.none")}</span>
|
||||
)}
|
||||
{jobline.location}
|
||||
{jobline.parts_dispatch_lines?.length > 0 && "-Disp"}
|
||||
</Space>
|
||||
</div>
|
||||
|
||||
@@ -1,105 +0,0 @@
|
||||
import { useCallback, useMemo, useState } from "react";
|
||||
import PropTypes from "prop-types";
|
||||
import { Popover } from "antd";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { selectBodyshop } from "../../redux/user/user.selectors";
|
||||
import JobPartsQueueCount from "../job-parts-queue-count/job-parts-queue-count.component";
|
||||
import { useTranslation } from "react-i18next";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
bodyshop: selectBodyshop
|
||||
});
|
||||
|
||||
/**
|
||||
* Displays "Parts Received" summary (modeled after the Production Board List column),
|
||||
* and on click shows a popover with the Parts Status grid (existing JobPartsQueueCount UI).
|
||||
* @param bodyshop
|
||||
* @param parts
|
||||
* @param displayMode
|
||||
* @param popoverPlacement
|
||||
* @returns {JSX.Element}
|
||||
* @constructor
|
||||
*/
|
||||
export function JobPartsReceived({ bodyshop, parts, displayMode = "full", popoverPlacement = "top" }) {
|
||||
const [open, setOpen] = useState(false);
|
||||
const { t } = useTranslation();
|
||||
|
||||
const summary = useMemo(() => {
|
||||
const receivedStatus = bodyshop?.md_order_statuses?.default_received;
|
||||
|
||||
if (!Array.isArray(parts) || parts.length === 0 || !receivedStatus) {
|
||||
return { total: 0, received: 0, percentLabel: t("general.labels.na") };
|
||||
}
|
||||
|
||||
// Keep consistent with JobPartsQueueCount: exclude PAS / PASL from parts math
|
||||
const { total, received } = parts.reduce(
|
||||
(acc, val) => {
|
||||
if (val?.part_type === "PAS" || val?.part_type === "PASL") return acc;
|
||||
const count = Number(val?.count || 0);
|
||||
acc.total += count;
|
||||
|
||||
if (val?.status === receivedStatus) {
|
||||
acc.received += count;
|
||||
}
|
||||
return acc;
|
||||
},
|
||||
{ total: 0, received: 0 }
|
||||
);
|
||||
|
||||
const percentLabel = total > 0 ? `${Math.round((received / total) * 100)}%` : t("general.labels.na");
|
||||
return { total, received, percentLabel };
|
||||
}, [parts, bodyshop?.md_order_statuses?.default_received]);
|
||||
|
||||
const canOpen = summary.total > 0;
|
||||
|
||||
const handleOpenChange = useCallback(
|
||||
(nextOpen) => {
|
||||
if (!canOpen) return;
|
||||
setOpen(nextOpen);
|
||||
},
|
||||
[canOpen]
|
||||
);
|
||||
|
||||
const displayText =
|
||||
displayMode === "compact" ? summary.percentLabel : `${summary.percentLabel} (${summary.received}/${summary.total})`;
|
||||
|
||||
// Prevent row/cell click handlers (table selection, drawer selection, etc.)
|
||||
const stop = (e) => e.stopPropagation();
|
||||
|
||||
return (
|
||||
<Popover
|
||||
open={open}
|
||||
onOpenChange={handleOpenChange}
|
||||
trigger={["click"]}
|
||||
placement={popoverPlacement}
|
||||
content={
|
||||
<div onClick={stop} style={{ minWidth: 260 }}>
|
||||
<JobPartsQueueCount parts={parts} />
|
||||
</div>
|
||||
}
|
||||
>
|
||||
<div
|
||||
onClick={stop}
|
||||
style={{
|
||||
width: "100%",
|
||||
height: "19px",
|
||||
cursor: canOpen ? "pointer" : "default",
|
||||
userSelect: "none"
|
||||
}}
|
||||
title={canOpen ? t("production.labels.click_for_statuses") : undefined}
|
||||
>
|
||||
{displayText}
|
||||
</div>
|
||||
</Popover>
|
||||
);
|
||||
}
|
||||
|
||||
JobPartsReceived.propTypes = {
|
||||
bodyshop: PropTypes.object,
|
||||
parts: PropTypes.array,
|
||||
displayMode: PropTypes.oneOf(["full", "compact"]),
|
||||
popoverPlacement: PropTypes.string
|
||||
};
|
||||
|
||||
export default connect(mapStateToProps)(JobPartsReceived);
|
||||
@@ -154,10 +154,6 @@ export function JobsAvailableContainer({ bodyshop, currentUser, insertAuditTrail
|
||||
: {})
|
||||
};
|
||||
|
||||
if (currentUser?.email) {
|
||||
newJob.created_user_email = currentUser.email;
|
||||
}
|
||||
|
||||
if (selectedOwner) {
|
||||
newJob.ownerid = selectedOwner;
|
||||
delete newJob.owner;
|
||||
|
||||
@@ -6,6 +6,7 @@ import { createStructuredSelector } from "reselect";
|
||||
import { logImEXEvent } from "../../firebase/firebase.utils";
|
||||
import { selectBodyshop } from "../../redux/user/user.selectors";
|
||||
import InstanceRenderManager from "../../utils/instanceRenderMgr";
|
||||
import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
bodyshop: selectBodyshop
|
||||
@@ -14,6 +15,8 @@ const mapStateToProps = createStructuredSelector({
|
||||
export function JobsCloseAutoAllocate({ bodyshop, joblines, form, disabled }) {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const hasDmsKey = bodyshopHasDmsKey(bodyshop);
|
||||
|
||||
const handleAllocate = (defaults) => {
|
||||
form.setFieldsValue({
|
||||
joblines: joblines.map((jl) => {
|
||||
@@ -64,21 +67,20 @@ export function JobsCloseAutoAllocate({ bodyshop, joblines, form, disabled }) {
|
||||
handleAllocate(bodyshop.md_responsibility_centers.dms_defaults.find((x) => x.name === key));
|
||||
};
|
||||
|
||||
const menu =
|
||||
bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber
|
||||
? {
|
||||
items: bodyshop.md_responsibility_centers.dms_defaults.map((mapping) => ({
|
||||
key: mapping.name,
|
||||
label: mapping.name,
|
||||
disabled: disabled
|
||||
})),
|
||||
onClick: handleMenuClick
|
||||
}
|
||||
: {
|
||||
items: []
|
||||
};
|
||||
const menu = hasDmsKey
|
||||
? {
|
||||
items: bodyshop.md_responsibility_centers.dms_defaults.map((mapping) => ({
|
||||
key: mapping.name,
|
||||
label: mapping.name,
|
||||
disabled: disabled
|
||||
})),
|
||||
onClick: handleMenuClick
|
||||
}
|
||||
: {
|
||||
items: []
|
||||
};
|
||||
|
||||
return bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber ? (
|
||||
return hasDmsKey ? (
|
||||
<Dropdown menu={menu}>
|
||||
<Button disabled={disabled}>{t("jobs.actions.dmsautoallocate")}</Button>
|
||||
</Dropdown>
|
||||
|
||||
@@ -10,6 +10,7 @@ import { auth, logImEXEvent } from "../../firebase/firebase.utils";
|
||||
import { INSERT_EXPORT_LOG } from "../../graphql/accounting.queries";
|
||||
import { UPDATE_JOB } from "../../graphql/jobs.queries";
|
||||
import { insertAuditTrail } from "../../redux/application/application.actions";
|
||||
import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
|
||||
import { selectBodyshop, selectCurrentUser } from "../../redux/user/user.selectors";
|
||||
import AuditTrailMapping from "../../utils/AuditTrailMappings";
|
||||
import client from "../../utils/GraphQLClient";
|
||||
@@ -45,7 +46,7 @@ export function JobsCloseExportButton({ bodyshop, currentUser, jobId, disabled,
|
||||
|
||||
const handleQbxml = async () => {
|
||||
//Check if it's a CDK setup.
|
||||
if (bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber) {
|
||||
if (bodyshopHasDmsKey(bodyshop)) {
|
||||
history(`/manage/dms?jobId=${jobId}`);
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { Form, Input, Select } from "antd";
|
||||
import { Form, Input } from "antd";
|
||||
import { useContext } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import JobCreateContext from "../../pages/jobs-create/jobs-create.context";
|
||||
@@ -7,11 +7,6 @@ import FormItemPhone, { PhoneItemFormatterValidation } from "../form-items-forma
|
||||
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
|
||||
|
||||
export default function JobsCreateOwnerInfoNewComponent() {
|
||||
const PHONE_TYPE_OPTIONS = [
|
||||
{ label: t("owners.labels.home"), value: "Home" },
|
||||
{ label: t("owners.labels.work"), value: "Work" },
|
||||
{ label: t("owners.labels.cell"), value: "Cell" }
|
||||
];
|
||||
const [state] = useContext(JobCreateContext);
|
||||
|
||||
const { t } = useTranslation();
|
||||
@@ -110,56 +105,26 @@ export default function JobsCreateOwnerInfoNewComponent() {
|
||||
]}
|
||||
name={["owner", "data", "ownr_ea"]}
|
||||
>
|
||||
<FormItemEmail disabled={!state.owner.new} />
|
||||
<FormItemEmail
|
||||
//email={form.getFieldValue("ownr_ea")}
|
||||
disabled={!state.owner.new}
|
||||
/>
|
||||
</Form.Item>
|
||||
|
||||
{/* Phone 1 + Type */}
|
||||
<Form.Item label={t("owners.fields.ownr_ph1")} style={{ marginBottom: 0 }}>
|
||||
<div style={{ display: "flex", alignItems: "center", gap: 8 }}>
|
||||
<Form.Item
|
||||
name={["owner", "data", "ownr_ph1"]}
|
||||
noStyle
|
||||
rules={[({ getFieldValue }) => PhoneItemFormatterValidation(getFieldValue, "owner.data.ownr_ph1")]}
|
||||
>
|
||||
<FormItemPhone disabled={!state.owner.new} style={{ flex: 1, minWidth: 150 }} />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item name={["owner", "data", "ownr_ph1_ty"]} noStyle>
|
||||
<Select
|
||||
disabled={!state.owner.new}
|
||||
allowClear
|
||||
placeholder="Type"
|
||||
options={PHONE_TYPE_OPTIONS}
|
||||
style={{ width: 110 }}
|
||||
/>
|
||||
</Form.Item>
|
||||
</div>
|
||||
<Form.Item
|
||||
label={t("owners.fields.ownr_ph1")}
|
||||
name={["owner", "data", "ownr_ph1"]}
|
||||
rules={[({ getFieldValue }) => PhoneItemFormatterValidation(getFieldValue, "owner.data.ownr_ph1")]}
|
||||
>
|
||||
<FormItemPhone disabled={!state.owner.new} />
|
||||
</Form.Item>
|
||||
|
||||
{/* Phone 2 + Type */}
|
||||
<Form.Item label={t("owners.fields.ownr_ph2")} style={{ marginBottom: 0 }}>
|
||||
<div style={{ display: "flex", alignItems: "center", gap: 8 }}>
|
||||
<Form.Item
|
||||
name={["owner", "data", "ownr_ph2"]}
|
||||
noStyle
|
||||
rules={[({ getFieldValue }) => PhoneItemFormatterValidation(getFieldValue, "owner.data.ownr_ph2")]}
|
||||
>
|
||||
<FormItemPhone disabled={!state.owner.new} style={{ flex: 1, minWidth: 150 }} />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item name={["owner", "data", "ownr_ph2_ty"]} noStyle>
|
||||
<Select
|
||||
disabled={!state.owner.new}
|
||||
allowClear
|
||||
placeholder="Type"
|
||||
options={PHONE_TYPE_OPTIONS}
|
||||
style={{ width: 110 }}
|
||||
/>
|
||||
</Form.Item>
|
||||
</div>
|
||||
<Form.Item
|
||||
label={t("owners.fields.ownr_ph2")}
|
||||
name={["owner", "data", "ownr_ph2"]}
|
||||
rules={[({ getFieldValue }) => PhoneItemFormatterValidation(getFieldValue, "owner.data.ownr_ph2")]}
|
||||
>
|
||||
<FormItemPhone disabled={!state.owner.new} />
|
||||
</Form.Item>
|
||||
</LayoutFormRow>
|
||||
|
||||
<LayoutFormRow grow>
|
||||
<Form.Item label={t("owners.fields.preferred_contact")} name={["owner", "data", "preferred_contact"]}>
|
||||
<Input disabled={!state.owner.new} />
|
||||
|
||||
@@ -61,7 +61,7 @@ export default function JobsCreateOwnerInfoSearchComponent({ loading, owners })
|
||||
title: t("owners.fields.ownr_ph1"),
|
||||
dataIndex: "ownr_ph1",
|
||||
key: "ownr_ph1",
|
||||
render: (text, record) => <PhoneFormatter type={record.ownr_ph1_ty}>{record.ownr_ph1}</PhoneFormatter>,
|
||||
render: (text, record) => <PhoneFormatter>{record.ownr_ph1}</PhoneFormatter>,
|
||||
sorter: (a, b) => alphaSort(a.ownr_ph1, b.ownr_ph1),
|
||||
sortOrder: tableState.sortedInfo.columnKey === "ownr_ph1" && tableState.sortedInfo.order
|
||||
},
|
||||
@@ -69,7 +69,7 @@ export default function JobsCreateOwnerInfoSearchComponent({ loading, owners })
|
||||
title: t("owners.fields.ownr_ph2"),
|
||||
dataIndex: "ownr_ph2",
|
||||
key: "ownr_ph2",
|
||||
render: (text, record) => <PhoneFormatter type={record.ownr_ph2_ty}>{record.ownr_ph2}</PhoneFormatter>,
|
||||
render: (text, record) => <PhoneFormatter>{record.ownr_ph2}</PhoneFormatter>,
|
||||
sorter: (a, b) => alphaSort(a.ownr_ph2, b.ownr_ph2),
|
||||
sortOrder: tableState.sortedInfo.columnKey === "ownr_ph2" && tableState.sortedInfo.order
|
||||
}
|
||||
|
||||
@@ -175,33 +175,25 @@ export function JobsDetailHeaderActions({
|
||||
};
|
||||
|
||||
const handleDuplicate = () =>
|
||||
DuplicateJob({
|
||||
apolloClient: client,
|
||||
jobId: job.id,
|
||||
config: { defaultOpenStatus: bodyshop.md_ro_statuses.default_imported },
|
||||
completionCallback: (newJobId) => {
|
||||
DuplicateJob(
|
||||
client,
|
||||
job.id,
|
||||
{ defaultOpenStatus: bodyshop.md_ro_statuses.default_imported },
|
||||
(newJobId) => {
|
||||
history(`/manage/jobs/${newJobId}`);
|
||||
notification.success({
|
||||
message: t("jobs.successes.duplicated")
|
||||
});
|
||||
},
|
||||
keepJobLines: true,
|
||||
currentUser
|
||||
});
|
||||
true
|
||||
);
|
||||
|
||||
const handleDuplicateConfirm = () =>
|
||||
DuplicateJob({
|
||||
apolloClient: client,
|
||||
jobId: job.id,
|
||||
config: { defaultOpenStatus: bodyshop.md_ro_statuses.default_imported },
|
||||
completionCallback: (newJobId) => {
|
||||
history(`/manage/jobs/${newJobId}`);
|
||||
notification.success({
|
||||
message: t("jobs.successes.duplicated")
|
||||
});
|
||||
},
|
||||
keepJobLines: false,
|
||||
currentUser
|
||||
DuplicateJob(client, job.id, { defaultOpenStatus: bodyshop.md_ro_statuses.default_imported }, (newJobId) => {
|
||||
history(`/manage/jobs/${newJobId}`);
|
||||
notification.success({
|
||||
message: t("jobs.successes.duplicated")
|
||||
});
|
||||
});
|
||||
|
||||
const handleFinish = async (values) => {
|
||||
@@ -617,7 +609,7 @@ export function JobsDetailHeaderActions({
|
||||
<FormDateTimePickerComponent
|
||||
onBlur={() => {
|
||||
const start = form.getFieldValue("start");
|
||||
form.setFieldsValue({ end: start?.add(30, "minutes") });
|
||||
form.setFieldsValue({ end: start.add(30, "minutes") });
|
||||
}}
|
||||
/>
|
||||
</Form.Item>
|
||||
|
||||
@@ -5,14 +5,7 @@ import { INSERT_NEW_JOB, QUERY_JOB_FOR_DUPE } from "../../graphql/jobs.queries";
|
||||
import dayjs from "../../utils/day";
|
||||
import i18n from "i18next";
|
||||
|
||||
export default async function DuplicateJob({
|
||||
apolloClient,
|
||||
jobId,
|
||||
config,
|
||||
completionCallback,
|
||||
keepJobLines = false,
|
||||
currentUser
|
||||
}) {
|
||||
export default async function DuplicateJob(apolloClient, jobId, config, completionCallback, keepJobLines = false) {
|
||||
logImEXEvent("job_duplicate");
|
||||
|
||||
const { defaultOpenStatus } = config;
|
||||
@@ -26,7 +19,6 @@ export default async function DuplicateJob({
|
||||
const existingJob = _.cloneDeep(jobs_by_pk);
|
||||
delete existingJob.__typename;
|
||||
delete existingJob.id;
|
||||
delete existingJob.created_user_email;
|
||||
delete existingJob.createdat;
|
||||
delete existingJob.updatedat;
|
||||
delete existingJob.cieca_stl;
|
||||
@@ -37,10 +29,6 @@ export default async function DuplicateJob({
|
||||
status: defaultOpenStatus
|
||||
};
|
||||
|
||||
if (currentUser?.email) {
|
||||
newJob.created_user_email = currentUser.email;
|
||||
}
|
||||
|
||||
const _tempLines = _.cloneDeep(existingJob.joblines);
|
||||
_tempLines.forEach((line) => {
|
||||
delete line.id;
|
||||
@@ -67,7 +55,7 @@ export default async function DuplicateJob({
|
||||
return;
|
||||
}
|
||||
|
||||
export async function CreateIouForJob({ apolloClient, jobId, config, jobLinesToKeep, currentUser }) {
|
||||
export async function CreateIouForJob(apolloClient, jobId, config, jobLinesToKeep) {
|
||||
logImEXEvent("job_create_iou");
|
||||
|
||||
const { status } = config;
|
||||
@@ -121,9 +109,6 @@ export async function CreateIouForJob({ apolloClient, jobId, config, jobLinesToK
|
||||
delete newJob.joblines;
|
||||
newJob.joblines = { data: _tempLines };
|
||||
|
||||
if (currentUser?.email) {
|
||||
newJob.created_user_email = currentUser.email;
|
||||
}
|
||||
const res2 = await apolloClient.mutate({
|
||||
mutation: INSERT_NEW_JOB,
|
||||
variables: { job: [newJob] }
|
||||
|
||||
@@ -29,6 +29,7 @@ import ProductionListColumnProductionNote from "../production-list-columns/produ
|
||||
import VehicleVinDisplay from "../vehicle-vin-display/vehicle-vin-display.component";
|
||||
import "./jobs-detail-header.styles.scss";
|
||||
import getPartsBasePath from "../../utils/getPartsBasePath.js";
|
||||
import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
jobRO: selectJobReadOnly,
|
||||
@@ -251,16 +252,16 @@ export function JobsDetailHeader({ job, bodyshop, disabled, insertAuditTrail, is
|
||||
<div>
|
||||
<DataLabel key="2" label={t("jobs.fields.ownr_ph1")}>
|
||||
{disabled || isPartsEntry ? (
|
||||
<PhoneNumberFormatter type={job.ownr_ph1_ty}>{job.ownr_ph1}</PhoneNumberFormatter>
|
||||
<PhoneNumberFormatter>{job.ownr_ph1}</PhoneNumberFormatter>
|
||||
) : (
|
||||
<ChatOpenButton type={job.ownr_ph1_ty} phone={job.ownr_ph1} jobid={job.id} />
|
||||
<ChatOpenButton phone={job.ownr_ph1} jobid={job.id} />
|
||||
)}
|
||||
</DataLabel>
|
||||
<DataLabel key="22" label={t("jobs.fields.ownr_ph2")}>
|
||||
{disabled || isPartsEntry ? (
|
||||
<PhoneNumberFormatter type={job.ownr_ph2_ty}>{job.ownr_ph2}</PhoneNumberFormatter>
|
||||
<PhoneNumberFormatter>{job.ownr_ph2}</PhoneNumberFormatter>
|
||||
) : (
|
||||
<ChatOpenButton type={job.ownr_ph2_ty} phone={job.ownr_ph2} jobid={job.id} />
|
||||
<ChatOpenButton phone={job.ownr_ph2} jobid={job.id} />
|
||||
)}
|
||||
</DataLabel>
|
||||
<DataLabel key="3" label={t("owners.fields.address")}>
|
||||
@@ -309,7 +310,7 @@ export function JobsDetailHeader({ job, bodyshop, disabled, insertAuditTrail, is
|
||||
</DataLabel>
|
||||
<DataLabel key="4" label={t("vehicles.fields.v_vin")}>
|
||||
<VehicleVinDisplay>{`${job.v_vin || t("general.labels.na")}`}</VehicleVinDisplay>
|
||||
{bodyshop.pbs_serialnumber || bodyshop.cdk_dealerid ? (
|
||||
{bodyshopHasDmsKey(bodyshop) ? (
|
||||
job.v_vin?.length !== 17 ? (
|
||||
<WarningFilled style={{ color: "tomato", marginLeft: ".3rem" }} />
|
||||
) : null
|
||||
|
||||
@@ -35,14 +35,16 @@ export function JobsDocumentsImgproxyDownloadButton({ galleryImages, identifier,
|
||||
...galleryImages.other.filter((image) => image.isSelected)
|
||||
];
|
||||
|
||||
const downloadProgress = ({ loaded }) => {
|
||||
setDownload((currentDownloadState) => ({
|
||||
downloaded: loaded ?? 0,
|
||||
speed: (loaded ?? 0) - (currentDownloadState?.downloaded ?? 0)
|
||||
}));
|
||||
};
|
||||
function downloadProgress(progressEvent) {
|
||||
setDownload((currentDownloadState) => {
|
||||
return {
|
||||
downloaded: progressEvent.loaded || 0,
|
||||
speed: (progressEvent.loaded || 0) - ((currentDownloadState && currentDownloadState.downloaded) || 0)
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
const standardMediaDownload = (bufferData) => {
|
||||
function standardMediaDownload(bufferData) {
|
||||
try {
|
||||
const a = document.createElement("a");
|
||||
const url = window.URL.createObjectURL(new Blob([bufferData]));
|
||||
@@ -53,26 +55,29 @@ export function JobsDocumentsImgproxyDownloadButton({ galleryImages, identifier,
|
||||
setLoading(false);
|
||||
setDownload(null);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
const handleDownload = async () => {
|
||||
logImEXEvent("jobs_documents_download");
|
||||
setLoading(true);
|
||||
try {
|
||||
const { data } = await axios({
|
||||
const response = await axios({
|
||||
url: "/media/imgproxy/download",
|
||||
method: "POST",
|
||||
responseType: "blob",
|
||||
data: { jobId, documentids: imagesToDownload.map((_) => _.id) },
|
||||
onDownloadProgress: downloadProgress
|
||||
});
|
||||
// Use the response data (Blob) to trigger download
|
||||
standardMediaDownload(data);
|
||||
} catch {
|
||||
// handle error (optional)
|
||||
} finally {
|
||||
|
||||
setLoading(false);
|
||||
setDownload(null);
|
||||
|
||||
// Use the response data (Blob) to trigger download
|
||||
standardMediaDownload(response.data);
|
||||
} catch {
|
||||
setLoading(false);
|
||||
setDownload(null);
|
||||
// handle error (optional)
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@@ -76,14 +76,14 @@ function JobsDocumentsImgproxyComponent({
|
||||
<SyncOutlined />
|
||||
</Button>
|
||||
<JobsDocumentsGallerySelectAllComponent galleryImages={galleryImages} setGalleryImages={setGalleryImages} />
|
||||
{!billId && (
|
||||
<JobsDocumentsGalleryReassign galleryImages={galleryImages} callback={fetchThumbnails || refetch} />
|
||||
)}
|
||||
<JobsDocumentsDownloadButton galleryImages={galleryImages} identifier={downloadIdentifier} jobId={jobId} />
|
||||
<JobsDocumentsDeleteButton
|
||||
galleryImages={galleryImages}
|
||||
deletionCallback={billsCallback || fetchThumbnails || refetch}
|
||||
/>
|
||||
{!billId && (
|
||||
<JobsDocumentsGalleryReassign galleryImages={galleryImages} callback={fetchThumbnails || refetch} />
|
||||
)}
|
||||
</Space>
|
||||
</Col>
|
||||
{!hasMediaAccess && (
|
||||
|
||||
@@ -67,7 +67,7 @@ export default function JobsDocumentsImgproxyDeleteButton({ galleryImages, delet
|
||||
okButtonProps={{ danger: true }}
|
||||
cancelText={t("general.actions.cancel")}
|
||||
>
|
||||
<Button danger disabled={imagesToDelete.length < 1} loading={loading}>
|
||||
<Button disabled={imagesToDelete.length < 1} loading={loading}>
|
||||
{t("documents.actions.delete")}
|
||||
</Button>
|
||||
</Popconfirm>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { EditFilled, FileExcelFilled, SyncOutlined } from "@ant-design/icons";
|
||||
import { FileExcelFilled, SyncOutlined } from "@ant-design/icons";
|
||||
import { Alert, Button, Card, Col, Row, Space } from "antd";
|
||||
import { useEffect, useState } from "react";
|
||||
import { Gallery } from "react-grid-gallery";
|
||||
@@ -107,8 +107,8 @@ export function JobsDocumentsLocalGallery({
|
||||
<a href={CreateExplorerLinkForJob({ jobid: job.id })}>
|
||||
<Button>{t("documents.labels.openinexplorer")}</Button>
|
||||
</a>
|
||||
<JobsDocumentsLocalGallerySelectAllComponent jobid={job.id} />
|
||||
<JobsDocumentsLocalGalleryReassign jobid={job.id} />
|
||||
<JobsDocumentsLocalGallerySelectAllComponent jobid={job.id} />
|
||||
<JobsLocalGalleryDownloadButton job={job} />
|
||||
<JobsDocumentsLocalDeleteButton jobid={job.id} />
|
||||
</Space>
|
||||
@@ -185,21 +185,6 @@ export function JobsDocumentsLocalGallery({
|
||||
</Col>
|
||||
{modalState.open && (
|
||||
<Lightbox
|
||||
toolbarButtons={[
|
||||
<EditFilled
|
||||
key="edit"
|
||||
onClick={() => {
|
||||
const newWindow = window.open(
|
||||
`${window.location.protocol}//${window.location.host}/edit?imageUrl=${
|
||||
jobMedia.images[modalState.index].fullsize
|
||||
}&filename=${jobMedia.images[modalState.index].filename}&jobid=${job.id}`,
|
||||
"_blank",
|
||||
"noopener,noreferrer"
|
||||
);
|
||||
if (newWindow) newWindow.opener = null;
|
||||
}}
|
||||
/>
|
||||
]}
|
||||
mainSrc={jobMedia.images[modalState.index].fullsize}
|
||||
nextSrc={jobMedia.images[(modalState.index + 1) % jobMedia.images.length].fullsize}
|
||||
prevSrc={jobMedia.images[(modalState.index + jobMedia.images.length - 1) % jobMedia.images.length].fullsize}
|
||||
|
||||
@@ -28,8 +28,6 @@ export function JobsDocumentsLocalDeleteButton({ bodyshop, getJobMedia, allMedia
|
||||
|
||||
const [loading, setLoading] = useState(false);
|
||||
|
||||
const imagesToDelete = (allMedia?.[jobid] || []).filter((i) => i.isSelected);
|
||||
|
||||
const handleDelete = async () => {
|
||||
logImEXEvent("job_documents_delete");
|
||||
setLoading(true);
|
||||
@@ -38,7 +36,7 @@ export function JobsDocumentsLocalDeleteButton({ bodyshop, getJobMedia, allMedia
|
||||
`${bodyshop.localmediaserverhttp}/jobs/delete`,
|
||||
{
|
||||
jobid: jobid,
|
||||
files: imagesToDelete.map((i) => i.filename)
|
||||
files: (allMedia?.[jobid] || []).filter((i) => i.isSelected).map((i) => i.filename)
|
||||
},
|
||||
{ headers: { ims_token: bodyshop.localmediatoken } }
|
||||
);
|
||||
@@ -62,17 +60,14 @@ export function JobsDocumentsLocalDeleteButton({ bodyshop, getJobMedia, allMedia
|
||||
|
||||
return (
|
||||
<Popconfirm
|
||||
disabled={imagesToDelete.length < 1}
|
||||
icon={<QuestionCircleOutlined style={{ color: "red" }} />}
|
||||
onConfirm={handleDelete}
|
||||
title={t("documents.labels.confirmdelete")}
|
||||
okText={t("general.actions.delete")}
|
||||
okButtonProps={{ danger: true }}
|
||||
okButtonProps={{ type: "danger" }}
|
||||
cancelText={t("general.actions.cancel")}
|
||||
>
|
||||
<Button danger disabled={imagesToDelete.length < 1} loading={loading}>
|
||||
{t("documents.actions.delete")}
|
||||
</Button>
|
||||
<Button loading={loading}>{t("documents.actions.delete")}</Button>
|
||||
</Popconfirm>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
import { Button, Space } from "antd";
|
||||
import { Button } from "antd";
|
||||
import { useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import cleanAxios from "../../utils/CleanAxios";
|
||||
import formatBytes from "../../utils/formatbytes";
|
||||
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { selectAllMedia } from "../../redux/media/media.selectors";
|
||||
@@ -19,63 +19,45 @@ export default connect(mapStateToProps, mapDispatchToProps)(JobsLocalGalleryDown
|
||||
|
||||
export function JobsLocalGalleryDownloadButton({ bodyshop, allMedia, job }) {
|
||||
const { t } = useTranslation();
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [download, setDownload] = useState(false);
|
||||
const [download, setDownload] = useState(null);
|
||||
|
||||
const imagesToDownload = (allMedia?.[job.id] || []).filter((i) => i.isSelected);
|
||||
|
||||
const downloadProgress = ({ loaded }) => {
|
||||
setDownload((currentDownloadState) => ({
|
||||
downloaded: loaded || 0,
|
||||
speed: (loaded || 0) - (currentDownloadState?.downloaded || 0)
|
||||
}));
|
||||
};
|
||||
|
||||
const standardMediaDownload = (bufferData, filename) => {
|
||||
try {
|
||||
const a = document.createElement("a");
|
||||
const url = window.URL.createObjectURL(new Blob([bufferData]));
|
||||
a.href = url;
|
||||
a.download = `${filename}.zip`;
|
||||
a.click();
|
||||
} catch {
|
||||
setLoading(false);
|
||||
setDownload(null);
|
||||
}
|
||||
};
|
||||
function downloadProgress(progressEvent) {
|
||||
setDownload((currentDownloadState) => {
|
||||
return {
|
||||
downloaded: progressEvent.loaded || 0,
|
||||
speed: (progressEvent.loaded || 0) - (currentDownloadState?.downloaded || 0)
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
const handleDownload = async () => {
|
||||
const { localmediaserverhttp, localmediatoken } = bodyshop;
|
||||
const { id, ro_number } = job;
|
||||
setLoading(true);
|
||||
try {
|
||||
const response = await cleanAxios.post(
|
||||
`${localmediaserverhttp}/jobs/download`,
|
||||
{
|
||||
jobid: id,
|
||||
files: imagesToDownload.map((i) => i.filename)
|
||||
},
|
||||
{
|
||||
headers: { ims_token: localmediatoken },
|
||||
responseType: "arraybuffer",
|
||||
onDownloadProgress: downloadProgress
|
||||
}
|
||||
);
|
||||
standardMediaDownload(response.data, ro_number);
|
||||
} catch {
|
||||
// handle error (optional)
|
||||
} finally {
|
||||
setLoading(false);
|
||||
setDownload(null);
|
||||
}
|
||||
const theDownloadedZip = await cleanAxios.post(
|
||||
`${bodyshop.localmediaserverhttp}/jobs/download`,
|
||||
{
|
||||
jobid: job.id,
|
||||
files: (allMedia?.[job.id] || []).filter((i) => i.isSelected).map((i) => i.filename)
|
||||
},
|
||||
{
|
||||
headers: { ims_token: bodyshop.localmediatoken },
|
||||
responseType: "arraybuffer",
|
||||
onDownloadProgress: downloadProgress
|
||||
}
|
||||
);
|
||||
setDownload(null);
|
||||
standardMediaDownload(theDownloadedZip.data, job.ro_number);
|
||||
};
|
||||
|
||||
return (
|
||||
<Button disabled={imagesToDownload < 1} loading={download || loading} onClick={handleDownload}>
|
||||
<Space>
|
||||
<span>{t("documents.actions.download")}</span>
|
||||
{download && <span>{`(${formatBytes(download.downloaded)} @ ${formatBytes(download.speed)} / second)`}</span>}
|
||||
</Space>
|
||||
<Button loading={!!download} onClick={handleDownload}>
|
||||
{t("documents.actions.download")}
|
||||
</Button>
|
||||
);
|
||||
}
|
||||
|
||||
function standardMediaDownload(bufferData, filename) {
|
||||
const a = document.createElement("a");
|
||||
const url = window.URL.createObjectURL(new Blob([bufferData]));
|
||||
a.href = url;
|
||||
a.download = `${filename}.zip`;
|
||||
a.click();
|
||||
}
|
||||
|
||||
@@ -64,11 +64,7 @@ export default function JobsFindModalComponent({
|
||||
width: "12%",
|
||||
ellipsis: true,
|
||||
render: (text, record) => {
|
||||
return record.ownr_ph1 ? (
|
||||
<PhoneFormatter type={record.ownr_ph1_ty}>{record.ownr_ph1}</PhoneFormatter>
|
||||
) : (
|
||||
t("general.labels.unknown")
|
||||
);
|
||||
return record.ownr_ph1 ? <PhoneFormatter>{record.ownr_ph1}</PhoneFormatter> : t("general.labels.unknown");
|
||||
}
|
||||
},
|
||||
{
|
||||
@@ -78,11 +74,7 @@ export default function JobsFindModalComponent({
|
||||
width: "12%",
|
||||
ellipsis: true,
|
||||
render: (text, record) => {
|
||||
return record.ownr_ph2 ? (
|
||||
<PhoneFormatter type={record.ownr_ph2_ty}>{record.ownr_ph2}</PhoneFormatter>
|
||||
) : (
|
||||
t("general.labels.unknown")
|
||||
);
|
||||
return record.ownr_ph2 ? <PhoneFormatter>{record.ownr_ph2}</PhoneFormatter> : t("general.labels.unknown");
|
||||
}
|
||||
},
|
||||
{
|
||||
@@ -253,11 +245,7 @@ export default function JobsFindModalComponent({
|
||||
>
|
||||
{t("jobs.labels.override_header")}
|
||||
</Checkbox>
|
||||
<Checkbox
|
||||
checked={partsQueueToggle}
|
||||
onChange={(e) => setPartsQueueToggle(e.target.checked)}
|
||||
id="parts_queue_toggle"
|
||||
>
|
||||
<Checkbox checked={partsQueueToggle} onChange={(e) => setPartsQueueToggle(e.target.checked)} id="parts_queue_toggle">
|
||||
{t("bodyshop.fields.md_functionality_toggles.parts_queue_toggle")}
|
||||
</Checkbox>
|
||||
<Checkbox
|
||||
|
||||
@@ -72,14 +72,14 @@ export function JobsList({ bodyshop, refetch, loading, jobs, total }) {
|
||||
dataIndex: "ownr_ph1",
|
||||
key: "ownr_ph1",
|
||||
ellipsis: true,
|
||||
render: (text, record) => <StartChatButton type={record.ownr_ph1_ty} phone={record.ownr_ph1} jobid={record.id} />
|
||||
render: (text, record) => <StartChatButton phone={record.ownr_ph1} jobid={record.id} />
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.ownr_ph2"),
|
||||
dataIndex: "ownr_ph2",
|
||||
key: "ownr_ph2",
|
||||
ellipsis: true,
|
||||
render: (text, record) => <StartChatButton type={record.ownr_ph2_ty} phone={record.ownr_ph2} jobid={record.id} />
|
||||
render: (text, record) => <StartChatButton phone={record.ownr_ph2} jobid={record.id} />
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.status"),
|
||||
|
||||
@@ -139,7 +139,7 @@ export function JobsList({ bodyshop }) {
|
||||
key: "ownr_ph1",
|
||||
ellipsis: true,
|
||||
responsive: ["md"],
|
||||
render: (text, record) => <ChatOpenButton type={record.ownr_ph1_ty} phone={record.ownr_ph1} jobid={record.id} />
|
||||
render: (text, record) => <ChatOpenButton phone={record.ownr_ph1} jobid={record.id} />
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.ownr_ph2"),
|
||||
@@ -147,7 +147,7 @@ export function JobsList({ bodyshop }) {
|
||||
key: "ownr_ph2",
|
||||
ellipsis: true,
|
||||
responsive: ["md"],
|
||||
render: (text, record) => <ChatOpenButton type={record.ownr_ph2_ty} phone={record.ownr_ph2} jobid={record.id} />
|
||||
render: (text, record) => <ChatOpenButton phone={record.ownr_ph2} jobid={record.id} />
|
||||
},
|
||||
|
||||
{
|
||||
|
||||
@@ -140,7 +140,7 @@ export function JobsReadyList({ bodyshop }) {
|
||||
key: "ownr_ph1",
|
||||
ellipsis: true,
|
||||
responsive: ["md"],
|
||||
render: (text, record) => <ChatOpenButton type={record.ownr_ph1_ty} phone={record.ownr_ph1} jobid={record.id} />
|
||||
render: (text, record) => <ChatOpenButton phone={record.ownr_ph1} jobid={record.id} />
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.ownr_ph2"),
|
||||
@@ -148,7 +148,7 @@ export function JobsReadyList({ bodyshop }) {
|
||||
key: "ownr_ph2",
|
||||
ellipsis: true,
|
||||
responsive: ["md"],
|
||||
render: (text, record) => <ChatOpenButton type={record.ownr_ph2_ty} phone={record.ownr_ph2} jobid={record.id} />
|
||||
render: (text, record) => <ChatOpenButton phone={record.ownr_ph2} jobid={record.id} />
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.status"),
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import i18next from "i18next";
|
||||
import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
|
||||
|
||||
export const CalculateAllocationsTotals = (bodyshop, joblines, timetickets, adjustments = []) => {
|
||||
const responsibilitycenters = bodyshop.md_responsibility_centers;
|
||||
@@ -14,10 +15,9 @@ export const CalculateAllocationsTotals = (bodyshop, joblines, timetickets, adju
|
||||
const r = allCodes.reduce((acc, value) => {
|
||||
const r = {
|
||||
opcode: value,
|
||||
cost_center:
|
||||
bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber
|
||||
? i18next.t(`joblines.fields.lbr_types.${value && value.toUpperCase()}`)
|
||||
: responsibilitycenters.defaults.costs[value],
|
||||
cost_center: bodyshopHasDmsKey(bodyshop)
|
||||
? i18next.t(`joblines.fields.lbr_types.${value && value.toUpperCase()}`)
|
||||
: responsibilitycenters.defaults.costs[value],
|
||||
mod_lbr_ty: value,
|
||||
total: joblines.reduce((acc2, val2) => {
|
||||
return val2.mod_lbr_ty === value ? acc2 + val2.mod_lb_hrs : acc2;
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { Form, Input, Select, Tooltip } from "antd";
|
||||
import { Form, Input, Tooltip } from "antd";
|
||||
import { CloseCircleFilled } from "@ant-design/icons";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import FormFieldsChanged from "../form-fields-changed-alert/form-fields-changed-alert.component";
|
||||
@@ -10,12 +10,6 @@ export default function OwnerDetailFormComponent({ form, isPhone1OptedOut, isPho
|
||||
const { t } = useTranslation();
|
||||
const { getFieldValue } = form;
|
||||
|
||||
const PHONE_TYPE_OPTIONS = [
|
||||
{ label: t("owners.labels.home"), value: "Home" },
|
||||
{ label: t("owners.labels.work"), value: "Work" },
|
||||
{ label: t("owners.labels.cell"), value: "Cell" }
|
||||
];
|
||||
|
||||
return (
|
||||
<div>
|
||||
<FormFieldsChanged form={form} />
|
||||
@@ -36,7 +30,6 @@ export default function OwnerDetailFormComponent({ form, isPhone1OptedOut, isPho
|
||||
<Input disabled />
|
||||
</Form.Item>
|
||||
</LayoutFormRow>
|
||||
|
||||
<LayoutFormRow header={t("owners.forms.address")}>
|
||||
<Form.Item label={t("owners.fields.ownr_addr1")} name="ownr_addr1">
|
||||
<Input />
|
||||
@@ -57,7 +50,6 @@ export default function OwnerDetailFormComponent({ form, isPhone1OptedOut, isPho
|
||||
<Input />
|
||||
</Form.Item>
|
||||
</LayoutFormRow>
|
||||
|
||||
<LayoutFormRow header={t("owners.forms.contact")}>
|
||||
<Form.Item
|
||||
label={t("owners.fields.ownr_ea")}
|
||||
@@ -71,8 +63,6 @@ export default function OwnerDetailFormComponent({ form, isPhone1OptedOut, isPho
|
||||
>
|
||||
<FormItemEmail email={getFieldValue("ownr_ea")} />
|
||||
</Form.Item>
|
||||
|
||||
{/* Phone 1 + Type + Opt-out icon */}
|
||||
<Form.Item label={t("owners.fields.ownr_ph1")} style={{ marginBottom: 0 }}>
|
||||
<div style={{ display: "flex", alignItems: "center", gap: "8px" }}>
|
||||
<Form.Item
|
||||
@@ -82,11 +72,6 @@ export default function OwnerDetailFormComponent({ form, isPhone1OptedOut, isPho
|
||||
>
|
||||
<Input style={{ flex: 1, minWidth: "150px" }} />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item name="ownr_ph1_ty" noStyle>
|
||||
<Select allowClear placeholder="Type" options={PHONE_TYPE_OPTIONS} style={{ width: 110 }} />
|
||||
</Form.Item>
|
||||
|
||||
{isPhone1OptedOut && (
|
||||
<Tooltip title={t("consent.text_body")}>
|
||||
<CloseCircleFilled
|
||||
@@ -103,8 +88,6 @@ export default function OwnerDetailFormComponent({ form, isPhone1OptedOut, isPho
|
||||
)}
|
||||
</div>
|
||||
</Form.Item>
|
||||
|
||||
{/* Phone 2 + Type + Opt-out icon */}
|
||||
<Form.Item label={t("owners.fields.ownr_ph2")} style={{ marginBottom: 0 }}>
|
||||
<div style={{ display: "flex", alignItems: "center", gap: "8px" }}>
|
||||
<Form.Item
|
||||
@@ -114,11 +97,6 @@ export default function OwnerDetailFormComponent({ form, isPhone1OptedOut, isPho
|
||||
>
|
||||
<Input style={{ flex: 1, minWidth: "150px" }} />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item name="ownr_ph2_ty" noStyle>
|
||||
<Select allowClear placeholder="Type" options={PHONE_TYPE_OPTIONS} style={{ width: 110 }} />
|
||||
</Form.Item>
|
||||
|
||||
{isPhone2OptedOut && (
|
||||
<Tooltip title={t("consent.text_body")}>
|
||||
<CloseCircleFilled
|
||||
@@ -135,7 +113,6 @@ export default function OwnerDetailFormComponent({ form, isPhone1OptedOut, isPho
|
||||
)}
|
||||
</div>
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item label={t("owners.fields.preferred_contact")} name="preferred_contact">
|
||||
<Input />
|
||||
</Form.Item>
|
||||
@@ -143,7 +120,6 @@ export default function OwnerDetailFormComponent({ form, isPhone1OptedOut, isPho
|
||||
<Input />
|
||||
</Form.Item>
|
||||
</LayoutFormRow>
|
||||
|
||||
<Form.Item label={t("owners.fields.note")} name="note">
|
||||
<Input.TextArea rows={4} />
|
||||
</Form.Item>
|
||||
|
||||
@@ -25,10 +25,8 @@ export default function OwnerDetailUpdateJobsComponent({ owner, selectedJobs, di
|
||||
ownr_ea: owner["ownr_ea"],
|
||||
ownr_fn: owner["ownr_fn"],
|
||||
ownr_ph1: owner["ownr_ph1"],
|
||||
ownr_ph1_ty: owner["ownr_ph1_ty"],
|
||||
ownr_ln: owner["ownr_ln"],
|
||||
ownr_ph2: owner["ownr_ph2"],
|
||||
ownr_ph2_ty: owner["ownr_ph2_ty"],
|
||||
ownr_st: owner["ownr_st"],
|
||||
ownr_title: owner["ownr_title"],
|
||||
ownr_zip: owner["ownr_zip"]
|
||||
|
||||
@@ -47,13 +47,13 @@ export default function OwnerFindModalComponent({
|
||||
title: t("owners.fields.ownr_ph1"),
|
||||
dataIndex: "ownr_ph1",
|
||||
key: "ownr_ph1",
|
||||
render: (text, record) => <PhoneFormatter type={record.ownr_ph1_ty}>{record.ownr_ph1}</PhoneFormatter>
|
||||
render: (text, record) => <PhoneFormatter>{record.ownr_ph1}</PhoneFormatter>
|
||||
},
|
||||
{
|
||||
title: t("owners.fields.ownr_ph2"),
|
||||
dataIndex: "ownr_ph2",
|
||||
key: "ownr_ph2",
|
||||
render: (text, record) => <PhoneFormatter type={record.ownr_ph2_ty}>{record.ownr_ph2}</PhoneFormatter>
|
||||
render: (text, record) => <PhoneFormatter>{record.ownr_ph2}</PhoneFormatter>
|
||||
},
|
||||
{
|
||||
title: t("owners.fields.note"),
|
||||
|
||||
@@ -15,10 +15,10 @@ export default function OwnerTagPopoverComponent({ job }) {
|
||||
<OwnerNameDisplay ownerObject={job} />
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item key="2" label={t("jobs.fields.ownr_ph1")}>
|
||||
<PhoneFormatter type={job.ownr_ph1_ty}>{job.ownr_ph1 || ""}</PhoneFormatter>
|
||||
<PhoneFormatter>{job.ownr_ph1 || ""}</PhoneFormatter>
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item key="22" label={t("jobs.fields.ownr_ph2")}>
|
||||
<PhoneFormatter type={job.ownr_ph2_ty}>{job.ownr_ph2 || ""}</PhoneFormatter>
|
||||
<PhoneFormatter>{job.ownr_ph2 || ""}</PhoneFormatter>
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item key="3" label={t("owners.fields.address")}>
|
||||
{`${job.ownr_addr1 || ""} ${job.ownr_addr2 || ""} ${
|
||||
@@ -36,10 +36,13 @@ export default function OwnerTagPopoverComponent({ job }) {
|
||||
<OwnerNameDisplay ownerObject={job.owner} />
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item key="2" label={t("jobs.fields.ownr_ph1")}>
|
||||
<PhoneFormatter type={job.owner.ownr_ph1_ty}>{job.owner.ownr_ph1 || ""}</PhoneFormatter>
|
||||
<PhoneFormatter>{job.owner.ownr_ph1 || ""}</PhoneFormatter>
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item key="22" label={t("jobs.fields.ownr_ph2")}>
|
||||
<PhoneFormatter>{job.owner.ownr_ph2 || ""}</PhoneFormatter>
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item key="2" label={t("jobs.fields.ownr_ph2")}>
|
||||
<PhoneFormatter type={job.owner.ownr_ph2_ty}>{job.owner.ownr_ph2 || ""}</PhoneFormatter>
|
||||
<PhoneFormatter>{job.owner.ownr_ph2 || ""}</PhoneFormatter>
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item key="3" label={t("owners.fields.address")}>
|
||||
{`${job.owner.ownr_addr1 || ""} ${job.owner.ownr_addr2 || ""} ${
|
||||
|
||||
@@ -39,7 +39,7 @@ export default function OwnersListComponent({ loading, owners, total, refetch })
|
||||
dataIndex: "ownr_ph1",
|
||||
key: "ownr_ph1",
|
||||
render: (text, record) => {
|
||||
return <PhoneFormatter type={record.ownr_ph1_ty}>{record.ownr_ph1}</PhoneFormatter>;
|
||||
return <PhoneFormatter>{record.ownr_ph1}</PhoneFormatter>;
|
||||
}
|
||||
},
|
||||
{
|
||||
@@ -47,7 +47,7 @@ export default function OwnersListComponent({ loading, owners, total, refetch })
|
||||
dataIndex: "ownr_ph2",
|
||||
key: "ownr_ph2",
|
||||
render: (text, record) => {
|
||||
return <PhoneFormatter type={record.ownr_ph2_ty}>{record.ownr_ph2}</PhoneFormatter>;
|
||||
return <PhoneFormatter>{record.ownr_ph2}</PhoneFormatter>;
|
||||
}
|
||||
},
|
||||
{
|
||||
|
||||
@@ -44,6 +44,7 @@ export async function checkPartnerStatus(bodyshop) {
|
||||
// bodyshop &&
|
||||
// (bodyshop.cdk_dealerid ||
|
||||
// bodyshop.pbs_serialnumber ||
|
||||
// bodyshop.rr_dealerid ||
|
||||
// bodyshop.accountingconfig.qbo)
|
||||
// )
|
||||
// ) {
|
||||
|
||||
@@ -28,6 +28,7 @@ import PartsOrderDeleteLine from "../parts-order-delete-line/parts-order-delete-
|
||||
import PartsOrderLineBackorderButton from "../parts-order-line-backorder-button/parts-order-line-backorder-button.component";
|
||||
import PartsReceiveModalContainer from "../parts-receive-modal/parts-receive-modal.container";
|
||||
import PrintWrapper from "../print-wrapper/print-wrapper.component";
|
||||
import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
jobRO: selectJobReadOnly,
|
||||
@@ -196,7 +197,7 @@ export function PartsOrderListTableDrawerComponent({
|
||||
quantity: pol.quantity,
|
||||
actual_price: pol.act_price,
|
||||
cost_center: pol.jobline?.part_type
|
||||
? bodyshop.pbs_serialnumber || bodyshop.cdk_dealerid
|
||||
? bodyshopHasDmsKey(bodyshop)
|
||||
? pol.jobline.part_type !== "PAE"
|
||||
? pol.jobline.part_type
|
||||
: null
|
||||
|
||||
@@ -20,6 +20,7 @@ import PartsReceiveModalContainer from "../parts-receive-modal/parts-receive-mod
|
||||
import PrintWrapper from "../print-wrapper/print-wrapper.component";
|
||||
import PartsOrderDrawer from "./parts-order-list-table-drawer.component";
|
||||
import ShareToTeamsButton from "../share-to-teams/share-to-teams.component.jsx";
|
||||
import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
jobRO: selectJobReadOnly,
|
||||
@@ -69,6 +70,7 @@ export function PartsOrderListTableComponent({
|
||||
|
||||
const parts_orders = billsQuery.data ? billsQuery.data.parts_orders : [];
|
||||
const { refetch } = billsQuery;
|
||||
|
||||
const recordActions = (record, showView = false) => (
|
||||
<Space direction="horizontal" wrap>
|
||||
<ShareToTeamsButton
|
||||
@@ -172,7 +174,7 @@ export function PartsOrderListTableComponent({
|
||||
actual_price: pol.act_price,
|
||||
|
||||
cost_center: pol.jobline?.part_type
|
||||
? bodyshop.pbs_serialnumber || bodyshop.cdk_dealerid
|
||||
? bodyshopHasDmsKey(bodyshop)
|
||||
? pol.jobline.part_type !== "PAE"
|
||||
? pol.jobline.part_type
|
||||
: null
|
||||
|
||||
@@ -16,11 +16,11 @@ import { pageLimit } from "../../utils/config";
|
||||
import { alphaSort, dateSort } from "../../utils/sorters";
|
||||
import useLocalStorage from "../../utils/useLocalStorage";
|
||||
import AlertComponent from "../alert/alert.component";
|
||||
import JobPartsQueueCount from "../job-parts-queue-count/job-parts-queue-count.component";
|
||||
import JobRemoveFromPartsQueue from "../job-remove-from-parst-queue/job-remove-from-parts-queue.component";
|
||||
import OwnerNameDisplay, { OwnerNameDisplayFunction } from "../owner-name-display/owner-name-display.component";
|
||||
import ProductionListColumnComment from "../production-list-columns/production-list-columns.comment.component";
|
||||
import { logImEXEvent } from "../../firebase/firebase.utils";
|
||||
import JobPartsReceived from "../job-parts-received/job-parts-received.component";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
bodyshop: selectBodyshop
|
||||
@@ -235,9 +235,7 @@ export function PartsQueueListComponent({ bodyshop }) {
|
||||
title: t("jobs.fields.partsstatus"),
|
||||
dataIndex: "partsstatus",
|
||||
key: "partsstatus",
|
||||
render: (text, record) => (
|
||||
<JobPartsReceived parts={record.joblines_status} displayMode="full" popoverPlacement="topLeft" />
|
||||
)
|
||||
render: (text, record) => <JobPartsQueueCount parts={record.joblines_status} />
|
||||
},
|
||||
{
|
||||
title: t("jobs.fields.comment"),
|
||||
|
||||
@@ -19,7 +19,6 @@ import JobPartsQueueCount from "../job-parts-queue-count/job-parts-queue-count.c
|
||||
import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
|
||||
import ShareToTeamsButton from "../share-to-teams/share-to-teams.component.jsx";
|
||||
import { PiMicrosoftTeamsLogo } from "react-icons/pi";
|
||||
import ProductionListColumnPartsReceived from "../production-list-columns/production-list-columns.partsreceived.component";
|
||||
|
||||
const cardColor = (ssbuckets, totalHrs) => {
|
||||
const bucket = ssbuckets.find((bucket) => bucket.gte <= totalHrs && (!bucket.lt || bucket.lt > totalHrs));
|
||||
@@ -313,20 +312,6 @@ const TasksToolTip = ({ metadata, cardSettings, t }) =>
|
||||
</Col>
|
||||
);
|
||||
|
||||
const PartsReceivedComponent = ({ metadata, cardSettings, card }) =>
|
||||
cardSettings?.partsreceived && (
|
||||
<Col span={24} style={{ textAlign: "center" }}>
|
||||
<ProductionListColumnPartsReceived
|
||||
displayMode="full"
|
||||
popoverPlacement="topLeft"
|
||||
record={{
|
||||
...metadata,
|
||||
id: card?.id,
|
||||
refetch: card?.refetch
|
||||
}}
|
||||
/>
|
||||
</Col>
|
||||
);
|
||||
export default function ProductionBoardCard({ technician, card, bodyshop, cardSettings }) {
|
||||
const { t } = useTranslation();
|
||||
const { metadata } = card;
|
||||
@@ -426,7 +411,6 @@ export default function ProductionBoardCard({ technician, card, bodyshop, cardSe
|
||||
<SubletsComponent metadata={metadata} cardSettings={cardSettings} />
|
||||
<ProductionNoteComponent metadata={metadata} cardSettings={cardSettings} card={card} />
|
||||
<PartsStatusComponent metadata={metadata} cardSettings={cardSettings} />
|
||||
<PartsReceivedComponent metadata={metadata} cardSettings={cardSettings} card={card} />
|
||||
</Row>
|
||||
);
|
||||
|
||||
|
||||
@@ -18,8 +18,7 @@ const InformationSettings = ({ t }) => (
|
||||
"partsstatus",
|
||||
"estimator",
|
||||
"subtotal",
|
||||
"tasks",
|
||||
"partsreceived"
|
||||
"tasks"
|
||||
].map((item) => (
|
||||
<Col xs={24} sm={12} md={8} lg={6} key={item}>
|
||||
<Form.Item name={item} valuePropName="checked">
|
||||
|
||||
@@ -74,7 +74,6 @@ const defaultKanbanSettings = {
|
||||
cardSize: "small",
|
||||
model_info: true,
|
||||
kiosk: false,
|
||||
partsreceived: false,
|
||||
totalHrs: true,
|
||||
totalAmountInProduction: false,
|
||||
totalLAB: true,
|
||||
|
||||
@@ -161,6 +161,7 @@ const productionListColumnsData = ({ technician, state, activeStatuses, data, bo
|
||||
dataIndex: "actual_in_time",
|
||||
key: "actual_in_time",
|
||||
ellipsis: true,
|
||||
|
||||
render: (text, record) => <TimeFormatter>{record.actual_in}</TimeFormatter>
|
||||
},
|
||||
{
|
||||
@@ -180,22 +181,6 @@ const productionListColumnsData = ({ technician, state, activeStatuses, data, bo
|
||||
|
||||
render: (text, record) => <TimeFormatter>{record.scheduled_completion}</TimeFormatter>
|
||||
},
|
||||
{
|
||||
title: i18n.t("jobs.fields.actual_completion"),
|
||||
dataIndex: "actual_completion",
|
||||
key: "actual_completion",
|
||||
ellipsis: true,
|
||||
sorter: (a, b) => dateSort(a.actual_completion, b.actual_completion),
|
||||
sortOrder: state.sortedInfo.columnKey === "actual_completion" && state.sortedInfo.order,
|
||||
render: (text, record) => <ProductionListDate record={record} field="actual_completion" time />
|
||||
},
|
||||
{
|
||||
title: i18n.t("jobs.fields.actual_completion") + " (HH:MM)",
|
||||
dataIndex: "actual_completion_time",
|
||||
key: "actual_completion_time",
|
||||
ellipsis: true,
|
||||
render: (text, record) => <TimeFormatter>{record.actual_completion}</TimeFormatter>
|
||||
},
|
||||
{
|
||||
title: i18n.t("jobs.fields.date_last_contacted"),
|
||||
dataIndex: "date_last_contacted",
|
||||
@@ -270,14 +255,14 @@ const productionListColumnsData = ({ technician, state, activeStatuses, data, bo
|
||||
dataIndex: "ownr_ph1",
|
||||
key: "ownr_ph1",
|
||||
ellipsis: true,
|
||||
render: (text, record) => <PhoneFormatter type={record.ownr_ph1_ty}>{record.ownr_ph1}</PhoneFormatter>
|
||||
render: (text, record) => <PhoneFormatter>{record.ownr_ph1}</PhoneFormatter>
|
||||
},
|
||||
{
|
||||
title: i18n.t("jobs.fields.ownr_ph2"),
|
||||
dataIndex: "ownr_ph2",
|
||||
key: "ownr_ph2",
|
||||
ellipsis: true,
|
||||
render: (text, record) => <PhoneFormatter type={record.ownr_ph2_ty}>{record.ownr_ph2}</PhoneFormatter>
|
||||
render: (text, record) => <PhoneFormatter>{record.ownr_ph2}</PhoneFormatter>
|
||||
},
|
||||
{
|
||||
title: i18n.t("jobs.fields.specialcoveragepolicy"),
|
||||
|
||||
@@ -144,7 +144,7 @@ export function ProductionListEmpAssignment({ insertAuditTrail, bodyshop, record
|
||||
<Spin spinning={loading}>
|
||||
{record[type] ? (
|
||||
<div>
|
||||
<span>{`${theEmployee?.first_name || ""} ${theEmployee?.last_name || ""}`}</span>
|
||||
<span>{`${theEmployee.first_name || ""} ${theEmployee.last_name || ""}`}</span>
|
||||
<DeleteFilled style={iconStyle} onClick={() => handleRemove(type)} />
|
||||
</div>
|
||||
) : (
|
||||
|
||||
@@ -1,5 +1,33 @@
|
||||
import JobPartsReceived from "../job-parts-received/job-parts-received.component";
|
||||
import { useMemo } from "react";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { selectBodyshop } from "../../redux/user/user.selectors";
|
||||
|
||||
export default function ProductionListColumnPartsReceived({ record }) {
|
||||
return <JobPartsReceived parts={record.joblines_status} displayMode="full" popoverPlacement="topLeft" />;
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
bodyshop: selectBodyshop
|
||||
});
|
||||
const mapDispatchToProps = () => ({
|
||||
//setUserLanguage: language => dispatch(setUserLanguage(language))
|
||||
});
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(ProductionListColumnPartsReceived);
|
||||
|
||||
export function ProductionListColumnPartsReceived({ bodyshop, record }) {
|
||||
const amount = useMemo(() => {
|
||||
const amount = record.joblines_status.reduce(
|
||||
(acc, val) => {
|
||||
acc.total += val.count;
|
||||
acc.received =
|
||||
val.status === bodyshop.md_order_statuses.default_received ? acc.received + val.count : acc.received;
|
||||
return acc;
|
||||
},
|
||||
{ total: 0, received: 0 }
|
||||
);
|
||||
|
||||
return {
|
||||
...amount,
|
||||
percent: amount.total !== 0 ? ((amount.received / amount.total) * 100).toFixed(0) + "%" : "N/A"
|
||||
};
|
||||
}, [record, bodyshop.md_order_statuses]);
|
||||
|
||||
return `${amount.percent} (${amount.received}/${amount.total})`;
|
||||
}
|
||||
|
||||
@@ -154,25 +154,13 @@ export function ProductionListDetail({ bodyshop, jobs, setPrintCenterContext, te
|
||||
<OwnerNameDisplay ownerObject={theJob} />
|
||||
{!technician ? (
|
||||
<>
|
||||
<StartChatButton
|
||||
type={data.jobs_by_pk.ownr_ph1_ty}
|
||||
phone={data.jobs_by_pk.ownr_ph1}
|
||||
jobid={data.jobs_by_pk.id}
|
||||
/>
|
||||
<StartChatButton
|
||||
type={data.jobs_by_pk.ownr_ph2_ty}
|
||||
phone={data.jobs_by_pk.ownr_ph2}
|
||||
jobid={data.jobs_by_pk.id}
|
||||
/>
|
||||
<StartChatButton phone={data.jobs_by_pk.ownr_ph1} jobid={data.jobs_by_pk.id} />
|
||||
<StartChatButton phone={data.jobs_by_pk.ownr_ph2} jobid={data.jobs_by_pk.id} />
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<PhoneNumberFormatter type={data.jobs_by_pk.ownr_ph1_ty}>
|
||||
{data.jobs_by_pk.ownr_ph1}
|
||||
</PhoneNumberFormatter>
|
||||
<PhoneNumberFormatter type={data.jobs_by_pk.ownr_ph2_ty}>
|
||||
{data.jobs_by_pk.ownr_ph2}
|
||||
</PhoneNumberFormatter>
|
||||
<PhoneNumberFormatter>{data.jobs_by_pk.ownr_ph1}</PhoneNumberFormatter>
|
||||
<PhoneNumberFormatter>{data.jobs_by_pk.ownr_ph2}</PhoneNumberFormatter>
|
||||
</>
|
||||
)}
|
||||
</Space>
|
||||
|
||||
@@ -143,7 +143,7 @@ export function ReportCenterModalComponent({ reportCenterModal, bodyshop }) {
|
||||
|
||||
//TODO: Find a way to filter out / blur on demand.
|
||||
return (
|
||||
<div className="report-center-modal">
|
||||
<div>
|
||||
<Form onFinish={handleFinish} autoComplete={"off"} layout="vertical" form={form}>
|
||||
<Input.Search onChange={(e) => setSearch(e.target.value)} value={search} />
|
||||
<Form.Item name="defaultSorters" hidden />
|
||||
@@ -163,14 +163,13 @@ export function ReportCenterModalComponent({ reportCenterModal, bodyshop }) {
|
||||
{Object.keys(grouped)
|
||||
//.filter((key) => !groupExcludeKeyFilter.includes(key))
|
||||
.map((key) => (
|
||||
<Col xs={24} sm={12} md={Object.keys(grouped).length === 1 ? 24 : 8} key={key}>
|
||||
<Col md={8} sm={12} key={key}>
|
||||
<Card.Grid
|
||||
style={{
|
||||
width: "100%",
|
||||
height: "100%",
|
||||
maxHeight: "33vh",
|
||||
overflowY: "scroll",
|
||||
minWidth: "200px"
|
||||
overflowY: "scroll"
|
||||
}}
|
||||
>
|
||||
<Typography.Title level={4}>{t(`reportcenter.labels.groups.${key}`)}</Typography.Title>
|
||||
@@ -178,7 +177,7 @@ export function ReportCenterModalComponent({ reportCenterModal, bodyshop }) {
|
||||
<BlurWrapperComponent
|
||||
featureName={groupExcludeKeyFilter.find((g) => g.key === key).featureName}
|
||||
>
|
||||
<ul style={{ listStyleType: "none", columns: grouped[key].length > 4 ? "2 auto" : "1", padding: 0, margin: 0 }}>
|
||||
<ul style={{ listStyleType: "none", columns: "2 auto" }}>
|
||||
{grouped[key].map((item) => (
|
||||
<li key={item.key}>
|
||||
<Radio key={item.key} value={item.key}>
|
||||
@@ -189,7 +188,7 @@ export function ReportCenterModalComponent({ reportCenterModal, bodyshop }) {
|
||||
</ul>
|
||||
</BlurWrapperComponent>
|
||||
) : (
|
||||
<ul style={{ listStyleType: "none", columns: grouped[key].length > 4 ? "2 auto" : "1", padding: 0, margin: 0 }}>
|
||||
<ul style={{ listStyleType: "none", columns: "2 auto" }}>
|
||||
{grouped[key].map((item) =>
|
||||
item.featureNameRestricted ? (
|
||||
<li key={item.key}>
|
||||
|
||||
@@ -11,38 +11,3 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Report center modal fixes for column layout
|
||||
.report-center-modal {
|
||||
.ant-form-item .ant-radio-group {
|
||||
width: 100%;
|
||||
|
||||
.ant-card-grid {
|
||||
padding: 16px;
|
||||
box-sizing: border-box;
|
||||
|
||||
ul {
|
||||
width: 100%;
|
||||
|
||||
li {
|
||||
margin-bottom: 8px;
|
||||
break-inside: avoid;
|
||||
page-break-inside: avoid;
|
||||
|
||||
.ant-radio-wrapper {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
width: 100%;
|
||||
|
||||
span:not(.ant-radio) {
|
||||
word-break: break-word;
|
||||
overflow-wrap: break-word;
|
||||
hyphens: auto;
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -331,7 +331,10 @@ export function ShopEmployeesFormComponent({ bodyshop }) {
|
||||
{t("timetickets.labels.shift")}
|
||||
</Select.Option>
|
||||
|
||||
{bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber || Enhanced_Payroll.treatment === "on"
|
||||
{bodyshop.cdk_dealerid ||
|
||||
bodyshop.pbs_serialnumber ||
|
||||
bodyshop.rr_dealerid ||
|
||||
Enhanced_Payroll.treatment === "on"
|
||||
? CiecaSelect(false, true)
|
||||
: bodyshop.md_responsibility_centers.costs.map((c) => (
|
||||
<Select.Option key={c.name} value={c.name}>
|
||||
|
||||
@@ -1,9 +1,12 @@
|
||||
import { DeleteFilled } from "@ant-design/icons";
|
||||
import { Button, Form, Input, InputNumber, Select, Space, Switch } from "antd";
|
||||
import { useSplitTreatments } from "@splitsoftware/splitio-react";
|
||||
import { Button, DatePicker, Form, Input, InputNumber, Radio, Select, Space, Switch } from "antd";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { selectBodyshop } from "../../redux/user/user.selectors";
|
||||
import DatePickerRanges from "../../utils/DatePickerRanges";
|
||||
import InstanceRenderManager from "../../utils/instanceRenderMgr";
|
||||
import FeatureWrapper, { HasFeatureAccess } from "../feature-wrapper/feature-wrapper.component";
|
||||
import CurrencyInput from "../form-items-formatted/currency-form-item.component";
|
||||
import FormItemEmail from "../form-items-formatted/email-form-item.component";
|
||||
@@ -23,6 +26,14 @@ export default connect(mapStateToProps, mapDispatchToProps)(ShopInfoGeneral);
|
||||
export function ShopInfoGeneral({ form, bodyshop }) {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const {
|
||||
treatments: { ClosingPeriod, ADPPayroll }
|
||||
} = useSplitTreatments({
|
||||
attributes: {},
|
||||
names: ["ClosingPeriod", "ADPPayroll"],
|
||||
splitKey: bodyshop?.imexshopid
|
||||
});
|
||||
|
||||
return (
|
||||
<div>
|
||||
<LayoutFormRow header={t("bodyshop.labels.businessinformation")} id="businessinformation">
|
||||
@@ -132,6 +143,299 @@ export function ShopInfoGeneral({ form, bodyshop }) {
|
||||
<InputNumber min={0} />
|
||||
</Form.Item>
|
||||
</LayoutFormRow>
|
||||
<LayoutFormRow header={t("bodyshop.labels.accountingsetup")} id="accountingsetup">
|
||||
{[
|
||||
...(HasFeatureAccess({ featureName: "export", bodyshop })
|
||||
? [
|
||||
<Form.Item
|
||||
key="qbo"
|
||||
label={t("bodyshop.labels.qbo")}
|
||||
valuePropName="checked"
|
||||
name={["accountingconfig", "qbo"]}
|
||||
>
|
||||
<Switch />
|
||||
</Form.Item>,
|
||||
InstanceRenderManager({
|
||||
imex: (
|
||||
<Form.Item key="qbo_usa_wrapper" shouldUpdate noStyle>
|
||||
{() => (
|
||||
<Form.Item
|
||||
label={t("bodyshop.labels.qbo_usa")}
|
||||
shouldUpdate
|
||||
valuePropName="checked"
|
||||
name={["accountingconfig", "qbo_usa"]}
|
||||
>
|
||||
<Switch disabled={!form.getFieldValue(["accountingconfig", "qbo"])} />
|
||||
</Form.Item>
|
||||
)}
|
||||
</Form.Item>
|
||||
)
|
||||
}),
|
||||
<Form.Item
|
||||
key="qbo_departmentid"
|
||||
label={t("bodyshop.labels.qbo_departmentid")}
|
||||
name={["accountingconfig", "qbo_departmentid"]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>,
|
||||
<Form.Item
|
||||
key="accountingtiers"
|
||||
label={t("bodyshop.labels.accountingtiers")}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
//message: t("general.validation.required"),
|
||||
}
|
||||
]}
|
||||
name={["accountingconfig", "tiers"]}
|
||||
>
|
||||
<Radio.Group>
|
||||
<Radio value={2}>2</Radio>
|
||||
<Radio value={3}>3</Radio>
|
||||
</Radio.Group>
|
||||
</Form.Item>,
|
||||
<Form.Item key="twotierpref_wrapper" shouldUpdate>
|
||||
{() => {
|
||||
return (
|
||||
<Form.Item
|
||||
label={t("bodyshop.labels.2tiersetup")}
|
||||
shouldUpdate
|
||||
rules={[
|
||||
{
|
||||
required: form.getFieldValue(["accountingconfig", "tiers"]) === 2
|
||||
//message: t("general.validation.required"),
|
||||
}
|
||||
]}
|
||||
name={["accountingconfig", "twotierpref"]}
|
||||
>
|
||||
<Radio.Group disabled={form.getFieldValue(["accountingconfig", "tiers"]) === 3}>
|
||||
<Radio value="name">{t("bodyshop.labels.2tiername")}</Radio>
|
||||
<Radio value="source">{t("bodyshop.labels.2tiersource")}</Radio>
|
||||
</Radio.Group>
|
||||
</Form.Item>
|
||||
);
|
||||
}}
|
||||
</Form.Item>,
|
||||
<Form.Item
|
||||
key="printlater"
|
||||
label={t("bodyshop.labels.printlater")}
|
||||
valuePropName="checked"
|
||||
name={["accountingconfig", "printlater"]}
|
||||
>
|
||||
<Switch />
|
||||
</Form.Item>,
|
||||
<Form.Item
|
||||
key="emaillater"
|
||||
label={t("bodyshop.labels.emaillater")}
|
||||
valuePropName="checked"
|
||||
name={["accountingconfig", "emaillater"]}
|
||||
>
|
||||
<Switch />
|
||||
</Form.Item>
|
||||
]
|
||||
: []),
|
||||
<Form.Item
|
||||
key="inhousevendorid"
|
||||
label={t("bodyshop.fields.inhousevendorid")}
|
||||
name={"inhousevendorid"}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
//message: t("general.validation.required"),
|
||||
}
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>,
|
||||
<Form.Item
|
||||
key="default_adjustment_rate"
|
||||
label={t("bodyshop.fields.default_adjustment_rate")}
|
||||
name={"default_adjustment_rate"}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
//message: t("general.validation.required"),
|
||||
}
|
||||
]}
|
||||
>
|
||||
<InputNumber min={0} precision={2} />
|
||||
</Form.Item>,
|
||||
InstanceRenderManager({
|
||||
imex: (
|
||||
<Form.Item key="federal_tax_id" label={t("bodyshop.fields.federal_tax_id")} name="federal_tax_id">
|
||||
<Input />
|
||||
</Form.Item>
|
||||
)
|
||||
}),
|
||||
<Form.Item key="state_tax_id" label={t("bodyshop.fields.state_tax_id")} name="state_tax_id">
|
||||
<Input />
|
||||
</Form.Item>,
|
||||
...(HasFeatureAccess({ featureName: "bills", bodyshop })
|
||||
? [
|
||||
InstanceRenderManager({
|
||||
imex: (
|
||||
<Form.Item
|
||||
key="invoice_federal_tax_rate"
|
||||
label={t("bodyshop.fields.invoice_federal_tax_rate")}
|
||||
name={["bill_tax_rates", "federal_tax_rate"]}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
//message: t("general.validation.required"),
|
||||
}
|
||||
]}
|
||||
>
|
||||
<InputNumber />
|
||||
</Form.Item>
|
||||
)
|
||||
}),
|
||||
<Form.Item
|
||||
key="invoice_state_tax_rate"
|
||||
label={t("bodyshop.fields.invoice_state_tax_rate")}
|
||||
name={["bill_tax_rates", "state_tax_rate"]}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
//message: t("general.validation.required"),
|
||||
}
|
||||
]}
|
||||
>
|
||||
<InputNumber />
|
||||
</Form.Item>,
|
||||
<Form.Item
|
||||
key="invoice_local_tax_rate"
|
||||
label={t("bodyshop.fields.invoice_local_tax_rate")}
|
||||
name={["bill_tax_rates", "local_tax_rate"]}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
//message: t("general.validation.required"),
|
||||
}
|
||||
]}
|
||||
>
|
||||
<InputNumber />
|
||||
</Form.Item>
|
||||
]
|
||||
: []),
|
||||
<Form.Item
|
||||
key="md_payment_types"
|
||||
name={["md_payment_types"]}
|
||||
label={t("bodyshop.fields.md_payment_types")}
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
//message: t("general.validation.required"),
|
||||
type: "array"
|
||||
}
|
||||
]}
|
||||
>
|
||||
<Select mode="tags" />
|
||||
</Form.Item>,
|
||||
<Form.Item
|
||||
key="md_categories"
|
||||
name={["md_categories"]}
|
||||
label={t("bodyshop.fields.md_categories")}
|
||||
rules={[
|
||||
{
|
||||
//message: t("general.validation.required"),
|
||||
type: "array"
|
||||
}
|
||||
]}
|
||||
>
|
||||
<Select mode="tags" />
|
||||
</Form.Item>,
|
||||
...(HasFeatureAccess({ featureName: "export", bodyshop })
|
||||
? [
|
||||
<Form.Item
|
||||
key="ReceivableCustomField1"
|
||||
name={["accountingconfig", "ReceivableCustomField1"]}
|
||||
label={t("bodyshop.fields.ReceivableCustomField", { number: 1 })}
|
||||
>
|
||||
{ReceivableCustomFieldSelect}
|
||||
</Form.Item>,
|
||||
<Form.Item
|
||||
key="ReceivableCustomField2"
|
||||
name={["accountingconfig", "ReceivableCustomField2"]}
|
||||
label={t("bodyshop.fields.ReceivableCustomField", { number: 2 })}
|
||||
>
|
||||
{ReceivableCustomFieldSelect}
|
||||
</Form.Item>,
|
||||
<Form.Item
|
||||
key="ReceivableCustomField3"
|
||||
name={["accountingconfig", "ReceivableCustomField3"]}
|
||||
label={t("bodyshop.fields.ReceivableCustomField", { number: 3 })}
|
||||
>
|
||||
{ReceivableCustomFieldSelect}
|
||||
</Form.Item>,
|
||||
<Form.Item
|
||||
key="md_classes"
|
||||
name={["md_classes"]}
|
||||
label={t("bodyshop.fields.md_classes")}
|
||||
rules={[
|
||||
({ getFieldValue }) => {
|
||||
return {
|
||||
required: getFieldValue("enforce_class"),
|
||||
//message: t("general.validation.required"),
|
||||
type: "array"
|
||||
};
|
||||
}
|
||||
]}
|
||||
>
|
||||
<Select mode="tags" />
|
||||
</Form.Item>,
|
||||
<Form.Item
|
||||
key="enforce_class"
|
||||
name={["enforce_class"]}
|
||||
label={t("bodyshop.fields.enforce_class")}
|
||||
valuePropName="checked"
|
||||
>
|
||||
<Switch />
|
||||
</Form.Item>,
|
||||
...(ClosingPeriod.treatment === "on"
|
||||
? [
|
||||
<Form.Item
|
||||
key="ClosingPeriod"
|
||||
name={["accountingconfig", "ClosingPeriod"]}
|
||||
label={t("bodyshop.fields.closingperiod")} //{t("reportcenter.labels.dates")}
|
||||
>
|
||||
<DatePicker.RangePicker format="MM/DD/YYYY" presets={DatePickerRanges} />
|
||||
</Form.Item>
|
||||
]
|
||||
: []),
|
||||
...(ADPPayroll.treatment === "on"
|
||||
? [
|
||||
<Form.Item
|
||||
key="companyCode"
|
||||
name={["accountingconfig", "companyCode"]}
|
||||
label={t("bodyshop.fields.companycode")}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
]
|
||||
: []),
|
||||
...(ADPPayroll.treatment === "on"
|
||||
? [
|
||||
<Form.Item
|
||||
key="batchID"
|
||||
name={["accountingconfig", "batchID"]}
|
||||
label={t("bodyshop.fields.batchid")}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
]
|
||||
: [])
|
||||
]
|
||||
: []),
|
||||
<Form.Item
|
||||
key="accumulatePayableLines"
|
||||
name={["accountingconfig", "accumulatePayableLines"]}
|
||||
label={t("bodyshop.fields.accumulatePayableLines")}
|
||||
valuePropName="checked"
|
||||
>
|
||||
<Switch />
|
||||
</Form.Item>
|
||||
]}
|
||||
</LayoutFormRow>
|
||||
<FeatureWrapper featureName="scoreboard" noauth={() => null}>
|
||||
<LayoutFormRow header={t("bodyshop.labels.scoreboardsetup")} id="scoreboardsetup">
|
||||
<Form.Item
|
||||
@@ -195,19 +499,6 @@ export function ShopInfoGeneral({ form, bodyshop }) {
|
||||
</FeatureWrapper>
|
||||
<LayoutFormRow header={t("bodyshop.labels.systemsettings")} id="systemsettings">
|
||||
{[
|
||||
<Form.Item
|
||||
key="md_categories"
|
||||
name={["md_categories"]}
|
||||
label={t("bodyshop.fields.md_categories")}
|
||||
rules={[
|
||||
{
|
||||
//message: t("general.validation.required"),
|
||||
type: "array"
|
||||
}
|
||||
]}
|
||||
>
|
||||
<Select mode="tags" />
|
||||
</Form.Item>,
|
||||
<Form.Item
|
||||
key="md_referral_sources"
|
||||
name={["md_referral_sources"]}
|
||||
@@ -643,8 +934,6 @@ export function ShopInfoGeneral({ form, bodyshop }) {
|
||||
}}
|
||||
</Form.List>
|
||||
</LayoutFormRow>
|
||||
|
||||
{/*Start Insurance Provider Row */}
|
||||
<LayoutFormRow
|
||||
grow
|
||||
header={<span id="insurancecos-header">{t("bodyshop.labels.insurancecos")}</span>}
|
||||
@@ -661,31 +950,11 @@ export function ShopInfoGeneral({ form, bodyshop }) {
|
||||
label={t("bodyshop.fields.md_ins_co.name")}
|
||||
key={`${index}name`}
|
||||
name={[field.name, "name"]}
|
||||
dependencies={[["md_ins_cos"]]}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
//message: t("general.validation.required"),
|
||||
},
|
||||
({ getFieldValue }) => ({
|
||||
validator: async (_, value) => {
|
||||
const normalizedValue = (value ?? "").toString().trim().toLowerCase();
|
||||
if (!normalizedValue) return Promise.resolve(); // handled by required
|
||||
|
||||
const list = getFieldValue(["md_ins_cos"]) || [];
|
||||
const normalizedNames = list
|
||||
.map((c) => (c?.name ?? "").toString().trim().toLowerCase())
|
||||
.filter(Boolean);
|
||||
|
||||
const count = normalizedNames.filter((n) => n === normalizedValue).length;
|
||||
|
||||
if (count > 1) {
|
||||
throw new Error(t("bodyshop.errors.duplicate_insurance_company"));
|
||||
}
|
||||
|
||||
return Promise.resolve();
|
||||
}
|
||||
})
|
||||
}
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
@@ -762,8 +1031,6 @@ export function ShopInfoGeneral({ form, bodyshop }) {
|
||||
}}
|
||||
</Form.List>
|
||||
</LayoutFormRow>
|
||||
{/*End Insurance Provider Row */}
|
||||
|
||||
<LayoutFormRow grow header={t("bodyshop.labels.estimators")} id="estimators">
|
||||
<Form.List name={["md_estimators"]}>
|
||||
{(fields, { add, remove, move }) => {
|
||||
@@ -1301,3 +1568,11 @@ export function ShopInfoGeneral({ form, bodyshop }) {
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
const ReceivableCustomFieldSelect = (
|
||||
<Select allowClear>
|
||||
<Select.Option value="v_vin">VIN</Select.Option>
|
||||
<Select.Option value="clm_no">Claim No.</Select.Option>
|
||||
<Select.Option value="ded_amt">Deductible Amount</Select.Option>
|
||||
</Select>
|
||||
);
|
||||
|
||||
@@ -16,7 +16,6 @@ export default function ShopInfoNotificationsAutoadd({ bodyshop }) {
|
||||
<Text type="secondary">{t("bodyshop.labels.notifications.followers")}</Text>
|
||||
{employeeOptions.length > 0 ? (
|
||||
<Form.Item
|
||||
normalize={(value) => (value || []).filter((id) => typeof id === "string" && id.trim() !== "")}
|
||||
name="notification_followers"
|
||||
rules={[
|
||||
{
|
||||
@@ -43,6 +42,11 @@ export default function ShopInfoNotificationsAutoadd({ bodyshop }) {
|
||||
options={employeeOptions}
|
||||
placeholder={t("bodyshop.fields.notifications.placeholder")}
|
||||
showEmail={true}
|
||||
onChange={(value) => {
|
||||
// Filter out null or invalid values before passing to Form
|
||||
const cleanedValue = value?.filter((id) => id != null && typeof id === "string" && id.trim() !== "");
|
||||
return cleanedValue;
|
||||
}}
|
||||
/>
|
||||
</Form.Item>
|
||||
) : (
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -5,6 +5,7 @@ import { createStructuredSelector } from "reselect";
|
||||
import { selectBodyshop } from "../../redux/user/user.selectors";
|
||||
import InstanceRenderManager from "../../utils/instanceRenderMgr";
|
||||
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
|
||||
import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
//currentUser: selectCurrentUser
|
||||
@@ -2126,7 +2127,7 @@ function TaxFormItems({ typeNum, typeNumIterator, rootElements, bodyshop }) {
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
{(bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber) && (
|
||||
{bodyshopHasDmsKey(bodyshop) && (
|
||||
<Form.Item
|
||||
label={t("bodyshop.fields.dms.dms_acctnumber")}
|
||||
rules={[
|
||||
|
||||
@@ -16,7 +16,7 @@ const mapDispatchToProps = () => ({
|
||||
export function TechHeader({ technician }) {
|
||||
const { t } = useTranslation();
|
||||
return (
|
||||
<Header style={{ textAlign: "center", height: "auto", overflow: "visible" }}>
|
||||
<Header style={{ textAlign: "center" }}>
|
||||
<Typography.Title style={{ color: "#fff" }}>
|
||||
{technician
|
||||
? t("tech.labels.loggedin", {
|
||||
|
||||
@@ -63,7 +63,10 @@ export function TechClockInComponent({ form, bodyshop, technician }) {
|
||||
<Select.Option key={item.cost_center} value={item.cost_center}>
|
||||
{item.cost_center === "timetickets.labels.shift"
|
||||
? t(item.cost_center)
|
||||
: bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber || Enhanced_Payroll.treatment === "on"
|
||||
: bodyshop.cdk_dealerid ||
|
||||
bodyshop.pbs_serialnumber ||
|
||||
bodyshop.rr_dealerid ||
|
||||
Enhanced_Payroll.treatment === "on"
|
||||
? t(`joblines.fields.lbr_types.${item.cost_center.toUpperCase()}`)
|
||||
: item.cost_center}
|
||||
</Select.Option>
|
||||
|
||||
@@ -75,7 +75,10 @@ export function TechClockInContainer({ setTimeTicketContext, technician, bodysho
|
||||
jobid: values.jobid,
|
||||
cost_center: values.cost_center,
|
||||
ciecacode:
|
||||
bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber || Enhanced_Payroll.treatment === "on"
|
||||
bodyshop.cdk_dealerid ||
|
||||
bodyshop.pbs_serialnumber ||
|
||||
bodyshop.rr_dealerid ||
|
||||
Enhanced_Payroll.treatment === "on"
|
||||
? values.cost_center
|
||||
: Object.keys(bodyshop.md_responsibility_centers.defaults.costs).find((key) => {
|
||||
return bodyshop.md_responsibility_centers.defaults.costs[key] === values.cost_center;
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { useMutation, useQuery } from "@apollo/client";
|
||||
import { Button, Card, Form, InputNumber, Popover, Select, Space } from "antd";
|
||||
import { Button, Card, Col, Form, InputNumber, Popover, Row, Select } from "antd";
|
||||
import axios from "axios";
|
||||
import { useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
@@ -16,6 +16,7 @@ import TechJobClockoutDelete from "../tech-job-clock-out-delete/tech-job-clock-o
|
||||
import { LaborAllocationContainer } from "../time-ticket-modal/time-ticket-modal.component";
|
||||
import { useSplitTreatments } from "@splitsoftware/splitio-react";
|
||||
import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
|
||||
import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
bodyshop: selectBodyshop,
|
||||
@@ -53,7 +54,9 @@ export function TechClockOffButton({
|
||||
nextFetchPolicy: "network-only"
|
||||
});
|
||||
const { t } = useTranslation();
|
||||
const emps = bodyshop.employees.filter((e) => e.id === (technician && technician.id))[0];
|
||||
|
||||
const emps = bodyshop.employees.filter((e) => e.id === technician?.id)[0];
|
||||
const hasDmsKey = bodyshopHasDmsKey(bodyshop);
|
||||
|
||||
const handleFinish = async (values) => {
|
||||
logImEXEvent("tech_clock_out_job");
|
||||
@@ -69,7 +72,10 @@ export function TechClockOffButton({
|
||||
rate: emps && emps.rates.filter((r) => r.cost_center === values.cost_center)[0]?.rate,
|
||||
flat_rate: emps && emps.flat_rate,
|
||||
ciecacode:
|
||||
bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber || Enhanced_Payroll.treatment === "on"
|
||||
bodyshop.cdk_dealerid ||
|
||||
bodyshop.pbs_serialnumber ||
|
||||
bodyshop.rr_dealerid ||
|
||||
Enhanced_Payroll.treatment === "on"
|
||||
? values.cost_center
|
||||
: Object.keys(bodyshop.md_responsibility_centers.defaults.costs).find((key) => {
|
||||
return bodyshop.md_responsibility_centers.defaults.costs[key] === values.cost_center;
|
||||
@@ -124,97 +130,70 @@ export function TechClockOffButton({
|
||||
cost_center: isShiftTicket ? "timetickets.labels.shift" : technician ? technician.cost_center : null
|
||||
}}
|
||||
>
|
||||
<Space direction="vertical">
|
||||
{!isShiftTicket ? (
|
||||
<div>
|
||||
<Form.Item
|
||||
label={t("timetickets.fields.actualhrs")}
|
||||
name="actualhrs"
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
//message: t("general.validation.required"),
|
||||
}
|
||||
]}
|
||||
>
|
||||
<InputNumber min={0} precision={1} />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("timetickets.fields.productivehrs")}
|
||||
name="productivehrs"
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
//message: t("general.validation.required"),
|
||||
},
|
||||
({ getFieldValue }) => ({
|
||||
validator(rule, value) {
|
||||
if (!bodyshop.tt_enforce_hours_for_tech_console) {
|
||||
return Promise.resolve();
|
||||
}
|
||||
if (!value || getFieldValue("cost_center") === null || !lineTicketData)
|
||||
return Promise.resolve();
|
||||
//Check the cost center,
|
||||
const totals = CalculateAllocationsTotals(
|
||||
bodyshop,
|
||||
lineTicketData.joblines,
|
||||
lineTicketData.timetickets,
|
||||
lineTicketData.jobs_by_pk.lbr_adjustments
|
||||
);
|
||||
const fieldTypeToCheck =
|
||||
bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber ? "mod_lbr_ty" : "cost_center";
|
||||
const costCenterDiff =
|
||||
Math.round(
|
||||
totals.find((total) => total[fieldTypeToCheck] === getFieldValue("cost_center"))
|
||||
?.difference * 10
|
||||
) / 10;
|
||||
if (value > costCenterDiff)
|
||||
return Promise.reject(t("timetickets.validation.hoursenteredmorethanavailable"));
|
||||
else {
|
||||
return Promise.resolve();
|
||||
}
|
||||
<Row gutter={[16, 16]}>
|
||||
<Col span={!isShiftTicket ? 8 : 24}>
|
||||
{!isShiftTicket ? (
|
||||
<div>
|
||||
<Form.Item
|
||||
label={t("timetickets.fields.actualhrs")}
|
||||
name="actualhrs"
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
//message: t("general.validation.required"),
|
||||
}
|
||||
})
|
||||
]}
|
||||
>
|
||||
<InputNumber min={0} precision={1} />
|
||||
</Form.Item>
|
||||
</div>
|
||||
) : null}
|
||||
<Form.Item
|
||||
name="cost_center"
|
||||
label={t("timetickets.fields.cost_center")}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
//message: t("general.validation.required"),
|
||||
}
|
||||
]}
|
||||
>
|
||||
<Select disabled={isShiftTicket}>
|
||||
{isShiftTicket ? (
|
||||
<Select.Option value="timetickets.labels.shift">{t("timetickets.labels.shift")}</Select.Option>
|
||||
) : (
|
||||
emps &&
|
||||
emps.rates.map((item) => (
|
||||
<Select.Option key={item.cost_center}>
|
||||
{item.cost_center === "timetickets.labels.shift"
|
||||
? t(item.cost_center)
|
||||
: bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber
|
||||
? t(`joblines.fields.lbr_types.${item.cost_center.toUpperCase()}`)
|
||||
: item.cost_center}
|
||||
</Select.Option>
|
||||
))
|
||||
)}
|
||||
</Select>
|
||||
</Form.Item>
|
||||
{isShiftTicket ? (
|
||||
<div></div>
|
||||
) : (
|
||||
]}
|
||||
>
|
||||
<InputNumber min={0} precision={1} />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("timetickets.fields.productivehrs")}
|
||||
name="productivehrs"
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
//message: t("general.validation.required"),
|
||||
},
|
||||
({ getFieldValue }) => ({
|
||||
validator(rule, value) {
|
||||
if (!bodyshop.tt_enforce_hours_for_tech_console) {
|
||||
return Promise.resolve();
|
||||
}
|
||||
if (!value || getFieldValue("cost_center") === null || !lineTicketData)
|
||||
return Promise.resolve();
|
||||
|
||||
//Check the cost center,
|
||||
const totals = CalculateAllocationsTotals(
|
||||
bodyshop,
|
||||
lineTicketData.joblines,
|
||||
lineTicketData.timetickets,
|
||||
lineTicketData.jobs_by_pk.lbr_adjustments
|
||||
);
|
||||
|
||||
const fieldTypeToCheck = hasDmsKey ? "mod_lbr_ty" : "cost_center";
|
||||
|
||||
const costCenterDiff =
|
||||
Math.round(
|
||||
totals.find((total) => total[fieldTypeToCheck] === getFieldValue("cost_center"))
|
||||
?.difference * 10
|
||||
) / 10;
|
||||
|
||||
if (value > costCenterDiff)
|
||||
return Promise.reject(t("timetickets.validation.hoursenteredmorethanavailable"));
|
||||
else {
|
||||
return Promise.resolve();
|
||||
}
|
||||
}
|
||||
})
|
||||
]}
|
||||
>
|
||||
<InputNumber min={0} precision={1} />
|
||||
</Form.Item>
|
||||
</div>
|
||||
) : null}
|
||||
<Form.Item
|
||||
name="status"
|
||||
label={t("jobs.fields.status")}
|
||||
initialValue={lineTicketData && lineTicketData.jobs_by_pk.status}
|
||||
name="cost_center"
|
||||
label={t("timetickets.fields.cost_center")}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
@@ -222,32 +201,67 @@ export function TechClockOffButton({
|
||||
}
|
||||
]}
|
||||
>
|
||||
<Select>
|
||||
{bodyshop.md_ro_statuses.production_statuses.map((item) => (
|
||||
<Select.Option key={item}></Select.Option>
|
||||
))}
|
||||
<Select disabled={isShiftTicket}>
|
||||
{isShiftTicket ? (
|
||||
<Select.Option value="timetickets.labels.shift">{t("timetickets.labels.shift")}</Select.Option>
|
||||
) : (
|
||||
emps &&
|
||||
emps.rates.map((item) => (
|
||||
<Select.Option key={item.cost_center}>
|
||||
{item.cost_center === "timetickets.labels.shift"
|
||||
? t(item.cost_center)
|
||||
: hasDmsKey
|
||||
? t(`joblines.fields.lbr_types.${item.cost_center.toUpperCase()}`)
|
||||
: item.cost_center}
|
||||
</Select.Option>
|
||||
))
|
||||
)}
|
||||
</Select>
|
||||
</Form.Item>
|
||||
)}
|
||||
<Button type="primary" htmlType="submit" loading={loading}>
|
||||
{t("general.actions.save")}
|
||||
</Button>
|
||||
<TechJobClockoutDelete completedCallback={completedCallback} timeTicketId={timeTicketId} />
|
||||
|
||||
{isShiftTicket ? (
|
||||
<div></div>
|
||||
) : (
|
||||
<Form.Item
|
||||
name="status"
|
||||
label={t("jobs.fields.status")}
|
||||
initialValue={lineTicketData && lineTicketData.jobs_by_pk.status}
|
||||
rules={[
|
||||
{
|
||||
required: true
|
||||
//message: t("general.validation.required"),
|
||||
}
|
||||
]}
|
||||
>
|
||||
<Select>
|
||||
{bodyshop.md_ro_statuses.production_statuses.map((item) => (
|
||||
<Select.Option key={item}></Select.Option>
|
||||
))}
|
||||
</Select>
|
||||
</Form.Item>
|
||||
)}
|
||||
<Button type="primary" htmlType="submit" loading={loading}>
|
||||
{t("general.actions.save")}
|
||||
</Button>
|
||||
<TechJobClockoutDelete completedCallback={completedCallback} timeTicketId={timeTicketId} />
|
||||
</Col>
|
||||
{!isShiftTicket && (
|
||||
<LaborAllocationContainer jobid={jobId || null} loading={queryLoading} lineTicketData={lineTicketData} />
|
||||
<Col span={16}>
|
||||
<LaborAllocationContainer
|
||||
jobid={jobId || null}
|
||||
loading={queryLoading}
|
||||
lineTicketData={lineTicketData}
|
||||
/>
|
||||
</Col>
|
||||
)}
|
||||
</Space>
|
||||
</Row>
|
||||
</Form>
|
||||
</div>
|
||||
</Card>
|
||||
);
|
||||
|
||||
return (
|
||||
<Popover
|
||||
content={<div style={{ maxHeight: "75vh", overflowY: "auto" }}>{overlay}</div>}
|
||||
trigger="click"
|
||||
getPopupContainer={() => document.querySelector('#time-ticket-modal')}
|
||||
>
|
||||
<Popover content={overlay} trigger="click">
|
||||
<Button loading={loading} {...otherBtnProps}>
|
||||
{t("timetickets.actions.clockout")}
|
||||
</Button>
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
import { useLazyQuery } from "@apollo/client";
|
||||
import { useSplitTreatments } from "@splitsoftware/splitio-react";
|
||||
import { Card, Form, Input, InputNumber, Select, Space, Switch } from "antd";
|
||||
import { useEffect } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
@@ -15,6 +14,7 @@ import {
|
||||
import JobSearchSelect from "../job-search-select/job-search-select.component";
|
||||
import LaborAllocationsTable from "../labor-allocations-table/labor-allocations-table.component";
|
||||
import { CalculateAllocationsTotals } from "../labor-allocations-table/labor-allocations-table.utility";
|
||||
import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
|
||||
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
|
||||
import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component";
|
||||
import { HasRbacAccess } from "../rbac-wrapper/rbac-wrapper.component";
|
||||
@@ -34,9 +34,7 @@ export function TimeTicketModalComponent({
|
||||
authLevel,
|
||||
employeeAutoCompleteOptions,
|
||||
disabled,
|
||||
employeeSelectDisabled,
|
||||
lineTicketRefreshKey,
|
||||
isOpen
|
||||
employeeSelectDisabled
|
||||
}) {
|
||||
const { t } = useTranslation();
|
||||
const {
|
||||
@@ -51,18 +49,6 @@ export function TimeTicketModalComponent({
|
||||
fetchPolicy: "network-only",
|
||||
nextFetchPolicy: "network-only"
|
||||
});
|
||||
|
||||
// Watch the jobid field so we can refetch the bottom section without relying on jobid changes
|
||||
const watchedJobId = Form.useWatch("jobid", form);
|
||||
|
||||
useEffect(() => {
|
||||
if (!isOpen) return;
|
||||
if (!watchedJobId) return;
|
||||
if (!lineTicketRefreshKey) return;
|
||||
|
||||
loadLineTicketData({ variables: { id: watchedJobId } });
|
||||
}, [lineTicketRefreshKey, watchedJobId, isOpen]);
|
||||
|
||||
const CostCenterSelect = ({ emps, value, ...props }) => {
|
||||
return (
|
||||
<Select
|
||||
@@ -75,7 +61,10 @@ export function TimeTicketModalComponent({
|
||||
<Select.Option key={item.cost_center} value={item.cost_center}>
|
||||
{item.cost_center === "timetickets.labels.shift"
|
||||
? t(item.cost_center)
|
||||
: bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber || Enhanced_Payroll.treatment === "on"
|
||||
: bodyshop.cdk_dealerid ||
|
||||
bodyshop.pbs_serialnumber ||
|
||||
bodyshop.rr_dealerid ||
|
||||
Enhanced_Payroll.treatment === "on"
|
||||
? t(`joblines.fields.lbr_types.${item.cost_center.toUpperCase()}`)
|
||||
: item.cost_center}
|
||||
</Select.Option>
|
||||
@@ -139,7 +128,7 @@ export function TimeTicketModalComponent({
|
||||
onSelect={(value) => {
|
||||
const emps = employeeAutoCompleteOptions && employeeAutoCompleteOptions.filter((e) => e.id === value)[0];
|
||||
|
||||
form.setFieldsValue({ flat_rate: emps && emps.flat_rate });
|
||||
form.setFieldsValue({ flat_rate: emps?.flat_rate });
|
||||
}}
|
||||
/>
|
||||
</Form.Item>
|
||||
@@ -201,8 +190,7 @@ export function TimeTicketModalComponent({
|
||||
lineTicketData.jobs_by_pk.lbr_adjustments
|
||||
);
|
||||
|
||||
const fieldTypeToCheck =
|
||||
bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber ? "mod_lbr_ty" : "cost_center";
|
||||
const fieldTypeToCheck = bodyshopHasDmsKey(bodyshop) ? "mod_lbr_ty" : "cost_center";
|
||||
|
||||
const costCenterDiff =
|
||||
Math.round(
|
||||
@@ -276,7 +264,7 @@ export function TimeTicketModalComponent({
|
||||
if (!value) return Promise.resolve();
|
||||
if (!clockon && value) return Promise.reject(t("timetickets.validation.clockoffwithoutclockon"));
|
||||
// TODO - Verify this exists
|
||||
if (value && value.isSameOrAfter && !value.isSameOrAfter(clockon))
|
||||
if (value?.isSameOrAfter && !value.isSameOrAfter(clockon))
|
||||
return Promise.reject(t("timetickets.validation.clockoffmustbeafterclockon"));
|
||||
|
||||
return Promise.resolve();
|
||||
@@ -319,7 +307,6 @@ export function TimeTicketModalComponent({
|
||||
)}
|
||||
</Form.Item>
|
||||
</LayoutFormRow>
|
||||
|
||||
<Form.Item dependencies={["jobid"]}>
|
||||
{() => {
|
||||
const jobid = form.getFieldValue("jobid");
|
||||
|
||||
@@ -29,9 +29,6 @@ export function TimeTicketModalContainer({ timeTicketModal, toggleModalVisible,
|
||||
const [loading, setLoading] = useState(false);
|
||||
const { t } = useTranslation();
|
||||
const [enterAgain, setEnterAgain] = useState(false);
|
||||
|
||||
const [lineTicketRefreshKey, setLineTicketRefreshKey] = useState(0);
|
||||
|
||||
const [insertTicket] = useMutation(INSERT_NEW_TIME_TICKET);
|
||||
const [updateTicket] = useMutation(UPDATE_TIME_TICKET);
|
||||
const {
|
||||
@@ -88,17 +85,11 @@ export function TimeTicketModalContainer({ timeTicketModal, toggleModalVisible,
|
||||
notification["success"]({
|
||||
message: t("timetickets.successes.created")
|
||||
});
|
||||
|
||||
// Refresh parent screens (Job Labor tab, etc.)
|
||||
if (timeTicketModal.actions.refetch) timeTicketModal.actions.refetch();
|
||||
|
||||
// Refresh the modal "bottom section" (allocations + embedded ticket list) for the current job
|
||||
setLineTicketRefreshKey((k) => k + 1);
|
||||
|
||||
if (enterAgain) {
|
||||
// Capture existing information and repopulate it.
|
||||
// (Include jobid so Save & New stays on the same RO if it was selected in-form.)
|
||||
const prev = form.getFieldsValue(["jobid", "date", "employeeid", "flat_rate"]);
|
||||
//Capture the existing information and repopulate it.
|
||||
|
||||
const prev = form.getFieldsValue(["date", "employeeid", "flat_rate"]);
|
||||
|
||||
form.resetFields();
|
||||
|
||||
@@ -146,7 +137,10 @@ export function TimeTicketModalContainer({ timeTicketModal, toggleModalVisible,
|
||||
if (!!changedFields.cost_center && !!EmployeeAutoCompleteData) {
|
||||
form.setFieldsValue({
|
||||
ciecacode:
|
||||
bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber || Enhanced_Payroll.treatment === "on"
|
||||
bodyshop.cdk_dealerid ||
|
||||
bodyshop.pbs_serialnumber ||
|
||||
bodyshop.rr_dealerid ||
|
||||
Enhanced_Payroll.treatment === "on"
|
||||
? changedFields.cost_center
|
||||
: Object.keys(bodyshop.md_responsibility_centers.defaults.costs).find(
|
||||
(key) => bodyshop.md_responsibility_centers.defaults.costs[key] === changedFields.cost_center
|
||||
@@ -238,7 +232,6 @@ export function TimeTicketModalContainer({ timeTicketModal, toggleModalVisible,
|
||||
</Space>
|
||||
}
|
||||
/>
|
||||
|
||||
<TimeTicketModalComponent
|
||||
isEdit={timeTicketModal.context.id}
|
||||
form={form}
|
||||
@@ -248,8 +241,6 @@ export function TimeTicketModalContainer({ timeTicketModal, toggleModalVisible,
|
||||
timeTicketModal.context?.timeticket?.committed_at ||
|
||||
(timeTicketModal.context?.timeticket?.employeeid && !timeTicketModal.context.id ? true : false)
|
||||
}
|
||||
lineTicketRefreshKey={lineTicketRefreshKey}
|
||||
isOpen={timeTicketModal.open}
|
||||
/>
|
||||
</Form>
|
||||
</Modal>
|
||||
|
||||
@@ -149,7 +149,7 @@ const SocketProvider = ({ children, bodyshop, navigate, currentUser }) => {
|
||||
|
||||
useEffect(() => {
|
||||
const initializeSocket = async (token) => {
|
||||
if (!bodyshop || !bodyshop.id || socketRef.current) return;
|
||||
if (!bodyshop?.id || socketRef.current) return;
|
||||
|
||||
const endpoint = import.meta.env.PROD ? import.meta.env.VITE_APP_AXIOS_BASE_API_URL : "";
|
||||
const socketInstance = SocketIO(endpoint, {
|
||||
|
||||
@@ -5,7 +5,7 @@ import { getFirestore } from "@firebase/firestore";
|
||||
import { getMessaging, getToken, onMessage } from "@firebase/messaging";
|
||||
import { store } from "../redux/store";
|
||||
//import * as amplitude from '@amplitude/analytics-browser';
|
||||
// import posthog from 'posthog-js'
|
||||
import posthog from 'posthog-js'
|
||||
|
||||
const config = JSON.parse(import.meta.env.VITE_APP_FIREBASE_CONFIG);
|
||||
initializeApp(config);
|
||||
@@ -74,6 +74,7 @@ onMessage(messaging, (payload) => {
|
||||
|
||||
export const logImEXEvent = (eventName, additionalParams, stateProp = null) => {
|
||||
try {
|
||||
|
||||
const state = stateProp || store.getState();
|
||||
|
||||
const eventParams = {
|
||||
@@ -98,7 +99,8 @@ export const logImEXEvent = (eventName, additionalParams, stateProp = null) => {
|
||||
// );
|
||||
logEvent(analytics, eventName, eventParams);
|
||||
//amplitude.track(eventName, eventParams);
|
||||
//posthog.capture(eventName, eventParams);
|
||||
posthog.capture(eventName, eventParams);
|
||||
|
||||
} finally {
|
||||
//If it fails, just keep going.
|
||||
}
|
||||
|
||||
@@ -40,8 +40,6 @@ export const QUERY_ALL_ACTIVE_APPOINTMENTS = gql`
|
||||
ownr_fn
|
||||
ownr_ph1
|
||||
ownr_ph2
|
||||
ownr_ph1_ty
|
||||
ownr_ph2_ty
|
||||
ownr_ea
|
||||
clm_total
|
||||
id
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user