\n
\n User Registration
\n\n Signing up is easy. It only takes a few steps\n
\n \n \n \n }\n />\n );\n }\n}\n\nexport default Register;\n","import React, { Component } from \"react\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Logo from \"../../Logo\";\nimport Spinner from \"../../Utils/Spinner\";\nimport APICall from \"../../Utils/APICall\";\nimport SpinnerButton from \"../../Utils/SpinnerButton\";\nimport Constants from \"../../Utils/Constants\";\n\nexport default class Logout extends Component {\n constructor(props) {\n super(props);\n this.state = {};\n }\n\n componentDidMount() {\n localStorage.clear();\n sessionStorage.clear();\n global.loggedInUser = null;\n }\n\n render() {\n return{children}
\n \n {/* content-wrapper ends */}\n \n );\n}\n","import { createContext } from \"react\";\nexport const DataContext = createContext({});\n","import React, { Component, useState } from \"react\";\nimport \"../sass/my-table.scss\";\nimport {\n useTable,\n useGroupBy,\n useFilters,\n useSortBy,\n useExpanded,\n usePagination,\n} from \"react-table\";\n\nexport default function MyTable({\n columns,\n data,\n deleteAction,\n enableSearch,\n reloadData,\n searchQuery,\n pageSize,\n page,\n cssArray,\n recordSelected,\n}) {\n // Use the state and functions returned from useTable to build your UI\n\n const { getTableProps, getTableBodyProps, headerGroups, rows, prepareRow } =\n useTable({\n columns,\n data,\n });\n\n var _currentPage = page;\n var _pageSize = pageSize;\n var _searchQuery = \"\";\n var pageOptions = [\"10\", \"50\", \"100\", \"150\"];\n var _cssArray = [];\n if (!cssArray || cssArray.length < columns.length) {\n columns.forEach((element) => {\n _cssArray.push(\"\");\n });\n } else {\n _cssArray = cssArray;\n }\n\n const [filteredRows, setValue] = useState(rows);\n\n function filterRow(event) {\n if (!event || !event.target) {\n setValue(rows);\n } else {\n if (reloadData) {\n __reloadData(null, 1, event.target.value);\n _searchQuery = event.target.value;\n } else {\n var _filteredRows = [];\n rows.forEach((element) => {\n if (\n JSON.stringify(element.original, function (key, value) {\n if (key.toLowerCase().includes(\"component\")) {\n //properties with components have jsx causing circular reference\n return \"\";\n } else {\n return value;\n }\n })\n .toLowerCase()\n .includes(event.target.value.toLowerCase())\n ) {\n _filteredRows.push(element);\n }\n });\n setValue(_filteredRows);\n }\n }\n }\n\n function __deleteAction(_record) {\n deleteAction(_record);\n }\n\n function __reloadData(pageSizeParam, currentPageParam, _query) {\n if (pageSizeParam) _pageSize = pageSizeParam;\n if (currentPageParam) _currentPage = currentPageParam;\n if (!_query) _query = _searchQuery;\n reloadData(_currentPage, _pageSize, _query);\n }\n\n function __nextPage() {\n var pageToNavigateTo = (_currentPage || 1) + 1;\n __reloadData(null, pageToNavigateTo, null);\n }\n\n function __prevPage() {\n var pageToNavigateTo = (_currentPage || 2) - 1;\n __reloadData(null, pageToNavigateTo, null);\n }\n\n // Render the UI for your table\n return (\n \n {enableSearch ? (\n filterRow(e)}\n />\n
\n \n ) : null}\n\n {reloadData ? (\n \n \n \n \n
\n \n {filteredRows.length <= 0 ? (\n
No results to show
\n ) : (\n\n \n {_currentPage <= 1 ? null : (\n __prevPage()}\n >\n Previous page\n \n )}\n {filteredRows.length <= 0 ? null : (\n __nextPage()}\n >\n Next page \n \n )}\n
{\" \"}\n \n ) : null}\n \n );\n}\n","import APICall from \"./APICall\";\nimport React from \"react\";\nimport Constants from \"./Constants\";\nimport MyTable from \"./MyTable\";\n\nexport default class Functions {\n static RenderTable({\n headerList,\n propertyList,\n dataList,\n enableSearch,\n deleteAction,\n cssArray,\n }) {\n const _headerList = [];\n for (let i = 0; i < headerList.length; i++) {\n _headerList.push({ Header: headerList[i], accessor: propertyList[i] });\n }\n //const tableHeader = React.useMemo(() => _headerList, []);\n //const tableData = React.useMemo(() => dataList, []);\n\n const tableHeader = _headerList;\n const tableData = dataList;\n\n return (\n \n
\n );\n }\n static toReadableDate(date) {\n var d = new Date(date),\n month = \"\" + (d.getMonth() + 1),\n day = \"\" + d.getDate(),\n year = d.getFullYear();\n\n if (month.length < 2) month = \"0\" + month;\n if (day.length < 2) day = \"0\" + day;\n\n return [day, month, year].join(\"/\");\n }\n\n static sqlDateString(date) {\n var d = new Date(date),\n month = \"\" + (d.getMonth() + 1),\n day = \"\" + d.getDate(),\n year = d.getFullYear();\n\n if (month.length < 2) month = \"0\" + month;\n if (day.length < 2) day = \"0\" + day;\n\n return [year, month, day].join(\"-\");\n }\n\n static isPhoneValid(phoneNumber) {\n if (phoneNumber.startsWith(\"0\")) {\n phoneNumber = phoneNumber.substr(1);\n }\n\n var phoneRe = /^[2-9]\\d{2}[2-9]\\d{2}\\d{4}$/;\n var digits = phoneNumber.replace(/\\D/g, \"\");\n return phoneRe.test(digits);\n }\n\n static currencyFormat(amount) {\n return Number(parseFloat(amount).toFixed(2)).toLocaleString(\"en\", {\n minimumFractionDigits: 2,\n });\n }\n\n static ratingStars(noOfstars) {\n var stars = [];\n if (noOfstars <= 0) noOfstars = 1;\n for (var i = 1; i <= noOfstars; i++) {\n stars.push(i);\n }\n return stars.map((star, index) => (\n \n ));\n }\n\n static getUserPhotoUrl(userId) {\n return (\n Constants.apiBaseUrl +\n \"/api/loadimage/profilephoto/\" +\n userId.toString() +\n \"?v=\" +\n Functions.randomString(10)\n );\n }\n\n static randomString(length) {\n var result = \"\";\n var characters = \"abcdefghijklmnopqrstuvwxyz0123456789\";\n var charactersLength = characters.length;\n for (var i = 0; i < length; i++) {\n result += characters.charAt(Math.floor(Math.random() * charactersLength));\n }\n return result;\n }\n\n formatDate(dateStr) {\n var monthNames = [\n \"JAN\",\n \"FEB\",\n \"MAR\",\n \"APR\",\n \"MAY\",\n \"JUN\",\n \"JUL\",\n \"AUG\",\n \"SEP\",\n \"OCT\",\n \"NOV\",\n \"DEC\",\n ];\n var date = new Date(dateStr);\n\n var hour = date.getHours() - 1;\n var minutes = date.getMinutes();\n var meridiem = hour >= 12 ? \"PM\" : \"AM\";\n if (hour > 12) {\n hour = hour - 12;\n }\n\n return (\n date.getDate() +\n \"-\" +\n monthNames[date.getMonth()] +\n \"-\" +\n date.getFullYear() +\n \" \" +\n hour +\n \":\" +\n minutes +\n \" \" +\n meridiem\n );\n }\n\n whoIsLoggedIn(callback, force) {\n APICall(\"api/users/profile\", \"GET\", {}, 0, true)\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n callback(response.data, null);\n } else {\n callback(\n null,\n \"Your request generated an error. Refresh or try again after sometime\"\n );\n }\n })\n .catch((error) => {\n callback(\n null,\n \"Your request generated an error. Please check your connection\"\n );\n });\n }\n\n static modalDefaultStyle() {\n return {\n content: {\n top: \"50%\",\n left: \"50%\",\n right: \"auto\",\n bottom: \"auto\",\n marginRight: \"-50%\",\n transform: \"translate(-50%, -50%)\",\n },\n };\n }\n\n static iconsBroom() {\n return (\n \n \n \n \n \n
\n );\n }\n\n static iconsUsers() {\n return (\n \n \n \n \n \n
\n );\n }\n\n static iconsSingleUser() {\n return (\n \n \n \n \n {\" \"}\n
\n );\n }\n\n static iconsStar() {\n return (\n \n \n \n \n \n
\n );\n }\n\n static iconsCheckMark() {\n return (\n \n \n \n \n \n
\n );\n }\n\n static iconsCancel() {\n return (\n \n \n \n \n \n \n \n
\n );\n }\n\n static iconsStarRating() {\n return (\n \n \n \n \n \n
\n );\n }\n\n static iconsWallet() {\n return (\n \n \n \n \n \n
\n );\n }\n\n static iconsClock() {\n return (\n \n \n \n \n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Logo from \"../../Logo\";\nimport Spinner from \"../../Utils/Spinner\";\nimport APICall from \"../../Utils/APICall\";\nimport SpinnerButton from \"../../Utils/SpinnerButton\";\nimport Constants from \"../../Utils/Constants\";\nimport { DataContext } from \"../../Contexts/DataContexts\";\nimport Functions from \"../../Utils/Functions\";\nimport AddAppScripts from \"../../Components/Layouts/AddAppScripts\";\nimport Toastr from \"../../Utils/Toastr\";\n\nclass Login extends Component {\n constructor(props) {\n super(props);\n this.state = {\n newRecord: {},\n errorMessage: null,\n loading: false,\n };\n\n this.submit = this.submit.bind(this);\n }\n\n static contextType = DataContext;\n\n componentDidMount() {\n localStorage.clear();\n sessionStorage.clear();\n }\n\n updateProp(e, prop) {\n var record = this.state.newRecord;\n record[prop] = e.target.value;\n this.setState({ newRecord: record });\n }\n\n doRedirects(loginResponse) {\n if (\n loginResponse.data == \"vet\" ||\n loginResponse.data == \"operationsassistant\"\n ) {\n this.setState({ redirectUrl: \"/in/checkin\" });\n } else {\n if (loginResponse.redirectUrl) {\n window.location.href = loginResponse.redirectUrl;\n } else {\n this.setState({ redirectUrl: \"/in/home\" });\n }\n }\n }\n\n submit() {\n if (!this.state.newRecord.emailOrPhone || !this.state.newRecord.password) {\n this.setState({\n errorMessage: \"Please enter your email and password to login\",\n });\n return;\n }\n\n this.setState({ errorMessage: null, loading: true });\n let payload = {\n username: this.state.newRecord.emailOrPhone,\n password: this.state.newRecord.password,\n };\n APICall(\"api/users/login\", \"POST\", payload)\n .then((data) => {\n if (data.data.isSuccess) {\n new Functions().whoIsLoggedIn((u, e) => {\n this.context.addItem(\"user\", u);\n this.doRedirects(data.data);\n }, true);\n } else {\n this.setState({ errorMessage: data.data.message, loading: false });\n }\n })\n .catch((error) => {\n this.setState({\n errorMessage: \"An error occurred, please check your network\",\n loading: false,\n });\n });\n }\n\n render() {\n return this.state.redirectUrl ? (\n \n
\n \n {/* content-wrapper ends */}\n \n );\n }\n}\n\nexport default Login;\n","import React, { Component } from \"react\";\nimport { Link } from \"react-router-dom\";\nimport PublicWithTopStripBackground from \"../../Components/Layouts/PublicWithTopStripBackground\";\nimport Logo from \"../../Logo\";\n\nexport default class RegistrationSuccesful extends Component {\n constructor(props) {\n super(props);\n this.state = {};\n }\n\n componentDidMount() {\n localStorage.clear();\n sessionStorage.clear();\n }\n\n render() {\n return (\n \n
\n \n \n
\n \n
\n \n Sign in to continue.\n
\n\n \n\n \n Your registration was successful,
\n
\n \n }\n />\n );\n }\n}\n","import React, { Component } from \"react\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Logo from \"../../Logo\";\nimport Spinner from \"../../Utils/Spinner\";\nimport APICall from \"../../Utils/APICall\";\nimport SpinnerButton from \"../../Utils/SpinnerButton\";\nimport Constants from \"../../Utils/Constants\";\n\nexport default class RecoverPassword extends Component {\n constructor(props) {\n super(props);\n this.state = {\n errorMessage: null,\n loading: false,\n };\n }\n\n componentDidMount() {\n localStorage.clear();\n sessionStorage.clear();\n }\n\n upateProp(e, prop) {\n var record = this.state.newRecord;\n record[prop] = e.target.value;\n this.setState({ newRecord: record });\n }\n\n submit() {\n if (!this.state.email || this.state.email.trim() == \"\") {\n this.setState({ errorMessage: \"Please supply your email address\" });\n return;\n }\n\n this.setState({ errorMessage: null, loading: true });\n APICall(\"api/users/resetpassword\", \"POST\", { Email: this.state.email })\n .then((data) => {\n if (data.data.status == \"success\") {\n this.setState({ redirectUrl: \"/password-recovery-step1-success\" });\n } else {\n this.setState({\n errorMessage: \"Password recovery failed\",\n loading: false,\n });\n }\n })\n .catch((error) => {\n this.setState({\n errorMessage: \"An error occurred, please check your network\",\n loading: false,\n });\n });\n }\n\n render() {\n return this.state.redirectUrl ? (\n \n
\n \n \n
\nWe just sent you an email
\n\n Your registration was successful,
\n click the link we sent to you to activate your account and\n login.\n
\n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport { Link } from \"react-router-dom\";\nimport Logo from \"../../Logo\";\nimport Spinner from \"../../Utils/Spinner\";\nimport APICall from \"../../Utils/APICall\";\nimport Constants from \"../../Utils/Constants\";\n\nexport default class RegisterVerifyEmail extends Component {\n constructor(props) {\n super(props);\n this.state = {\n verificationStatus: null,\n };\n }\n\n componentDidMount() {\n localStorage.clear();\n sessionStorage.clear();\n if (this.props.match.params.verificationStatus) {\n this.setState({\n verificationStatus: this.props.match.params.verificationStatus.replace(\n /\\+/g,\n \" \"\n ),\n });\n }\n }\n\n render() {\n return (\n \n
\n {/* content-wrapper ends */}\n \n
\n \n
\n \n
\n \n
\n Password recovery
\n\n Provide your email below, we will help you regain access to\n your account\n
\n \n\n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport { Link } from \"react-router-dom\";\nimport Logo from \"../../Logo\";\n\n\nexport default class RecoverPasswordSuccessful extends Component {\n constructor(props) {\n super(props);\n this.state = {}\n }\n\n componentDidMount(){\n localStorage.clear();\n sessionStorage.clear();\n }\n\n \n\n render() {\n return (\n \n
\n {/* content-wrapper ends */}\n \n
\n \n
\n \n \n Now that we have verified your email,
\n \n Login\n \n \n ) : (\n <>\n \n Your request failed,\n
\n \n Home\n \n \n Login\n \n \n )}\n
\n \n
\n {this.props.match.params.verificationStatus == \"success\" ? (\n <>\n \n \n
\n\n Your account is now active!\n
\n\n Now that we have verified your email,
\n you may now login to your profile.\n
\n \n \n
\nAn error occurred
\n\n Your request failed,\n
\n {this.state.verificationStatus}\n
\n \n
\n );\n }\n}\n\n","import React, { Component } from \"react\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Logo from \"../../Logo\";\nimport Spinner from \"../../Utils/Spinner\";\nimport APICall from \"../../Utils/APICall\";\nimport Constants from \"../../Utils/Constants\";\nimport PublicWithTopStripBackground from \"../../Components/Layouts/PublicWithTopStripBackground\";\n\nexport default class SetPassword extends Component {\n constructor(props) {\n super(props);\n this.state = {\n payload: {},\n errorMessage: null,\n loading: false,\n redirectUrl: null,\n };\n }\n\n componentDidMount() {\n localStorage.clear();\n sessionStorage.clear();\n if (!this.props.match.params.code) {\n window.location.href = \"/login\";\n }\n }\n\n updateProp(e, prop, value) {\n var record = this.state.payload;\n record[prop] = value ? value : e.target.value;\n this.setState({ payload: record });\n }\n\n sendToServer() {\n var payload = {\n data: this.state.payload.password,\n };\n APICall(\n `api/users/register/password/${this.props.match.params.code}`,\n \"POST\",\n payload\n )\n .then((data) => {\n if (data.data.isSuccess) {\n this.setState({\n redirectUrl: \"/set-password-successful\",\n });\n } else {\n this.setState({ errorMessage: data.data.message, loading: false });\n }\n })\n .catch((error) => {\n this.setState({\n errorMessage: \"An error occurred, please check your network\",\n loading: false,\n });\n });\n }\n\n submit() {\n if (\n !this.state.payload.password ||\n this.state.payload.password.trim() == \"\"\n ) {\n this.setState({ errorMessage: \"Supply a new password to continue\" });\n return;\n }\n\n if (\n !this.state.payload.passwordConfirmation ||\n this.state.payload.passwordConfirmation.trim() == \"\"\n ) {\n this.setState({ errorMessage: \"Confirm your password to continue\" });\n return;\n }\n\n if (this.state.payload.password.length < 8) {\n this.setState({\n errorMessage: \"Supply a password of at least 8 characters\",\n });\n return;\n }\n\n if (\n this.state.payload.password != this.state.payload.passwordConfirmation\n ) {\n this.setState({\n errorMessage: \"Your password and confirmation needs to match\",\n });\n return;\n }\n\n this.setState({ errorMessage: null, loading: true }, () => {\n this.sendToServer();\n });\n }\n\n render() {\n return this.state.redirectUrl ? (\n \n
\n {/* content-wrapper ends */}\n \n
\n \n
\n \n To complete your password recovery,
\n \n
\n \n
\n \n
We sent you an email
\nTo complete your password recovery,
please follow the instructions in the email we just sent to you.
\n \n \n
\n \n Set account password\n
\n\n Choose a secure password of at least 8 characters for your\n account.\n
\n \n \n \n }\n />\n );\n }\n}\n","import React, { Component } from \"react\";\nimport { Link } from \"react-router-dom\";\nimport PublicWithTopStripBackground from \"../../Components/Layouts/PublicWithTopStripBackground\";\nimport Logo from \"../../Logo\";\nimport Constants from \"../../Utils/Constants\";\n\nexport default class SetPasswordSuccessful extends Component {\n constructor(props) {\n super(props);\n this.state = {};\n }\n\n componentDidMount() {\n localStorage.clear();\n sessionStorage.clear();\n }\n\n render() {\n return (\n\n
\n \n \n
\nPassword setup is successful
\n\n You have successfuly set a password for your account,
\n you may now proceed to login.\n
\n - \n
- Main \n {this.state.loading ? (\n
- \n \n \n
\n \n \n \n \n ) : null}\n {!this.state.menus\n ? null\n : this.state.menus.map((menu, index) => (\n - \n \n \n \n \n {menu.label}\n \n \n ))}\n
- \n
\n \n - \n \n \n \n Log Out\n \n\n \n
\n
\n );\n }\n}\n","import React, { Component, useContext } from \"react\";\nimport TopNav from \"../TopNav\";\nimport Sidebar from \"../Sidebar\";\nimport Constants from \"../../Utils/Constants\";\nimport Functions from \"../../Utils/Functions\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport CenterBlock from \"../CenterBlock\";\nimport Spinner from \"../../Utils/Spinner\";\nimport Tooltip from \"react-tooltip-lite\";\nimport { DataContext } from \"../../Contexts/DataContexts\";\nimport AddAppScripts from \"./AddAppScripts\";\n\nexport default class MainLayout extends Component {\n constructor(props) {\n super(props);\n this.state = {\n redirect: null,\n hideFloatingButton: false,\n hideActivationMessage: false,\n mobileMenuIsOpen: false,\n };\n\n this.toggleMobileMenu = this.toggleMobileMenu.bind(this);\n }\n\n static contextType = DataContext;\n\n componentDidMount() {}\n\n toggleMobileMenu() {\n this.setState({ mobileMenuIsOpen: !this.state.mobileMenuIsOpen });\n }\n\n render() {\n return (\n <>\n \n {this.props.children}\n
\n \n
\n \n );\n }\n}\n","import React, { Component } from \"react\";\n\nexport default class CardBlock extends Component {\n constructor(props) {\n super(props);\n this.state = {};\n }\n\n componentDidMount() { }\n\n render() {\n return (\n \n
\n \n
\n \n \n \n ) : this.state.redirect ? (\n
\n \n {this.props.title ? (\n
\n {this.state.loading ? (\n \n {this.props.title}\n
\n ) : null}\n\n \n\n
\n );\n }\n}\n","import React, { Component } from \"react\";\n\nexport default function Tabs({ headers, contents, id }) {\n const randomString = (length) => {\n var result = \"\";\n var characters =\n \"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789\";\n var charactersLength = characters.length;\n for (var i = 0; i < length; i++) {\n result += characters.charAt(Math.floor(Math.random() * charactersLength));\n }\n return result;\n };\n const tabId = id || randomString(15);\n let firstIndex = 0;\n let savedIndex = sessionStorage.getItem(`currenttab_${tabId}`);\n if (savedIndex) {\n firstIndex = parseInt(savedIndex);\n }\n\n const saveCurrentTab = (tabIndex) => {\n console.log(`current tab set to: `, tabIndex);\n sessionStorage.setItem(`currenttab_${tabId}`, tabIndex);\n };\n\n return !headers ? null : (\n <>\n {headers.length <= 1 ? null : (\n \n {\n this.props.title && this.props.title.trim() != \"\"?\n
\n {this.props.title}
:null\n }\n \n {\n this.props.description && this.props.description.trim() != \"\"?\n{this.props.description}
:null\n }\n \n\n
\n\n \n {this.props.children}\n
\n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport MainLayout from \"../../Components/Layouts/MainLayout\";\nimport CardBlock from \"../../Components/CardBlock\";\nimport Tabs from \"../../Utils/Tabs\";\nimport CenterBlock from \"../../Components/CenterBlock\";\nimport StepsIndicator from \"../../Components/StepsIndicator\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Constants from \"../../Utils/Constants\";\nimport SpinnerButton from \"../../Utils/SpinnerButton\";\nimport Toastr from \"../../Utils/Toastr\";\nimport APICall from \"../../Utils/APICall\";\n\nexport default class PasswordChange extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: false,\n data: {},\n redirect: null,\n };\n }\n\n componentDidMount() {}\n\n submit() {\n if (\n !this.state.data ||\n this.state.data.newPassword != this.state.data.retypePassword\n ) {\n Toastr(\"error\", \"New password and confirmation must match\");\n return;\n }\n\n this.setState({ errorMessage: null, loading: true });\n APICall(\"api/users/changepassword\", \"POST\", this.state.data)\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n Toastr(\"success\", \"Password changed, redirecting ... \");\n setTimeout(() => {\n this.setState({ redirect: \"/logout\" });\n }, 5000);\n } else {\n Toastr(\"error\", response.message);\n this.setState({ loading: false });\n }\n })\n .catch((error) => {\n Toastr(\"error\", \"An error occurred, please check your network\");\n this.setState({ loading: false });\n });\n }\n\n updateProp(e, prop) {\n var record = this.state.data;\n record[prop] = e.target.value;\n this.setState({ data: record });\n }\n\n render() {\n return this.state.redirect ? (\n - \n {\n this.props.steps.map((step, index)=>\n
- = (index+1))? \"active\": \"\"}>\n {step.label} \n )\n }\n
\n
\n \n \n this.submit()}\n />\n \n
\n \n \n
\n \n this.updateProp(e, \"oldPassword\")}\n />\n
\n \n \n
\n \n this.updateProp(e, \"newPassword\")}\n />\n
\n \n \n
\n\n \n this.updateProp(e, \"retypePassword\")}\n />\n
\n \n
\n );\n }\n\n render() {\n return (\n \n \n
\n \n
\n \n {prop.title}
\n{prop.data}
\n\n
\n \n )}\n
\n \n \n \n \n \n {this.state.loading && !this.state.data ? (\n \n \n ) : this.state.errorMessage ? (\n \n this.loadData()}\n className=\"btn btn-inverse-light btn-fw mt-4 btn-rounded\"\n >\n Reload\n \n \n ) : this.state.data ? (\n <>\n
\n \n \n
\n\n {this.state.errorMessage}\n
\n \n {null && (\n <>\n \n
\n \n \n \n -\n \n \n
\n \n \n \n this.setState({ fromDate: date }, () => {\n this.quickReload();\n })\n }\n className=\"my-custom-datepicker-component\"\n />\n
\n \n \n \n this.setState({ toDate: date }, () => {\n this.quickReload();\n })\n }\n className=\"my-custom-datepicker-component\"\n />\n
\n \n \n )}\n
\n
\n \n
\n \n
\n \n
\n \n
\n \n \n 10k{\" \"}\n
\n \n
\n \n
\n \n \n
\n \n \n
\n \n
\n \n Month production per abattoir\n
\n\n 10k{\" \"}\n \n animals\n \n
\n \n \n
\n \n
\n \n \n
\n \n \n
\n \n
\n Income
\n\n YTD: 59,565.00\n
\n\n \n
\n \n \n
\n \n
\n \n \n
\n \n \n
\n \n
\n \n
\n \n Healthy vs Diseased animals\n
\n- \n
- \n
- \n
\n
\n \n ) : null}\n \n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport CardBlock from \"../CardBlock\";\nimport CenterBlock from \"../CenterBlock\";\nimport { Link } from \"react-router-dom\";\nimport Spinner from \"../../Utils/Spinner\";\nimport Functions from \"../../Utils/Functions\";\nimport APICall from \"../../Utils/APICall\";\nimport Constants from \"../../Utils/Constants\";\n\nexport default class VetDashboard extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: true,\n errorMessage: null,\n data: null,\n };\n }\n\n componentDidMount() {\n this.loadData();\n }\n\n loadData() {\n this.setState({ loading: true, errorMessage: null });\n\n APICall(\"api/dashboard/vet\", \"GET\", null)\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState(\n { data: response.data, errorMessage: null, loading: false },\n () => {\n localStorage.setItem(\"dashboard\", JSON.stringify(response.data));\n }\n );\n } else {\n this.setState({\n errorMessage: response.message,\n loading: false,\n data: null,\n });\n }\n })\n .catch((error) => {\n this.setState({\n errorMessage: \"An error occurred, please check your network\",\n loading: false,\n });\n });\n }\n\n statBox(prop) {\n return (\n \n
\n \n
\n \n
\n );\n }\n\n render() {\n return (\n \n \n
\n \n
\n \n {prop.title}
\n{prop.data}
\n\n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport CardBlock from \"../CardBlock\";\nimport CenterBlock from \"../CenterBlock\";\nimport { Link } from \"react-router-dom\";\nimport Spinner from \"../../Utils/Spinner\";\nimport Functions from \"../../Utils/Functions\";\nimport APICall from \"../../Utils/APICall\";\nimport Constants from \"../../Utils/Constants\";\n\nexport default class DistributorDashboard extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: true,\n errorMessage: null,\n data: null,\n };\n }\n\n componentDidMount() {\n this.loadData();\n }\n\n loadData() {\n this.setState({ loading: true, errorMessage: null });\n\n APICall(\"api/dashboard/distributor\", \"GET\", null)\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState(\n { data: response.data, errorMessage: null, loading: false },\n () => {\n localStorage.setItem(\"dashboard\", JSON.stringify(response.data));\n }\n );\n } else {\n this.setState({\n errorMessage: response.message,\n loading: false,\n data: null,\n });\n }\n })\n .catch((error) => {\n this.setState({\n errorMessage: \"An error occurred, please check your network\",\n loading: false,\n });\n });\n }\n\n statBox(prop) {\n return (\n \n {this.state.loading && !this.state.data ? (\n \n \n ) : this.state.errorMessage ? (\n \n this.loadData()}\n className=\"btn btn-inverse-light btn-fw mt-4 btn-rounded\"\n >\n Reload\n \n \n ) : this.state.data ? (\n <>\n
\n \n \n
\n\n {this.state.errorMessage}\n
\n \n
\n \n Last Check-in:\n
\n
\n \n
\n \n {this.state.data.checkedInto.name}\n \n
\n\n
\n \n
\n \n
\n \n ) : null}\n \n
\n \n \n View Certificates\n \n \n Issue New Certificate\n \n
\n \n
\n );\n }\n\n render() {\n return (\n \n \n
\n \n
\n \n {prop.title}
\n{prop.data}
\n\n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport CardBlock from \"../CardBlock\";\nimport CenterBlock from \"../CenterBlock\";\nimport { Link } from \"react-router-dom\";\nimport Spinner from \"../../Utils/Spinner\";\nimport Functions from \"../../Utils/Functions\";\nimport APICall from \"../../Utils/APICall\";\nimport Constants from \"../../Utils/Constants\";\n\nexport default class VetSupervisorDashboard extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: true,\n errorMessage: null,\n data: null,\n };\n }\n\n componentDidMount() {\n this.loadData();\n }\n\n loadData() {\n this.setState({ loading: true, errorMessage: null });\n\n APICall(\"api/dashboard/vetsupervisor\", \"GET\", null)\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState(\n { data: response.data, errorMessage: null, loading: false },\n () => {\n sessionStorage.setItem(\n \"dashboard\",\n JSON.stringify(response.data)\n );\n }\n );\n } else {\n this.setState({\n errorMessage: response.message,\n loading: false,\n data: null,\n });\n }\n })\n .catch((error) => {\n this.setState({\n errorMessage: \"An error occurred, please check your network\",\n loading: false,\n });\n });\n }\n\n statBox(prop) {\n return (\n \n {this.state.loading && !this.state.data ? (\n \n \n ) : this.state.errorMessage ? (\n \n this.loadData()}\n className=\"btn btn-inverse-light btn-fw mt-4 btn-rounded\"\n >\n Reload\n \n \n ) : this.state.data ? (\n <>\n
\n \n \n
\n\n {this.state.errorMessage}\n
\n \n
\n \n
\n\n
\n
\n \n
\n \n {this.state.data.distributor.companyName}\n \n
\n \n
\n \n
\n \n
\n \n ) : null}\n \n
\n \n \n View Certificates\n \n
\n \n
\n );\n }\n\n render() {\n return (\n \n \n
\n \n
\n \n {prop.title}
\n{prop.data}
\n\n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport CardBlock from \"../CardBlock\";\nimport CenterBlock from \"../CenterBlock\";\nimport { Link } from \"react-router-dom\";\nimport Spinner from \"../../Utils/Spinner\";\nimport Functions from \"../../Utils/Functions\";\nimport APICall from \"../../Utils/APICall\";\nimport Constants from \"../../Utils/Constants\";\n\nexport default class RegularDashboard extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: false,\n errorMessage: null,\n data: null,\n };\n }\n\n componentDidMount() {}\n\n statBox(prop) {\n return (\n \n {this.state.loading && !this.state.data ? (\n \n \n ) : this.state.errorMessage ? (\n \n this.loadData()}\n className=\"btn btn-inverse-light btn-fw mt-4 btn-rounded\"\n >\n Reload\n \n \n ) : this.state.data ? (\n <>\n
\n \n \n
\n\n {this.state.errorMessage}\n
\n \n
\n \n ) : null}\n \n
\n \n
\n \n
\n );\n }\n\n render() {\n return (\n \n \n
\n \n
\n \n \n
\n \n \n
\n \n
\n \n {prop.title}\n
\n\n
\n );\n }\n}\n","import APICall from \"./APICall\";\nimport React from \"react\";\nimport { jssPreset } from \"@material-ui/core\";\n\nexport default class DataAPI {\n static specializationsList(callback) {\n APICall(\"api/specializations/masterlist\", \"GET\", null)\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n callback(response.data, null);\n } else {\n callback(null, response.message);\n }\n })\n .catch((error) => {\n callback(null, \"Please check your connection\");\n });\n }\n\n static diseaseReportingConfiguration = async (noCache) => {\n let data = sessionStorage.getItem(\"disease-reporting-configuration\");\n if (data && !noCache) return JSON.parse(data);\n\n await APICall(\"api/diseasereports/loadconfiguration\", \"GET\", null).then(\n (apidata) => {\n var response = apidata.data;\n if (response.isSuccess) {\n sessionStorage.setItem(\n \"disease-reporting-configuration\",\n JSON.stringify(response.data)\n );\n data = response.data;\n }\n }\n );\n return data;\n };\n\n static findAnimal = async (tagNumber) => {\n let data = null;\n await APICall(`api/abattoirs/fetchanimal/${tagNumber}`, \"GET\", null).then(\n (apidata) => {\n const response = apidata.data;\n if (response.isSuccess) {\n data = response.data;\n }\n }\n );\n return data;\n };\n\n static listUsers = async (page, pageSize, role, query) => {\n let data = null;\n await APICall(\n `api/users/fetch/${page}/${pageSize}/${role}?query=${query}`,\n \"GET\",\n null\n ).then((apidata) => {\n const response = apidata.data;\n if (response.isSuccess) {\n data = response.data;\n }\n });\n return data;\n };\n\n static listSupplyLog = async (certificateCode) => {\n let data = null;\n await APICall(`api/supplies/list/${certificateCode}`, \"GET\", null).then(\n (apidata) => {\n const response = apidata.data;\n if (response.isSuccess) {\n data = response.data;\n }\n }\n );\n return data;\n };\n\n static verifyCertificate = async (certificateCode) => {\n let data = null;\n await APICall(\n `api/certificates/verify/${certificateCode}`,\n \"GET\",\n null\n ).then((apidata) => {\n const response = apidata.data;\n if (response.isSuccess) {\n data = response.data;\n }\n });\n\n return {\n certificate: data?.certificate,\n diseaseReport: data?.diseaseReport,\n supplyList: data?.supplyList,\n };\n };\n\n static banksList = async () => {\n let data = sessionStorage.getItem(\"banks-list\");\n if (data) return JSON.parse(data);\n\n await APICall(\"api/bankaccounts/listbanks\", \"GET\", null).then((apidata) => {\n var response = apidata.data;\n if (response.isSuccess) {\n sessionStorage.setItem(\"banks-list\", JSON.stringify(response.data));\n data = response.data;\n }\n });\n return data;\n };\n\n static retailersAddresses = async () => {\n let data = sessionStorage.getItem(\"retail-addresses\");\n if (data) {\n return JSON.parse(data);\n }\n\n await APICall(\"api/configuration/listaddresses\", \"GET\", null).then(\n (apidata) => {\n var response = apidata.data;\n if (response.isSuccess) {\n sessionStorage.setItem(\n \"retail-addresses\",\n JSON.stringify(response.data)\n );\n data = response.data;\n }\n }\n );\n\n return data || [];\n };\n\n static listDistributors = async (state, country) => {\n let returnData = null;\n // await APICall(`api/distributors/list`, \"get\")\n await APICall(`api/distributors/get/${country}/${state}`, \"get\")\n .then((data) => {\n if (data.data.isSuccess) {\n let response = data.data;\n if (response.data) {\n returnData = response.data;\n }\n }\n })\n .catch((error) => {\n console.log(error);\n });\n\n return returnData;\n };\n\n\n static findAnimalBirthInformation = async (tagNumber) => {\n let data = null;\n await APICall(`api/Ranch/getranchanimalbyanimaltag/${tagNumber}`, \"GET\", null).then(\n (apidata) => {\n const response = apidata.data;\n if (response.isSuccess) {\n data = response.data;\n }\n }\n );\n return data;\n };\n\n static findAnimalMonthlyRecords = async (tagNumber) => {\n let data = null;\n await APICall(`api/Ranch/getmonthlyranchanimalbyanimaltag/${tagNumber}`, \"GET\", null).then(\n (apidata) => {\n const response = apidata.data;\n if (response.isSuccess) {\n data = response.data;\n }\n }\n );\n return data;\n };\n}\n","import React, { Component } from \"react\";\nimport MainLayout from \"../../Components/Layouts/MainLayout\";\nimport CardBlock from \"../../Components/CardBlock\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Constants from \"../../Utils/Constants\";\nimport APICall from \"../../Utils/APICall\";\nimport Spinner from \"../../Utils/Spinner\";\nimport SpinnerButton from \"../../Utils/SpinnerButton\";\nimport Toastr from \"../../Utils/Toastr\";\nimport Modal from \"react-modal\";\nimport DataAPI from \"../../Utils/DataAPI\";\nimport Functions from \"../../Utils/Functions\";\n\nexport default class DeliveryPage extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: false,\n distributor: {},\n errorMessage: null,\n certificateCode: null,\n certificate: null,\n diseaseReport: null,\n supplyLoading: false,\n redirectUrl: null,\n supplyList: [],\n };\n\n this.formControl = this.formControl.bind(this);\n }\n\n statusChecker = null;\n componentDidMount() {}\n\n componentWillUnmount() {\n if (this.statusChecker) {\n //CANCEL INTERVAL HERE\n clearInterval(this.statusChecker);\n }\n }\n\n startCheckingForStatus() {\n this.statusChecker = setInterval(() => {\n this.checkSupplyStatus();\n }, 10000);\n }\n\n async startSupply() {\n this.setState({ supplyLoading: true });\n const payload = {\n weight: parseFloat(this.state.weight),\n certificateCode: this.state.certificate.code,\n };\n\n let apiResponse = null;\n await APICall(`api/distributors/startsupply`, \"POST\", payload)\n .then((data) => {\n apiResponse = data.data;\n })\n .catch((error) => {\n Toastr(\"error\", \"An error occurred, please check your network.\");\n });\n\n if (apiResponse?.isSuccess) {\n this.setState({ newsupply: apiResponse.data }, () => {\n setTimeout(() => {\n //wait for 10 seconds and start checking for status\n this.startCheckingForStatus();\n }, 10000);\n });\n } else {\n Toastr(\"error\", apiResponse.message);\n }\n\n this.setState({ supplyLoading: false });\n }\n\n async checkSupplyStatus() {\n let apiResponse = null;\n await APICall(\n `api/distributors/pullsupply/${this.state.newsupply.supplyCode}`,\n \"GET\"\n )\n .then((data) => {\n apiResponse = data.data;\n })\n .catch((error) => {\n Toastr(\"error\", \"Unable to confirm status, please check your network.\");\n });\n\n if (apiResponse?.isSuccess) {\n const supply = apiResponse.data.supply;\n if (supply.accepted) {\n this.setState({\n redirectUrl: `/in/supplier-delivery-success/${supply.supplyCode}`,\n });\n }\n }\n }\n\n async verifyCertificate() {\n this.setState({ validateLoading: true });\n let verifiedCertificate = await DataAPI.verifyCertificate(\n this.state.certificateCode\n );\n if (verifiedCertificate) {\n this.setState({\n certificate: verifiedCertificate.certificate,\n diseaseReport: verifiedCertificate.diseaseReport,\n supplyList: verifiedCertificate.supplyList,\n });\n } else {\n Toastr(\"error\", \"Invalid certificate number\");\n }\n this.setState({ validateLoading: false });\n }\n\n dataRow({ label, data }) {\n return (\n \n
\n \n
\n \n \n \n
\n
\n );\n }\n\n formControl({ label, prop, inputType, required }) {\n if (!inputType) inputType = \"text\";\n let payload = this.state.payload;\n if (!payload) payload = {};\n\n return (\n <>\n \n \n
\n \n \n Waiting for response
\n
\n this.setState({ newsupply: null })}\n className=\"btn btn-rounded btn-sm btn-danger\"\n >\n Cancel Delivery\n \n
\n \n )}\n \n \n Waiting for response
\n \n
{this.state.newsupply.supplyCode}
\n\n Give the code above to the person taking delivery of this\n consignment to validate your supply\n
\n\n
\n \n {this.state.loading ? (\n \n \n )}\n
\n \n
\n \n \n
\n \n
\n );\n }\n\n formGroupRow2({ colClass, children, extraChildren }) {\n return (\n {children}
\n \n
\n );\n }\n\n formControl({ label, prop, inputType, required }) {\n if (!inputType) inputType = \"text\";\n let payload = this.state.payload;\n if (!payload) payload = {};\n\n return (\n <>\n \n {children}
\n {extraChildren && {extraChildren}
}\n \n
\n \n \n {this.state.step == 1 && (\n \n
\n \n )}\n \n
\n \n
\n ) : null}\n\n \n
\n \n \n this.takeDeliveryNow()}\n className=\"btn btn-success mr-2 btn-block btn-rounded\"\n label=\"Take Delivery\"\n loading={this.state.loading}\n />\n
\n \n
\n );\n }\n\n render() {\n return (\n \n \n
\n \n
\n \n {prop.title}
\n{prop.data}
\n\n
\n \n )}\n
\n \n \n \n \n {this.state.loading && !this.state.data ? (\n \n \n ) : this.state.errorMessage ? (\n \n this.loadData()}\n className=\"btn btn-inverse-light btn-fw mt-4 btn-rounded\"\n >\n Reload\n \n \n ) : this.state.data ? (\n <>\n
\n \n \n
\n\n {this.state.errorMessage}\n
\n \n {null && (\n <>\n \n
\n \n \n \n -\n \n \n
\n \n \n \n this.setState({ fromDate: date }, () => {\n this.quickReload();\n })\n }\n className=\"my-custom-datepicker-component\"\n />\n
\n \n \n \n this.setState({ toDate: date }, () => {\n this.quickReload();\n })\n }\n className=\"my-custom-datepicker-component\"\n />\n
\n \n \n )}\n
\n
\n \n
\n \n
\n \n
\n \n
\n \n \n {Object.values(this.state.animalStat).reduce((acc, data) => acc + data, 0)}{\" \"}\n
\n\n
\n \n
\n \n \n
\n \n \n
\n \n
\n \n {this.context.globalState.user?.name}\n
\n\n
\n \n Ranch Animal Summary\n
\n\n {Object.values(this.state.animalStat).reduce((acc, data) => acc + data, 0)}{\" \"}\n \n animals\n \n
\n\n \n \n
\n \n
\n \n \n
\n \n \n
\n \n
\n Animal Frequency line Chart
\n\n Animal Count: {this.state.animalCount}{\" \"}\n\n
\n\n \n
\n \n \n
\n \n
\n \n \n
\n \n \n
\n \n
\n \n
\n \n Healthy vs Diseased animals\n
\n- \n
- \n
- \n
\n
\n
\n
\n
\n
\n \n ) : null}\n \n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport MainLayout from \"../../Components/Layouts/MainLayout\";\nimport CenterBlock from \"../../Components/CenterBlock\";\nimport AdminDashboard from \"../../Components/Dashboards/AdminDashboard\";\nimport Spinner from \"../../Utils/Spinner\";\nimport VetDashboard from \"../../Components/Dashboards/VetDashboard\";\nimport DistributorDashboard from \"../../Components/Dashboards/DistributorDashboard\";\nimport { DataContext } from \"../../Contexts/DataContexts\";\nimport VetSupervisorDashboard from \"../../Components/Dashboards/VetSupervisorDashboard\";\nimport RegularDashboard from \"../../Components/Dashboards/RegularDashboard\";\nimport DeliveryPage from \"../Distributors/DeliveryPage\";\nimport TakeDeliveryPage from \"../Vets/TakeDeliveryPage\";\nimport { Redirect } from \"react-router\";\nimport RanchDashboard from \"../../Components/Dashboards/RanchDashboard\";\n\nexport default class Home extends Component {\n constructor(props) {\n super(props);\n this.state = {\n errorState: false,\n };\n }\n\n static contextType = DataContext;\n\n componentDidMount() { }\n\n render() {\n return (\n \n
\n \n\n\n {Object.entries(this.state.animalStat).map(([animalName, animalCount]) => (\n
\n \n \n
\n\n An error occurred on this page.
\n Try reloading the page.\n
\n \n Try reloading the page.\n
\n
);\n }\n}\n\nexport default PageError;","import React, { Component } from \"react\";\nimport APICall from \"../Utils/APICall\";\nimport CenterBlock from \"./CenterBlock\";\nimport Spinner from \"../Utils/Spinner\";\nimport Modal from \"react-modal\";\nimport MyTable from \"../Utils/MyTable\";\nimport Functions from \"../Utils/Functions\";\nimport SpinnerButton from \"../Utils/SpinnerButton\";\nimport Toastr from \"../Utils/Toastr\";\nimport \"../sass/user-bio.scss\";\nimport PageError from \"./PageError\";\nimport Constants from \"../Utils/Constants\";\nimport { DataContext } from \"../Contexts/DataContexts\";\n\nexport default class UserBio extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: true,\n data: null,\n errorMessage: null,\n newRecord: {},\n newRecordErrorMessage: null,\n submitLoading: false,\n loggedInUser: null,\n profileImageloading: false,\n hovered: false,\n updatePayload: {},\n queryString: Functions.randomString(6),\n };\n\n this.init = this.init.bind(this);\n }\n\n static contextType = DataContext;\n\n changeDisplayPhoto(e) {\n var file = e.target.files[0];\n var reader = new FileReader();\n reader.onloadend = () => {\n this.postDP(reader.result);\n };\n reader.readAsDataURL(file);\n }\n\n postDP = (base64File) => {\n if (!base64File || base64File.trim() <= 10) return;\n this.setState({ errorMessage: null, profileImageloading: true });\n APICall(\"api/users/ChangeProfilePicture\", \"POST\", {\n userId: this.state.data.id,\n base64Image: base64File,\n })\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState({\n profileImageloading: false,\n queryString: Functions.randomString(10),\n });\n } else {\n Toastr(\"error\", response.message);\n this.setState({\n profileImageloading: false,\n });\n }\n })\n .catch((error) => {\n Toastr(\"success\", \"Please check your network\");\n this.setState({\n profileImageloading: false,\n });\n });\n };\n\n componentDidMount() {\n this.whoIsLoggedIn();\n }\n\n whoIsLoggedIn = () => {\n this.setState({ errorMessage: null, loading: true });\n APICall(\"api/users/profile\", \"GET\", {})\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState({ loggedInUser: response.data });\n this.init(this.state.page, this.state.pageSize);\n } else {\n this.setState({\n errorMessage:\n \"Your request generated an error. Refresh or try again after sometime\",\n loading: false,\n });\n }\n })\n .catch((error) => {\n this.setState({\n errorMessage:\n \"Your request generated an error. Please check your connection\",\n loading: false,\n });\n });\n };\n\n toggleActive = () => {\n this.setState({ errorMessage: null, toggleLoading: true });\n APICall(\n \"api/users/ToggleActive/\" + this.state.data.id.toString(),\n \"POST\",\n {}\n )\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState({ toggleLoading: false });\n Toastr(\"success\", \"Request successful\");\n } else {\n Toastr(\n \"error\",\n \"Your request generated an error. Refresh or try again after sometime\"\n );\n this.setState({ toggleLoading: false });\n }\n })\n .catch((error) => {\n Toastr(\n \"error\",\n \"Your request generated an error. Please check your connection\"\n );\n this.setState({\n toggleLoading: false,\n });\n });\n };\n\n init() {\n this.setState({\n errorMessage: null,\n loading: true,\n });\n\n var endpoint = \"\";\n if (this.props.userId) {\n endpoint = \"api/users/get/\" + this.props.userId;\n } else {\n endpoint = \"api/users/profile\";\n }\n\n APICall(endpoint, \"GET\", {})\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n var updatePayload = {\n name: response.data.name,\n phoneNumber: response.data.phoneNumber,\n vcnRegistrationNumber: response.data.vcnRegistrationNumber,\n };\n this.setState(\n {\n loading: false,\n data: response.data,\n updatePayload: updatePayload,\n },\n () => {}\n );\n } else {\n this.setState({\n errorMessage:\n \"Your request generated an error. Try again after sometime\",\n loading: false,\n });\n }\n console.log(data);\n })\n .catch((error) => {\n this.setState({\n errorMessage:\n \"Your request generated an error. Please check your network connection\",\n loading: false,\n });\n });\n }\n\n updateProp(e, prop) {\n var record = this.state.updatePayload;\n record[prop] = e.target.value;\n this.setState({ updatePayload: record }, () => {});\n }\n\n validate() {\n if (\n !this.state.updatePayload.name ||\n !this.state.updatePayload.phoneNumber\n ) {\n Toastr(\"error\", \"Name and phone number cannot be blank\");\n return false;\n }\n if (this.state.updatePayload.name.trim() == \"\") {\n Toastr(\"error\", \"Name cannot be blank\");\n return false;\n }\n if (\n this.state.updatePayload.phoneNumber.trim() == \"\" ||\n this.state.updatePayload.phoneNumber.trim().length < 7\n ) {\n Toastr(\"error\", \"Add a valid mobile number\");\n return false;\n }\n return true;\n }\n\n submit() {\n if (!this.validate()) return;\n this.setState({ submitLoading: true });\n var requestPayload = this.state.updatePayload;\n requestPayload.id = this.state.data.id;\n APICall(\"api/users/update\", \"POST\", requestPayload)\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState({ submitLoading: false });\n Toastr(\"success\", \"User account updated\");\n this.context.addItem(\"user\", response.data);\n } else {\n Toastr(\"error\", response.message);\n this.setState({ submitLoading: false });\n }\n })\n .catch((error) => {\n Toastr(\n \"error\",\n \"Your request generated an error. Please check your network connection\"\n );\n this.setState({ submitLoading: false });\n });\n }\n\n changePassword() {\n if (\n !this.state.newPassword ||\n !this.state.newPasswordConfirmation ||\n this.state.newPassword.trim() == \"\" ||\n this.state.newPasswordConfirmation.trim() == \"\"\n ) {\n return;\n }\n if (this.state.newPassword != this.state.newPasswordConfirmation) {\n Toastr(\"error\", \"Your new password and confirmation does not match\");\n return;\n }\n\n this.setState({ passwordLoading: true });\n\n APICall(\"api/users/changepassword\", \"POST\", {\n newPassword: this.state.newPassword,\n })\n .then((data) => {\n var response = data.data;\n if (response.status == \"success\") {\n Toastr(\"success\", \"Password changed, you will be logged out\");\n setTimeout(() => {\n window.location.href = \"/logout\";\n }, 2000);\n this.setState({ newPassword: \"\", newPasswordConfirmation: \"\" });\n } else {\n Toastr(\"error\", response.message);\n this.setState({ passwordLoading: false });\n }\n })\n .catch((error) => {\n Toastr(\n \"error\",\n \"Your request generated an error. Please check your network connection\"\n );\n this.setState({ passwordLoading: false });\n });\n }\n\n render() {\n return this.state.errorMessage ? (\n \n
\n \n
\n \n
\n {this.props.children? this.props.children:
\n Your request generated an error. \n \n {\n this.props.action? Click the button below to retry:null\n }
}\n {\n this.props.action?\n :null\n }\n \n\n
\n ) : (\n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport MainLayout from \"../../Components/Layouts/MainLayout\";\nimport CardBlock from \"../../Components/CardBlock\";\nimport Tabs from \"../../Utils/Tabs\";\nimport CenterBlock from \"../../Components/CenterBlock\";\nimport UserBio from \"../../Components/UserBio\";\nimport Functions from \"../../Utils/Functions\";\n\nexport default class Profile extends Component {\n constructor(props) {\n super(props);\n this.state = {};\n }\n\n componentDidMount() {}\n\n render() {\n return (\n \n
\n \n \n \n
\n \n 
\n
\n );\n}\n","import React, { Component } from \"react\";\nimport MainLayout from \"../../Components/Layouts/MainLayout\";\nimport CardBlock from \"../../Components/CardBlock\";\nimport Tabs from \"../../Utils/Tabs\";\nimport CenterBlock from \"../../Components/CenterBlock\";\nimport { Link } from \"react-router-dom\";\nimport Constants from \"../../Utils/Constants\";\nimport APICall from \"../../Utils/APICall\";\nimport Spinner from \"../../Utils/Spinner\";\nimport SpinnerButton from \"../../Utils/SpinnerButton\";\nimport Toastr from \"../../Utils/Toastr\";\nimport PublicWithTopStripBackground from \"../../Components/Layouts/PublicWithTopStripBackground\";\nimport CreditCard from \"../../Components/CreditCard\";\n\nexport default class PaymentStatus extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: true,\n data: {},\n subscribeLoading: false,\n errorMessage: null,\n };\n }\n\n componentDidMount() {\n this.loadData();\n }\n\n loadData(silent) {\n if (!this.props.match.params.reference) {\n //no reference was passed, this transaction failed fatally\n this.setState({ errorMessage: null, loading: false });\n return;\n }\n\n this.setState({ errorMessage: null, loading: silent ? false : true });\n APICall(\n \"api/payments/status/\" + this.props.match.params.reference,\n \"GET\",\n null\n )\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState({ data: response.data, loading: false });\n } else {\n this.setState({\n errorMessage: response.message,\n loading: false,\n data: {},\n });\n }\n })\n .catch((error) => {\n this.setState({\n errorMessage: \"An error occurred, please check your network\",\n loading: false,\n });\n });\n }\n\n newSubscription() {\n this.subscribe();\n }\n\n subscribe(useCardOnFile, replaceCardOnFile) {\n if (!useCardOnFile) {\n useCardOnFile = false;\n } else {\n useCardOnFile = true;\n }\n if (!replaceCardOnFile) {\n replaceCardOnFile = false;\n } else {\n replaceCardOnFile = true;\n }\n\n this.setState({ subscribeLoading: true });\n APICall(\n `api/subscriptions/New/${useCardOnFile}/${replaceCardOnFile}`,\n \"POST\",\n null\n )\n .then((data) => {\n var response = data.data;\n if (response.status == \"success\") {\n if (response.redirectUrl) {\n //redirect to payment endpoint to complete subscription\n window.location.href = response.redirectUrl;\n } else {\n //redirect not set, this has to be that charge was done with card on file\n Toastr(\"success\", \"Subscription successful\");\n this.loadData();\n }\n } else {\n Toastr(\"error\", \"Subscription failed.\");\n this.setState({ subscribeLoading: false });\n }\n })\n .catch((error) => {\n console.log(error);\n Toastr(\"error\", \"An error occurred, please check your network.\");\n this.setState({ subscribeLoading: false });\n });\n }\n\n render() {\n return (\n **** **** **** {last4}
\n \n {name}\n {expiry}\n
\n \n \n
\n\n An error occurred, click the button to refresh{\" \"}\n
\n \n \n
\n {this.state.data\n .id /*The subscription was created but payment failed */ ? (\n <>\n\n {this.state.data.amountFormatted}\n
\n\n Your transaction was not successful\n
\n \n ) : (\n /*Transaction failed fatally */\n \n An error occurred, subscription payment failed to\n initialize{\" \"}\n
\n )}\n\n \n
\n \n \n Return\n \n
\n \n this.newSubscription()}\n />\n
\n \n \n
\n {this.state.data.transactionType == \"cardTokenization\" ? (\n <>\n\n \n Your card details was captured successfully.\n {\" \"}\n
\n For seamless experience, always ensure you fund your\n account adequately before going to purchase meat at\n the abattoir.{\" \"}\n
\n
\n
\n \n )}\n\n \n
\n \n
\n Amount
\n\n
\n \n {this.state.data.amountFormatted}\n
\n\n
\n \n
\n \n Reference\n
\n\n
\n \n {this.state.data.paymentReference.toUpperCase()}\n
\n\n
\n \n
\n Card
\n\n
\n \n **** **** **** {this.state.data.card}\n
\n\n
\n \n
\n );\n };\n\n return (\n <>\n \n {owner} Bank Account\n
\n\n \n
\n openModal()}\n />\n
\n ) : (\n \n \n You have not setup any bank account for {owner.toUpperCase()}.\n {\" \"}\n
\n You need to specify an account where {owner.toUpperCase()}'s revenue\n will be settled into.\n
\n \n \n \n \n {owner.toUpperCase()} account:\n \n
\n \n {bankAccount.accountNumber}
{\" \"}\n \n {bankAccount.bankName}\n \n \n \n \n \n \n
\n )}\n \n );\n}\n","import React, { Component } from \"react\";\nimport MainLayout from \"../../Components/Layouts/MainLayout\";\nimport CardBlock from \"../../Components/CardBlock\";\nimport Tabs from \"../../Utils/Tabs\";\nimport CenterBlock from \"../../Components/CenterBlock\";\nimport { Link } from \"react-router-dom\";\nimport Constants from \"../../Utils/Constants\";\nimport APICall from \"../../Utils/APICall\";\nimport Spinner from \"../../Utils/Spinner\";\nimport SpinnerButton from \"../../Utils/SpinnerButton\";\nimport Toastr from \"../../Utils/Toastr\";\nimport \"../../sass/kanban.scss\";\nimport Select from \"react-select\";\nimport Modal from \"react-modal\";\nimport SingleBankAccount from \"../../Components/SingleBankAccount\";\n\nexport default class BankAccount extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: true,\n data: {},\n updateLoading: false,\n errorMessage: null,\n banks: [],\n saveErrorMessage: null,\n modalIsOpen: false,\n };\n }\n\n componentDidMount() {\n this.loadBanks();\n }\n\n loadBanks() {\n this.setState({ errorMessage: null, loading: true });\n APICall(\"api/bankaccounts/listbanks\", \"GET\", null)\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n response.data.forEach((element) => {\n element.label = element.bankName;\n element.value = element.bankCode;\n });\n this.setState({ banks: response.data }, () => {\n this.loadData();\n });\n } else {\n this.setState({\n errorMessage: response.message,\n loading: false,\n data: {},\n });\n }\n })\n .catch((error) => {\n this.setState({\n errorMessage: \"An error occurred, please check your network\",\n loading: false,\n });\n });\n }\n\n loadData() {\n this.setState({ errorMessage: null, loading: true });\n APICall(\"api/bankaccounts/getconfiguration\", \"GET\", null)\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState({ data: response.data, loading: false });\n } else {\n this.setState({\n errorMessage: response.message,\n loading: false,\n data: {},\n });\n }\n })\n .catch((error) => {\n this.setState({\n errorMessage: \"An error occurred, please check your network\",\n loading: false,\n });\n });\n }\n\n render() {\n return (\n <>\n \n \n {bankAccount.accountNumber}
{\" \"}\n \n {bankAccount.bankName}\n \n \n \n \n
\n openModal()}\n className=\"btn btn-sm btn-dark\"\n />\n
\n \n
\n \n {this.state.loading ? (\n \n {this.state.errorMessage ? (\n \n this.loadData()}\n className=\"btn btn-inverse-light btn-fw mt-4 mb-5\"\n >\n Reload\n \n \n ) : (\n <>\n \n )}\n
\n \n \n
\n\n An error occurred.
\n Reload page or try again after sometime.{\" \"}\n
\n \n Reload page or try again after sometime.{\" \"}\n
\n
\n \n )}\n \n this.loadData()}\n />\n
\n \n this.loadData()}\n />\n
\n \n \n
\n\n {this.state.errorMessage}\n
\n \n
\n ) : this.context.globalState.user.id ? (\n \n
\n ) : null}\n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport CardBlock from \"../../Components/CardBlock\";\nimport CenterBlock from \"../../Components/CenterBlock\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Constants from \"../../Utils/Constants\";\nimport APICall from \"../../Utils/APICall\";\nimport Spinner from \"../../Utils/Spinner\";\nimport SpinnerButton from \"../../Utils/SpinnerButton\";\nimport Toastr from \"../../Utils/Toastr\";\nimport MyTable from \"../../Utils/MyTable\";\nimport Dropzone from \"react-dropzone\";\nimport Modal from \"react-modal\";\nimport Functions from \"../../Utils/Functions\";\nimport Select from \"react-select\";\nimport { throttle } from \"lodash\";\nimport MainLayout from \"../../Components/Layouts/MainLayout\";\nimport \"moment/locale/en-gb.js\";\nimport { DatePicker, DatePickerInput } from \"rc-datepicker\";\nimport \"rc-datepicker/lib/style.css\";\nimport DateFnsUtils from \"@date-io/date-fns\";\n\nexport default class Payments extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: true,\n data: [],\n errorMessage: null,\n searchQuery: \"\",\n page: 1,\n pageSize: 10,\n modalIsOpen: false,\n uploadErrorMessage: null,\n uploading: false,\n redirect: null,\n user: {},\n alreadyGotResults: false,\n dateFrom: new Date(new Date().getFullYear(), new Date().getMonth(), 1),\n dateTo: new Date(),\n };\n\n this.RenderTable = this.RenderTable.bind(this);\n this.setLoggedInUser = this.setLoggedInUser.bind(this);\n this.init = this.init.bind(this);\n }\n\n quickReload() {\n this.init(1, this.state.pageSize, this.state.searchQuery);\n }\n\n componentDidMount() {\n Modal.setAppElement(\"body\");\n new Functions().whoIsLoggedIn(this.setLoggedInUser, false);\n }\n\n setLoggedInUser(user, error) {\n this.setState({ loading: true });\n\n if (!error) {\n this.setState({ user: user }, () => {\n this.init(1, this.state.pageSize, \"\");\n });\n } else {\n this.setState({\n errorMessage:\n \"Your request generated an error. Try again after sometime\",\n loading: false,\n });\n }\n }\n\n RenderTable(_data) {\n var headerList = [\n {\n Header: \"Reference\",\n accessor: \"referenceComponent\",\n },\n {\n Header: \"Licenses\",\n accessor: \"licenseCountComponent\",\n },\n {\n Header: \"Owner\",\n accessor: \"ownerComponent\",\n },\n {\n Header: \"Payment Date\",\n accessor: \"datePaidFormatted\",\n },\n {\n Header: \"Amount\",\n accessor: \"amountFormatted\",\n },\n ];\n\n const tableHeader = React.useMemo(() => headerList, []);\n\n _data._data.forEach((element) => {\n element.referenceComponent = element.reference.toUpperCase();\n element.licenseCountComponent = element.licenseCount || 1;\n if (element.hospitalId > 0) {\n element.ownerComponent = (\n \n
\n {element.hospital.hospitalName}
\n );\n } else {\n element.ownerComponent = {element.owner.name}
;\n }\n });\n\n const tableData = React.useMemo(() => _data, []);\n return (\n \n
\n );\n }\n\n init(page, pageSize, query) {\n if (!query) query = \"\";\n\n this.setState({\n errorMessage: null,\n loading: true,\n searchQuery: query,\n page: page,\n pageSize: pageSize,\n });\n\n var dateFrom = Functions.sqlDateString(this.state.dateFrom);\n var dateTo = Functions.sqlDateString(this.state.dateTo);\n\n APICall(\n `api/subscriptions/Fetch/${pageSize}/${page}/${dateFrom}/${dateTo}?query=${query}`,\n \"GET\",\n {}\n )\n .then((data) => {\n var response = data.data;\n if (response.status == \"success\") {\n this.setState({ loading: false, data: null }, () => {\n this.setState({ data: response.data });\n });\n } else {\n this.setState({\n errorMessage:\n \"Your request generated an error. Try again after sometime\",\n loading: false,\n });\n }\n console.log(data);\n })\n .catch((error) => {\n this.setState({\n errorMessage:\n \"Your request generated an error. Please check your network connection\",\n loading: false,\n });\n });\n }\n\n render() {\n return (\n \n \n
\n\n An error occurred, you can try reloading the page\n
\n \n
\n \n
\n \n \n \n this.setState({ dateFrom: date }, () => {\n this.quickReload();\n })\n }\n className=\"my-custom-datepicker-component\"\n />\n
\n \n \n -\n \n \n
\n \n \n \n this.setState({ dateTo: date }, () => {\n this.quickReload();\n })\n }\n className=\"my-custom-datepicker-component\"\n />\n
\n \n {!this.state.data ? null : (\n
\n \n Approval number:{\" \"}\n {element.approvalNumber}\n \n \n );\n\n element.investorsTrigger = (\n
\n
\n );\n }\n\n deleteRecord(record) {\n this.setState({ loading: true });\n APICall(`api/specializations/removefrommaster/${record.id}`, \"POST\", {})\n .then((data) => {\n this.setState({ loading: false });\n var response = data.data;\n if (response.status == \"success\") {\n Toastr(\"warning\", \"Record deleted\");\n this.init();\n } else {\n Toastr(\n \"error\",\n \"Your request generated an error. Try again after sometime\"\n );\n }\n console.log(data);\n })\n .catch((error) => {\n Toastr(\"error\", \"Please check your network connection\");\n this.setState({ loading: false });\n });\n }\n static contextType = DataContext;\n\n init(page, pageSize, query) {\n if (!query) query = \"\";\n\n this.setState({\n errorMessage: null,\n loading: true,\n searchQuery: query,\n page: page,\n pageSize: pageSize,\n });\n\n\n const { globalState, addItem } = this.context;\n this.setState({ profile: globalState?.data })\n const { state, country, userRole } = globalState?.user\n\n let apiURL = `api/abattoirs/get/${country}/${state}`\n\n if (userRole == \"superadmin\") {\n apiURL = \"api/abattoirs/list\"\n }\n // APICall(`api/abattoirs/get/${country}/${state}`, \"GET\", {})\n APICall(`${apiURL}`, \"GET\", {})\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState({ loading: false, data: null }, () => {\n this.setState({ data: response.data });\n });\n } else {\n this.setState({\n errorMessage:\n \"Your request generated an error. Try again after sometime\",\n loading: false,\n });\n }\n console.log(data);\n })\n .catch((error) => {\n this.setState({\n errorMessage:\n \"Your request generated an error. Please check your network connection\",\n loading: false,\n });\n });\n }\n\n render() {\n return this.state.redirect ? (\n \n \n
\n\n An error occurred, you can try reloading the page\n
\n \n
\n ) : null}\n\n {!this.state.data ? null : \n
\n );\n }\n\n\n init(page, pageSize, query) {\n if (!query) query = \"\";\n\n this.setState({\n errorMessage: null,\n loading: true,\n searchQuery: query,\n page: page,\n pageSize: pageSize,\n });\n\n APICall(\n `api/users/Fetch/${pageSize}/${page}/${this.state.userType}?query=${query}`,\n \"GET\",\n {}\n )\n .then((data) => {\n var response = data.data;\n if (response.status == \"success\") {\n this.setState({ loading: false, data: null }, () => {\n this.setState({ data: response.data });\n });\n } else {\n this.setState({\n errorMessage:\n \"Your request generated an error. Try again after sometime\",\n loading: false,\n });\n }\n console.log(data);\n })\n .catch((error) => {\n this.setState({\n errorMessage:\n \"Your request generated an error. Please check your network connection\",\n loading: false,\n });\n });\n }\n\n render() {\n return this.state.redirect ? (\n \n \n
\n\n An error occurred, you can try reloading the page\n
\n \n
\n ) : null}\n {this.props.userType ? null : (\n \n
\n \n )}\n\n {!this.state.data ? null : \n Role filter\n
\n \n this.filterUserType(option)}\n />\n
\n \n
\n \n
\n );\n }\n\n updateRecordForm() {\n return (\n ADD ABATTOIR
\n\n \n
\n
\n \n
\n );\n }\n\n addRecord() {\n this.setState({ loading: true, saveErrorMessage: null });\n APICall(\"api/abattoirs/add\", \"POST\", this.state.payload)\n .then((data) => {\n var response = data.data;\n this.setState({ loading: false });\n if (response.isSuccess) {\n Toastr(\"success\", \"New record added\");\n this.setState({ modalIsOpen: false, payload: {} });\n } else {\n this.setState({ saveErrorMessage: response.message });\n }\n })\n .catch((error) => {\n this.setState({\n loading: false,\n saveErrorMessage: \"An error occurred, please check your network\",\n });\n });\n }\n\n updateRecord() {\n this.setState({ loading: true, saveErrorMessage: null });\n APICall(\n `api/abattoirs/update/${this.state.selectedRecord.id}`,\n \"POST\",\n this.state.selectedRecord\n )\n .then((data) => {\n var response = data.data;\n this.setState({ loading: false });\n if (response.isSuccess) {\n Toastr(\"success\", \"Record updated\");\n this.setState({ selectedRecord: null });\n this.reloadPage();\n } else {\n this.setState({ saveErrorMessage: response.message });\n }\n })\n .catch((error) => {\n this.setState({\n loading: false,\n saveErrorMessage: \"An error occurred, please check your network\",\n });\n });\n }\n\n selectRecord(record) {\n this.setState({ selectedRecord: record });\n }\n\n reloadPage() {\n this.setState({ reloading: true }, () => {\n setTimeout(() => {\n this.setState({ reloading: false });\n }, 1000);\n });\n }\n\n render() {\n return (\n <>\n UPDATE ABATTOIR
\n\n \n
\n
\n \n \n );\n }\n}\n","import React, { Component, useEffect, useState } from \"react\";\nimport Constants from \"../../Utils/Constants\";\n\nexport default function AddWebScripts() {\n const [loading, setLoading] = useState(true);\n\n const jsScripts = [\n \"/landing-page/js/jquery.js\",\n \"/landing-page/js/popper.min.js\",\n \"/landing-page/js/bootstrap.min.js\",\n \"/landing-page/js/bootstrap-select.min.js\",\n \"/landing-page/js/jquery.fancybox.js\",\n \"/landing-page/js/isotope.js\",\n \"/landing-page/js/owl.js\",\n \"/landing-page/js/appear.js\",\n \"/landing-page/js/wow.js\",\n \"/landing-page/js/lazyload.js\",\n \"/landing-page/js/scrollbar.js\",\n \"/landing-page/js/TweenMax.min.js\",\n \"/landing-page/js/swiper.min.js\",\n \"/landing-page/js/script.js\",\n ];\n\n const stylesheets = [\n \"/landing-page/css/bootstrap.css\",\n \"/landing-page/css/style.css\",\n \"/landing-page/css/responsive.css\",\n \"/landing-page/css/color.css\",\n ];\n const loadedScripts = [];\n const loadedStyles = [];\n\n const loadScripts = function () {\n loadStyles();\n jsScripts.forEach((scriptUrl) => {\n const script = document.createElement(\"script\");\n script.src = Constants.subfolder + scriptUrl;\n script.async = true;\n document.body.appendChild(script);\n loadedScripts.push(script);\n });\n };\n\n ///loadStyles is called in loadScripts too\n const loadStyles = function () {\n stylesheets.forEach((css) => {\n const link = document.createElement(\"link\");\n link.type = \"text/css\";\n link.rel = \"stylesheet\";\n link.href = Constants.subfolder + css;\n document.head.appendChild(link);\n loadedStyles.push(link);\n });\n };\n\n const unloadScripts = function () {\n loadedScripts.forEach((script) => {\n document.body.removeChild(script);\n });\n loadedStyles.forEach((css) => {\n document.head.removeChild(css);\n });\n };\n\n useEffect(() => {\n document.body.classList.add(\"notvisible\");\n loadScripts();\n\n setTimeout(() => {\n document.body.classList.remove(\"notvisible\");\n }, 2000);\n\n return () => unloadScripts();\n }, []);\n\n return null;\n}\n","import React, { Component } from \"react\";\nimport CenterBlock from \"../Components/CenterBlock\";\nimport AddWebScripts from \"../Components/Layouts/AddWebScripts\";\nimport Constants from \"../Utils/Constants\";\nimport Spinner from \"../Utils/Spinner\";\nimport Logo from \"../Logo\";\nimport \"../sass/landing-page.scss\";\nimport { Link } from \"react-router-dom\";\n\nexport default class LandingPage extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: false,\n };\n\n this.topSlab = this.topSlab.bind(this);\n }\n\n componentDidMount() {\n /* if (\n process.env.REACT_APP_LANDING_PAGE &&\n process.env.REACT_APP_LANDING_PAGE.trim() != \"\"\n ) {\n window.location.href = process.env.REACT_APP_LANDING_PAGE;\n }*/\n }\n\n pageImage(image) {\n return `${Constants.subfolder}/landing-page/img/${image}`;\n }\n\n menus = [\n {\n label: \"Home\",\n url: \"#\",\n children: [],\n },\n {\n label: \"Supplier Registration\",\n url: \"/register\",\n },\n {\n label: \"Features\",\n url: \"\",\n },\n {\n label: \"Use Cases\",\n url: \"\",\n },\n {\n label: \"Menu 1\",\n url: \"#\",\n children: [\n {\n label: \"Child menu 1\",\n url: \"#\",\n },\n {\n label: \"Child menu 2\",\n url: \"#\",\n },\n ],\n },\n ];\n\n renderMenu() {\n return (\n \n \n {this.state.reloading ? (\n this.selectRecord(r)}\n />\n )}\n \n )}\n \n
\n - \n {this.menus.map((menu, index) => (\n
- \n {submenu.label}\n \n ))}\n
- \n {menu.children.map((submenu, submenu_index) => (\n
\n
\n );\n }\n\n render() {\n return (\n <>\n \n
\n \n })
\n
\n \n
\n {header}
\n{body}
\n \n {/* Main Header */}\n \n {/* Header Upper */}\n \n {/* End Main Header */}\n\n {/* End Bnner Section */}\n {/* Welcome Section */}\n \n
\n \n {/* About Section */}\n \n
\n {/*End Header Upper*/}\n {/* Main Menu */}\n \n
\n \n {/*Logo*/}\n
\n \n
\n \n \n
\n \n
\n \n \n
\n
\n \n
\n \n
\n {/* Sticky Header */}\n {null && (\n \n
\n \n \n {/*Nav Box*/}\n
\n \n {/*Mobile Navigation Toggler*/}\n
\n \n ![\"\"]({this.pageImage(\"icon-bar.png\")})
\n
\n {/* Main Menu */}\n \n {/* Main Menu End*/}\n \n \n \n
\n )}\n {/* End Sticky Menu */}\n {/* Mobile Menu */}\n \n
\n \n
\n \n \n {/* Main Menu */}\n \n {/* Main Menu End*/}\n {/* Main Menu End*/}\n \n \n \n
\n \n \n
\n {/* End Mobile Menu */}\n \n \n
\n \n \n \n \n
\n \n \n
\n Catchy Phrase Title
\n\n Lorem ipsum dolor sit amet, consectetur adipiscing elit.\n Praesent scelerisque tempus molestie
Proin molestie\n velit vitae tincidunt cursus. Fusce non sagittis sem.{\" \"}\n
\n Proin molestie\n velit vitae tincidunt cursus. Fusce non sagittis sem.{\" \"}\n
\n \n Lorem ipsum dolor sit amet, consectetur
\n ipsum dolor consectetur adipiscing
\n sit amet, consectetur elit.\n \n }\n />\n\n\n Lorem ipsum dolor sit amet, consectetur
\n ipsum dolor consectetur adipiscing
\n sit amet, consectetur elit.\n \n }\n />\n\n\n Lorem ipsum dolor sit amet, consectetur
\n ipsum dolor consectetur adipiscing
\n sit amet, consectetur elit.\n \n }\n />\n
\n \n ipsum dolor consectetur adipiscing
\n sit amet, consectetur elit.\n \n }\n />\n\n
\n ipsum dolor consectetur adipiscing
\n sit amet, consectetur elit.\n \n }\n />\n\n
\n ipsum dolor consectetur adipiscing
\n sit amet, consectetur elit.\n \n }\n />\n
\n
\n \n \n {/* CTA Section */}\n \n
\n \n
\n \n \n Second Major Section
\n
\n \n Second Major Section
Header Text\n
\n \n Nunc a elit vel ex elementum fermentum. Curabitur vel\n vestibulum lectus, quis efficitur tellus. Etiam blandit in\n nisl at gravida. Donec tempus tincidunt purus ac placerat.\n Orci varius natoque penatibus et magnis dis parturient\n montes, nascetur ridiculus mus. In tristique lectus quis\n dolor accumsan maximus. Mauris accumsan est metus,\n tincidunt tincidunt lorem placerat eget. Aenean eget\n libero vulputate, vulputate mi vitae, ornare justo. Donec\n nec vestibulum nisl\n
\n \n
\n \n
\n \n \n Point
\n
\n \n \n
\n \n Point
one\n
\n \n
\n \n \n Second
\n
\n \n \n
\n \n Second
item\n
\n \n
\n \n \n Item
\n
\n \n \n
\n \n Item
Three\n
\n \n
\n \n \n Final
\n
\n \n \n
\n \n Final
Item\n
\n \n \n ![\"\"]({this.pageImage(\"cow.png\")})
\n
\n \n \n
\n \n {/* Services Section */}\n \n
\n Major Section Three Header
\n\n Duis lobortis euismod viverra. Duis eu scelerisque sem, sed\n facilisis erat. Orci varius natoque penatibus et magnis dis\n parturient montes, nascetur ridiculus mus. In dictum maximus\n erat a vestibulum. Donec turpis nunc, viverra sed elit et,\n pharetra finibus elit. Aenean et scelerisque purus, ac\n consectetur lacus.\n
\n \n
\n \n
\n Major Section 4 Header
\n\n Sed ut perspiciatis unde omnis iste natus error sit voluptatem\n accusantium doloremque laudantium, totam rem aperiam, eaque{\" \"}\n
ipsa quae ab illo inventore veritatis et quasi\n architecto beatae.\n
\n ipsa quae ab illo inventore veritatis et quasi\n architecto beatae.\n
\n
\n \n \n
\n Item One
\n\n Proin tempor aliquam accumsan
\n Donec ultricies, erat tristique\n
\n \n Donec ultricies, erat tristique\n
\n \n
\n Item 2
\n\n Proin tempor aliquam accumsan
\n Donec ultricies, erat tristique\n
\n \n Donec ultricies, erat tristique\n
\n \n
\n \n Third item
\n\n Proin tempor aliquam accumsan
\n Donec ultricies, erat tristique\n
\n \n Donec ultricies, erat tristique\n
\n \n
\n \n \n 4th Item
\n\n Proin tempor aliquam accumsan
\n Donec ultricies, erat tristique\n
\n \n Donec ultricies, erat tristique\n
\n \n Action Button\n \n
\n \n \n {/* Features Section */}\n \n ![\"\"]({this.pageImage(\"sketch-1.jpg\")})
\n
\n \n \n ![\"\"](\"assets/images/resource/sketch-2.jpg\")
\n
\n \n \n
\n \n
\n \n
\n \n
\n \n \n ![\"\"]({this.pageImage(\"vet1.jpg\")})
\n
\n \n \n
\n \n \n Subitem One
\n
\n \n Subitem One
Section 5\n
\n \n Duis in accumsan tortor. In commodo felis ut sapien\n condimentum egestas. Fusce massa diam, pretium sed\n tempus id, malesuada et massa. Praesent ac lobortis\n odio. Nulla ut eros vehicula, bibendum sapien dictum,\n feugiat odio. Integer sit amet metus mattis.\n
\n \n
\n \n \n \n
\n \n
\n \n \n ![\"\"]({this.pageImage(\"vet2.jpg\")})
\n
\n \n \n
\n \n \n Subitem two
\n
\n \n Subitem two
\n Section 5\n
\n \n Duis in accumsan tortor. In commodo felis ut sapien\n condimentum egestas. Fusce massa diam, pretium sed\n tempus id, malesuada et massa. Praesent ac lobortis\n odio. Nulla ut eros vehicula, bibendum sapien dictum,\n feugiat odio. Integer sit amet metus mattis.\n
\n \n
\n \n
\n 6th Major Section
\n\n Mauris tempor at augue pellentesque faucibus. Pellentesque\n lacinia varius felis,
\n eget tincidunt felis imperdiet non. Nullam efficitur semper\n dolor, id condimentum mi.\n
Proin non sagittis nunc. Sed laoreet, tortor eu feugiat\n sodales, arcu neque sagittis dolor, interdum scelerisque augue\n
\n erat vitae tellus. Nam quis magna enim. Suspendisse potenti.\n
\n \n eget tincidunt felis imperdiet non. Nullam efficitur semper\n dolor, id condimentum mi.\n
Proin non sagittis nunc. Sed laoreet, tortor eu feugiat\n sodales, arcu neque sagittis dolor, interdum scelerisque augue\n
\n erat vitae tellus. Nam quis magna enim. Suspendisse potenti.\n
\n \n
\n \n ![\"\"](\"assets/images/resource/team-1.jpg\")
\n ![\"\"](\"assets/images/resource/team-2.jpg\")
\n \n \n \n
\n \n \n \n \n \n ![\"\"](\"assets/images/resource/team-3.jpg\")
\n \n
\n Merry Desulva
\nField Farmer
\n ![\"\"](\"assets/images/resource/team-4.jpg\")
\n \n {/*Widgets Section*/}\n
\n {/* Footer Bottom */}\n \n
\n \n {/*Column*/}\n
\n \n
\n {/*Column*/}\n \n
\n \n \n
\n \n Company contact information
\n Street address, Country.\n
\n \n Street address, Country.\n
Call Us: +234 803 192839
\n\n
\n {/*Column*/}\n \n \n Quick Links\n \n
\n \n
\n \n \n
\n \n
\n - \n
- \n Verify Certificate\n \n
- \n Contact us\n \n
- \n FAQ\n \n
\n
\n \n \n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Logo from \"../../Logo\";\nimport Spinner from \"../../Utils/Spinner\";\nimport APICall from \"../../Utils/APICall\";\nimport \"react-phone-input-2/lib/material.css\";\nimport \"../../sass/react-phone.scss\";\nimport Constants from \"../../Utils/Constants\";\nimport PublicWithTopStripBackground from \"../../Components/Layouts/PublicWithTopStripBackground\";\nimport { DataContext } from \"../../Contexts/DataContexts\";\nimport Select from \"react-select\";\nimport { CountryAndRegions } from \"../../Utils/CountryAndRegions\";\n\n\nexport default class RegisterCompleteSupplier extends Component {\n constructor(props) {\n super(props);\n this.state = {\n payload: {},\n errorMessage: null,\n loading: false,\n redirectUrl: null,\n states: [],\n };\n }\n\n componentDidMount() {\n localStorage.clear();\n sessionStorage.clear();\n if (!this.props.match.params.registrationCode) {\n window.location.href = \"/register\";\n }\n }\n\n\n static contextType = DataContext;\n componentDidUpdate(prevProps, prevState) {\n if (prevState.country !== this.state.payload?.country) {\n const countryName = this.state.payload?.country;\n const states = this.getSubdivisionsByCountry(countryName);\n if (states !== this.state.states) {\n this.setState({ states: states });\n }\n }\n }\n\n getSubdivisionsByCountry(countryName) {\n const country = CountryAndRegions.find(item => item.label === countryName);\n if (country) {\n return country.subdivisions;\n } else {\n return [];\n }\n }\n\n\n updateProp(e, prop, value) {\n var record = this.state.payload;\n record[prop] = value ? value : e.target.value;\n this.setState({ payload: record });\n }\n\n\n updatePayload(value, index) {\n let payload = this.state.payload;\n payload[index] = value;\n this.setState({ payload: payload });\n }\n\n sendToServer() {\n let payload = this.state.payload;\n payload.role = \"distributor\";\n APICall(\n `api/users/register/complete/${this.props.match.params.registrationCode}`,\n \"POST\",\n payload\n )\n .then((data) => {\n if (data.data.isSuccess) {\n this.setState({\n redirectUrl: \"/registration-successful/\" + data.data.data,\n });\n } else {\n this.setState({ errorMessage: data.data.message, loading: false });\n }\n })\n .catch((error) => {\n this.setState({\n errorMessage: \"An error occurred, please check your network\",\n loading: false,\n });\n });\n }\n\n submit() {\n if (\n !this.state.payload.contactName ||\n this.state.payload.contactName.trim() == \"\"\n ) {\n this.setState({ errorMessage: \"Enter your full name\" });\n return;\n }\n\n if (!this.state.payload.email || this.state.payload.email.trim() == \"\") {\n this.setState({ errorMessage: \"Enter your email address\" });\n return;\n }\n\n this.setState({ errorMessage: null, loading: true }, () => {\n this.sendToServer();\n });\n }\n\n render() {\n return this.state.redirectUrl ? (\n \n
\n \n
\n \n
\n © Copyright 2021.
\n \n \n
\n \n Supplier Registration:{\" \"}\n Final step\n
\n\n Tell us a little more about you and your company.\n
\n \n \n \n }\n />\n );\n }\n}\n","import React, { Component } from \"react\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Logo from \"../../Logo\";\nimport APICall from \"../../Utils/APICall\";\nimport SpinnerButton from \"../../Utils/SpinnerButton\";\nimport Constants from \"../../Utils/Constants\";\nimport Select from \"react-select\";\nimport AddAppScripts from \"../../Components/Layouts/AddAppScripts\";\nimport { DataContext } from \"../../Contexts/DataContexts\";\n\nexport default class VetCheckin extends Component {\n constructor(props) {\n super(props);\n this.state = {\n newRecord: {},\n errorMessage: null,\n loading: false,\n currentCheckin: {},\n abattoirs: [],\n };\n\n this.submit = this.submit.bind(this);\n }\n\n static contextType = DataContext;\n\n componentDidMount() {\n const { globalState, addItem } = this.context;\n this.setState({ profile: globalState?.data })\n const { state, country } = globalState?.user\n this.listAbattoirs(state, country);\n this.getLastCheckin();\n }\n\n\n listAbattoirs(state, country) {\n APICall(`api/abattoirs/get/${country}/${state}`, \"get\")\n .then((data) => {\n if (data.data.isSuccess) {\n let response = data.data;\n response.data.forEach((element) => {\n element.label = element.name;\n element.value = element.id;\n });\n\n this.setState({ abattoirs: response.data });\n }\n })\n .catch((error) => {\n console.log(error);\n });\n }\n\n getLastCheckin() {\n APICall(\"api/vets/lastcheckin\", \"get\")\n .then((data) => {\n if (data.data.isSuccess) {\n let response = data.data;\n if (response.data) {\n response.data.label = response.data.name;\n response.data.value = response.data.id;\n this.setState({ currentCheckin: response.data });\n }\n }\n })\n .catch((error) => {\n console.log(error);\n });\n }\n\n handleChange(abattoir) {\n this.setState({ currentCheckin: abattoir });\n }\n submit() {\n if (!this.state.currentCheckin || !this.state.currentCheckin.id) {\n this.setState({\n errorMessage: \"Please choose an abattoir to check into\",\n });\n return;\n }\n\n this.setState({ errorMessage: null, loading: true });\n\n APICall(`api/vets/checkinto/${this.state.currentCheckin.id}`, \"POST\", {})\n .then((data) => {\n if (data.data.isSuccess) {\n this.setState({ redirectUrl: \"/in/home\" });\n } else {\n this.setState({ errorMessage: data.data.message, loading: false });\n }\n })\n .catch((error) => {\n this.setState({\n errorMessage: \"An error occurred, please check your network\",\n loading: false,\n });\n });\n }\n\n render() {\n return this.state.redirectUrl ? (\n\n
\n \n {/* content-wrapper ends */}\n \n );\n }\n}\n","import React, { Component, useEffect, useState } from \"react\";\nimport { Link } from \"react-router-dom\";\nimport APICall from \"../../Utils/APICall\";\nimport DataAPI from \"../../Utils/DataAPI\";\n\nexport default function DiseaseList({ diseaseList, tagNumber }) {\n const [diseaseReports, setDiseaseReports] = useState([]);\n\n const loadDiseaseList = () => {\n APICall(`api/diseasereports/get/${tagNumber}`, \"GET\")\n .then((data) => {\n const response = data.data;\n if (response.isSuccess) {\n setDiseaseReports(response.data);\n } else {\n setDiseaseReports([]);\n }\n })\n .catch((error) => {});\n };\n\n useEffect(() => {\n if (diseaseList) {\n setDiseaseReports(diseaseList);\n } else {\n loadDiseaseList();\n }\n }, []);\n\n const DataDisplay = ({ label, data }) => {\n return (\n \n
\n \n \n
\n \n
\n \n Check into an abattoir\n
\n\n \n\n
\n );\n };\n\n return (\n \n \n {label}\n \n
\n {data}
\n\n
\n );\n}\n","import React, { Component } from \"react\";\nimport Tabs from \"../../Utils/Tabs\";\nimport CenterBlock from \"../CenterBlock\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Constants from \"../../Utils/Constants\";\nimport APICall from \"../../Utils/APICall\";\nimport Spinner from \"../../Utils/Spinner\";\nimport SpinnerButton from \"../../Utils/SpinnerButton\";\nimport Toastr from \"../../Utils/Toastr\";\nimport Modal from \"react-modal\";\nimport Select from \"react-select\";\nimport Functions from \"../../Utils/Functions\";\nimport { DataContext } from \"../../Contexts/DataContexts\";\nimport DataAPI from \"../../Utils/DataAPI\";\nimport CardBlock from \"../CardBlock\";\n\nexport default class NewDiseaseReport extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: true,\n data: null,\n errorMessage: null,\n redirectUrl: null,\n payload: {\n tagNumber: this.props.tagNumber,\n },\n species: [],\n organs: [],\n pathologicalDiagnosis: [],\n diseases: [],\n secondConfirmation: null,\n saveLoading: false,\n animal: null,\n validateLoading: false,\n };\n\n this.formControl = this.formControl.bind(this);\n }\n\n static contextType = DataContext;\n\n async componentDidMount() {\n this.init();\n Modal.setAppElement(\"body\");\n if (this.props.tagNumber) {\n await this.validateTagNumber();\n }\n }\n\n async validateTagNumber() {\n this.setState({ validateLoading: true });\n let tagNumber = this.props.tagNumber\n ? this.props.tagNumber\n : this.state.payload?.tagNumber;\n let animal = await DataAPI.findAnimal(tagNumber);\n if (animal) {\n this.setState({ animal: animal });\n this.updateSpecie(animal.specie);\n } else {\n Toastr(\"error\", \"Invalid animal tag number\");\n }\n this.setState({ validateLoading: false });\n }\n\n async init() {\n let configuration = await DataAPI.diseaseReportingConfiguration();\n this.setState(\n {\n configuration: configuration,\n loading: false,\n initError: configuration ? false : true,\n },\n () => {\n if (this.state.configuration) {\n const species = [];\n this.state.configuration.species.forEach((element) => {\n species.push({ label: element, value: element });\n });\n\n this.setState({ species: species });\n }\n }\n );\n }\n\n condemnationOptions = [\n { label: \"Partial\", value: \"Partial\" },\n { label: \"Full\", value: \"Full\" },\n { label: \"Inconsequential\", value: \"Inconsequential\" },\n ];\n\n saveReport() {\n let payload = this.state.payload;\n\n this.setState({ saveLoading: true, errorMessage: null });\n APICall(\"api/diseasereports/add\", \"post\", payload)\n .then((data) => {\n if (data.data.isSuccess) {\n Toastr(\"success\", \"Report saved\");\n if (this.props.returnAction) {\n this.props.returnAction();\n } else {\n this.setState({\n redirectUrl: \"/in/new-disease-report-success\",\n });\n }\n } else {\n this.setState({\n saveLoading: false,\n errorMessage: data.data.message,\n });\n }\n })\n .catch((error) => {\n console.log(error);\n this.setState({\n saveLoading: false,\n errorMessage: \"Check your network connection\",\n });\n });\n }\n\n updateFile(e) {\n var file = e.target.files[0];\n var reader = new FileReader();\n reader.onloadend = () => {\n this.updateProp(reader.result, \"base64File\");\n };\n reader.readAsDataURL(file);\n }\n\n updateSpecie(value) {\n this.updateProp(value, \"animalSpecie\");\n let organs = this.state.configuration.organs.filter((a) => {\n return a.specie.toLowerCase() == value.toLowerCase();\n });\n\n if (organs && organs.length > 0) {\n organs.forEach((element) => {\n element.value = element.organ;\n element.label = element.organ;\n });\n }\n this.setState({ organs: organs });\n\n let diseases = this.state.configuration.diseases.filter((a) => {\n return a.specie.toLowerCase() == value.toLowerCase();\n });\n\n if (diseases && diseases.length > 0) {\n diseases.forEach((element) => {\n element.value = element.disease;\n element.label = element.disease;\n });\n }\n this.setState({ diseases: diseases });\n }\n\n updateOrgan(organ) {\n this.updateProp(organ.value, \"organ\");\n const pathologicalDiagnosis = [];\n if (organ.pathologicalDiagnosis && organ.pathologicalDiagnosis.length > 0) {\n organ.pathologicalDiagnosis.forEach((element) => {\n pathologicalDiagnosis.push({ label: element, value: element });\n });\n }\n\n this.setState({ pathologicalDiagnosis: pathologicalDiagnosis });\n }\n\n updateDisease(disease) {\n this.updateProp(disease.value, \"diseaseSuspected\");\n if (disease.confirmation && disease.confirmation.trim() != \"\") {\n this.setState({\n secondConfirmation: {\n label: disease.confirmationLabel,\n notes: disease.confirmation,\n },\n });\n } else {\n this.setState({ secondConfirmation: null });\n }\n }\n\n updateProp(value, prop) {\n let payload = this.state.payload;\n if (!payload) payload = {};\n payload[prop] = value;\n this.setState({ payload: payload });\n }\n\n formGroupRow({ colClass, children }) {\n return (\n \n {diseaseReports.length} report(s) found for this animal\n
\n {diseaseReports.map((report, index) => (\n \n
\n
\n ))}\n \n
\n \n \n {report.organ}{\" \"}\n /\n Condemnation:{\" \"}\n
\n
\n \n {report.organ}{\" \"}\n /\n Condemnation:{\" \"}\n \n {report.condemnation}\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n \n
\n
\n );\n }\n\n formControl({ label, prop, inputType, required }) {\n if (!inputType) inputType = \"text\";\n let payload = this.state.payload;\n if (!payload) payload = {};\n\n return (\n <>\n \n {children}
\n \n \n
\n\n Only Vets with VCN Registration Number can fill disease reporting\n
\n \n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport MainLayout from \"../../Components/Layouts/MainLayout\";\nimport CardBlock from \"../../Components/CardBlock\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Constants from \"../../Utils/Constants\";\nimport APICall from \"../../Utils/APICall\";\nimport Spinner from \"../../Utils/Spinner\";\nimport SpinnerButton from \"../../Utils/SpinnerButton\";\nimport Toastr from \"../../Utils/Toastr\";\nimport Modal from \"react-modal\";\nimport Select from \"react-select\";\nimport DataAPI from \"../../Utils/DataAPI\";\nimport Functions from \"../../Utils/Functions\";\nimport DiseaseList from \"../../Components/DiseaseReporting/DiseaseList\";\nimport NewDiseaseReport from \"../../Components/DiseaseReporting/NewDiseaseReport\";\n\nexport default class IssueCertificate extends Component {\n constructor(props) {\n super(props);\n this.state = {\n diseaseListLoading: false,\n loading: false,\n data: null,\n errorMessage: null,\n step: 1,\n currentCheckin: {},\n distributors: [],\n redirectUrl: null,\n payload: {},\n investors: [],\n validateLoading: false,\n animal: null,\n modalIsOpen: false,\n destinations: [],\n };\n\n this.formControl = this.formControl.bind(this);\n this.resetDiseaseList = this.resetDiseaseList.bind(this);\n }\n\n componentDidMount() {\n this.getLastCheckin();\n Modal.setAppElement(\"body\");\n }\n\n async validateTagNumber() {\n this.setState({ validateLoading: true, animal: null });\n let animal = await DataAPI.findAnimal(this.state.payload?.tagNumber);\n if (animal) {\n this.setState({ animal: animal });\n this.updateProp(animal.specie, \"animalSpecie\");\n this.updateProp(\n this.state.payload.tagNumber.toUpperCase(),\n \"identificationMark\"\n );\n } else {\n Toastr(\"error\", \"Invalid animal tag number\");\n }\n this.setState({ validateLoading: false });\n }\n\n addDestination = () => {\n let destinations = this.state.destinations;\n if (!destinations) destinations = [];\n\n if (this.state.newDestination && this.state.newDestination.trim()) {\n if (\n destinations.find(\n (a) =>\n a.toLowerCase() == this.state.newDestination.trim().toLowerCase()\n )\n ) {\n return;\n }\n destinations.push(this.state.newDestination.trim());\n this.setState({ destinations: destinations, newDestination: \"\" });\n }\n };\n\n removeDestination = (destination) => {\n let _destinations = this.state.destinations.filter((a) => a != destination);\n this.setState({ destinations: _destinations });\n };\n\n advanceStep1 = async () => {\n if (\n !this.state.payload?.animalSpecie ||\n !this.state.payload?.beefWeightInKg\n ) {\n Toastr(\"error\", \"Some required fields are not filled\");\n return;\n }\n\n if (await this.checkWeight()) {\n this.setState({ step: 2 });\n }\n };\n\n getLastCheckin() {\n APICall(\"api/vets/lastcheckin\", \"get\")\n .then((data) => {\n if (data.data.isSuccess) {\n let response = data.data;\n if (response.data) {\n this.setState({ currentCheckin: response.data }, () => {\n //investors are tied to abattoirs\n this.getInvestors();\n });\n }\n }\n })\n .catch((error) => {\n console.log(error);\n });\n }\n\n checkWeight = async () => {\n if (!this.state.animal?.tagNumber || !this.state.payload?.beefWeightInKg) {\n Toastr(\"error\", \"Check that form is properly filled\");\n return false;\n }\n\n let weightOk = false;\n await APICall(\n `api/certificates/checkweight/${this.state.animal.tagNumber}/${this.state.payload.beefWeightInKg}`,\n \"post\"\n )\n .then((data) => {\n if (data.data.isSuccess) {\n weightOk = true;\n } else {\n Toastr(\"error\", data.data.message);\n }\n })\n .catch((error) => {\n Toastr(\"error\", \"Unable to continue, check your network\");\n });\n\n return weightOk;\n };\n\n getInvestors() {\n APICall(\n `api/abattoirs/listInvestors/${this.state.currentCheckin.id}`,\n \"get\"\n )\n .then((data) => {\n if (data.data.isSuccess) {\n let response = data.data;\n if (response.data) {\n response.data.forEach((element) => {\n element.value = element.id;\n element.label = element.investorName;\n });\n this.setState({ investors: response.data });\n }\n }\n })\n .catch((error) => {\n console.log(error);\n });\n }\n\n issueCertificate() {\n if (!this.state.destinations || this.state.destinations.length <= 0) {\n this.setState({\n loading: false,\n errorMessage: \"Add at least one destination\",\n });\n return;\n }\n let payload = this.state.payload;\n payload.destinations = this.state.destinations;\n payload.abattoirId = this.state.currentCheckin.id;\n payload.numberOfParts = parseInt(payload.numberOfParts) || 1;\n payload.beefWeightInKg = parseFloat(payload.beefWeightInKg);\n\n if (payload.paymentChannel?.toLowerCase() == \"card\") {\n payload.receiptNumber = \"\";\n }\n\n this.setState({ loading: true, errorMessage: null });\n APICall(\"api/certificates/issue\", \"post\", payload)\n .then((data) => {\n if (data.data.isSuccess) {\n Toastr(\"success\", \"Certificate issued successfully\");\n this.setState({\n redirectUrl: \"/in/new-certificate-success/\" + data.data.data.code,\n });\n } else {\n this.setState({ loading: false, errorMessage: data.data.message });\n }\n })\n .catch((error) => {\n console.log(error);\n this.setState({\n loading: false,\n errorMessage: \"Check your network connection\",\n });\n });\n }\n\n modalStyle = {\n content: {\n top: \"50%\",\n left: \"50%\",\n right: \"auto\",\n bottom: \"auto\",\n marginRight: \"-50%\",\n transform: \"translate(-50%, -50%)\",\n overflow: \"visible\",\n },\n };\n\n updateProp(value, prop) {\n let payload = this.state.payload;\n if (!payload) payload = {};\n payload[prop] = value;\n this.setState({ payload: payload });\n }\n\n handleChange(option) {\n let payload = this.state.payload;\n if (!payload) payload = {};\n payload.distributorId = option.id;\n this.setState({ payload: payload });\n }\n\n formGroupRow({ colClass, children, extraChildren }) {\n return (\n \n {this.state.loading ? (\n \n this.init()}\n className=\"btn btn-inverse-light btn-fw mt-4 mb-5 btn-rounded\"\n >\n Reload\n \n \n ) : null}\n {this.state.loading || this.state.initError ? null : !this.context\n .globalState.user.vcnRegistrationNumber ? (\n \n \n )}\n
\n \n \n
\n\n An error occurred, you can try reloading the page\n
\n \n
\n \n \n
\n \n
\n );\n }\n\n formControl({ label, prop, inputType, required }) {\n if (!inputType) inputType = \"text\";\n let payload = this.state.payload;\n if (!payload) payload = {};\n\n return (\n <>\n \n {children}
\n {extraChildren && {extraChildren}
}\n \n {label}\n
\n {this.state.animal[prop]}\n
\n \n \n );\n };\n\n animalDisplay = () => {\n return (\n
\n
\n );\n };\n\n render() {\n return this.state.redirectUrl ? (\n \n {this.singleAnimalItem({ label: \"Specie\", prop: \"specie\" })}\n
\n \n {this.singleAnimalItem({ label: \"Sub-specie\", prop: \"subSpecie\" })}\n
\n \n {this.singleAnimalItem({ label: \"Colour\", prop: \"color\" })}\n
\n \n {this.singleAnimalItem({ label: \"Weight (kg)\", prop: \"weight\" })}\n
\n \n {this.singleAnimalItem({\n label: \"Animal Owner\",\n prop: \"animalOwner\",\n })}\n
\n \n {this.singleAnimalItem({\n label: \"State of origin\",\n prop: \"stateOfOrigin\",\n })}\n
\n \n {this.singleAnimalItem({\n label: \"Vet's Observations\",\n prop: \"vetObservations\",\n })}\n
\n \n \n \n )}\n {this.state.step == 3 && (\n \n
\n \n )}\n \n \n \n {this.state.step == 1 && (\n \n
\n \n )}\n {this.state.step == 2 && (\n \n
\n \n
\n ) : null}\n\n \n \n
\n \n )}\n \n \n this.advanceStep1()}\n className=\"btn btn-success mr-2 btn-block btn-rounded\"\n label=\"Continue\"\n />\n
\n \n
\n \n \n
\n \n
\n \n
\n ) : null}\n\n \n
\n \n \n
\n \n
\n \n this.setState({ step: 1 })}\n className=\"btn btn-link\"\n >\n {\"< \"} Back\n \n
\n \n this.issueCertificate()}\n className=\"btn btn-success btn-rounded\"\n label=\"Issue Certificate\"\n loading={this.state.loading}\n />\n
\n \n this.setState({ modalIsOpen: false })}\n >\n \n this.loadData()}\n className=\"btn btn-inverse-success btn-fw mt-4 mb-5 btn-rounded\"\n >\n Reload\n \n \n ) : !this.state.data || this.state.data.isExpired ? (\n
\n );\n }\n}\n","import React, { Component } from \"react\";\nimport MainLayout from \"../../Components/Layouts/MainLayout\";\nimport CardSetup from \"../../Components/CardSetup\";\n\nexport default class CardSetupPage extends Component {\n constructor(props) {\n super(props);\n this.state = {};\n }\n\n componentDidMount() {}\n\n render() {\n return (\n \n
\n \n
\n \n {this.state.errorMessage ? (\n Confirm card change
\n\n \n
\n \n
\n\n An error occurred.
\n Try again after sometime.{\" \"}\n
\n \n Try again after sometime.{\" \"}\n
\n this.addCard()}\n />\n ) : null}\n
\n ) : this.state.data ? (\n <>\n \n {this.props.userId == 0 ? (\n <>\n
\n {this.state.data?.isExpired\n ? \"The card you added has expired.\"\n : \"You do not have any debit or credit card on file.\"}{\" \"}\n
A valid debit/credit card is required before you can be\n issued certificates
\n for your purchases at the abattoir.\n \n ) : (\n <>User does not have any debit or credit card setup\n )}{\" \"}\n
\n {this.props.userId == 0 ? (\n \n {this.state.data?.isExpired\n ? \"The card you added has expired.\"\n : \"You do not have any debit or credit card on file.\"}{\" \"}\n
A valid debit/credit card is required before you can be\n issued certificates
\n for your purchases at the abattoir.\n \n ) : (\n <>User does not have any debit or credit card setup\n )}{\" \"}\n
\n
\n this.setState({ modalIsOpen: true })}\n >\n Change Card\n \n
\n \n ) : null}\n \n We have your card on file. For ease, this card will be\n automatically
\n charged for meat purchase certificate fees.\n
\n
\n
\n \n
\n \n
\n \n
\n \n
\n
\n \n \n
\n\n
Certificate issued successfully
\n\n Certificate number: \n \n {this.props.match.params.certificateCode}\n \n
\n\n \n Issue another certificate\n \n\n \n Download Certificate\n \n
\n \n
\n \n );\n\n this.setState({ pdfDocument: pdfRenderer }, () => { });\n }\n\n componentDidMount() {\n this.init();\n Modal.setAppElement(\"body\");\n }\n\n getSupplyHistory = async (certificate) => {\n this.setState({ selectedCertificate: certificate });\n let supplyLog = await DataAPI.listSupplyLog(certificate.code);\n if (supplyLog) {\n supplyLog = supplyLog.filter((a) => a.accepted);\n this.setState({ supplyLog: supplyLog });\n }\n };\n\n RenderTable(_data) {\n if (!_data) return null;\n console.log(_data);\n\n const headerList = [\n {\n Header: \"Certificate Code\",\n accessor: \"codeComponent\",\n },\n {\n Header: \"Supplier\",\n accessor: \"supplierComponent\",\n },\n {\n Header: \"Supply Date\",\n accessor: \"dateComponent\",\n },\n {\n Header: \"Net Weight\",\n accessor: \"beefWeightInKg\",\n },\n {\n Header: \"\",\n accessor: \"supplyLogComponent\",\n },\n ];\n\n const tableHeader = React.useMemo(() => headerList, []);\n\n _data._data.forEach((element) => {\n element.dateComponent = Functions.toReadableDate(element.timeIssued);\n // element.amountComponent = Functions.currencyFormat(element.amountPaid);\n element.supplierComponent = element.distributor.companyName;\n element.codeComponent = (\n \n \n this.init(page, pageSize, query)\n }\n enableSearch={true}\n />\n
\n );\n }\n\n RenderSupplyLogTable(_data) {\n if (!_data) return null;\n console.log(\"_dataaaa\", _data);\n\n const headerList = [\n {\n Header: \"Retail Outlet\",\n accessor: \"outletComponent\",\n },\n {\n Header: \"Supply Code\",\n accessor: \"supplyCode\",\n },\n {\n Header: \"Date Issued\",\n accessor: \"dateComponent\",\n },\n {\n Header: \"Weight Supplied (kg)\",\n accessor: \"weight\",\n },\n ];\n\n const tableHeader = headerList;\n\n _data.forEach((element) => {\n element.dateComponent = Functions.toReadableDate(element.dateSupplied);\n element.outletComponent = element.retailer.name;\n });\n\n const tableData = _data;\n return (\n \n
\n );\n }\n\n quickReload() {\n this.init(this.state.page, this.state.pageSize, this.state.searchQuery);\n }\n\n init(page, pageSize, query) {\n if (!query) query = \"\";\n\n this.setState({\n errorMessage: null,\n loading: true,\n searchQuery: query,\n page: page,\n pageSize: pageSize,\n });\n\n const issuedBy = this.props.issuedBy ? this.props.issuedBy : 0;\n const issuedTo = this.props.issuedTo ? this.props.issuedTo : 0;\n const dateFrom = Functions.sqlDateString(this.state.fromDate);\n const dateTo = Functions.sqlDateString(this.state.toDate);\n if (!page) page = 1;\n if (!pageSize) pageSize = 10;\n\n APICall(\n `api/certificates/list/${issuedBy}/${issuedTo}/${dateFrom}/${dateTo}/${page}/${pageSize}?search=${query}`,\n \"GET\",\n {}\n )\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState({ loading: false, data: null }, () => {\n this.setState({ data: response.data });\n });\n } else {\n this.setState({\n errorMessage:\n \"Your request generated an error. Try again after sometime\",\n loading: false,\n });\n }\n console.log(data);\n })\n .catch((error) => {\n this.setState({\n errorMessage:\n \"Your request generated an error. Please check your network connection\",\n loading: false,\n });\n });\n }\n\n render() {\n return this.state.redirect ? (\n \n \n
\n\n An error occurred, you can try reloading the page\n
\n \n
\n ) : null}\n\n {this.state.supplyLog && (\n \n No supply logs available\n
\n \n ) : (\n <>\nCertificate number:
\n\n {this.state.supplyLog[0].certificateCode}\n
\n\nSupplier:
\n\n {this.state.supplyLog[0].supplierCompany.companyName}\n
\n\n {this.RenderSupplyLogTable(this.state.supplyLog)}\n\n
\n
\n \n )}\n \n )}\n\n \n
\n Consignment total:
\n\n {this.state.selectedCertificate.beefWeightInKg}\n kg\n
\n\n
\n Total supplied:
\n\n {this.state.supplyLog.reduce((sum, current) => {\n return sum + current.weight;\n }, 0)}\n kg\n
\n\n
\n \n
\n \n \n \n this.setState({ fromDate: date }, () => {\n this.quickReload();\n })\n }\n className=\"my-custom-datepicker-component\"\n />\n
\n \n \n -\n \n \n
\n \n \n \n this.setState({ toDate: date }, () => {\n this.quickReload();\n })\n }\n className=\"my-custom-datepicker-component\"\n />\n
\n \n\n {!this.state.data ? null :
\n
\n \n \n \n
\n \n
\n \n {this.state.loading ? (\n \n \n )}\n
\n \n
\n \n {this.state.loading ? (\n \n \n )}\n
\n \n setDropdownVisible(!dropdownVisible)}\n >\n {label}\n \n \n {linksArray.map((link, index) => (\n \n {linkLabelsArray[index]}\n \n ))}\n
\n \n );\n}\n","import React, { Component } from \"react\";\nimport CenterBlock from \"./CenterBlock\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport APICall from \"../Utils/APICall\";\nimport Spinner from \"../Utils/Spinner\";\nimport MyTable from \"../Utils/MyTable\";\nimport Modal from \"react-modal\";\nimport { throttle } from \"lodash\";\nimport DropdownLinkMenu from \"./DropdownLinkMenu\";\nimport { DataContext } from \"../Contexts/DataContexts\";\n\nexport default class VetsList extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: true,\n data: [],\n errorMessage: null,\n searchQuery: \"\",\n page: 1,\n pageSize: 10,\n modalIsOpen: false,\n uploadErrorMessage: null,\n uploading: false,\n redirect: null,\n user: {},\n alreadyGotResults: false,\n };\n\n this.RenderTable = this.RenderTable.bind(this);\n this.init = this.init.bind(this);\n\n this.throttledReload = throttle(() => {\n this.init(this.state.page, this.state.pageSize, this.state.searchQuery);\n }, 500);\n }\n\n componentDidMount() {\n Modal.setAppElement(\"body\");\n this.init();\n // new Functions().whoIsLoggedIn(this.setLoggedInUser, false);\n }\n\n RenderTable(_data) {\n const { selectRecord } = this.props;\n\n const headerList = [\n {\n Header: \"\",\n accessor: \"actionsComponent\",\n },\n {\n Header: \"Name\",\n accessor: \"nameComponent\",\n },\n {\n Header: \"Phone number\",\n accessor: \"phoneNumber\",\n },\n {\n Header: \"Country\",\n accessor: \"country\",\n },\n {\n Header: \"State\",\n accessor: \"state\",\n },\n {\n Header: \"Email\",\n accessor: \"email\",\n },\n {\n Header: \"VCN Number\",\n accessor: \"vcnRegistrationNumber\",\n },\n ];\n\n _data._data.forEach((element) => {\n element.nameComponent = (\n selectRecord(element)}>\n {element.name}\n \n );\n element.actionsComponent = (\n \n
\n );\n }\n\n\n static contextType = DataContext;\n\n\n init(page, pageSize, query) {\n if (!query) query = \"\";\n\n this.setState({\n errorMessage: null,\n loading: true,\n searchQuery: query,\n page: page,\n pageSize: pageSize,\n });\n\n const { globalState, addItem } = this.context;\n this.setState({ profile: globalState?.data })\n const { state, country, userRole } = globalState?.user\n\n let apiURL = `api/vets/get/${country}/${state}`\n\n if (userRole == \"superadmin\") {\n apiURL = \"api/vets/list\"\n }\n\n\n // APICall(`api/vets/get/${country}/${state}`, \"GET\", {})\n // APICall(`api/vets/list`, \"GET\", {})\n APICall(`${apiURL}`, \"GET\", {})\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState({ loading: false, data: null }, () => {\n this.setState({ data: response.data });\n });\n } else {\n this.setState({\n errorMessage:\n \"Your request generated an error. Try again after sometime\",\n loading: false,\n });\n }\n console.log(data);\n })\n .catch((error) => {\n this.setState({\n errorMessage:\n \"Your request generated an error. Please check your network connection\",\n loading: false,\n });\n });\n }\n\n render() {\n return this.state.redirect ? (\n \n \n
\n\n An error occurred, you can try reloading the page\n
\n \n
\n ) : null}\n\n {!this.state.data ? null : \n
\n \n
\n );\n }\n\n updateRecordForm() {\n return (\n Add Veterinary Officer
\n\n \n
\n
\n \n
\n );\n }\n\n addRecord() {\n this.setState({ loading: true, saveErrorMessage: null });\n APICall(\"api/users/register/vet\", \"POST\", this.state.payload)\n .then((data) => {\n var response = data.data;\n this.setState({ loading: false });\n if (response.isSuccess) {\n Toastr(\"success\", \"New veterinary officer added\");\n this.setState({ modalIsOpen: false, payload: {} });\n } else {\n this.setState({ saveErrorMessage: response.message });\n }\n })\n .catch((error) => {\n this.setState({\n loading: false,\n saveErrorMessage: \"An error occurred, please check your network\",\n });\n });\n }\n\n updateRecord() {\n let payload = {\n id: this.state.selectedRecord.id,\n contactName: this.state.payload.contactName,\n email: this.state.payload.email,\n phoneNumber: this.state.payload.phoneNumber,\n };\n\n this.setState({ loading: true, saveErrorMessage: null });\n APICall(\"api/vets/update\", \"POST\", payload)\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n Toastr(\"success\", \"Record updated\");\n this.setState(\n { selectedRecord: null, payload: {}, loading: false },\n () => {}\n );\n } else {\n this.setState({ saveErrorMessage: response.message, loading: false });\n }\n })\n .catch((error) => {\n this.setState({\n loading: false,\n saveErrorMessage: \"An error occurred, please check your network\",\n });\n });\n }\n\n selectRecord(record) {\n if (this.context.globalState.user.userRole.includes(\"admin\")) {\n this.setState({ selectedRecord: record, payload: record });\n }\n }\n\n render() {\n return (\n <>\n Update Veterinary Officer
\n\n \n
\n
\n \n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport CardBlock from \"./CardBlock\";\nimport Tabs from \"../Utils/Tabs\";\nimport CenterBlock from \"./CenterBlock\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Constants from \"../Utils/Constants\";\nimport APICall from \"../Utils/APICall\";\nimport Spinner from \"../Utils/Spinner\";\nimport SpinnerButton from \"../Utils/SpinnerButton\";\nimport Toastr from \"../Utils/Toastr\";\nimport MyTable from \"../Utils/MyTable\";\nimport Dropzone from \"react-dropzone\";\nimport Modal from \"react-modal\";\nimport Functions from \"../Utils/Functions\";\nimport Select from \"react-select\";\nimport { throttle } from \"lodash\";\nimport { DataContext } from \"../Contexts/DataContexts\";\n\nexport default class DistributorsList extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: true,\n data: [],\n errorMessage: null,\n searchQuery: \"\",\n page: 1,\n pageSize: 10,\n modalIsOpen: false,\n uploadErrorMessage: null,\n uploading: false,\n redirect: null,\n user: {},\n alreadyGotResults: false,\n };\n\n this.RenderTable = this.RenderTable.bind(this);\n this.init = this.init.bind(this);\n\n this.throttledReload = throttle(() => {\n this.init(this.state.page, this.state.pageSize, this.state.searchQuery);\n }, 500);\n }\n\n componentDidMount() {\n Modal.setAppElement(\"body\");\n this.init();\n }\n\n RenderTable(_data) {\n var headerList = [\n {\n Header: \"Company Name\",\n accessor: \"companyName\",\n },\n {\n Header: \"Contact person\",\n accessor: \"contactPersonComponent\",\n },\n {\n Header: \"Country\",\n accessor: \"country\",\n },\n {\n Header: \"State\",\n accessor: \"state\",\n },\n {\n Header: \"Email\",\n accessor: \"emailComponent\",\n },\n {\n Header: \"Address\",\n accessor: \"companyAddress\",\n },\n ];\n\n _data._data.forEach((element) => {\n element.emailComponent = element.user?.email;\n element.contactPersonComponent = (\n <>\n {element.user?.name}\n \n \n \n\n {this.state.selectedRecord\n ? null\n : this.state.modalIsOpen || (\n this.selectRecord(record)}\n />\n )}\n \n
\n \n \n {element.user?.phoneNumber}\n \n );\n });\n\n const tableHeader = React.useMemo(() => headerList, []);\n\n const tableData = React.useMemo(() => _data, []);\n return (\n
\n
\n );\n }\n static contextType = DataContext;\n\n init(page, pageSize, query) {\n if (!query) query = \"\";\n\n this.setState({\n errorMessage: null,\n loading: true,\n searchQuery: query,\n page: page,\n pageSize: pageSize,\n });\n\n const { globalState } = this.context;\n const { state, country, userRole } = globalState?.user\n\n let apiURL = `api/distributors/get/${country}/${state}`\n\n if (userRole == \"superadmin\") {\n apiURL = \"api/distributors/list\"\n }\n\n // APICall(`api/distributors/get/${country}/${state}`, \"GET\", {})\n APICall(`${apiURL}`, \"GET\", {})\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState({ loading: false, data: null }, () => {\n this.setState({ data: response.data });\n });\n } else {\n this.setState({\n errorMessage:\n \"Your request generated an error. Try again after sometime\",\n loading: false,\n });\n }\n console.log(data);\n })\n .catch((error) => {\n this.setState({\n errorMessage:\n \"Your request generated an error. Please check your network connection\",\n loading: false,\n });\n });\n }\n\n render() {\n return this.state.redirect ? (\n \n \n
\n\n An error occurred, you can try reloading the page\n
\n \n
\n ) : null}\n\n {!this.state.data ? null : \n
\n \n \n \n {this.state.modalIsOpen || \n
\n \n
\n );\n }\n\n init(page, pageSize, query) {\n if (!query) query = \"\";\n\n this.setState({\n errorMessage: null,\n loading: true,\n searchQuery: query,\n page: page,\n pageSize: pageSize,\n });\n\n APICall(`api/abattoirs/listInvestors/${this.props.abattoirId}`, \"GET\", {})\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState({ loading: false, data: null }, () => {\n this.setState({ data: response.data });\n });\n } else {\n this.setState({\n errorMessage:\n \"Your request generated an error. Try again after sometime\",\n loading: false,\n });\n }\n console.log(data);\n })\n .catch((error) => {\n this.setState({\n errorMessage:\n \"Your request generated an error. Please check your network connection\",\n loading: false,\n });\n });\n }\n\n render() {\n return this.state.redirect ? (\n \n \n
\n\n An error occurred, you can try reloading the page\n
\n \n
\n ) : null}\n\n {!this.state.data ? null : \n \n Add Abattoir Investor to:\n
\n
\n \n
\n );\n }\n\n updateRecordForm() {\n return (\n \n Add Abattoir Investor to:\n
\n {this.state.abattoir.name}\n
\n \n \n
\n
\n \n
\n );\n }\n\n addRecord() {\n let payload = this.state.payload;\n payload.abattoirId =\n this.state.abattoir.id || this.props.match.params.abattoirId;\n this.setState({ loading: true, saveErrorMessage: null });\n APICall(\"api/abattoirs/addinvestor\", \"POST\", payload)\n .then((data) => {\n var response = data.data;\n this.setState({ loading: false });\n if (response.isSuccess) {\n Toastr(\"success\", \"New investor added\");\n this.setState({ modalIsOpen: false, payload: {} });\n } else {\n this.setState({ saveErrorMessage: response.message });\n }\n })\n .catch((error) => {\n this.setState({\n loading: false,\n saveErrorMessage: \"An error occurred, please check your network\",\n });\n });\n }\n\n updateRecord() {\n let payload = {\n id: this.state.selectedRecord.id,\n investorName: this.state.payload.investorName,\n phoneNumber: this.state.payload.phoneNumber,\n emailAddress: this.state.payload.emailAddress,\n };\n\n this.setState({ loading: true, saveErrorMessage: null });\n APICall(\"api/abattoirs/updateinvestor\", \"POST\", payload)\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n Toastr(\"success\", \"Record updated\");\n this.setState({ selectedRecord: null, payload: {}, loading: false });\n } else {\n this.setState({ saveErrorMessage: response.message, loading: false });\n }\n })\n .catch((error) => {\n this.setState({\n loading: false,\n saveErrorMessage: \"An error occurred, please check your network\",\n });\n });\n }\n\n render() {\n return (\n <>\n \n Update Investor Record\n
\n\n \n
\n {this.state.abattoir.name}\n \n )}\n\n {this.context.globalState.user.userRole.includes(\"admin\") && (\n
\n
\n \n \n );\n }\n}\n","import React, { useState, useEffect } from \"react\";\nimport \"../sass/setting.css\";\n\nfunction Setting({\n id,\n name,\n description,\n optionsList,\n value,\n handleChange,\n regexStatus,\n}) {\n return (\n \n \n \n\n {this.state.selectedRecord\n ? null\n : this.state.modalIsOpen || (\n this.selectRecord(record)}\n abattoirId={this.props.match.params.abattoirId}\n />\n )}\n \n
\n \n
\n );\n}\n\nexport default Setting;\n","import React, { Component } from \"react\";\nimport MainLayout from \"../../Components/Layouts/MainLayout\";\nimport CardBlock from \"../../Components/CardBlock\";\nimport Tabs from \"../../Utils/Tabs\";\nimport CenterBlock from \"../../Components/CenterBlock\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Constants from \"../../Utils/Constants\";\nimport APICall from \"../../Utils/APICall\";\nimport Spinner from \"../../Utils/Spinner\";\nimport SpinnerButton from \"../../Utils/SpinnerButton\";\nimport Toastr from \"../../Utils/Toastr\";\nimport \"../../sass/kanban.scss\";\nimport \"moment/locale/en-gb.js\";\nimport Modal from \"react-modal\";\nimport Select from \"react-select\";\nimport DataAPI from \"../../Utils/DataAPI\";\nimport Functions from \"../../Utils/Functions\";\nimport { isThisHour } from \"date-fns\";\nimport { DataContext } from \"../../Contexts/DataContexts\";\n\nexport default class NewDiseaseReportPage extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: true,\n data: null,\n errorMessage: null,\n redirectUrl: null,\n payload: {\n tagNumber: this.props.match.params.tagNumber\n ? this.props.match.params.tagNumber\n : null,\n },\n species: [],\n organs: [],\n pathologicalDiagnosis: [],\n diseases: [],\n secondConfirmation: null,\n saveLoading: false,\n animal: null,\n validateLoading: false,\n };\n\n this.formControl = this.formControl.bind(this);\n }\n\n static contextType = DataContext;\n\n async componentDidMount() {\n this.init();\n Modal.setAppElement(\"body\");\n if (this.props.match.params.tagNumber) {\n await this.validateTagNumber();\n }\n }\n\n async validateTagNumber() {\n this.setState({ validateLoading: true });\n let tagNumber = this.props.match.params.tagNumber\n ? this.props.match.params.tagNumber\n : this.state.payload?.tagNumber;\n let animal = await DataAPI.findAnimal(tagNumber);\n if (animal) {\n this.setState({ animal: animal });\n this.updateSpecie(animal.specie);\n } else {\n Toastr(\"error\", \"Invalid animal tag number\");\n }\n this.setState({ validateLoading: false });\n }\n\n async init() {\n let configuration = await DataAPI.diseaseReportingConfiguration();\n this.setState(\n {\n configuration: configuration,\n loading: false,\n initError: configuration ? false : true,\n },\n () => {\n if (this.state.configuration) {\n const species = [];\n this.state.configuration.species.forEach((element) => {\n species.push({ label: element, value: element });\n });\n\n this.setState({ species: species });\n }\n }\n );\n }\n\n condemnationOptions = [\n { label: \"Partial\", value: \"Partial\" },\n { label: \"Full\", value: \"Full\" },\n { label: \"Inconsequential\", value: \"Inconsequential\" },\n ];\n\n saveReport() {\n let payload = this.state.payload;\n\n this.setState({ saveLoading: true, errorMessage: null });\n APICall(\"api/diseasereports/add\", \"post\", payload)\n .then((data) => {\n if (data.data.isSuccess) {\n Toastr(\"success\", \"Report saved\");\n this.setState({\n redirectUrl: \"/in/new-disease-report-success\",\n });\n } else {\n this.setState({\n saveLoading: false,\n errorMessage: data.data.message,\n });\n }\n })\n .catch((error) => {\n console.log(error);\n this.setState({\n saveLoading: false,\n errorMessage: \"Check your network connection\",\n });\n });\n }\n\n updateFile(e) {\n var file = e.target.files[0];\n var reader = new FileReader();\n reader.onloadend = () => {\n this.updateProp(reader.result, \"base64File\");\n };\n reader.readAsDataURL(file);\n }\n\n updateSpecie(value) {\n this.updateProp(value, \"animalSpecie\");\n let organs = this.state.configuration.organs.filter((a) => {\n return a.specie.toLowerCase() == value.toLowerCase();\n });\n\n if (organs && organs.length > 0) {\n organs.forEach((element) => {\n element.value = element.organ;\n element.label = element.organ;\n });\n }\n this.setState({ organs: organs });\n\n let diseases = this.state.configuration.diseases.filter((a) => {\n return a.specie.toLowerCase() == value.toLowerCase();\n });\n\n if (diseases && diseases.length > 0) {\n diseases.forEach((element) => {\n element.value = element.disease;\n element.label = element.disease;\n });\n }\n this.setState({ diseases: diseases });\n }\n\n updateOrgan(organ) {\n this.updateProp(organ.value, \"organ\");\n const pathologicalDiagnosis = [];\n if (organ.pathologicalDiagnosis && organ.pathologicalDiagnosis.length > 0) {\n organ.pathologicalDiagnosis.forEach((element) => {\n pathologicalDiagnosis.push({ label: element, value: element });\n });\n }\n\n this.setState({ pathologicalDiagnosis: pathologicalDiagnosis });\n }\n\n updateDisease(disease) {\n this.updateProp(disease.value, \"diseaseSuspected\");\n if (disease.confirmation && disease.confirmation.trim() != \"\") {\n this.setState({\n secondConfirmation: {\n label: disease.confirmationLabel,\n notes: disease.confirmation,\n },\n });\n } else {\n this.setState({ secondConfirmation: null });\n }\n }\n\n updateProp(value, prop) {\n let payload = this.state.payload;\n if (!payload) payload = {};\n payload[prop] = value;\n this.setState({ payload: payload });\n }\n\n formGroupRow({ colClass, children }) {\n return (\n \n
\n {name}
\n{description}?
\n\n
\n \n {optionsList?.length ? (\n handleChange(id, e.target.value)}\n name=\"option\"\n className=\"form-control form-control-sm\"\n >\n \n {optionsList?.map((option) => (\n \n ))}\n \n ) : (\n
\n \n
\n )}\n \n handleChange(id, e.target.value)}\n />\n
\n \n
\n );\n }\n\n formControl({ label, prop, inputType, required }) {\n if (!inputType) inputType = \"text\";\n let payload = this.state.payload;\n if (!payload) payload = {};\n\n return (\n <>\n \n {children}
\n \n \n
\n\n Only Vets with VCN Registration Number can fill disease reporting\n
\n \n
\n \n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport MainLayout from \"../../Components/Layouts/MainLayout\";\nimport CardBlock from \"../../Components/CardBlock\";\nimport Tabs from \"../../Utils/Tabs\";\nimport CenterBlock from \"../../Components/CenterBlock\";\nimport { Link } from \"react-router-dom\";\nimport Constants from \"../../Utils/Constants\";\nimport APICall from \"../../Utils/APICall\";\nimport Spinner from \"../../Utils/Spinner\";\nimport SpinnerButton from \"../../Utils/SpinnerButton\";\nimport Toastr from \"../../Utils/Toastr\";\nimport \"moment/locale/en-gb.js\";\nimport Modal from \"react-modal\";\nimport Select from \"react-select\";\nimport Functions from \"../../Utils/Functions\";\n\nexport default class NewDiseaseReportSuccessPage extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: false,\n data: null,\n errorMessage: null,\n };\n }\n\n componentDidMount() {}\n\n render() {\n return (\n \n {this.state.loading ? (\n \n this.init()}\n className=\"btn btn-inverse-light btn-fw mt-4 mb-5 btn-rounded\"\n >\n Reload\n \n \n ) : null}\n {this.state.loading || this.state.initError ? null : !this.context\n .globalState.user.vcnRegistrationNumber ? (\n \n
\n \n )}\n \n \n
\n\n An error occurred, you can try reloading the page\n
\n \n
\n \n
\n ) : null}\n\n {this.state.animal && (\n \n
\n )}\n \n \n this.saveReport()}\n className=\"btn btn-success mr-2 btn-block btn-rounded\"\n label=\"Save Disease Report\"\n loading={this.state.saveLoading}\n />\n
\n \n
\n \n
\n \n
\n
\n \n \n
\n\n
New disease report captured successfully
\n\n \n Capture new disease report\n \n\n \n Finish\n \n
\n \n
\n );\n}\n","import React, { Component } from \"react\";\nimport { Link } from \"react-router-dom\";\n\nexport default function SingleDiseaseReport(report) {\n const DataDisplay = ({ label, data }) => {\n return (\n \n \n
\n \n \n {data}\n {subTitle && (\n \n
\n
\n \n \n {title}\n
\n\n {data}\n {subTitle && (\n \n
\n {subTitle}: {subData}\n \n )}\n
\n \n \n {label}\n \n
\n );\n };\n\n return (\n \n
\n {data}
\n\n
\n );\n}\n","import React, { Component } from \"react\";\nimport CardBlock from \"../CardBlock\";\nimport Tabs from \"../../Utils/Tabs\";\nimport CenterBlock from \"../CenterBlock\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Constants from \"../../Utils/Constants\";\nimport APICall from \"../../Utils/APICall\";\nimport Spinner from \"../../Utils/Spinner\";\nimport SpinnerButton from \"../../Utils/SpinnerButton\";\nimport Toastr from \"../../Utils/Toastr\";\nimport MyTable from \"../../Utils/MyTable\";\nimport Dropzone from \"react-dropzone\";\nimport Modal from \"react-modal\";\nimport Functions from \"../../Utils/Functions\";\nimport Select from \"react-select\";\nimport { functions, throttle } from \"lodash\";\nimport \"moment/locale/en-gb.js\";\nimport { DatePicker, DatePickerInput } from \"rc-datepicker\";\nimport \"rc-datepicker/lib/style.css\";\nimport DateFnsUtils from \"@date-io/date-fns\";\nimport StatBox from \"../StatBox\";\nimport SingleDiseaseReport from \"./SingleDiseaseReport\";\n\nexport default class DiseaseReportsList extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: true,\n data: [],\n errorMessage: null,\n searchQuery: \"\",\n page: 1,\n pageSize: 10,\n modalIsOpen: false,\n uploadErrorMessage: null,\n uploading: false,\n redirect: null,\n user: {},\n alreadyGotResults: false,\n fromDate: new Date(),\n toDate: new Date(),\n animalSpecie: \"all\",\n selectedRecord: null,\n };\n\n this.RenderTable = this.RenderTable.bind(this);\n this.init = this.init.bind(this);\n\n this.throttledReload = throttle(() => {\n this.init(this.state.page, this.state.pageSize, this.state.searchQuery);\n }, 500);\n }\n\n componentDidMount() {\n Modal.setAppElement(\"body\");\n this.init(1, this.state.pageSize, \"\");\n }\n\n RenderTable(_data) {\n var headerList = [\n {\n Header: \"Tag Number\",\n accessor: \"tagNumber\",\n },\n {\n Header: \"Specie\",\n accessor: \"animalSpecie\",\n },\n {\n Header: \"Organ\",\n accessor: \"organ\",\n },\n {\n Header: \"Pathological Diagnosis\",\n accessor: \"diagnosisComponent\",\n },\n {\n Header: \"Condemnation\",\n accessor: \"condemnation\",\n },\n {\n Header: \"Date Recorded\",\n accessor: \"dateComponent\",\n },\n {\n Header: \"\",\n accessor: \"buttonComponent\",\n },\n ];\n\n const tableHeader = React.useMemo(() => headerList, []);\n\n _data._data.forEach((element) => {\n element.diagnosisComponent = `${element.pathologicalDiagnosis} ${element.diseaseSuspected} ${element.confirmatoryDiagnosis}`;\n element.dateComponent = new Functions().formatDate(element.dateRecorded);\n element.buttonComponent = (\n {element.effectiveRole}
\n });\n\n const tableData = React.useMemo(() => _data, []);\n return (\n \n
\n );\n }\n\n quickReload() {\n this.init(1, this.state.pageSize, this.state.searchQuery);\n }\n\n init(page, pageSize, query) {\n if (!query) query = \"\";\n\n this.setState({\n errorMessage: null,\n loading: true,\n searchQuery: query,\n page: page,\n pageSize: pageSize,\n });\n\n const fromDate = Functions.sqlDateString(this.state.fromDate);\n const toDate = Functions.sqlDateString(this.state.toDate);\n const animalSpecie = this.state.animalSpecie || \"all\";\n const userId = this.props.userId || 0;\n\n APICall(\n `api/diseasereports/fetch/${page}/${pageSize}/${animalSpecie}/${fromDate}/${toDate}/${userId}?query=${query}`,\n \"GET\"\n )\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState({ loading: false, data: null }, () => {\n this.setState({ data: response.data });\n });\n } else {\n this.setState({\n errorMessage:\n \"Your request generated an error. Try again after sometime\",\n loading: false,\n });\n }\n console.log(data);\n })\n .catch((error) => {\n this.setState({\n errorMessage:\n \"Your request generated an error. Please check your network connection\",\n loading: false,\n });\n });\n }\n\n render() {\n return this.state.redirect ? (\n \n \n
\n\n An error occurred, you can try reloading the page\n
\n \n
\n ) : null}\n {this.state.selectedRecord && (\n \n
\n {
\n \n )}\n \n \n Disease report details\n \n
\n\n {
\n
\n \n
\n \n \n \n this.setState({ fromDate: date }, () => {\n this.quickReload();\n })\n }\n className=\"my-custom-datepicker-component\"\n />\n
\n \n \n -\n \n \n
\n \n \n \n this.setState({ toDate: date }, () => {\n this.quickReload();\n })\n }\n className=\"my-custom-datepicker-component\"\n />\n
\n \n {this.state.data?.summary && (\n
\n
\n )}\n {!this.state.data?.data ? null : (\n \n
\n \n \n \n
\n \n
\n \n \n \n \n
\n {element.effectiveRole}
\n });\n\n const tableData = React.useMemo(() => _data, []);\n return (\n \n
\n );\n }\n\n quickReload() {\n this.init(1, this.state.pageSize, this.state.searchQuery);\n }\n\n init(page, pageSize, query) {\n if (!query) query = \"\";\n\n this.setState({\n errorMessage: null,\n loading: true,\n searchQuery: query,\n page: page,\n pageSize: pageSize,\n });\n\n const fromDate = Functions.sqlDateString(this.state.fromDate);\n const toDate = Functions.sqlDateString(this.state.toDate);\n\n APICall(\n `api/revenue/fetch/${page}/${pageSize}/${fromDate}/${toDate}?query=${query}`,\n \"GET\"\n )\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState({ loading: false, data: null }, () => {\n this.setState({ data: response.data });\n });\n } else {\n this.setState({\n errorMessage:\n \"Your request generated an error. Try again after sometime\",\n loading: false,\n });\n }\n console.log(data);\n })\n .catch((error) => {\n this.setState({\n errorMessage:\n \"Your request generated an error. Please check your network connection\",\n loading: false,\n });\n });\n }\n\n render() {\n return this.state.redirect ? (\n \n \n
\n\n An error occurred, you can try reloading the page\n
\n \n
\n ) : null}\n {this.state.selectedRecord && (\n \n
\n {
\n \n )}\n \n \n Disease report details\n \n
\n\n {
\n
\n \n
\n \n \n \n this.setState({ fromDate: date }, () => {\n this.quickReload();\n })\n }\n className=\"my-custom-datepicker-component\"\n />\n
\n \n \n -\n \n \n
\n \n \n \n this.setState({ toDate: date }, () => {\n this.quickReload();\n })\n }\n className=\"my-custom-datepicker-component\"\n />\n
\n \n {this.state.data?.summary && (\n
\n {`${process.env.REACT_APP_NAME.toLowerCase()} earnings`}\n }\n data={Functions.currencyFormat(this.state.data.summary.ours)}\n subTitle=\"YTD\"\n subData={Functions.currencyFormat(\n this.state.data.yearToDate.ours\n )}\n />\n
\n )}\n {!this.state.data?.data ? null : (\n \n
\n \n \n \n
\n - \n {this.menus.map((menu, index) => (\n
- {this.menuLink(childMenu)} \n ))}\n
- \n {menu.children.map((childMenu, childIndex) => (\n
\n \n
\n \n );\n }\n\n valueChainItem({ title1, body1, image1, title2, body2, image2 }) {\n return (\n {title}
\n{body}
\n\n \n
\n \n {image2 && (\n \n {image1 && (\n
\n )}\n VALUE CHAIN
\n{title1}
\n{body1}
\n\n
\n \n
\n \n )}\n \n );\n }\n\n render() {\n return (\n <>\n VALUE CHAIN
\n{title2}
\n{body2}
\n\n {/* Start Header */}\n \n \n \n VERIFY A CERTIFICATE\n \n {/* End Header */}\n {/* Start Hero Area */}\n \n
\n {/* End Hero Area */}\n\n \n
\n \n
\n \n {/* Start site logo */}\n
\n \n \n
\n {/* End site logo */}\n \n {/* Start main navigation */}\n
\n \n \n
\n {/* Mobile Menu Active here. Don't Remove it */}\n \n {/* End main navigation */}\n \n
\n \n
\n \n
\n \n {/* Start hero content */}\n
\n \n \n VERIFY A CERTIFICATE\n \n
\n {/* End hero content */}\n The pathway to meat export in Nigeria
\n\n Proteintrail is digitalizing the entire process to facilitate and\n strengthen due diligence in the systems enabling meat export from the ranch,\n approved abattoirs, Nigerian customs at all international airports,\n and foreign off-takers, all within our patented app.\n
\n\n {/* Start hero right */}\n \n {/* End hero right */}\n
\n \n
\n \n\n {/* Start Technical Space Area */}\n \n
\n \n
\n \n {/* Start section title */}\n
\n \n
\n {/* End section title */}\n The ProteinTrail Idea
\n\n Proteintrail is a tech startup established to sanitise Nigeria's meat value chain.\n The modus operandi is to use advances in information and communication technology,\n including artificial intelligence, to digitise and coordinate the various systems\n in production, distribution, and supply within the value chain.\n
\n {/*\n As the systems were developed, it became clear that other\n value chains like aquatic animal, sheep and goat, pork,\n camel etc (all collectively described as first class\n protein sources) including fruits and vegetables could\n benefit immensely from our progressive activity. To this\n end, the vision received an upgrade and so did our\n standard operating procedure.\n
*/}\n\n
\n \n {/* Start single feature */}\n \n ![\"Feature\"]({this.pageImage(\"feature-1.png\")})
\n
\n {/* End single feature */}\n \n Inclusion
\n\n Proteintrail offers a seamless electronic mechanism to all stakeholders within the meat value chain to monitor the consignment of raw and processed meat.\n
\n\n {/* Start single feature */}\n
\n\n \n ![\"Feature\"]({this.pageImage(\"feature-2.png\")})
\n
\n {/* End single feature */}\n \n Transparency
\n\n Foreign off-takers have been unable to trade with Nigeria because our practice lacks transparency.\n We have made it possible for foreign off-takers to monitor the whole process of meat export on the App,\n from the birth certificates to the fattening stages( 12, 24 or 36 months), plus real-time vaccination records applied to the cattle.\n
\n\n {/* Start single feature */}\n
\n \n ![\"Feature\"]({this.pageImage(\"feature-3.png\")})
\n
\n\n \n Quality Control
\n\n Slaughtered animals are required by law to pass through\n veterinary and other fitness checks by trained\n veterinarians before their meat can be passed to the\n public for consumption.\n
\n\n
\n \n {/* End Technical Space Area */}\n {/* Start Notification Area */}\n {/* \n
\n \n
\n \n {/* Start section title */}\n \n \n Ante-Mortem {\"&\"}
\n
\n {/* End section title */}\n \n Ante-Mortem {\"&\"}
\n Post-Mortem Inspection\n
\n \n When animals pass through the stages of inspection, they\n are usually issued some form of legal pass which\n traditionally happens in the form of a certificate\n (handled by the merchants) or some kind of body marking or\n a combination of either of these to varying degrees\n depending on jurisdiction. Proteintrail automates these\n into a seamless one stop process having the following\n effect among other things:\n
\n\n
\n \n
*/}\n {/* End Notification Area */}\n {/* Start Video Area */}\n {null && (\n \n Sheep Meat}\n body1={\n <>\n Mutton and Lamb\n
\n \n }\n image2=\"pig.jpg\"\n title2=\"Pork Meat\"\n body2=\"Sadly no class A facility exists as far as we know in the state where pig is processed to pork. At best, facilities are class C. So until investment has been made in this area to develop this value chain, we may not be able to certify pig meat confidently\"\n />\n\nFish}\n body1={\n <>\n Including other aquatic products\n
\n This follows a very different value chain route than meat.\n The sources include\n
\n
\n Eggs sold out of farms should also be certified as fit for\n human consumption as well as drug or antibiotic free. This\n is currently not carried out on farms by state government\n and Proteintrail can impress it upon government to do so.\n \n }\n />\n\nOther Exotic Meat}\n body1={\n <>\n Bush meat, etc\n
\n This would include imports of all kinds as well as other\n meats not include in the above listed categories. Government\n will also have to find a way to certify them.\n \n }\n />\n
\n \n \n }\n image2=\"pig.jpg\"\n title2=\"Pork Meat\"\n body2=\"Sadly no class A facility exists as far as we know in the state where pig is processed to pork. At best, facilities are class C. So until investment has been made in this area to develop this value chain, we may not be able to certify pig meat confidently\"\n />\n\n
\n This follows a very different value chain route than meat.\n The sources include\n
- \n
- \n Importation through the\n air and sea ports\n \n
- \n Fishing activities by\n artisanal fish farmers\n \n
- \n Fish and other aquatic\n animal culture activity by subsistence and large scale\n fish farmers\n \n
\n
\n Eggs sold out of farms should also be certified as fit for\n human consumption as well as drug or antibiotic free. This\n is currently not carried out on farms by state government\n and Proteintrail can impress it upon government to do so.\n \n }\n />\n\n
\n This would include imports of all kinds as well as other\n meats not include in the above listed categories. Government\n will also have to find a way to certify them.\n \n }\n />\n
\n
\n \n )}\n {/* End Video Area */}\n {/* Start Testimonial Area */}\n {null && (\n \n
\n \n {/* start section tilte */}\n
\n \n
\n {/* start section tilte */}\n Description With Video
\n\n Delay rapid joy share allow age manor six. Went why far\n saw many knew. Exquisite excellent son gentleman\n acuteness her.\n
\n\n
\n \n {/* start video */}\n
\n \n ![\"\"](\"img/video.jpg\")
\n \n \n \n
\n {/* end video */}\n \n \n
\n \n )}\n {/* End Testimonial Area */}\n {/* Start News Leater Area */}\n {null && (\n \n
\n \n {/* Start section title */}\n
\n \n
\n {/* End section title */}\n Our Clients Reviews And Testimonials
\n\n Delay rapid joy share allow age manor six. Went why far\n saw many knew. Exquisite excellent son gentleman\n acuteness her.\n
\n\n
\n \n {/* Start Testimonial Wrap */}\n
\n \n {/* Start single testimonial */}\n
\n {/* End Testimonial Wrap */}\n \n
\n {/* End single testimonial */}\n {/* Start single testimonial */}\n \n ![\"\"](\"img/testi-1.png\")
\n
\n \n \n \n
\n \n Delay rapid joy share allow age manor six. Went why\n far saw many knew. Exquisite excellent son gentleman\n acuteness her.\n
\n- \n
- \n \n \n
- \n \n \n
- \n \n \n
- \n \n \n
- \n \n \n
Christopher
\nJuly 28, 2020
\n\n
\n {/* End single testimonial */}\n {/* Start single testimonial */}\n \n ![\"\"](\"img/testi-2.png\")
\n
\n \n \n \n
\n \n Delay rapid joy share allow age manor six. Went why\n far saw many knew. Exquisite excellent son gentleman\n acuteness her.\n
\n- \n
- \n \n \n
- \n \n \n
- \n \n \n
- \n \n \n
- \n \n \n
Mark Rosas
\nAugust 28, 2019
\n\n
\n {/* End single testimonial */}\n {/* Start single testimonial */}\n \n ![\"\"](\"img/testi-3.png\")
\n
\n \n \n \n
\n \n Delay rapid joy share allow age manor six. Went why\n far saw many knew. Exquisite excellent son gentleman\n acuteness her.\n
\n- \n
- \n \n \n
- \n \n \n
- \n \n \n
- \n \n \n
- \n \n \n
Michael Jonson
\nDecembor 17, 2020
\n\n
\n {/* End single testimonial */}\n \n \n
\n \n \n \n
\n \n Delay rapid joy share allow age manor six. Went why\n far saw many knew. Exquisite excellent son gentleman\n acuteness her.\n
\n- \n
- \n \n \n
- \n \n \n
- \n \n \n
- \n \n \n
- \n \n \n
Richard Roy
\nJuly 28, 2020
\n\n
\n )}\n \n {/* End Footer Area */}\n \n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Spinner from \"../Utils/Spinner\";\nimport APICall from \"../Utils/APICall\";\n\nexport default class VerifyCertificate extends Component {\n constructor(props) {\n super(props);\n this.state = {\n errorMessage: null,\n loading: false,\n redirectUrl: null,\n certificateNumber: null,\n };\n }\n\n componentDidMount() {}\n\n loadCertificate() {\n this.setState({ loading: true });\n const _certificateNumber = this.state.certificateNumber?.trim();\n APICall(`api/certificates/verify/${_certificateNumber}`, \"GET\")\n .then((data) => {\n const response = data.data;\n if (response.isSuccess) {\n this.setState({\n redirectUrl: `/view-certificate/${_certificateNumber}?returnUrl=${this.props.returnUrl}`,\n });\n } else {\n this.setState({ errorMessage: response.message, loading: false });\n }\n })\n .catch((error) => {\n this.setState({\n errorMessage: \"An error occurred, please check your network\",\n loading: false,\n });\n });\n }\n\n render() {\n return this.state.redirectUrl ? (\n \n
\n \n
\n \n {/* Start section title */}\n \n
\n \n \n
\n {/* End section title */}\n {/* Start form */}\n Latest Update And New Offers Notification
\n\n Delay rapid joy share allow age manor six. Went why far\n saw many knew. Exquisite excellent son gentleman\n acuteness her.\n
\n\n Enter certificate number below to continue.\n
\n \n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Logo from \"../../Logo\";\nimport Spinner from \"../../Utils/Spinner\";\nimport APICall from \"../../Utils/APICall\";\nimport ReactPhoneInput from \"react-phone-input-2\";\nimport \"react-phone-input-2/lib/material.css\";\nimport \"../../sass/react-phone.scss\";\nimport PublicWithTopStripBackground from \"../../Components/Layouts/PublicWithTopStripBackground\";\nimport VerifyCertificate from \"../../Components/VerifyCertificate\";\n\nexport default class VerifyCertificatePage extends Component {\n constructor(props) {\n super(props);\n this.state = {\n errorMessage: null,\n loading: false,\n redirectUrl: null,\n certificateNumber: null,\n };\n }\n\n componentDidMount() {\n localStorage.clear();\n sessionStorage.clear();\n }\n\n loadCertificate() {\n this.setState({ loading: true });\n APICall(`api/certificates/verify/${this.state.certificateNumber}`, \"GET\")\n .then((data) => {\n const response = data.data;\n if (response.isSuccess) {\n this.setState({\n redirectUrl: `/view-certificate/${this.state.certificateNumber}`,\n });\n } else {\n this.setState({ errorMessage: response.message, loading: false });\n }\n })\n .catch((error) => {\n this.setState({\n errorMessage: \"An error occurred, please check your network\",\n loading: false,\n });\n });\n }\n\n render() {\n return this.state.redirectUrl ? (\n\n
\n Verify Certificate
\n\n
\n );\n\n return (\n \n
\n \n {
\n );\n }\n\n this.setState({\n display: \n \n this.setState({\n redirectUrl: this.props.history.goBack(),\n })\n }\n style={{ cursor: \"pointer\" }}\n className=\"mdi mdi-keyboard-backspace icon-lg\"\n >\n \n back\n \n {\" \"}\n
\n )}\n \n
\n {this.state.errorMessage && (\n \n {this.state.errorMessage}\n
\n )}\n {this.state.loading && \n
\n \n
\n \n
\n
\n \n \n
\n\n
Animal delivery taken successfully
\n\n Tag number: \n \n {this.props.match.params.tagNumber}\n \n
\n\n \n New Delivery\n \n\n \n Print Tag Number\n \n
\n \n {label}\n {value}\n
\n );\n }\n\n render() {\n return (\n\n
\n )}\n \n
\n \n
\n
\n \n \n
\n\n
Delivery taken successfully
\n\n
\n\n \n
\n
\n
\n \n
\n
\n \n Supply History\n \n\n \n New Supply\n \n
\n \n
\n \n User Registration:{\" \"}\n Final step\n
\n\n Tell us a little more about you.\n
\n \n \n \n }\n />\n );\n }\n}\n","import React, { Component } from \"react\";\nimport MainLayout from \"../../Components/Layouts/MainLayout\";\nimport CardBlock from \"../../Components/CardBlock\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport VerifyCertificate from \"../../Components/VerifyCertificate\";\n\nexport default class VerifyCertificateAfterLoginPage extends Component {\n constructor(props) {\n super(props);\n this.state = {};\n }\n render() {\n return this.state.redirectUrl ? (\n\n
\n \n \n \n
\n \n {
,\n ];\n\n this.setState({\n display: \n \n \n
\n
\n );\n }\n\n formControl({ label, prop, inputType, required }) {\n if (!inputType) inputType = \"text\";\n let payload = this.state.payload;\n if (!payload) payload = {};\n\n return (\n <>\n \n \n
\n
\n );\n };\n\n render() {\n return this.state.redirectUrl ? (\n \n
\n \n this.acceptSupply()}\n className=\"btn btn-success btn-rounded\"\n />\n this.rejectSupply()}\n className=\"btn btn-danger btn-rounded ml-3\"\n type=\"button\"\n >\n Reject Supply\n \n
\n \n
\n \n {this.state.loading ? (\n \n \n )}\n
\n \n
\n \n \n
\n \n {label}\n {value}\n
\n );\n }\n\n render() {\n return (\n\n
\n )}\n \n
\n \n
\n
\n \n \n
\n\n
Delivery taken successfully
\n\n
\n\n \n
\n
\n
\n \n
\n
\n \n My Consignments\n \n\n \n Home\n \n
\n \n
\n \n )}\n \n \n \n )}\n \n
\n \n
\n );\n }\n\n updateRecordForm() {\n return (\n Add Veterinary Officer
\n\n \n
\n
\n \n
\n );\n }\n\n addRecord() {\n this.setState({ loading: true, saveErrorMessage: null });\n APICall(\"api/users/register/vet\", \"POST\", this.state.payload)\n .then((data) => {\n var response = data.data;\n this.setState({ loading: false });\n if (response.isSuccess) {\n Toastr(\"success\", \"New veterinary officer added\");\n this.setState({ modalIsOpen: false, payload: {} });\n } else {\n this.setState({ saveErrorMessage: response.message });\n }\n })\n .catch((error) => {\n this.setState({\n loading: false,\n saveErrorMessage: \"An error occurred, please check your network\",\n });\n });\n }\n\n updateRecord() {\n let payload = {\n id: this.state.selectedRecord.id,\n contactName: this.state.payload.contactName,\n email: this.state.payload.email,\n phoneNumber: this.state.payload.phoneNumber,\n };\n\n this.setState({ loading: true, saveErrorMessage: null });\n APICall(\"api/vets/update\", \"POST\", payload)\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n Toastr(\"success\", \"Record updated\");\n this.setState(\n { selectedRecord: null, payload: {}, loading: false },\n () => { }\n );\n } else {\n this.setState({ saveErrorMessage: response.message, loading: false });\n }\n })\n .catch((error) => {\n this.setState({\n loading: false,\n saveErrorMessage: \"An error occurred, please check your network\",\n });\n });\n }\n\n selectRecord(record) {\n if (this.context.globalState.user.userRole.includes(\"admin\")) {\n this.setState({ selectedRecord: record, payload: record });\n }\n }\n\n render() {\n return (\n <>\n Update Veterinary Officer
\n\n \n
\n
\n \n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport MainLayout from \"../../Components/Layouts/MainLayout\";\nimport CardBlock from \"../../Components/CardBlock\";\nimport Tabs from \"../../Utils/Tabs\";\nimport CenterBlock from \"../../Components/CenterBlock\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Constants from \"../../Utils/Constants\";\nimport APICall from \"../../Utils/APICall\";\nimport Spinner from \"../../Utils/Spinner\";\nimport SpinnerButton from \"../../Utils/SpinnerButton\";\nimport Toastr from \"../../Utils/Toastr\";\nimport \"../../sass/kanban.scss\";\nimport \"moment/locale/en-gb.js\";\nimport { DatePicker, DatePickerInput } from \"rc-datepicker\";\nimport \"rc-datepicker/lib/style.css\";\nimport {\n KeyboardTimePicker,\n MuiPickersUtilsProvider,\n} from \"@material-ui/pickers\";\nimport DateFnsUtils from \"@date-io/date-fns\";\nimport \"../../sass/doctors-calendar.scss\";\nimport moment from \"moment\";\nimport Modal from \"react-modal\";\nimport Select from \"react-select\";\nimport DataAPI from \"../../Utils/DataAPI\";\nimport Functions from \"../../Utils/Functions\";\nimport { DataContext } from \"../../Contexts/DataContexts\";\n\n\n\nexport default class SendTestSamplePage extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: false,\n data: null,\n errorMessage: null,\n redirectUrl: null,\n payload: {},\n retailOutlets: [],\n laboratories: [],\n };\n\n this.formControl = this.formControl.bind(this);\n }\n\n\n static contextType = DataContext;\n\n\n init = async () => {\n const { globalState, addItem } = this.context;\n this.setState({ profile: globalState?.data })\n const { state, country } = globalState?.user\n console.log(state, country)\n await this.listRetailOutlets(country, state);\n await this.listLaboratories(country, state);\n };\n\n\n\n\n componentDidMount() {\n const { globalState, addItem } = this.context;\n this.setState({ profile: globalState?.data })\n const { state, country } = globalState?.user\n console.log(state, country)\n this.listAbattoirs(state, country);\n this.getLastCheckin();\n }\n\n\n async listRetailOutlets(country, state) {\n let retailOutlets = await DataAPI.listUsers(1, 1000, `regular/${country}/${state}`, \"\");\n retailOutlets.forEach((element) => {\n element.value = element.id;\n element.label = element.name;\n });\n this.setState({ retailOutlets: retailOutlets });\n }\n\n async listLaboratories(country, state) {\n let data = await DataAPI.listUsers(1, 1000, `laboratory/${country}/${state}`, \"\");\n data.forEach((element) => {\n element.value = element.id;\n element.label = element.name;\n });\n this.setState({ laboratories: data });\n }\n\n componentDidMount = async () => {\n await this.init();\n };\n\n submit() {\n let payload = this.state.payload;\n\n this.setState({ loading: true, errorMessage: null });\n APICall(\"api/labs/requesttest\", \"post\", payload)\n .then((data) => {\n const response = data.data;\n if (response.isSuccess) {\n Toastr(\"success\", \"Sample forwarded successfully\");\n this.setState({\n redirectUrl: \"/in/send-test-success/\" + response.data.sampleCode,\n });\n } else {\n this.setState({ loading: false, errorMessage: response.message });\n }\n })\n .catch((error) => {\n console.log(error);\n this.setState({\n loading: false,\n errorMessage: \"Check your network connection\",\n });\n });\n }\n\n updateProp(value, prop) {\n let payload = this.state.payload;\n if (!payload) payload = {};\n payload[prop] = value;\n this.setState({ payload: payload });\n }\n\n formGroupRow({ colClass, children }) {\n return (\n \n \n \n\n {this.state.selectedRecord\n ? null\n : this.state.modalIsOpen || (\n this.selectRecord(record)}\n />\n )}\n \n
\n \n
\n );\n }\n\n formControl({ label, prop, inputType, required }) {\n if (!inputType) inputType = \"text\";\n let payload = this.state.payload;\n if (!payload) payload = {};\n\n return (\n <>\n \n {children}
\n \n
\n \n \n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n
\n
\n \n \n
\n\n
Laboratory has been notified of this sample
\n\n Tracking code: \n \n {this.props.match.params.trackingCode}\n \n
\n\n \n Send New Sample\n \n\n \n Home\n \n
\n {MyTable({ ...tableParams })}
;\n }\n\n quickReload() {\n this.init(this.state.page, this.state.pageSize, this.state.searchQuery);\n }\n\n init(page, pageSize, query) {\n if (!query) query = \"\";\n\n this.setState({\n errorMessage: null,\n loading: true,\n searchQuery: query,\n page: page,\n pageSize: pageSize,\n });\n\n const vetId = this.props.vetId || 0;\n const retailOutletId = this.props.retailOutletId || 0;\n const laboratoryId = this.props.laboratoryId || 0;\n const dateFrom = Functions.sqlDateString(this.state.fromDate);\n const dateTo = Functions.sqlDateString(this.state.toDate);\n if (!page) page = 1;\n if (!pageSize) pageSize = 10;\n\n APICall(\n `api/labs/tests/${page}/${pageSize}/${dateFrom}/${dateTo}/${vetId}/${retailOutletId}/${laboratoryId}?query=${query}`,\n \"GET\",\n {}\n )\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState({ loading: false, data: response.data }, () => {});\n } else {\n this.setState({\n errorMessage:\n \"Your request generated an error. Try again after sometime\",\n loading: false,\n });\n }\n console.log(data);\n })\n .catch((error) => {\n this.setState({\n errorMessage:\n \"Your request generated an error. Please check your network connection\",\n loading: false,\n });\n });\n }\n\n displayRecord = () => {\n return (\n \n Tracking code: {this.state.selectedRecord.sampleCode}\n
\n\n \n \n );\n };\n\n render() {\n return this.state.redirect ? (\n
\n \n
\n\n An error occurred, you can try reloading the page\n
\n \n
\n ) : null}\n\n {this.state.selectedRecord && (\n \n
\n \n
\n \n \n \n this.setState({ fromDate: date }, () => {\n this.quickReload();\n })\n }\n className=\"my-custom-datepicker-component\"\n />\n
\n \n \n -\n \n \n
\n \n \n \n this.setState({ toDate: date }, () => {\n this.quickReload();\n })\n }\n className=\"my-custom-datepicker-component\"\n />\n
\n \n\n {this.state.data.length > 0 && (\n
No data to display
\n )}\n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport MainLayout from \"../../Components/Layouts/MainLayout\";\nimport CardBlock from \"../../Components/CardBlock\";\nimport \"rc-datepicker/lib/style.css\";\nimport { DataContext } from \"../../Contexts/DataContexts\";\nimport LabTestList from \"../../Components/LabTestList\";\nimport Modal from \"react-modal\";\nimport Constants from \"../../Utils/Constants\";\nimport Select from \"react-select\";\nimport SpinnerButton from \"../../Utils/SpinnerButton\";\nimport Functions from \"../../Utils/Functions\";\nimport APICall from \"../../Utils/APICall\";\nimport Toastr from \"../../Utils/Toastr\";\nimport Badge from \"../../Components/Badge\";\n\nexport default class VetsLabTestsPage extends Component {\n constructor(props) {\n super(props);\n this.state = {\n data: null,\n errorMessage: null,\n selectedRecord: null,\n saveLoading: false,\n saveErrorMessage: null,\n };\n }\n\n static contextType = DataContext;\n\n vetActions = [\n { label: \"No Action Required\", value: \"okay\" },\n { label: \"Blacklist Outlet\", value: \"blacklist\" },\n { label: \"Issue Warning\", value: \"warning\" },\n ];\n\n componentDidMount() {}\n\n displayModal(record) {\n this.setState({ selectedRecord: record });\n }\n\n resetForm() {\n this.setState({ selectedRecord: null });\n }\n\n takeAction() {\n this.setState({ saveLoading: true });\n let payload = {\n actionTaken: this.state.actionTaken,\n comments: this.state.comments,\n };\n APICall(\n `api/labs/vetaction/${this.state.selectedRecord.sampleCode}`,\n \"post\",\n payload\n )\n .then((data) => {\n const response = data.data;\n if (response.isSuccess) {\n Toastr(\"success\", \"Report submitted\");\n this.setState({\n selectedRecord: response.data,\n comments: null,\n actionTaken: null,\n });\n } else {\n Toastr(\"error\", response.message);\n }\n this.setState({ saveLoading: false });\n })\n .catch((err) => {\n this.setState({\n saveLoading: false,\n saveErrorMessage: \"Please check your network\",\n });\n });\n }\n\n displayRecord = () => {\n return (\n\n Tracking code: {this.state.selectedRecord.sampleCode}\n
\n\n \n \n );\n };\n\n render() {\n return (\n
\n
\n \n \n this.displayModal(record)}\n />\n \n
\n \n Tracking code: {this.state.selectedRecord.sampleCode}\n
\n\n \n \n );\n };\n\n render() {\n return (\n
\n
\n \n \n this.displayModal(record)}\n />\n \n
\n \n
\n \n {this.state.loading ? (\n \n \n )}\n
\n \n
\n );\n }\n\n static contextType = DataContext;\n\n\n init(page, pageSize, query) {\n if (!query) query = \"\";\n\n this.setState({\n errorMessage: null,\n loading: true,\n searchQuery: query,\n page: page,\n pageSize: pageSize,\n });\n\n\n const { globalState, addItem } = this.context;\n this.setState({ profile: globalState?.data })\n const { state, country, userRole } = globalState?.user\n\n let apiURL = `api/governmentinspectors/get/${country}/${state}`\n\n if (userRole == \"superadmin\") {\n apiURL = \"api/governmentinspectors/list\"\n }\n\n // APICall(`api/governmentinspectors/get/${country}/${state}`, \"GET\", {})\n APICall(`${apiURL}`, \"GET\", {})\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState({ loading: false, data: null }, () => {\n this.setState({ data: response.data });\n });\n } else {\n this.setState({\n errorMessage:\n \"Your request generated an error. Try again after sometime\",\n loading: false,\n });\n }\n console.log(data);\n })\n .catch((error) => {\n this.setState({\n errorMessage:\n \"Your request generated an error. Please check your network connection\",\n loading: false,\n });\n });\n }\n\n render() {\n return this.state.redirect ? (\n \n \n
\n\n An error occurred, you can try reloading the page\n
\n \n
\n ) : null}\n\n {!this.state.data ? null : \n
\n \n
\n );\n }\n\n updateRecordForm() {\n return (\n Add Inspection Officer
\nAn email will be sent to this officer to setup their account
\n\n\n \n
\n
\n \n
\n );\n }\n\n addRecord() {\n this.setState({ loading: true, saveErrorMessage: null });\n APICall(\"api/governmentinspectors/register\", \"POST\", this.state.payload)\n .then((data) => {\n var response = data.data;\n this.setState({ loading: false });\n if (response.isSuccess) {\n Toastr(\n \"success\",\n \"Inspector invited, advise them to check their email\"\n );\n this.setState({ modalIsOpen: false, payload: {} });\n } else {\n this.setState({ saveErrorMessage: response.message });\n }\n })\n .catch((error) => {\n this.setState({\n loading: false,\n saveErrorMessage: \"An error occurred, please check your network\",\n });\n });\n }\n\n updateRecord() {\n let payload = {\n id: this.state.selectedRecord.id,\n contactName: this.state.payload.contactName,\n email: this.state.payload.email,\n phoneNumber: this.state.payload.phoneNumber,\n };\n\n this.setState({ loading: true, saveErrorMessage: null });\n APICall(\"api/governmentinspectors/update\", \"POST\", payload)\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n Toastr(\"success\", \"Record updated\");\n this.setState(\n { selectedRecord: null, payload: {}, loading: false },\n () => { }\n );\n } else {\n this.setState({ saveErrorMessage: response.message, loading: false });\n }\n })\n .catch((error) => {\n this.setState({\n loading: false,\n saveErrorMessage: \"An error occurred, please check your network\",\n });\n });\n }\n\n selectRecord(record) {\n if (this.context.globalState.user.userRole.includes(\"admin\")) {\n this.setState({ selectedRecord: record, payload: record });\n }\n }\n\n render() {\n return (\n <>\n Update Inspector Record
\n\n \n
\n
\n \n \n );\n }\n}\n","import React, { useState } from 'react'\nimport APICall from '../Utils/APICall';\nimport Constants from '../Utils/Constants';\nimport Spinner from '../Utils/Spinner';\n\nfunction DownloadTag() {\n const [errorMessage, setErrorMessage] = useState('');\n const [isLoading, setIsLoading] = useState(false);\n const [certificateNo, setCertificateNo] = useState('')\n\n const downloadCertificate = () => {\n console.log(certificateNo);\n setIsLoading(true);\n const certificateNumber = certificateNo?.trim();\n APICall(`api/certificates/verify/${certificateNumber}`, \"GET\")\n .then((data) => {\n const response = data.data;\n if(response.isSuccess){\n window.open(`${Constants.apiBaseUrl}/api/certificates/downloadtag/${certificateNumber}`);\n setIsLoading(false);\n setErrorMessage('');\n setCertificateNo('');\n }else {\n setErrorMessage(response.message);\n setIsLoading(false);\n }\n })\n .catch((error) => {\n setErrorMessage(\"An error occurred, please check your network\");\n setIsLoading(false);\n })\n }\n return (\n \n \n \n\n {this.state.selectedRecord\n ? null\n : this.state.modalIsOpen || (\n this.selectRecord(record)}\n />\n )}\n \n
\n \n
\n )\n}\n\nexport default DownloadTag","import React, { Component } from \"react\";\nimport MainLayout from \"../../Components/Layouts/MainLayout\";\nimport CardBlock from \"../../Components/CardBlock\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport VerifyCertificate from \"../../Components/VerifyCertificate\";\nimport DownloadTag from \"../../Components/DownloadTag\";\n\nexport default class RenderTagPage extends Component {\n constructor(props) {\n super(props);\n this.state = {};\n }\n render() {\n return this.state.redirectUrl ? (\n \n Enter certificate number below to continue.\n
\n \n\n
\n \n \n \n
\n \n
\n );\n\n return (\n \n
\n \n {
\n );\n }\n\n this.setState({\n display: \n \n this.setState({\n redirectUrl: this.props.history.goBack(),\n })\n }\n style={{ cursor: \"pointer\" }}\n className=\"mdi mdi-keyboard-backspace icon-lg\"\n >\n \n back\n \n {\" \"}\n
\n )}\n \n
\n {this.state.errorMessage && (\n \n {this.state.errorMessage}\n
\n )}\n {this.state.loading && \n \n Approval number:{\" \"}\n {element.approvalNumber}\n \n \n );\n\n element.investorsTrigger = (\n
\n
\n );\n }\n\n deleteRecord(record) {\n this.setState({ loading: true });\n APICall(`api/specializations/removefrommaster/${record.id}`, \"POST\", {})\n .then((data) => {\n this.setState({ loading: false });\n var response = data.data;\n if (response.status == \"success\") {\n Toastr(\"warning\", \"Record deleted\");\n this.init();\n } else {\n Toastr(\n \"error\",\n \"Your request generated an error. Try again after sometime\"\n );\n }\n console.log(data);\n })\n .catch((error) => {\n Toastr(\"error\", \"Please check your network connection\");\n this.setState({ loading: false });\n });\n }\n static contextType = DataContext;\n\n init(page, pageSize, query) {\n if (!query) query = \"\";\n\n this.setState({\n errorMessage: null,\n loading: true,\n searchQuery: query,\n page: page,\n pageSize: pageSize,\n });\n\n\n const { globalState, addItem } = this.context;\n this.setState({ profile: globalState?.data })\n const { state, country, userRole } = globalState?.user\n\n let apiURL = `api/complains/get/${country}/${state}`\n\n if (userRole == \"superadmin\") {\n apiURL = \"api/complains/list/1/100\"\n }\n // APICall(`api/abattoirs/get/${country}/${state}`, \"GET\", {})\n APICall(`${apiURL}`, \"GET\", {})\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState({ loading: false, data: null }, () => {\n this.setState({ data: response.data });\n });\n } else {\n this.setState({\n errorMessage:\n \"Your request generated an error. Try again after sometime\",\n loading: false,\n });\n }\n console.log(data);\n })\n .catch((error) => {\n this.setState({\n errorMessage:\n \"Your request generated an error. Please check your network connection\",\n loading: false,\n });\n });\n }\n\n render() {\n return this.state.redirect ? (\n \n \n
\n\n An error occurred, you can try reloading the page\n
\n \n
\n ) : null}\n\n {!this.state.data ? null : \n
\n \n
\n );\n }\n\n updateRecordForm() {\n return (\n ADD ABATTOIR
\n\n \n
\n
\n \n
\n );\n }\n\n addRecord() {\n this.setState({ loading: true, saveErrorMessage: null });\n APICall(\"api/abattoirs/add\", \"POST\", this.state.payload)\n .then((data) => {\n var response = data.data;\n this.setState({ loading: false });\n if (response.isSuccess) {\n Toastr(\"success\", \"New record added\");\n this.setState({ modalIsOpen: false, payload: {} });\n } else {\n this.setState({ saveErrorMessage: response.message });\n }\n })\n .catch((error) => {\n this.setState({\n loading: false,\n saveErrorMessage: \"An error occurred, please check your network\",\n });\n });\n }\n\n updateRecord() {\n this.setState({ loading: true, saveErrorMessage: null });\n APICall(\n `api/abattoirs/update/${this.state.selectedRecord.id}`,\n \"POST\",\n this.state.selectedRecord\n )\n .then((data) => {\n var response = data.data;\n this.setState({ loading: false });\n if (response.isSuccess) {\n Toastr(\"success\", \"Record updated\");\n this.setState({ selectedRecord: null });\n this.reloadPage();\n } else {\n this.setState({ saveErrorMessage: response.message });\n }\n })\n .catch((error) => {\n this.setState({\n loading: false,\n saveErrorMessage: \"An error occurred, please check your network\",\n });\n });\n }\n\n selectRecord(record) {\n this.setState({ selectedRecord: record });\n }\n\n reloadPage() {\n this.setState({ reloading: true }, () => {\n setTimeout(() => {\n this.setState({ reloading: false });\n }, 1000);\n });\n }\n\n render() {\n return (\n <>\n UPDATE ABATTOIR
\n\n \n
\n
\n \n \n );\n }\n}\n","import React, { Component } from \"react\";\nimport CardBlock from \"./CardBlock\";\nimport Tabs from \"../Utils/Tabs\";\nimport CenterBlock from \"./CenterBlock\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Constants from \"../Utils/Constants\";\nimport APICall from \"../Utils/APICall\";\nimport Spinner from \"../Utils/Spinner\";\nimport SpinnerButton from \"../Utils/SpinnerButton\";\nimport Toastr from \"../Utils/Toastr\";\nimport MyTable from \"../Utils/MyTable\";\nimport Dropzone from \"react-dropzone\";\nimport Modal from \"react-modal\";\nimport Functions from \"../Utils/Functions\";\nimport Select from \"react-select\";\nimport { throttle } from \"lodash\";\nimport { DataContext } from \"../Contexts/DataContexts\";\n\nexport default class RanchList extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: true,\n data: [],\n errorMessage: null,\n searchQuery: \"\",\n page: 1,\n pageSize: 10,\n modalIsOpen: false,\n uploadErrorMessage: null,\n uploading: false,\n redirect: null,\n user: {},\n alreadyGotResults: false,\n };\n\n this.RenderTable = this.RenderTable.bind(this);\n this.init = this.init.bind(this);\n this.deleteRecord = this.deleteRecord.bind(this);\n\n this.throttledReload = throttle(() => {\n this.init(this.state.page, this.state.pageSize, this.state.searchQuery);\n }, 500);\n }\n\n componentDidMount() {\n Modal.setAppElement(\"body\");\n this.init();\n // new Functions().whoIsLoggedIn(this.setLoggedInUser, false);\n }\n\n RenderTable(_data) {\n var headerList = [\n {\n Header: \"Company Name\",\n accessor: \"name\",\n },\n {\n Header: \"Contact person\",\n accessor: \"contactPersonComponent\",\n },\n {\n Header: \"PhoneNumber\",\n accessor: \"phoneNumber\",\n },\n {\n Header: \"Country\",\n accessor: \"country\",\n },\n {\n Header: \"State\",\n accessor: \"state\",\n },\n {\n Header: \"Email\",\n accessor: \"email\",\n },\n {\n Header: \"Address\",\n accessor: \"operatingAddress\",\n },\n {\n Header: \"\",\n accessor: \"investorsTrigger\",\n },\n ];\n\n _data._data.forEach((element) => {\n let clonedElement = Object.assign({}, element);\n element.contactPersonComponent = (\n <>\n {element.username}\n \n \n {this.state.reloading ? (\n this.selectRecord(r)}\n />\n )}\n \n )}\n \n
\n \n \n {element.phoneNumber}\n \n );\n element.nameComponent = (\n
\n \n Approval number:{\" \"}\n {element.approvalNumber}\n \n \n );\n\n element.investorsTrigger = (\n
\n
\n );\n }\n\n deleteRecord(record) {\n this.setState({ loading: true });\n APICall(`api/specializations/removefrommaster/${record.id}`, \"POST\", {})\n .then((data) => {\n this.setState({ loading: false });\n var response = data.data;\n if (response.status == \"success\") {\n Toastr(\"warning\", \"Record deleted\");\n this.init();\n } else {\n Toastr(\n \"error\",\n \"Your request generated an error. Try again after sometime\"\n );\n }\n console.log(data);\n })\n .catch((error) => {\n Toastr(\"error\", \"Please check your network connection\");\n this.setState({ loading: false });\n });\n }\n static contextType = DataContext;\n\n init(page, pageSize, query) {\n if (!query) query = \"\";\n\n this.setState({\n errorMessage: null,\n loading: true,\n searchQuery: query,\n page: page,\n pageSize: pageSize,\n });\n\n\n const { globalState, addItem } = this.context;\n this.setState({ profile: globalState?.data })\n const { state, country, userRole } = globalState?.user\n\n // api/Users/fetch/0/0/ranch/${country}/${state}\n\n let apiURL = `api/Users/fetch/0/0/ranch/${country}/${state}`\n // https://proteintrail.com/api/Users/getranchlist\n if (userRole == \"superadmin\") {\n apiURL = \"api/Users/getranchlist\"\n }\n // APICall(`api/ranch/get/${country}/${state}`, \"GET\", {})\n APICall(`${apiURL}`, \"GET\", {})\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n this.setState({ loading: false, data: null }, () => {\n this.setState({ data: response.data });\n });\n } else {\n this.setState({\n errorMessage:\n \"Your request generated an error. Try again after sometime\",\n loading: false,\n });\n }\n console.log(data);\n })\n .catch((error) => {\n this.setState({\n errorMessage:\n \"Your request generated an error. Please check your network connection\",\n loading: false,\n });\n });\n }\n\n render() {\n return this.state.redirect ? (\n \n \n
\n\n An error occurred, you can try reloading the page\n
\n \n
\n ) : null}\n\n {!this.state.data ? null : \n
\n \n
\n );\n }\n\n updateRecordForm() {\n return (\n ADD RANCH
\n\n \n
\n
\n \n
\n );\n }\n\n addRecord() {\n this.setState({ loading: true, saveErrorMessage: null });\n APICall(\"/api/Users/register/ranch\", \"POST\", this.state.payload)\n .then((data) => {\n var response = data.data;\n this.setState({ loading: false });\n if (response.isSuccess) {\n Toastr(\"success\", \"New record added\");\n this.setState({ modalIsOpen: false, payload: {} });\n } else {\n this.setState({ saveErrorMessage: response.message });\n }\n })\n .catch((error) => {\n this.setState({\n loading: false,\n saveErrorMessage: \"An error occurred, please check your network\",\n });\n });\n }\n\n updateRecord() {\n this.setState({ loading: true, saveErrorMessage: null });\n APICall(\n `api/abattoirs/update/${this.state.selectedRecord.id}`,\n \"POST\",\n this.state.selectedRecord\n )\n .then((data) => {\n var response = data.data;\n this.setState({ loading: false });\n if (response.isSuccess) {\n Toastr(\"success\", \"Record updated\");\n this.setState({ selectedRecord: null });\n this.reloadPage();\n } else {\n this.setState({ saveErrorMessage: response.message });\n }\n })\n .catch((error) => {\n this.setState({\n loading: false,\n saveErrorMessage: \"An error occurred, please check your network\",\n });\n });\n }\n\n selectRecord(record) {\n this.setState({ selectedRecord: record });\n }\n\n reloadPage() {\n this.setState({ reloading: true }, () => {\n setTimeout(() => {\n this.setState({ reloading: false });\n }, 1000);\n });\n }\n\n render() {\n return (\n <>\n UPDATE RANCH
\n\n \n
\n
\n \n \n );\n }\n}\n","import React, { useState, useEffect, useContext } from \"react\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Modal from \"react-modal\";\nimport { throttle } from \"lodash\";\nimport MyTable from \"../Utils/MyTable\";\nimport Spinner from \"../Utils/Spinner\";\nimport DropdownLinkMenu from \"./DropdownLinkMenu\";\nimport { DataContext } from \"../Contexts/DataContexts\";\nimport APICall from \"../Utils/APICall\";\nimport CenterBlock from \"./CenterBlock\";\nimport Functions from \"../Utils/Functions\";\nimport Constants from \"../Utils/Constants\";\n\nconst RanchAnimalMonthlyList = (props) => {\n const { selectRecord, animalTag } = props;\n const [loading, setLoading] = useState(true);\n const [data, setData] = useState([]);\n const [errorMessage, setErrorMessage] = useState(null);\n const [searchQuery, setSearchQuery] = useState(\"\");\n const [page, setPage] = useState(1);\n const [pageSize, setPageSize] = useState(10);\n const [modalIsOpen, setModalIsOpen] = useState(false);\n const [uploadErrorMessage, setUploadErrorMessage] = useState(null);\n const [uploading, setUploading] = useState(false);\n const [redirect, setRedirect] = useState(null);\n const [user, setUser] = useState({});\n const [alreadyGotResults, setAlreadyGotResults] = useState(false);\n const [selectedAnimal, setSelectedAnimal] = useState({});\n\n\n const throttledReload = throttle(() => {\n init(page, pageSize, searchQuery);\n }, 500);\n\n const context = useContext(DataContext);\n\n useEffect(() => {\n Modal.setAppElement(\"body\");\n init();\n // new Functions().whoIsLoggedIn(this.setLoggedInUser, false);\n }, [animalTag]);\n\n const RenderTable = (_data) => {\n const headerList = [\n {\n Header: \"\",\n accessor: \"actionsComponent\",\n },\n {\n Header: \"Animal Tag\",\n accessor: \"animalTag\",\n },\n {\n Header: \"Weight\",\n accessor: \"weight\",\n },\n {\n Header: \"Feed\",\n accessor: \"feed\",\n },\n {\n Header: \"Illness\",\n accessor: \"illness\",\n },\n {\n Header: \"Deworm\",\n accessor: \"deworm\",\n },\n {\n Header: \"Date\",\n accessor: \"dateRecordCreated\",\n },\n {\n Header: \"\",\n accessor: \"investorsTrigger\",\n },\n ];\n\n _data._data.forEach((element) => {\n element.nameComponent = (\n \n \n {this.state.reloading ? (\n this.selectRecord(r)}\n />\n )}\n \n )}\n \n
\n \n
\n );\n };\n\n const init = (page, pageSize, query) => {\n if (!query) query = \"\";\n\n setSearchQuery(query);\n setPage(page);\n setPageSize(pageSize);\n\n context && setUser(context.globalState?.user);\n\n // const { state, country, userRole, id } = context?.globalState?.user;\n\n // let apiURL = `api/vets/get/${country}/${state}`;\n\n // if (userRole === \"superadmin\") {\n // apiURL = \"api/vets/list\";\n // }\n\n // /api/Ranch/getmonthlyranchanimalbyanimaltag/{animalTag}\n\n\n APICall(`/api/Ranch/getmonthlyranchanimalbyanimaltag/${animalTag}`, \"GET\", {})\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n setData(response.data)\n } else {\n setErrorMessage(\n \"Your request generated an error. Try again after sometime\"\n );\n setLoading(false);\n }\n console.log(data);\n })\n .catch((error) => {\n setErrorMessage(\n \"Your request generated an error. Please check your network connection\"\n );\n setLoading(false);\n });\n };\n\n return redirect ? (\n \n \n
\n\n An error occurred, you can try reloading the page\n
\n \n
\n ) : null}\n\n\n\n\n\n \n
\n \n
\n \n\n\n {!data ? null : Monthly record for animal on {Functions.sqlDateString(selectedAnimal?.dateCreated)}\n
\n\n \n
\n
\n \n
\n\n );\n };\n\n const loadData = () => {\n setLoading(true);\n setErrorMessage(null);\n\n APICall(\"api/dashboard/admin\", \"GET\", null)\n .then((data) => {\n const response = data.data;\n if (response.isSuccess) {\n setData(response.data);\n setErrorMessage(null);\n setLoading(false);\n\n const diseaseData = {\n labels: [],\n datasets: [\n {\n label: \"Healthy\",\n data: [],\n backgroundColor: \"rgb(255, 99, 132)\",\n },\n {\n label: \"Diseased\",\n data: [],\n backgroundColor: \"rgb(54, 162, 235)\",\n },\n ],\n };\n\n response.data.diseaseDistribution.forEach((e) => {\n diseaseData.labels.push(e.key);\n diseaseData.datasets[0].data.push(e.value2);\n diseaseData.datasets[1].data.push(e.value);\n });\n\n setDiseaseDistributionData(diseaseData);\n } else {\n setErrorMessage(response.message);\n setLoading(false);\n }\n })\n .catch((error) => {\n setErrorMessage(\"An error occurred, please check your network\");\n setLoading(false);\n });\n\n\n\n\n\n APICall(`api/Ranch/getranchanimalbyanimaltag/${props.match.params.animalTag}`, \"GET\", null)\n .then((data) => {\n const response = data.data;\n if (response.isSuccess) {\n setData(response.data);\n setErrorMessage(null);\n setLoading(false);\n setAnimal(response.data)\n\n const diseaseData = {\n labels: [],\n datasets: [\n {\n label: \"Healthy\",\n data: [],\n backgroundColor: \"rgb(255, 99, 132)\",\n },\n {\n label: \"Diseased\",\n data: [],\n backgroundColor: \"rgb(54, 162, 235)\",\n },\n ],\n };\n\n response.data.diseaseDistribution.forEach((e) => {\n diseaseData.labels.push(e.key);\n diseaseData.datasets[0].data.push(e.value2);\n diseaseData.datasets[1].data.push(e.value);\n });\n\n setDiseaseDistributionData(diseaseData);\n } else {\n setErrorMessage(response.message);\n setLoading(false);\n }\n })\n .catch((error) => {\n setErrorMessage(\"An error occurred, please check your network\");\n setLoading(false);\n });\n\n\n\n\n APICall(`api/Ranch/getmonthlyranchanimalbyanimaltag/${props.match.params.animalTag}`, \"GET\", null)\n .then((data) => {\n const response = data.data;\n console.log(response)\n alert(JSON.parse(response))\n if (true) {\n setData(response.data);\n setErrorMessage(null);\n setLoading(false);\n setLineData({\n labels: Array.from({ length: response.length }, (_, index) => `Mth ${index + 1}`),\n datasets: [\n {\n label: \"# of Votes\",\n data: response.map((item) => item.weight),\n fill: true,\n backgroundColor: \"rgb(131, 183, 57)\",\n borderColor: \"rgba(0, 110, 71, 0.45)\",\n },\n ],\n })\n } else {\n setErrorMessage(response.message);\n setLoading(false);\n }\n })\n .catch((error) => {\n setErrorMessage(\"An error occurred, please check your network\");\n setLoading(false);\n });\n\n };\n\n const statBox = (prop) => {\n return (\n Add Animal Monthly Record
\n\n \n
\n
\n );\n };\n\n const singleAnimalItem = ({ label, prop }) => {\n return (\n <>\n \n \n
\n \n
\n \n {prop.title}
\n\n {prop.data}\n
\n\n {label}\n
\n {animal[prop]}\n
\n \n \n );\n };\n\n const animalBirthInfoDisplay = () => {\n return (\n
\n
\n );\n };\n\n const animalDeliveryInfoDisplay = () => {\n return (\n \n {singleAnimalItem({ label: \"Specie\", prop: \"specie\" })}\n
\n \n {singleAnimalItem({ label: \"Sub-specie\", prop: \"subSpecie\" })}\n
\n \n {singleAnimalItem({ label: \"Tag Number\", prop: \"animalTagId\" })}\n
\n \n {singleAnimalItem({ label: \"Weight\", prop: \"weightAtBirth\" })}\n
\n \n {singleAnimalItem({ label: \"Color\", prop: \"color\" })}\n
\n \n {singleAnimalItem({ label: \"Gender\", prop: \"gender\" })}\n
\n\n \n <>\n
\n \n \n
\n \n Date of Birth\n
\n\n {Functions.sqlDateString(animal[\"dateOfBirth\"])}\n
\n \n \n
\n
\n );\n };\n\n return (\n <>\n \n {singleAnimalItem({ label: \"Specie\", prop: \"specie\" })}\n
\n \n {singleAnimalItem({ label: \"Sub-specie\", prop: \"subSpecie\" })}\n
\n \n {singleAnimalItem({ label: \"Tag Number\", prop: \"animalTagId\" })}\n
\n \n {singleAnimalItem({ label: \"Weight\", prop: \"weightAtBirth\" })}\n
\n \n {singleAnimalItem({ label: \"Color\", prop: \"color\" })}\n
\n \n {singleAnimalItem({ label: \"Gender\", prop: \"gender\" })}\n
\n \n {singleAnimalItem({ label: \"Date of Birth\", prop: \"dateOfBirth\" })}\n
\n \n {singleAnimalItem({ label: \"Date of Birth\", prop: \"dateOfBirth\" })}\n
\n {saveErrorMessage}
\n )}\n \n\n\n\n\n {animal && (\n <>\n
\n\n \n )}\n
\n {/* \n
\n \n
\n \n Animal Birth Information\n
\n {animalBirthInfoDisplay()}\n\n\n \n )}\n
\n
\n\n\n\n\n \n
\n \n
\n \n
\n Animal Monthly Records
\n\n\n {modalIsOpen || (\n setSelectedRecord(r)}\n animalTag={props.match.params.animalTag}\n />\n )}\n\n
\n \n
\n\n \n
\n \n \n
\n \n
\n \n \n
\n \n \n
\n \n
\n Gross Weight at Slaughter
\n\n\n {/* KG: {this.state?.animalSlaughterInfo?.weight ? `${this.state?.animalSlaughterInfo?.weight}` : \"-\"} */}\n
\n\n
*/}\n \n \n );\n};\n\nexport default SingleAnimal;\n","import React, { Component } from \"react\";\nimport MainLayout from \"../../Components/Layouts/MainLayout\";\nimport CardBlock from \"../../Components/CardBlock\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Constants from \"../../Utils/Constants\";\nimport APICall from \"../../Utils/APICall\";\nimport Spinner from \"../../Utils/Spinner\";\nimport SpinnerButton from \"../../Utils/SpinnerButton\";\nimport Toastr from \"../../Utils/Toastr\";\nimport Modal from \"react-modal\";\nimport Select from \"react-select\";\nimport DataAPI from \"../../Utils/DataAPI\";\nimport Functions from \"../../Utils/Functions\";\nimport { DataContext } from \"../../Contexts/DataContexts\";\n\nexport default class TakeTagDeliveryPage extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: false,\n data: null,\n errorMessage: null,\n step: 1,\n currentCheckin: {},\n distributors: [],\n redirectUrl: null,\n payload: {},\n investors: [],\n animalConfiguration: {},\n species: [],\n subSpecies: [],\n animalColors: [],\n nigerianStates: [],\n modeOfSlaughter: [],\n paymentChannel: null,\n amountPayable: 0,\n\n };\n\n this.formControl = this.formControl.bind(this);\n }\n\n paymentChannels = [\n { label: \"Card\", value: \"card\" },\n { label: \"Cash\", value: \"cash\" },\n { label: \"POS\", value: \"pos\" },\n ];\n\n genders = [\n { label: \"Male\", value: \"M\" },\n { label: \"Female\", value: \"F\" },\n ];\n static contextType = DataContext;\n\n init = async () => {\n this.getLastCheckin();\n Modal.setAppElement(\"body\");\n const _config = await DataAPI.diseaseReportingConfiguration();\n const _species = [];\n _config.species.forEach((element) => {\n _species.push({ label: element, value: element });\n });\n\n\n const _nigerianStates = [];\n Constants.nigerianStates.forEach((element) => {\n _nigerianStates.push({ label: element, value: element });\n });\n\n const _modeOfSlaughter = [];\n Constants.modeOfSlaughter.forEach((element) => {\n _modeOfSlaughter.push({ label: element, value: element });\n });\n\n const { globalState, addItem } = this.context;\n this.setState({ profile: globalState?.data })\n const { state, country } = globalState?.user\n\n const _distributors = (await DataAPI.listDistributors(state, country)) || [];\n\n _distributors &&\n _distributors.forEach((element) => {\n element.value = element.id;\n element.label = element.companyName;\n });\n\n _distributors.push({\n label: \"UNREGISTERED\",\n value: 0,\n id: 0,\n companyName: \"UNREGISTERED\",\n });\n\n this.setState({\n animalConfiguration: _config,\n species: _species,\n nigerianStates: _nigerianStates,\n modeOfSlaughter: _modeOfSlaughter,\n distributors: _distributors,\n });\n };\n\n componentDidMount = async () => {\n // this.getLocation();\n await this.init();\n };\n componentDidUpdate = async () => {\n console.log(this.state.payload)\n\n };\n\n getLastCheckin() {\n APICall(\"api/vets/lastcheckin\", \"get\")\n .then((data) => {\n if (data.data.isSuccess) {\n let response = data.data;\n if (response.data) {\n this.setState({ currentCheckin: response.data }, () => { });\n }\n }\n })\n .catch((error) => {\n console.log(error);\n });\n }\n\n calculateAmount = () => {\n if (!this.state.payload?.specie || !this.state.payload?.weight) {\n return;\n }\n APICall(\n `api/abattoirs/takedelivery/getamount/${this.state.payload.specie}/${this.state.payload.weight}`,\n \"get\"\n )\n .then((data) => {\n if (data.data.isSuccess) {\n const response = data.data;\n this.setState({ amountPayable: response.data });\n }\n })\n .catch((error) => {\n console.log(error);\n });\n };\n\n takeDeliveryNow() {\n let payload = this.state.payload;\n payload.abattoirId = this.state.currentCheckin.id;\n payload.weight = parseInt(this.state.payload.weight);\n\n payload.specie = this.state.animal.specie.toUpperCase();\n payload.subSpecie = this.state.animal.subSpecie\n payload.color = this.state.animal.color\n payload.gender = this.state.animal.gender\n payload.animalOwner = this.state.animal.user.name\n payload.stateOfOrigin = this.state.animal.user.state\n\n\n if (!payload.animalOwner) {\n Toastr(\"error\", \"Select animal owner\");\n return;\n }\n if (!this.state.paymentChannel) {\n Toastr(\"error\", \"Select payment channel\");\n return;\n }\n\n if (payload.distributorId === 0 && !payload.buyerName) {\n Toastr(\"error\", \"Buyer name is required\");\n return;\n }\n\n this.setState({ loading: true, errorMessage: null });\n APICall(\n `api/Abattoirs/takedeliveryfromranchanimal/${this.state.paymentChannel}/${this.state.animal.animalTagId}`,\n \"post\",\n payload\n )\n .then((data) => {\n const response = data.data;\n if (response.isSuccess) {\n Toastr(\"success\", \"Delivery taken successfully\");\n this.setState({\n redirectUrl: \"/in/take-delivery-success/\" + response.data.tagNumber,\n });\n } else {\n this.setState({ loading: false, errorMessage: response.message });\n }\n })\n .catch((error) => {\n console.log(error);\n this.setState({\n loading: false,\n errorMessage: \"Check your network connection\",\n });\n });\n }\n\n updateProp(value, prop) {\n if (prop == \"specie\") {\n this.loadSpeciesConfigs(value);\n this.updateProp(null, \"subSpecie\");\n this.updateProp(null, \"color\");\n }\n\n let payload = this.state.payload;\n if (!payload) payload = {};\n payload[prop] = value;\n this.setState({ payload: payload }, () => {\n if (prop == \"weight\" || prop == \"specie\") {\n this.calculateAmount();\n }\n });\n }\n\n loadSpeciesConfigs(specie) {\n this.loadSubSpecies(specie);\n this.loadSpeciesColors(specie);\n }\n\n loadSpeciesColors(specie) {\n const _colors =\n this.state.animalConfiguration.colorOptions.filter(\n (a) => a.specie.toLowerCase() == specie.toLowerCase()\n ) || [];\n\n const _colorOptions = [];\n _colors.forEach((element) => {\n _colorOptions.push({\n label: element.color,\n value: element.color,\n });\n });\n\n this.setState({ animalColors: _colorOptions });\n }\n\n loadSubSpecies(specie) {\n const _subSpecies =\n this.state.animalConfiguration.subSpecies.filter(\n (a) => a.specie.toLowerCase() == specie.toLowerCase()\n ) || [];\n\n const _subSpeciesOptions = [];\n _subSpecies.forEach((element) => {\n _subSpeciesOptions.push({\n label: element.subSpecie,\n value: element.subSpecie,\n });\n });\n\n this.setState({ subSpecies: _subSpeciesOptions });\n }\n\n handleChange(option) {\n let payload = this.state.payload;\n if (!payload) payload = {};\n payload.distributorId = option.id;\n this.setState({ payload: payload });\n }\n\n formGroupRow({ colClass, children }) {\n return (\n \n
\n \n
\n \n
\n Ranch Performance
\nSales Report
\nLoss Report
\n\n
\n );\n }\n\n formGroupRow2({ colClass, children, extraChildren }) {\n return (\n {children}
\n \n
\n );\n }\n\n formControl({ label, prop, inputType, required }) {\n if (!inputType) inputType = \"text\";\n let payload = this.state.payload;\n if (!payload) payload = {};\n\n return (\n <>\n \n {children}
\n {extraChildren && {extraChildren}
}\n \n {label}\n
\n {this.state.animal[prop]}\n
\n \n \n );\n };\n\n animalBirthInformationDisplay = () => {\n return (\n
\n
\n );\n };\n\n render() {\n return this.state.redirectUrl ? (\n \n {this.singleAnimalItem({ label: \"Specie\", prop: \"specie\" })}\n
\n \n {this.singleAnimalItem({ label: \"Sub-specie\", prop: \"subSpecie\" })}\n
\n \n {this.singleAnimalItem({ label: \"Tag Number\", prop: \"animalTagId\" })}\n
\n \n {this.singleAnimalItem({ label: \"Weight\", prop: \"weightAtBirth\" })}\n
\n \n {this.singleAnimalItem({ label: \"Color\", prop: \"color\" })}\n
\n \n {this.singleAnimalItem({ label: \"Gender\", prop: \"gender\" })}\n
\n\n\n\n \n\n <>\n
\n \n \n
\n \n State of Origin\n
\n\n {this.state.animal.user.state}\n
\n \n \n
\n\n <>\n
\n \n \n
\n\n\n \n Animal Owner\n
\n\n {this.state.animal.user.name}\n
\n \n \n
\n <>\n
\n \n \n
\n\n\n \n Date of Birth\n
\n\n {Functions.sqlDateString(this.state.animal[\"dateOfBirth\"])}\n
\n \n \n
\n
\n <>\n\n\n
\n \n
\n\n\n\n {this.state.animal && (\n <>\n \n \n this.updateProp(e.target.value, \"tagNumber\")\n }\n className=\"form-control\"\n />\n
\n \n {this.state.validateLoading ? (\n { this.fetchBirthInformation() }}\n className=\"btn btn-success\"\n type=\"button\"\n >\n Fetch Animal\n \n )}\n
\n \n
\n \n
\n \n Animal Birth Information\n
\n {this.animalBirthInformationDisplay()}\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n \n )}\n \n
\n
\n
\n
\n \n \n {this.state.animal && (\n \n
\n \n )}\n \n
\n \n
\n ) : null}\n\n \n
\n \n \n this.takeDeliveryNow()}\n className=\"btn btn-success mr-2 btn-block btn-rounded\"\n label=\"Take Delivery\"\n loading={this.state.loading}\n />\n
\n \n
\n );\n }\n\n formControl({ label, prop, inputType, required }) {\n if (!inputType) inputType = \"text\";\n let payload = this.state.payload;\n if (!payload) payload = {};\n\n return (\n <>\n \n {children}
\n {extraChildren && {extraChildren}
}\n \n {label}\n
\n {this.state.animal[prop]}\n
\n \n \n );\n };\n\n animalBirthInformationDisplay = () => {\n return (\n
\n
\n );\n };\n\n render() {\n return this.state.redirectUrl ? (\n \n {this.singleAnimalItem({ label: \"Specie\", prop: \"specie\" })}\n
\n \n {this.singleAnimalItem({ label: \"Sub-specie\", prop: \"subSpecie\" })}\n
\n\n \n {this.singleAnimalItem({ label: \"Color\", prop: \"color\" })}\n
\n \n {this.singleAnimalItem({ label: \"Gender\", prop: \"gender\" })}\n
\n \n <>\n
\n \n \n
\n \n Weight at Birth\n
\n {`${this.state.animal[\"weightAtBirth\"]}kg`}
\n \n \n
\n <>\n
\n \n \n
\n\n \n Weight at Slaughter\n
\n {this.state?.animalSlaughterInfo?.weight ? `${this.state?.animalSlaughterInfo?.weight}kg` : \"-\"}\n
\n \n \n
\n <>\n
\n \n \n
\n \n Date of Birth\n
\n\n {Functions.sqlDateString(this.state.animal[\"dateOfBirth\"])}\n
\n \n \n
\n <>\n
\n \n \n
\n\n\n \n Date of Slaughter\n
\n {this.state?.animalSlaughterInfo?.dateCreated ? Functions.sqlDateString(this.state?.animalSlaughterInfo?.dateCreated) : \"-\"}\n
\n \n \n
\n <>\n
\n \n
\n \n State of Origin\n
\n {this.state.animal.user.state}\n
\n \n
\n <>\n
\n \n \n
\n \n Animal Owner\n
\n {this.state.animal.user.name}\n
\n \n \n
\n
\n \n \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n \n {this.state.step == 1 && (\n \n
\n \n
\n \n )}\n
\n \n
\n \n \n )}\n
\n
\n \n
\n \n
\n \n
\n \n
\n \n \n 10k{\" \"}\n
\n \n
\n \n
\n \n \n
\n \n \n
\n \n
\n \n Animal Growth Chart\n
\n\n 10k{\" \"}\n \n animals\n \n
\n \n \n
\n \n
\n \n \n
\n \n \n
\n \n
\n Income
\n\n YTD: 59,565.00\n
\n\n \n
\n \n \n
\n \n
\n \n \n
\n \n \n
\n \n
\n \n
\n \n Healthy vs Diseased animals\n
\n- \n
- \n
- \n
\n
\n\n\n\n\n\n\n \n )}\n \n \n \n \n )}\n {this.state.step == 2 && (\n \n\n \n {this.state.reloading ? (\n this.setSelectedRecord(r)}\n animalTag={this.state.payload?.tagNumber}\n />\n \n )}\n \n
\n \n
\n\n Animal Monthly Record
\n\n
\n \n \n
\n \n
\n \n \n
\n ) : null}\n\n \n
\n \n \n
\n \n
\n \n this.setState({ step: 1 })}\n className=\"btn btn-link\"\n >\n {\"< \"} Back\n \n
\n \n this.issueCertificate()}\n className=\"btn btn-success btn-rounded\"\n label=\"Issue Certificate\"\n loading={this.state.loading}\n />\n
\n \n
\n );\n }\n\n formControl({ label, prop, inputType, required }) {\n if (!inputType) inputType = \"text\";\n let payload = this.state.payload;\n if (!payload) payload = {};\n\n return (\n <>\n \n {children}
\n {extraChildren && {extraChildren}
}\n \n {label}\n
\n {this.state.animal[prop]}\n
\n \n \n );\n };\n\n animalBirthInformationDisplay = () => {\n return (\n
\n
\n );\n };\n\n\n render() {\n return this.state.redirectUrl ? (\n \n {this.singleAnimalItem({ label: \"Specie\", prop: \"specie\" })}\n
\n \n {this.singleAnimalItem({ label: \"Sub-specie\", prop: \"subSpecie\" })}\n
\n\n \n {this.singleAnimalItem({ label: \"Color\", prop: \"color\" })}\n
\n \n {this.singleAnimalItem({ label: \"Gender\", prop: \"gender\" })}\n
\n \n <>\n
\n \n \n
\n \n Weight at Birth\n
\n {`${this.state.animal[\"weightAtBirth\"]}kg`}
\n \n \n
\n <>\n
\n \n \n
\n\n \n Weight at Slaughter\n
\n {this.state?.animalSlaughterInfo?.weight ? `${this.state?.animalSlaughterInfo?.weight}kg` : \"-\"}\n
\n \n \n
\n <>\n
\n \n \n
\n \n Date of Birth\n
\n\n {Functions.sqlDateString(this.state.animal[\"dateOfBirth\"])}\n
\n \n \n
\n <>\n
\n \n \n
\n\n\n \n Date of Slaughter\n
\n {this.state?.animalSlaughterInfo?.dateCreated ? Functions.sqlDateString(this.state?.animalSlaughterInfo?.dateCreated) : \"-\"}\n
\n \n \n
\n <>\n
\n \n \n
\n \n State of Origin\n
\n {this.state.animal.user.state}\n
\n \n \n
\n <>\n
\n \n \n
\n\n \n Animal Owner\n
\n\n {this.state.animal.user.name ? this.state.animal.user.name : \"-\"}\n\n
\n \n \n
\n <>\n
\n \n \n
\n\n \n Ranch Address\n
\n {this.state.animal.user.operatingAddress ? this.state.animal.user.operatingAddress : \"-\"}\n
\n \n \n
\n <>\n
\n \n \n
\n\n \n Mode of Slaughter\n
\n {this.state?.animalSlaughterInfo?.modeOfSlaughter ? this.state?.animalSlaughterInfo?.modeOfSlaughter : \"-\"}\n
\n \n \n
\n <>\n
\n \n \n
\n\n \n Meat Distributor's Name\n
\n {this.state?.animalSlaughterInfo?.buyerName ? this.state?.animalSlaughterInfo?.buyerName : \"-\"}\n
\n \n \n
\n <>\n
\n \n \n
\n\n \n Vet's observations at slaughter\n
\n {this.state?.animalSlaughterInfo?.vetObservations ? this.state?.animalSlaughterInfo?.vetObservations : \"-\"}\n
\n \n \n
\n
\n \n \n )}\n\n\n \n\n\n\n\n \n \n }\n />\n\n \n );\n }\n}\n","import React, { useState, useEffect, useContext } from \"react\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Modal from \"react-modal\";\nimport { throttle } from \"lodash\";\nimport MyTable from \"../Utils/MyTable\";\nimport Spinner from \"../Utils/Spinner\";\nimport DropdownLinkMenu from \"./DropdownLinkMenu\";\nimport { DataContext } from \"../Contexts/DataContexts\";\nimport APICall from \"../Utils/APICall\";\nimport CenterBlock from \"./CenterBlock\";\n\nconst RanchAnimalList = (props) => {\n const { selectRecord, animal } = props;\n const [loading, setLoading] = useState(true);\n const [data, setData] = useState([]);\n const [errorMessage, setErrorMessage] = useState(null);\n const [searchQuery, setSearchQuery] = useState(\"\");\n const [page, setPage] = useState(1);\n const [pageSize, setPageSize] = useState(10);\n const [modalIsOpen, setModalIsOpen] = useState(false);\n const [uploadErrorMessage, setUploadErrorMessage] = useState(null);\n const [uploading, setUploading] = useState(false);\n const [redirect, setRedirect] = useState(null);\n const [user, setUser] = useState({});\n const [alreadyGotResults, setAlreadyGotResults] = useState(false);\n\n const throttledReload = throttle(() => {\n init(page, pageSize, searchQuery);\n }, 500);\n\n const context = useContext(DataContext);\n\n useEffect(() => {\n Modal.setAppElement(\"body\");\n init();\n // new Functions().whoIsLoggedIn(this.setLoggedInUser, false);\n }, [animal]);\n\n const RenderTable = (_data) => {\n const headerList = [\n {\n Header: \"\",\n accessor: \"actionsComponent\",\n },\n {\n Header: \"Animal Tag\",\n accessor: \"animalTagId\",\n },\n {\n Header: \"Sub-Specie\",\n accessor: \"subSpecie\",\n },\n {\n Header: \"Dam\",\n accessor: \"dam\",\n },\n {\n Header: \"Sire\",\n accessor: \"sire\",\n },\n {\n Header: \"Gender\",\n accessor: \"gender\",\n },\n {\n Header: \"\",\n accessor: \"investorsTrigger\",\n },\n ];\n\n _data._data.forEach((element) => {\n element.nameComponent = (\n \n {this.state.step == 1 && (\n \n
\n\n\n \n
\n \n )}\n
\n \n
\n \n \n )}\n
\n
\n \n
\n \n
\n \n
\n\n \n
\n \n \n
\n \n
\n \n \n
\n \n \n
\n \n
\n Gross Weight at Slaughter
\n\n\n KG: {this.state?.animalSlaughterInfo?.weight ? `${this.state?.animalSlaughterInfo?.weight}` : \"-\"}\n
\n\n
\n\n\n\n {console.log(this.state?.animalSlaughterInfo, this.state?.animalSlaughterInfo?.abattoirId)}\n \n\n \n {this.state.reloading ? (\n this.setSelectedRecord(r)}\n animalTag={this.state.payload?.tagNumber}\n />\n \n )}\n \n
\n \n
\n\n Animal Monthly Record
\nAnimal Certificate
\n \n \n )}\n \n\n
\n );\n };\n\n const init = (page, pageSize, query) => {\n if (!query) query = \"\";\n\n setSearchQuery(query);\n setPage(page);\n setPageSize(pageSize);\n\n context && setUser(context.globalState?.user);\n\n const { state, country, userRole, id } = context?.globalState?.user;\n\n let apiURL = `api/vets/get/${country}/${state}`;\n\n if (userRole === \"superadmin\") {\n apiURL = \"api/vets/list\";\n }\n\n\n APICall(`/api/Ranch/getranchanimalsbyspecie/${id}/${animal}`, \"GET\", {})\n .then((data) => {\n var response = data.data;\n if (response) {\n setData(response.data)\n } else {\n // setErrorMessage(\n // \"Your request generated an error. Try again after sometime\"\n // );\n setLoading(false);\n }\n })\n .catch((error) => {\n setErrorMessage(\n \"Your request generated an error. Please check your network connection\"\n );\n setLoading(false);\n });\n };\n\n return redirect ? (\n \n \n
\n\n An error occurred, you can try reloading the page\n
\n \n
\n ) : null}\n\n {!data ? null : \n
\n \n
\n );\n };\n\n const updateRecordForm = () => {\n return (\n Add {props.match.params.animal}
\n\n \n
\n
\n \n
\n );\n };\n\n const addRecord = () => {\n setLoading(true);\n setSaveErrorMessage(null);\n APICall(\"api/users/register/vet\", \"POST\", payload)\n .then((data) => {\n var response = data.data;\n setLoading(false);\n if (response.isSuccess) {\n Toastr(\"success\", \"New veterinary officer added\");\n setModalIsOpen(false);\n setPayload({});\n } else {\n setSaveErrorMessage(response.message);\n }\n })\n .catch((error) => {\n setLoading(false);\n setSaveErrorMessage(\n \"An error occurred, please check your network\"\n );\n });\n };\n\n const updateRecord = () => {\n let updatedPayload = {\n id: selectedRecord.id,\n contactName: payload.contactName,\n email: payload.email,\n phoneNumber: payload.phoneNumber,\n };\n\n setLoading(true);\n setSaveErrorMessage(null);\n APICall(\"api/vets/update\", \"POST\", updatedPayload)\n .then((data) => {\n var response = data.data;\n if (response.isSuccess) {\n Toastr(\"success\", \"Record updated\");\n setSelectedRecord(null);\n setPayload({});\n setLoading(false);\n } else {\n setSaveErrorMessage(response.message);\n setLoading(false);\n }\n })\n .catch((error) => {\n setLoading(false);\n setSaveErrorMessage(\n \"An error occurred, please check your network\"\n );\n });\n };\n\n const selectRecord = (record) => {\n if (context.globalState.user.userRole.includes(\"admin\")) {\n setSelectedRecord(record);\n setPayload(record);\n }\n };\n\n useEffect(() => {\n setAnimal(props.match.params.animal);\n updateAnimalState();\n }, [props.match.params.animal]);\n\n const updateAnimalState = () => {\n const { match } = props;\n setAnimal(props.match.params.animal)\n };\n\n return (\n <>\n Update {props.match.params.animal}
\n\n \n
\n
\n \n \n );\n};\n\nexport default AnimalsPage;\n","import React, { Component } from \"react\";\nimport MainLayout from \"../../Components/Layouts/MainLayout\";\nimport CardBlock from \"../../Components/CardBlock\";\nimport { Link, Redirect } from \"react-router-dom\";\nimport Constants from \"../../Utils/Constants\";\nimport APICall from \"../../Utils/APICall\";\nimport Spinner from \"../../Utils/Spinner\";\nimport SpinnerButton from \"../../Utils/SpinnerButton\";\nimport Toastr from \"../../Utils/Toastr\";\nimport Modal from \"react-modal\";\nimport Select from \"react-select\";\nimport DataAPI from \"../../Utils/DataAPI\";\nimport Functions from \"../../Utils/Functions\";\nimport { DataContext } from \"../../Contexts/DataContexts\";\n\nexport default class AnimalBirthingInformationPage extends Component {\n constructor(props) {\n super(props);\n this.state = {\n loading: false,\n data: null,\n errorMessage: null,\n step: 1,\n currentCheckin: {},\n distributors: [],\n redirectUrl: null,\n payload: {},\n investors: [],\n animalConfiguration: {},\n species: [],\n subSpecies: [],\n animalColors: [],\n nigerianStates: [],\n modeOfSlaughter: [],\n paymentChannel: null,\n amountPayable: 0,\n\n };\n\n this.formControl = this.formControl.bind(this);\n }\n\n paymentChannels = [\n { label: \"Card\", value: \"card\" },\n { label: \"Cash\", value: \"cash\" },\n { label: \"POS\", value: \"pos\" },\n ];\n\n genders = [\n { label: \"Male\", value: \"M\" },\n { label: \"Female\", value: \"F\" },\n ];\n static contextType = DataContext;\n\n init = async () => {\n\n this.getLastCheckin();\n Modal.setAppElement(\"body\");\n const _config = await DataAPI.diseaseReportingConfiguration();\n const _species = [];\n _config.species.forEach((element) => {\n _species.push({ label: element, value: element });\n });\n\n\n const _nigerianStates = [];\n Constants.nigerianStates.forEach((element) => {\n _nigerianStates.push({ label: element, value: element });\n });\n\n const _modeOfSlaughter = [];\n Constants.modeOfSlaughter.forEach((element) => {\n _modeOfSlaughter.push({ label: element, value: element });\n });\n\n\n\n\n\n const { globalState, addItem } = this.context;\n\n this.setState({ profile: globalState?.data })\n const { state, country } = globalState?.user\n\n\n\n const _distributors = (await DataAPI.listDistributors(state, country)) || [];\n\n _distributors &&\n _distributors.forEach((element) => {\n element.value = element.id;\n element.label = element.companyName;\n });\n\n _distributors.push({\n label: \"UNREGISTERED\",\n value: 0,\n id: 0,\n companyName: \"UNREGISTERED\",\n });\n\n this.setState({\n animalConfiguration: _config,\n species: _species,\n nigerianStates: _nigerianStates,\n modeOfSlaughter: _modeOfSlaughter,\n distributors: _distributors,\n });\n };\n\n componentDidMount = async () => {\n // this.getLocation();\n // console.log(this.props.match.params.animal)\n // this.updateProp(this.props.match.params.animal, \"specie\")\n await this.init();\n };\n\n getLastCheckin() {\n APICall(\"api/vets/lastcheckin\", \"get\")\n .then((data) => {\n if (data.data.isSuccess) {\n let response = data.data;\n if (response.data) {\n this.setState({ currentCheckin: response.data }, () => { });\n }\n }\n })\n .catch((error) => {\n console.log(error);\n });\n }\n\n calculateAmount = () => {\n if (!this.state.payload?.specie || !this.state.payload?.weight) {\n return;\n }\n APICall(\n `api/abattoirs/takedelivery/getamount/${this.state.payload.specie}/${this.state.payload.weight}`,\n \"get\"\n )\n .then((data) => {\n if (data.data.isSuccess) {\n const response = data.data;\n this.setState({ amountPayable: response.data });\n }\n })\n .catch((error) => {\n console.log(error);\n });\n };\n\n takeDeliveryNow() {\n\n\n const { globalState, addItem } = this.context;\n let payload = this.state.payload;\n payload.ranchId = globalState.user.id;\n payload.dateOfBirth = `${payload.dateOfBirth}T23:20:06.428Z`;\n payload.dateOfWeaning = null;\n payload.specie = this.props.match.params.animal;\n payload.weightAtBirth = parseInt(payload.weightAtBirth);\n if (!payload.dam) {\n Toastr(\"error\", \"Enter Dam\");\n return;\n }\n if (!payload.sire) {\n Toastr(\"error\", \"Enter Sire\");\n return;\n }\n\n this.setState({ loading: true, errorMessage: null });\n APICall(\n `api/Ranch/createranchanimal`,\n \"post\",\n payload\n )\n .then((data) => {\n const response = data.data;\n if (response.isSuccess) {\n Toastr(\"success\", \"Birth Information taken successfully\");\n this.setState({\n redirectUrl: `/in/ranch/${this.props.match.params.animal}`,\n });\n } else {\n this.setState({ loading: false, errorMessage: response.message });\n\n }\n })\n .catch((error) => {\n console.log(error);\n this.setState({\n loading: false,\n errorMessage: \"Check your network connection\",\n });\n });\n }\n\n updateProp(value, prop) {\n if (prop == \"specie\") {\n this.loadSpeciesConfigs(value);\n this.updateProp(null, \"subSpecie\");\n this.updateProp(null, \"color\");\n }\n\n let payload = this.state.payload;\n if (!payload) payload = {};\n payload[prop] = value;\n this.setState({ payload: payload }, () => {\n if (prop == \"weight\" || prop == \"specie\") {\n this.calculateAmount();\n }\n });\n }\n\n loadSpeciesConfigs(specie) {\n this.loadSubSpecies(specie);\n this.loadSpeciesColors(specie);\n }\n\n loadSpeciesColors(specie) {\n const _colors =\n this.state.animalConfiguration.colorOptions.filter(\n (a) => a.specie.toLowerCase() == specie.toLowerCase()\n ) || [];\n\n const _colorOptions = [];\n _colors.forEach((element) => {\n _colorOptions.push({\n label: element.color,\n value: element.color,\n });\n });\n\n this.setState({ animalColors: _colorOptions });\n }\n\n loadSubSpecies(specie) {\n const _subSpecies =\n this.state.animalConfiguration.subSpecies.filter(\n (a) => a.specie.toLowerCase() == specie.toLowerCase()\n ) || [];\n\n const _subSpeciesOptions = [];\n _subSpecies.forEach((element) => {\n _subSpeciesOptions.push({\n label: element.subSpecie,\n value: element.subSpecie,\n });\n });\n\n this.setState({ subSpecies: _subSpeciesOptions });\n }\n\n handleChange(option) {\n let payload = this.state.payload;\n if (!payload) payload = {};\n payload.distributorId = option.id;\n this.setState({ payload: payload });\n }\n\n formGroupRow({ colClass, children }) {\n return (\n \n \n \n {console.log(\"xxx\", animal)}\n {selectedRecord ? null : modalIsOpen || \n
\n \n
\n );\n }\n\n formGroupRow2({ colClass, children, extraChildren }) {\n return (\n {children}
\n \n
\n );\n }\n\n formControl({ label, prop, inputType, required }) {\n if (!inputType) inputType = \"text\";\n let payload = this.state.payload;\n if (!payload) payload = {};\n\n return (\n <>\n \n {children}
\n {extraChildren && {extraChildren}
}\n \n
\n \n \n {this.state.step == 1 && (\n \n
\n \n )}\n \n
\n \n
\n ) : null}\n\n \n
\n \n \n this.takeDeliveryNow()}\n className=\"btn btn-success mr-2 btn-block btn-rounded\"\n label={`Take ${this.props.match.params.animal}'s Birth Information`}\n loading={this.state.loading}\n />\n
\n \n
\n \n )}\n \n {tabView && (\n
\n