({\r\n busca: \"\",\r\n tipoProduto: \"\",\r\n situacao: { label: \"\", value: \"\" },\r\n status: { label: \"\", value: \"\" },\r\n referencia: { label: \"\", value: \"\" },\r\n linha: { label: \"\", value: \"\" },\r\n });\r\n\r\n const [buscaState, setBuscaState] = useState(\"\");\r\n const [tipoState, setTipoState] = useState<{\r\n label: string;\r\n value: number;\r\n }>();\r\n const [situacaoState, setSituacaoState] = useState<{\r\n label: string;\r\n value: string;\r\n }>();\r\n const [statusState, setStatusState] = useState<{\r\n label: string;\r\n value: string;\r\n }>();\r\n const [referenciaState, setReferenciaState] = useState<\r\n {\r\n label: string;\r\n value: string;\r\n }[]\r\n >([]);\r\n const [linhaState, setLinhaState] = useState<\r\n {\r\n label: string;\r\n value: number;\r\n }[]\r\n >([]);\r\n\r\n const saveFiltersToLocalStorage = (filters: any) => {\r\n localStorage.setItem(\"filters\", JSON.stringify(filters));\r\n };\r\n\r\n //Effects\r\n useEffect(() => {\r\n if (query.get(\"busca\")) {\r\n handleChangeBusca(query.get(\"busca\") || \"\");\r\n }\r\n if (query.get(\"tipoProduto\")) {\r\n handleChangeProdutos(Number(query.get(\"tipoProduto\")));\r\n }\r\n if (query.get(\"situacao\")) {\r\n handleChangeSituacao(Number(query.get(\"situacao\") || \"\"));\r\n }\r\n if (query.get(\"status\")) {\r\n handleChangeStatus(Number(query.get(\"status\") || \"\"));\r\n }\r\n\r\n if (query.get(\"referencia\")) {\r\n const referenciasValues = query\r\n .getAll(\"referencia\")\r\n .map((item) => Number(item));\r\n const valueReferencia: { label: string; value: string }[] = [];\r\n referenciasValues.forEach((itemReferencia) => {\r\n const referenciasFinds = referencias.find(\r\n (item: any) => item.value === itemReferencia\r\n );\r\n if (referenciasFinds) {\r\n valueReferencia.push(referenciasFinds);\r\n }\r\n });\r\n if (valueReferencia.length) {\r\n handleChangeReferencia(valueReferencia);\r\n }\r\n }\r\n\r\n if (!loadedFilters) {\r\n const fetchData = async () => {\r\n try {\r\n const selectReferencias = await api.get(\r\n \"geral/selecaoReferenciaFiltro\"\r\n );\r\n setReferencias(selectReferencias.data);\r\n\r\n const selectTipoMaterial = await api.get(\"geral/selecaoTipoMaterial\");\r\n setTipoMateriais(selectTipoMaterial.data);\r\n } catch (error) {\r\n console.error(\"Erro ao carregar dados:\", error);\r\n }\r\n };\r\n\r\n fetchData();\r\n\r\n const savedFilters = localStorage.getItem(\"filters\");\r\n if (savedFilters) {\r\n const parsedFilters = JSON.parse(savedFilters);\r\n setSearchValue(parsedFilters.busca || \"\");\r\n } else {\r\n saveFiltersToLocalStorage(localFilters);\r\n }\r\n\r\n setLoadedFilters(true);\r\n }\r\n }, [loadedFilters, query]);\r\n\r\n useEffect(() => {\r\n if (query.get(\"linha\")) {\r\n const linhasValues = query.getAll(\"linha\").map((item) => Number(item));\r\n\r\n const valueLinhas: { label: string; value: number }[] = [];\r\n linhasValues.forEach((itemLinha) => {\r\n const linhaFind = linhas.find((item: any) => item.value === itemLinha);\r\n if (linhaFind) {\r\n valueLinhas.push(linhaFind);\r\n }\r\n });\r\n if (valueLinhas.length) {\r\n handleChangeLinha(valueLinhas);\r\n }\r\n }\r\n }, [linhas, query]);\r\n\r\n // Handles\r\n const handleChangeBusca = useCallback(\r\n debounce(async (busca) => {\r\n if (busca) {\r\n produtoContext.setFiltro((prevState: any) => ({\r\n ...prevState,\r\n busca: busca,\r\n }));\r\n\r\n if (busca) {\r\n setBuscaState(busca);\r\n }\r\n\r\n saveFiltersToLocalStorage({\r\n ...produtoContext.filtro,\r\n busca: busca,\r\n });\r\n return;\r\n }\r\n saveFiltersToLocalStorage({\r\n ...produtoContext.filtro,\r\n busca: \"\",\r\n });\r\n setBuscaState(\"\");\r\n produtoContext.setFiltro((prevState: any) => ({\r\n ...prevState,\r\n busca: \"\",\r\n }));\r\n }, 0),\r\n []\r\n );\r\n\r\n const handleChangeProdutos = (tipoValue: number | null) => {\r\n if (tipoValue !== null && tipoValue !== undefined) {\r\n produtoContext.setFiltro((prevState: any) => ({\r\n ...prevState,\r\n tipoProduto: tipoValue,\r\n }));\r\n\r\n const tipoResult = tipoMateriais.find((item) => item.value === tipoValue);\r\n if (tipoResult) {\r\n setTipoState(tipoResult);\r\n }\r\n\r\n saveFiltersToLocalStorage({\r\n ...produtoContext.filtro,\r\n tipoProduto: tipoValue,\r\n });\r\n return;\r\n }\r\n saveFiltersToLocalStorage({\r\n ...produtoContext.filtro,\r\n tipoProduto: \"\",\r\n });\r\n setTipoState(undefined);\r\n produtoContext.setFiltro((prevState: any) => ({\r\n ...prevState,\r\n tipoProduto: \"\",\r\n }));\r\n };\r\n\r\n const handleChangeSituacao = (situacaoValue: number | null) => {\r\n if (situacaoValue !== null && situacaoValue !== undefined) {\r\n produtoContext.setFiltro((prevState: any) => ({\r\n ...prevState,\r\n situacao: situacaoValue,\r\n }));\r\n const situacaoResult = situacao.find(\r\n (item) => item.value === situacaoValue.toString()\r\n );\r\n if (situacaoResult) {\r\n setSituacaoState(situacaoResult);\r\n }\r\n\r\n saveFiltersToLocalStorage({\r\n ...produtoContext.filtro,\r\n situacao: situacaoValue,\r\n });\r\n return;\r\n }\r\n saveFiltersToLocalStorage({\r\n ...produtoContext.filtro,\r\n situacao: \"\",\r\n });\r\n setSituacaoState(undefined);\r\n produtoContext.setFiltro((prevState: any) => ({\r\n ...prevState,\r\n situacao: \"\",\r\n }));\r\n };\r\n\r\n const handleChangeStatus = (statusValue: number) => {\r\n if (statusValue !== null && statusValue !== undefined) {\r\n produtoContext.setFiltro((prevState: any) => ({\r\n ...prevState,\r\n status: statusValue,\r\n }));\r\n const statusResult = status.find(\r\n (item) => item.value === (statusValue?.toString() || \"\")\r\n );\r\n if (statusResult) {\r\n setStatusState(statusResult);\r\n }\r\n saveFiltersToLocalStorage({\r\n ...produtoContext.filtro,\r\n status: statusValue,\r\n });\r\n return;\r\n }\r\n saveFiltersToLocalStorage({\r\n ...produtoContext.filtro,\r\n status: \"\",\r\n });\r\n setStatusState(undefined);\r\n produtoContext.setFiltro((prevState: any) => ({\r\n ...prevState,\r\n status: \"\",\r\n }));\r\n };\r\n\r\n const handleChangeReferencia = async (\r\n referenciaValue: { label: string; value: string }[]\r\n ) => {\r\n const referenciaFinal: any = [];\r\n\r\n await Promise.all(\r\n referenciaValue.map(async (obj) => {\r\n referenciaFinal.push(obj.value);\r\n })\r\n );\r\n\r\n const { data } = await api.post(`linha/selectMulti`, referenciaFinal);\r\n setLinhas(data);\r\n\r\n setCountReferencias(referenciaFinal.length);\r\n if (referenciaValue !== null && referenciaValue !== undefined) {\r\n produtoContext.setFiltro((prevState: any) => ({\r\n ...prevState,\r\n referencia: referenciaFinal,\r\n }));\r\n\r\n setReferenciaState(referenciaValue);\r\n saveFiltersToLocalStorage({\r\n ...produtoContext.filtro,\r\n referencia: referenciaFinal,\r\n });\r\n return;\r\n }\r\n saveFiltersToLocalStorage({\r\n ...produtoContext.filtro,\r\n referencia: \"\",\r\n });\r\n setReferenciaState([]);\r\n produtoContext.setFiltro((prevState: any) => ({\r\n ...prevState,\r\n referencia: \"\",\r\n }));\r\n };\r\n\r\n const handleChangeLinha = async (\r\n linhaValue: { label: string; value: number }[]\r\n ) => {\r\n const linhaFinal: any = [];\r\n await Promise.all(\r\n linhaValue.map(async (obj) => {\r\n linhaFinal.push(obj.value);\r\n })\r\n );\r\n if (linhaValue !== null && linhaValue !== undefined) {\r\n produtoContext.setFiltro((prevState: any) => ({\r\n ...prevState,\r\n linha: linhaFinal,\r\n }));\r\n\r\n setLinhaState(linhaValue);\r\n saveFiltersToLocalStorage({\r\n ...produtoContext.filtro,\r\n linha: linhaFinal,\r\n });\r\n return;\r\n }\r\n saveFiltersToLocalStorage({\r\n ...produtoContext.filtro,\r\n linha: \"\",\r\n });\r\n setLinhaState([]);\r\n produtoContext.setFiltro((prevState: any) => ({\r\n ...prevState,\r\n linha: \"\",\r\n }));\r\n };\r\n\r\n function havePermission(permission: string): boolean {\r\n var isValid = user?.role.indexOf(permission) !== -1;\r\n return isValid;\r\n }\r\n\r\n if (user?.role.indexOf(\"ConsultaProduto\") === -1) {\r\n status.push({ label: \"Arquivo Morto\", value: \"5\" });\r\n status.push({ label: \"Novo Portfólio\", value: \"7\" });\r\n }\r\n\r\n return (\r\n <>\r\n Filtros
\r\n {!havePermission(\"ConsultaProduto\") ? (\r\n <>\r\n \r\n Busca:\r\n {\r\n setSearchValue(e.target.value);\r\n handleChangeBusca(e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n Produtos:\r\n {\r\n handleChangeProdutos(e?.value);\r\n }}\r\n // onKeyDown={(e: any) => {\r\n // if (e.key === \"Enter\")\r\n // props.fetchData(produtoContext.filtro, props.emEdicao);\r\n // }}\r\n />\r\n
\r\n >\r\n ) : (\r\n <>\r\n \r\n Produtos:\r\n {\r\n handleChangeProdutos(e?.value);\r\n }}\r\n onKeyDown={(e: any) => {\r\n if (e.key === \"Enter\")\r\n props.fetchData(produtoContext.filtro, props.emEdicao);\r\n }}\r\n />\r\n
\r\n \r\n Busca:\r\n handleChangeBusca(e.target.value)}\r\n onKeyDown={(e: any) => {\r\n if (e.key === \"Enter\")\r\n props.fetchData(localFilters, props.emEdicao);\r\n }}\r\n />\r\n
\r\n >\r\n )}\r\n\r\n {user?.role.indexOf(\"ConsultaProduto\") === -1 && (\r\n \r\n Situação:\r\n {\r\n handleChangeSituacao(e?.value);\r\n console.log(\"e\", e);\r\n }}\r\n // onKeyDown={(e: any) => {\r\n // if (e.key === \"Enter\")\r\n // props.fetchData(produtoContext.filtro, props.emEdicao);\r\n // }}\r\n />\r\n
\r\n )}\r\n\r\n \r\n Status:\r\n handleChangeStatus(e?.value)}\r\n onKeyDown={(e: any) => {\r\n if (e.key === \"Enter\")\r\n props.fetchData(produtoContext.filtro, props.emEdicao);\r\n }}\r\n />\r\n
\r\n\r\n \r\n Referência:\r\n {\r\n handleChangeReferencia(e);\r\n }}\r\n noOptionsMessage={() => \"Sem dados\"}\r\n isMulti={true}\r\n onKeyDown={(e: any) => {\r\n if (e.key === \"Enter\")\r\n props.fetchData(produtoContext.filtro, props.emEdicao);\r\n }}\r\n />\r\n
\r\n\r\n \r\n Linha:\r\n {\r\n handleChangeLinha(e);\r\n }}\r\n noOptionsMessage={() => \"Sem dados\"}\r\n isMulti={true}\r\n onKeyDown={(e: any) => {\r\n if (e.key === \"Enter\")\r\n props.fetchData(produtoContext.filtro, props.emEdicao);\r\n }}\r\n />\r\n
\r\n >\r\n );\r\n};\r\nexport default memo(FiltrosProdutos);\r\n","export enum SituacaoAplicabilidade {\r\n EM_EDICAO = 1,\r\n EM_HOMOLOGACAO = 2,\r\n DISPONIVEL = 3\r\n}\r\n\r\nexport enum SituacaoTabelaPreco {\r\n EM_EDICAO = 1,\r\n EM_HOMOLOGACAO = 2,\r\n DISPONIVEL = 3,\r\n DESCONSIDERADO = 4,\r\n}\r\n\r\nexport enum Sistema {\r\n CEM = 1,\r\n SMC = 2,\r\n CMN = 3,\r\n ONE = 4,\r\n PAR = 5,\r\n CL = 6,\r\n OP = 7\r\n}\r\n\r\nexport enum Sistema {\r\n \r\n}","export function isNullOrUndefined(value: any): boolean {\r\n return value === null || value === undefined\r\n}","import React, { useState, useEffect, memo, useMemo, useRef } from \"react\";\r\nimport { Button, Modal, Image, Fade } from \"react-bootstrap\";\r\nimport { Link } from \"react-router-dom\";\r\nimport { reject } from \"lodash\";\r\nimport fs from 'fs';\r\n\r\nimport Placeholder from \"../../../assets/imgs/img-placeholder.png\";\r\nimport DataTable from \"../../../components/DataTable\";\r\nimport DataNotFound from \"../../../components/DataNotFound\";\r\nimport api from \"../../../services/api\";\r\nimport { IProdutoItem } from \"../../../common/interfaces/produtos.interfaces\";\r\nimport { IAplicabilidade } from \"../../../common/interfaces/produtos.interfaces\";\r\nimport { useAuth } from \"../../../hooks/auth\";\r\nimport { SituacaoAplicabilidade } from '../../../common/interfaces/enums'\r\nimport { isNullOrUndefined } from \"../../../helpers/validation\";\r\n\r\ninterface PropsItens {\r\n podeEditar: boolean;\r\n aplicabilidadeEdicao: boolean;\r\n modoEdicao: boolean;\r\n produto: IProdutoItem;\r\n}\r\n\r\nconst Itens: React.FC = (props) => {\r\n\r\n //Fields\r\n const baseUrlImagem = `${process.env.REACT_APP_API}figurasicones/`;\r\n const random = Math.random();\r\n const { user } = useAuth();\r\n // States\r\n const emValidacao = useRef(\"\");\r\n const [fade, setFade] = useState(false);\r\n const [classeStatus, setClasseStatus] = useState(\"\");\r\n const [classeSituacao, setClasseSituacao] = useState(\"\");\r\n const [imagem, setImagem] = useState(Placeholder);\r\n const [mostrarModalAplicabilidade, setMostrarModalAplicabilidade] = useState(false);\r\n const [tableLoading, setTableLoading] = useState(false);\r\n const [tableData, setTableData] = useState([]);\r\n\r\n const handleClose = () => [setMostrarModalAplicabilidade(false)];\r\n //Fields Typed\r\n const DataTableTS: any = DataTable;\r\n\r\n // Effects\r\n useEffect(() => {\r\n setFade(props.modoEdicao);\r\n\r\n if ((props.produto.editavel && props.produto.situacao == \"Disponível para Mercado\") || props.produto.situacao == \"Disponível para Mercado\")\r\n emValidacao.current = \"\"\r\n else\r\n emValidacao.current = \"/validacao\";\r\n\r\n //Tags\r\n switch (props.produto?.status) {\r\n case \"Ativo\":\r\n setClasseStatus(\"tag-green\");\r\n break;\r\n case \"Descontinuado\":\r\n setClasseStatus(\"tag-red\");\r\n break;\r\n case \"Arquivo Morto\":\r\n setClasseStatus(\"tag-gray\");\r\n break;\r\n case \"Novo Portfólio\":\r\n setClasseStatus(\"tag-cyan\");\r\n break;\r\n }\r\n\r\n switch (props.produto?.situacao) {\r\n case \"Disponível para Mercado\":\r\n setClasseSituacao(\"tag-azure\");\r\n break;\r\n case \"Em Edição\":\r\n setClasseSituacao(\"tag-orange\");\r\n break;\r\n case \"Em Homologação\":\r\n setClasseSituacao(\"tag-yellow\");\r\n break;\r\n case \"Indisponível para Mercado\":\r\n setClasseSituacao(\"tag-gray-dark\");\r\n break;\r\n }\r\n\r\n if (props.produto.aplicabilidades) {\r\n\r\n var aplicabilidades = props.produto.aplicabilidades.map((item: any) => {\r\n if (item.idEmpresa === user!.idEmpresa)\r\n return item\r\n });\r\n aplicabilidades = reject(aplicabilidades, (item) => item === undefined);\r\n if (aplicabilidades.length > 0) {\r\n if (aplicabilidades.find(p => p.situacao === 1)) {\r\n setClasseSituacao(\"tag-orange\");\r\n }\r\n else if (aplicabilidades.find(p => p.situacao === 2)) {\r\n setClasseSituacao(\"tag-yellow\");\r\n }\r\n }\r\n }\r\n\r\n if (props.produto.nomeImagem !== \"\") {\r\n switch (props.produto.tipoProduto) {\r\n case \"COMPONENTE\":\r\n setImagem(`${baseUrlImagem}componentes/figuras${emValidacao.current}/${props.produto.nomeImagem}?v=${random}`);\r\n break;\r\n case \"PERFIL\":\r\n setImagem(`${baseUrlImagem}perfis/figuras${emValidacao.current}/${props.produto.nomeImagem}?v=${random}`);\r\n break;\r\n case \"VIDRO\":\r\n setImagem(`${baseUrlImagem}vidros/figuras${emValidacao.current}/${props.produto.nomeImagem}?v=${random}`);\r\n break;\r\n case \"SUPERFICIE\":\r\n setImagem(`${baseUrlImagem}superficies/figuras${emValidacao.current}/${props.produto.nomeImagem}?v=${random}`);\r\n break;\r\n }\r\n }\r\n else {\r\n setImagem(Placeholder);\r\n }\r\n\r\n }, [props.produto, props.modoEdicao]);\r\n\r\n const modalAplicabilidade = async () => {\r\n setMostrarModalAplicabilidade(true);\r\n try {\r\n const { data } = await api.get(`aplicabilidade/listaAplicabilidade/${props.produto.id}`);\r\n setTableData(data);\r\n } catch (error) {\r\n\r\n } finally {\r\n setTableLoading(false);\r\n }\r\n };\r\n\r\n const validaUrl = (url: string) => {\r\n\r\n if(isNullOrUndefined(url))\r\n return false;\r\n\r\n url = url.toLocaleLowerCase();\r\n\r\n let extensions = ['.pdf', '.jpg', '.jpeg', 'https'];\r\n\r\n if (extensions.some(ext => url.includes(ext))) {\r\n return true;\r\n }\r\n\r\n return false;\r\n }\r\n\r\n const columns = useMemo(\r\n () => [\r\n {\r\n Header: \"Código\",\r\n accessor: \"codigo\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Descrição\",\r\n accessor: \"descricao\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Referência\",\r\n accessor: \"referencia\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Situação\",\r\n accessor: \"situacao\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Ação\",\r\n accessor: \"acao\",\r\n display: \"align-middle column-table-2\",\r\n Cell: ({\r\n row: { original },\r\n }: {\r\n row: { original: IAplicabilidade };\r\n }) => (\r\n \r\n \r\n \r\n \r\n ),\r\n },\r\n ],\r\n []\r\n );\r\n const ObterImagem = (): string => {\r\n if (props.produto.logoReferencia !== \"\" && props.produto.logoReferencia !== undefined)\r\n return props.produto.logoReferencia;\r\n return Placeholder;\r\n }\r\n\r\n const obterSituacao = (produto: IProdutoItem): string => {\r\n if (produto.aplicabilidades?.length === 0) {\r\n return produto.situacao;\r\n } else {\r\n\r\n if (produto.aplicabilidades!.find(p => parseInt(p.situacao) === SituacaoAplicabilidade.EM_EDICAO)) {\r\n return \"Em Edição - Aplicabilidade Base\";\r\n }\r\n else if (produto.aplicabilidades!.find(p => parseInt(p.situacao) === SituacaoAplicabilidade.EM_HOMOLOGACAO))\r\n return \"Em Homologação - Aplicabilidade Base\";\r\n else\r\n return \"Disponivel para Mercado\";\r\n }\r\n }\r\n\r\n\r\n return (\r\n <>\r\n \r\n
\r\n
\r\n
\r\n event.target.src = Placeholder}\r\n height=\"30px\"\r\n className=\"card-img-top-fabricante\"\r\n />\r\n
\r\n
\r\n {props.produto.tipoProduto === \"COMPONENTE\" && (\r\n <>\r\n {props.produto?.temAplicabilidade && (\r\n \r\n \r\n \r\n )}\r\n >\r\n )}\r\n {(validaUrl(props.produto?.fichaTecnica) && props.produto.tipoProduto?.toUpperCase() != \"PERFIL\") && (\r\n {\r\n window.open(props.produto.fichaTecnica + `?v=${random}`, \"_blank\");\r\n }}\r\n className=\"text-muted mr-2\"\r\n title=\"Ficha Técnica\"\r\n style={{ cursor: 'pointer' }}\r\n >\r\n \r\n \r\n )}\r\n {(props.podeEditar && props.modoEdicao) &&\r\n \r\n \r\n \r\n \r\n \r\n }\r\n\r\n {(props.aplicabilidadeEdicao) &&\r\n \r\n \r\n \r\n \r\n \r\n }\r\n
\r\n
\r\n
\r\n \r\n { event.target.src = Placeholder }}\r\n className=\"card-img\"\r\n style={{ maxWidth: '100%', maxHeight: '100%', objectFit: 'cover' }}\r\n />\r\n \r\n
\r\n\r\n\r\n
\r\n
Código:
\r\n
{props.produto.codigo}
\r\n\r\n
Descrição:
\r\n
{props.produto.descricao}
\r\n\r\n
\r\n \r\n {props.produto?.status}\r\n \r\n {props.podeEditar &&\r\n \r\n {props.produto?.situacao}\r\n \r\n }\r\n {props.aplicabilidadeEdicao &&\r\n \r\n {obterSituacao(props.produto)}\r\n \r\n }\r\n
\r\n
\r\n
\r\n
\r\n\r\n {/* Modal Aplicabilidade*/}\r\n \r\n \r\n Código Aplicáveis\r\n \r\n \r\n \r\n
\r\n
\r\n {tableData && (\r\n \r\n )}\r\n \r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n >\r\n );\r\n};\r\n\r\nexport default memo(Itens);\r\n","\r\n\r\n\r\nfunction DataNotFoundProducts(props) {\r\n return (\r\n <>\r\n {props.visible == true ? props.visible && (\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n Nenhum dado disponível!\r\n
\r\n {props.children}\r\n
\r\n
\r\n ) : (\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n Selecione o tipo de produto que deseja pesquisar no filtro ao lado!\r\n
\r\n {props.children}\r\n
\r\n
\r\n )\r\n }\r\n >\r\n );\r\n}\r\n\r\nexport default DataNotFoundProducts;\r\n","export interface IFormComponente {\r\n id: number;\r\n tipo: string;\r\n urlImagem: string;\r\n status: {\r\n label: string;\r\n value: number;\r\n };\r\n situacao: {\r\n label: string;\r\n value: number;\r\n };\r\n codigo: string;\r\n codigoInterno: string;\r\n referencia: {\r\n label: string;\r\n value: number;\r\n };\r\n linha: {\r\n label: string;\r\n value: number;\r\n };\r\n grupo: {\r\n label: string;\r\n value: number;\r\n };\r\n cor: {\r\n label: string;\r\n value: number;\r\n };\r\n descricao: string;\r\n unidadeItem: {\r\n label: string;\r\n value: number;\r\n };\r\n unidadeEmbalagem: {\r\n label: string;\r\n value: number;\r\n };\r\n quantidadeEmbalagem: number;\r\n otimizacaoBarra: number;\r\n ipi: number;\r\n}\r\n\r\nexport interface IFormPerfil {\r\n id: number;\r\n tipo: string;\r\n urlImagem: string;\r\n status: {\r\n label: string;\r\n value: number;\r\n };\r\n situacao: {\r\n label: string;\r\n value: number;\r\n };\r\n codigo: string;\r\n codigoInterno: string;\r\n referencia: {\r\n label: string;\r\n value: number;\r\n };\r\n linha: {\r\n label: string;\r\n value: number;\r\n };\r\n descricao: string;\r\n barra1: string;\r\n barra2: string;\r\n barra3: string;\r\n peso: number;\r\n ipi: number;\r\n classe: {\r\n label: string;\r\n value: number;\r\n };\r\n unidadeValorizacao: {\r\n label: string;\r\n value: number;\r\n };\r\n prenativo: {\r\n label: string;\r\n value: number;\r\n };\r\n perda: {\r\n label: string;\r\n value: number;\r\n };\r\n perfil: {\r\n label: string;\r\n value: number;\r\n };\r\n liga: {\r\n label: string;\r\n value: number;\r\n };\r\n tempera: {\r\n label: string;\r\n value: number;\r\n };\r\n wx: number;\r\n jx: number;\r\n wy: number;\r\n jy: number;\r\n perimetroTotal: number;\r\n perimetroTratamento: number;\r\n}\r\n\r\nexport interface IFormSuperficie {\r\n id: number;\r\n tipo: string;\r\n urlImagem: string;\r\n status: {\r\n label: string;\r\n value: number;\r\n };\r\n situacao: {\r\n label: string;\r\n value: number;\r\n };\r\n codigo: string;\r\n codigoInterno: string;\r\n referencia: {\r\n label: string;\r\n value: number;\r\n };\r\n linha: {\r\n label: string;\r\n value: number;\r\n };\r\n descricao: string;\r\n cor: {\r\n label: string;\r\n value: string;\r\n };\r\n unidadeValorizacao: {\r\n label: string;\r\n value: string;\r\n };\r\n ipi: string;\r\n grupo: {\r\n label: string;\r\n value: string;\r\n };\r\n passo: number;\r\n terminal: {\r\n label: string;\r\n value: string;\r\n };\r\n}\r\n\r\nexport interface IFormVidro {\r\n id: number;\r\n tipo: string;\r\n urlImagem: string;\r\n status: {\r\n label: string;\r\n value: number;\r\n };\r\n situacao: {\r\n label: string;\r\n value: number;\r\n };\r\n codigo: string;\r\n codigoInterno: string;\r\n referencia: {\r\n label: string;\r\n value: number;\r\n };\r\n linha: {\r\n label: string;\r\n value: number;\r\n };\r\n descricao: string;\r\n tipoVidro: {\r\n label: string;\r\n value: number;\r\n };\r\n espessura: number;\r\n peso: number;\r\n fatorLh: number;\r\n controleSolar: {\r\n label: string;\r\n value: number;\r\n };\r\n arredondamento: {\r\n label: string;\r\n value: number;\r\n };\r\n ipi: number;\r\n}\r\n\r\nexport interface IOutrasCaracteristicas {\r\n id: number;\r\n codigo: string;\r\n tipoMaterial: string;\r\n nome: string;\r\n descricao: string;\r\n}\r\n\r\nexport interface ILinhasAplicacao {\r\n id: number;\r\n idMaterial: number;\r\n linhaAplicacao: {\r\n label: string;\r\n value: number;\r\n };\r\n}\r\n\r\nexport interface IAplicabilidade {\r\n id: number;\r\n idAplicavel: number;\r\n aplicabilidade: string;\r\n codigo: string;\r\n descricao: string;\r\n fichaTecnica: string;\r\n linkLogoReferencia: string;\r\n situacao: string;\r\n excluida: boolean;\r\n filtroReferencia: {\r\n label: string;\r\n value: string;\r\n };\r\n}\r\n\r\nexport interface IFormComposicao {\r\n id: number;\r\n idPerfil: number;\r\n perfil: {\r\n label: string;\r\n value: string;\r\n };\r\n internoExterno: {\r\n label: string;\r\n value: string;\r\n };\r\n}\r\n\r\nexport enum ITipoPerfilComposto {\r\n INTERNO = 1,\r\n EXTERNO = 2,\r\n COR_UNICA = 0,\r\n}\r\n\r\nexport interface IListComposicaoPerfil {\r\n id: number;\r\n perfil: string;\r\n internoExterno: string;\r\n}\r\n\r\nexport interface IProdutoCor {\r\n id: number;\r\n linha: {\r\n label: string;\r\n value: string;\r\n };\r\n}\r\n\r\nexport interface IVidroCor {\r\n id: number;\r\n idVidro: number;\r\n cor: {\r\n label: string;\r\n value: string;\r\n };\r\n fatorSolar: number;\r\n transLumin: number;\r\n transTermica: number;\r\n bloqCalor: number;\r\n reflexaoInterna: number;\r\n reflexaoExterna: number;\r\n ativo: boolean;\r\n absorcaoEnergetica: number;\r\n}\r\n\r\nexport interface IListProduto {\r\n lastLimit: number;\r\n total: number;\r\n hasMore: boolean;\r\n threshold: number;\r\n items: IProdutoItem[];\r\n}\r\n\r\nexport interface IProdutoItem {\r\n idSequencial: number;\r\n id: number;\r\n idReferencia: number;\r\n tipoProduto: string;\r\n codigo: string;\r\n descricao: string;\r\n status: string;\r\n situacao: string;\r\n situacaoAplicabilidadeBase: string;\r\n nomeImagem: string;\r\n logoReferencia: string;\r\n fichaTecnica: string;\r\n temAplicabilidade: boolean;\r\n aplicabilidadeBaseEditavel: boolean;\r\n editavel: boolean;\r\n aplicabilidades?: IAplicabilidade[];\r\n}\r\n\r\nexport interface IFiltro {\r\n busca?: string;\r\n tipoProduto?: string;\r\n situacao?: ISelect;\r\n status: ISelect;\r\n referencia?: ISelect;\r\n linha?: ISelect;\r\n}\r\n\r\ninterface ISelect {\r\n label: string;\r\n value: string;\r\n}\r\n","import React, { useState, useEffect, useContext, useRef } from \"react\";\r\nimport { Button, Fade } from \"react-bootstrap\";\r\nimport InfiniteScroll from \"react-infinite-scroll-component\";\r\n\r\nimport { EndMessage, Loading } from \"../../components/InfiniteScroll\";\r\nimport { SweetAlertContext } from \"../../contexts/sweetAlert/alertContext\";\r\nimport api from \"../../services/api\";\r\nimport history from \"../../helpers/history\";\r\nimport { ProdutoContext } from \"../../contexts/produtos/produtosContext\";\r\nimport FiltrosProdutos from \"./Filtros\";\r\nimport Itens from \"./Itens\";\r\nimport {\r\n IFiltro,\r\n IListProduto,\r\n IProdutoItem,\r\n} from \"../../common/interfaces/produtos.interfaces\";\r\nimport { useAuth } from \"../../hooks/auth\";\r\nimport { toast } from \"react-toastify\";\r\nimport { getSingleErrorMessage } from \"../../helpers/getSingleErrorMessage\";\r\nimport DataNotFoundProducts from \"../../components/DataNotFoundProducts\";\r\nimport { useHistory } from \"react-router-dom\";\r\n\r\nconst Produtos: React.FC = () => {\r\n // Fields\r\n const emEdicao = useRef(false);\r\n const queryString = require(\"querystring\");\r\n const limite = 12;\r\n const { user } = useAuth();\r\n const { replace } = useHistory();\r\n\r\n // Contexts\r\n const sweetAlertContext = useContext(SweetAlertContext);\r\n const produtoContext = useContext(ProdutoContext);\r\n\r\n const filtro = produtoContext.filtro;\r\n // States\r\n const [modoEdicao, setModoEdicao] = useState(false);\r\n const [loading, setLoading] = useState(true);\r\n const [produto, setProduto] = useState({} as IListProduto);\r\n const [referenciasLiberada, setReferenciasLiberada] = useState([]);\r\n const [homologar, setHomologar] = useState(false);\r\n const [disponivel, setDisponivel] = useState(false);\r\n const [qtdSearch, setQtdSearch] = useState(0);\r\n\r\n // Effects\r\n useEffect(() => {\r\n const fetchData = async () => {\r\n const modoEdicao = await api.get(\"produto/modoEdicaoValue\");\r\n setModoEdicao(modoEdicao.data);\r\n };\r\n\r\n fetchData();\r\n }, []);\r\n\r\n useEffect(() => {\r\n const fetch = async () => {\r\n setLoading(true);\r\n\r\n await api\r\n .get(\"geral/selecaoReferenciaMaterialLiberada\")\r\n .then((response) => setReferenciasLiberada(response.data))\r\n .catch((error) => toast.error(getSingleErrorMessage(error)));\r\n\r\n await api\r\n .get(\"produto/acaoPermitidaMaterial\")\r\n .then((response) => handleAcaoPermitida(response.data))\r\n .catch((error) => toast.error(getSingleErrorMessage(error)));\r\n\r\n setQtdSearch(0);\r\n fetchData(filtro, modoEdicao);\r\n };\r\n\r\n fetch();\r\n }, [modoEdicao]);\r\n\r\n if (referenciasLiberada && !havePermission(\"ConsultaProduto\"))\r\n emEdicao.current = true;\r\n // Callbacks\r\n const fetchData = async (filtro: IFiltro, modoEdicao: boolean) => {\r\n replace(`/produtos?${queryString.stringify(filtro)}`);\r\n setQtdSearch(0);\r\n setLoading(true);\r\n var response = await api\r\n .get(\r\n `/produto/lista?limite=${limite}&pageSkip=${0}&modoEdicao=${modoEdicao}&${queryString.stringify(\r\n filtro\r\n )}`\r\n )\r\n .then((response) => {\r\n if (response.data.items) {\r\n setProduto(response.data);\r\n setQtdSearch((qtdSearch) => qtdSearch + 1);\r\n } else {\r\n setProduto(response.data);\r\n }\r\n })\r\n .catch((error) => {\r\n toast.error(getSingleErrorMessage(error));\r\n })\r\n .finally(() => {\r\n setLoading(false);\r\n });\r\n\r\n return response;\r\n };\r\n\r\n const fetchMoreData = async () => {\r\n await api\r\n .get(\r\n `/produto/lista?limite=${limite}&pageSkip=${qtdSearch}&modoEdicao=${modoEdicao}&${queryString.stringify(\r\n filtro\r\n )}`\r\n )\r\n .then((response) => {\r\n if (response.data.items) {\r\n produto.items = produto.items.concat(response.data.items);\r\n setProduto(produto);\r\n setQtdSearch((qtdSearch) => qtdSearch + 1);\r\n } else {\r\n setProduto((produto) => {\r\n return { ...produto, hasMore: false };\r\n });\r\n }\r\n })\r\n .catch((error) => toast.error(getSingleErrorMessage(error)));\r\n };\r\n\r\n //Handles\r\n const handleAcaoPermitida = ({ homologar, disponibilizar }: any) => {\r\n setHomologar(homologar);\r\n setDisponivel(disponibilizar);\r\n };\r\n\r\n const handleNew = () => {\r\n history.push(`/produtos/0/novoProduto`);\r\n };\r\n\r\n const handleModoEdicao = async (modoEdicao: boolean) => {\r\n try {\r\n await api.post(`produto/modoEdicao/${modoEdicao}`);\r\n setModoEdicao(modoEdicao);\r\n } catch (err) {\r\n toast.error(getSingleErrorMessage(err));\r\n }\r\n };\r\n\r\n const handleHomologar = async () => {\r\n const title = \"Homologar\";\r\n const message =\r\n \"Deseja homologar as alterações realizadas, isso não pode ser desfeito.\";\r\n\r\n sweetAlertContext.warning(title, message, async () => {\r\n try {\r\n var promise = new Promise(async (resolve, reject) => {\r\n try {\r\n const {\r\n data: { total },\r\n } = await api.post(\"produto/homologar\");\r\n resolve(response);\r\n } catch (error) {\r\n reject(error);\r\n toast.error(getSingleErrorMessage(error));\r\n }\r\n });\r\n\r\n var response = await toast\r\n .promise(promise, {\r\n pending: \"Homologando materiais...\",\r\n error: \"Não há materiais em edição para homologação\",\r\n success:\r\n \"A ação foi concluída. Em breve será disponibilzado o pacote de atualização para importação no seu sistema para homologação.\",\r\n })\r\n .then(async (data) => {\r\n const acaoPermitida = await api.get(\r\n \"produto/acaoPermitidaMaterial\"\r\n );\r\n handleAcaoPermitida(acaoPermitida.data);\r\n fetchData(filtro, modoEdicao);\r\n });\r\n } catch (err) {\r\n toast.error(getSingleErrorMessage(err));\r\n }\r\n });\r\n };\r\n\r\n const handleDisponibilizar = async () => {\r\n const title = \"Disponível para Mercado\";\r\n const message =\r\n \"Deseja tornar a atualizações disponíveis para uso dos clientes?\";\r\n sweetAlertContext.warning(title, message, async () => {\r\n try {\r\n var promise = new Promise(async (resolve, reject) => {\r\n api\r\n .post(\"produto/disponibilizar\")\r\n .then((response) => {\r\n resolve(response.data);\r\n })\r\n .catch((error) => {\r\n reject(error.response.data);\r\n });\r\n });\r\n\r\n await toast\r\n .promise(promise, {\r\n pending: \"Disponibilizando materiais...\",\r\n error: {\r\n render({ data }: any) {\r\n return data;\r\n },\r\n },\r\n success:\r\n \"A ação foi concluída. Em breve estará disponível para importação nos sistemas dos clientes.\",\r\n })\r\n .then(async (data) => {\r\n const acaoPermitida = await api.get(\r\n \"produto/acaoPermitidaMaterial\"\r\n );\r\n\r\n handleAcaoPermitida(acaoPermitida.data);\r\n fetchData(filtro, modoEdicao);\r\n });\r\n } catch (err) {\r\n toast.error(getSingleErrorMessage(err));\r\n }\r\n });\r\n };\r\n\r\n const handleProdutoEditavel = (produto: IProdutoItem) => {\r\n const referenciaLiberada = referenciasLiberada.some(\r\n (referencia: any) =>\r\n referencia.value == produto.idReferencia &&\r\n produto.tipoProduto == referencia.label &&\r\n !produto.aplicabilidadeBaseEditavel\r\n );\r\n\r\n return (\r\n referenciaLiberada && modoEdicao && !havePermission(\"ConsultaProduto\")\r\n );\r\n };\r\n\r\n function havePermission(permission: string): boolean {\r\n var isValid = user?.role.indexOf(permission) !== -1;\r\n return isValid;\r\n }\r\n\r\n return (\r\n <>\r\n \r\n
\r\n
\r\n {!havePermission(\"ConsultaProduto\") && (\r\n
\r\n
\r\n
Produtos
\r\n \r\n
\r\n
\r\n
\r\n \r\n {modoEdicao && (\r\n <>\r\n \r\n \r\n {havePermission(\"Master\") && (\r\n \r\n )}\r\n >\r\n )}\r\n
\r\n \r\n
\r\n
\r\n {emEdicao.current && (\r\n
\r\n \r\n
\r\n )}\r\n
\r\n )}\r\n
\r\n\r\n
\r\n {/*Filtros*/}\r\n
\r\n \r\n \r\n
\r\n\r\n {/*Itens*/}\r\n
\r\n
\r\n
\r\n
\r\n {produto.total > 0 && (\r\n
fetchMoreData()}\r\n hasMore={produto.hasMore}\r\n loader={}\r\n className=\"row\"\r\n endMessage={}\r\n scrollThreshold={produto.threshold}\r\n >\r\n {produto.items.map(\r\n (objProduto: IProdutoItem, index: number) => (\r\n \r\n \r\n
\r\n )\r\n )}\r\n \r\n )}\r\n
\r\n
\r\n {produto.total === 0 && !loading && (\r\n
\r\n 0 && qtdSearch >= 0}\r\n />\r\n
\r\n )}\r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n};\r\nexport default Produtos;\r\n","import React, { useContext, useEffect, useRef, useState } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport { Form } from \"react-bootstrap\";\r\nimport { Input, InputDecimal, Select } from \"../../../../../components/Form\";\r\nimport api from \"../../../../../services/api\";\r\nimport {\r\n situacao,\r\n status,\r\n} from \"../../../../../components/Form/Select/options\";\r\n\r\nimport { ProdutoContext } from \"../../../../../contexts/produtos/produtosContext\";\r\n\r\nconst ComponenteTabGeral: React.FC = ({\r\n selectValues,\r\n setLogoLinha,\r\n loadingValues,\r\n}) => {\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // É um novo componente?\r\n const novo = pId == 0;\r\n\r\n // Contexts\r\n const produtoContext = useContext(ProdutoContext);\r\n\r\n //States\r\n const [linha, setLinha] = useState([]);\r\n\r\n //Effects\r\n useEffect(() => {\r\n produtoContext.setEntrouEmEdicao(false);\r\n }, []);\r\n\r\n useEffect(() => {\r\n if (produtoContext.entrouEmEdicao &&Object.keys(selectValues).length != 0) {\r\n selectValues.formRef?.current?.setFieldValue(\"situacao\", situacao[0]);\r\n }\r\n }, [produtoContext.entrouEmEdicao]);\r\n\r\n //Handles\r\n const handleReferenciaLinha = async ({ value }: any) => {\r\n selectValues.formRef?.current?.clearField(\"linha\");\r\n\r\n const { data } = await api.get(`linha/select/${value}`);\r\n setLinha(data);\r\n\r\n handleChangeField();\r\n };\r\n\r\n const handleLinha = async (e: any) => {\r\n if (e != undefined) {\r\n const { data } = await api.get(`linha/logoLinha/${e.value}`);\r\n setLogoLinha(data);\r\n\r\n handleChangeField();\r\n }\r\n };\r\n\r\n const handleChangeField = () => {\r\n if (!produtoContext.entrouEmEdicao && !loadingValues) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n }\r\n }; \r\n\r\n return (\r\n <>\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n Código *\r\n \r\n \r\n
\r\n Código Interno\r\n \r\n \r\n
\r\n\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n \r\n Descrição *\r\n \r\n \r\n \r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n \r\n Quantidade Embalagem *\r\n \r\n \r\n \r\n Otimização Barra\r\n \r\n \r\n \r\n IPI\r\n { \r\n const { formattedValue, floatValue } = values; \r\n return formattedValue === \"\" || floatValue <= 99;\r\n }} \r\n />\r\n \r\n \r\n
\r\n
\r\n >\r\n );\r\n};\r\nexport default ComponenteTabGeral;\r\n","import React, { useState, useEffect, useMemo, useRef, useContext } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport { Button } from \"react-bootstrap\";\r\nimport { Input, TextArea } from \"../../../../../components/Form\";\r\nimport api from \"../../../../../services/api\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from 'yup'\r\nimport getValidationErrors from \"../../../../../helpers/getValidateErrors\"\r\nimport { getSingleErrorMessage } from \"../../../../../helpers/getSingleErrorMessage\";\r\n\r\nimport DataTable from \"../../../../../components/DataTable\";\r\nimport DataNotFound from \"../../../../../components/DataNotFound\";\r\n\r\nimport { ToastContext } from \"../../../../../contexts/toast/toastContext\";\r\nimport { SweetAlertContext } from \"../../../../../contexts/sweetAlert/alertContext\";\r\n\r\nimport { IOutrasCaracteristicas } from \"../../../../../common/interfaces/produtos.interfaces\";\r\nimport { ToastErrorContext } from \"../../../../../contexts/toast/toastErrorContext\";\r\nimport { toast } from \"react-toastify\";\r\n\r\nconst ComponenteTabOutrasCaracteristicas: React.FC = ({setTableData, tableData}) => {\r\n\r\n // URL Params\r\n const { pId, pString }: any = useParams();\r\n\r\n //Fields\r\n const DataTableTS: any = DataTable;\r\n const tipoMaterial = 'COMPONENTE';\r\n const novo = (pId == 0);\r\n\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //Context\r\n const sweetAlertContext = useContext(SweetAlertContext);\r\n const toastContext = useContext(ToastContext);\r\n const toastError = useContext(ToastErrorContext);\r\n\r\n //States\r\n const [tableLoading, setTableLoading] = useState(false);\r\n const [reloadTable, setReloadTable] = useState(false);\r\n\r\n //Effects\r\n useEffect(() => {\r\n (async () => {\r\n try {\r\n if (!novo) {\r\n setTableLoading(true);\r\n const { data } = await api.get(`produto/caracteristicaMaterial/${pString}/${tipoMaterial}`); \r\n setTableData(data);\r\n }\r\n } catch (error) {\r\n console.log(error);\r\n } finally {\r\n setTableLoading(false);\r\n }\r\n })();\r\n }, [reloadTable]);\r\n\r\n // Handles\r\n const handleSubmit: SubmitHandler = async (outrasCaracteristicasComponente, { reset }) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n\r\n const message = \"Campo obrigatório\";\r\n const schema = Yup.object().shape({\r\n\r\n nome: Yup.string().required(message),\r\n descricao: Yup.string().required(message),\r\n });\r\n await schema.validate(outrasCaracteristicasComponente, { abortEarly: false });\r\n\r\n //Passou pela validação \r\n outrasCaracteristicasComponente.codigo = pString;\r\n outrasCaracteristicasComponente.tipoMaterial = tipoMaterial;\r\n \r\n await api.post('produto/SalvarCaracteristicaMaterial', outrasCaracteristicasComponente);\r\n\r\n toast.success(\"A ação foi concluída.\");\r\n\r\n setReloadTable(reload => !reload);\r\n reset();\r\n\r\n } catch (err) {\r\n toast.error(getSingleErrorMessage(err));\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n }\r\n };\r\n\r\n const handleDelete = ({ id, nome }: IOutrasCaracteristicas) => {\r\n const title = `Excluir \"${nome}\"?`;\r\n const message = \"Essa característica será excluída, isso não pode ser desfeito.\";\r\n sweetAlertContext.danger(title, message, async () => {\r\n try {\r\n await api.delete(`produto/RemoverCaracteristicaMaterial/${id}`);\r\n setTableData((prevState: any) =>\r\n prevState.filter(function (item: any) {\r\n return item.id !== id;\r\n })\r\n );\r\n sweetAlertContext.close();\r\n } catch (error) {\r\n const message = getSingleErrorMessage(error);\r\n if (message) {\r\n toastContext.notification(message, \"warn\");\r\n } else {\r\n toastContext.notification(\r\n \"Ocorreu um erro ao realizar essa operação.\",\r\n \"error\"\r\n );\r\n }\r\n }\r\n });\r\n };\r\n\r\n\r\n const columns = useMemo(\r\n () => [\r\n {\r\n Header: \"Nome\",\r\n accessor: \"nome\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Descrição\",\r\n accessor: \"descricao\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Ação\",\r\n accessor: \"acao\",\r\n disableSortBy: true,\r\n display: \"align-middle column-table-1b\",\r\n Cell: ({ row: { original } }: { row: { original: IOutrasCaracteristicas } }) => (\r\n\r\n \r\n\r\n ),\r\n },\r\n ],\r\n []\r\n );\r\n\r\n return (\r\n <>\r\n \r\n\r\n \r\n
\r\n
\r\n
\r\n {tableData && (\r\n \r\n )}\r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n};\r\nexport default ComponenteTabOutrasCaracteristicas;\r\n","import React, { useState, useEffect, useMemo, useRef, useContext } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport { Button } from \"react-bootstrap\";\r\nimport { Select } from \"../../../../../components/Form\";\r\nimport api from \"../../../../../services/api\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from 'yup'\r\nimport getValidationErrors from \"../../../../../helpers/getValidateErrors\"\r\nimport { getSingleErrorMessage } from \"../../../../../helpers/getSingleErrorMessage\";\r\n\r\nimport DataTable from \"../../../../../components/DataTable\";\r\nimport DataNotFound from \"../../../../../components/DataNotFound\";\r\n\r\nimport { ToastContext } from \"../../../../../contexts/toast/toastContext\";\r\nimport { SweetAlertContext } from \"../../../../../contexts/sweetAlert/alertContext\";\r\nimport { ToastErrorContext } from \"../../../../../contexts/toast/toastErrorContext\";\r\nimport { ProdutoContext } from \"../../../../../contexts/produtos/produtosContext\";\r\n\r\nimport { ILinhasAplicacao } from \"../../../../../common/interfaces/produtos.interfaces\";\r\nimport { toast } from \"react-toastify\";\r\n\r\nconst ComponenteTabLinhasDeAplicacao: React.FC = ({ selectLinhaAplicacao, setLogoPreview }) => {\r\n //Fields\r\n const DataTableTS: any = DataTable;\r\n\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // É um novo componente?\r\n const novo = (pId == 0);\r\n const tipoMaterial = 'COMPONENTE';\r\n\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //Context\r\n const sweetAlertContext = useContext(SweetAlertContext);\r\n const toastContext = useContext(ToastContext);\r\n const toastError = useContext(ToastErrorContext);\r\n const produtoContext = useContext(ProdutoContext);\r\n\r\n //States\r\n const [tableData, setTableData] = useState([]);\r\n const [tableLoading, setTableLoading] = useState(false);\r\n const [reloadTable, setReloadTable] = useState(false);\r\n const [reloadLogo, setReloadLogo] = useState(false);\r\n\r\n //Effects\r\n useEffect(() => {\r\n (async () => {\r\n try {\r\n if (!novo) {\r\n setTableLoading(true);\r\n const { data } = await api.get(`componente/linhaAplicacao/${pId}`);\r\n\r\n setTableData(data);\r\n }\r\n } catch (error) {\r\n } finally {\r\n setTableLoading(false);\r\n }\r\n })();\r\n }, [reloadTable]);\r\n\r\n useEffect(() => {\r\n (async () => {\r\n try {\r\n if (!novo) {\r\n setTableLoading(true);\r\n const { data } = await api(`produto/logoLinhaAplicavel/${pId}/${tipoMaterial}`)\r\n setLogoPreview(data);\r\n }\r\n } catch (error) {\r\n } finally {\r\n setTableLoading(false);\r\n }\r\n })();\r\n }, [reloadLogo]);\r\n\r\n //Handles\r\n const handleSubmit: SubmitHandler = async (linhasAplicacaoComponente, { reset }) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n\r\n const message = \"Campo obrigatório\";\r\n const schema = Yup.object().shape({\r\n linhaAplicacao: Yup.object().shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n }).nullable().required(message),\r\n });\r\n await schema.validate(linhasAplicacaoComponente, { abortEarly: false });\r\n\r\n //Passou pela validação \r\n linhasAplicacaoComponente.idMaterial = pId;\r\n await api.post('componente/salvarLinhaAplicacao', linhasAplicacaoComponente);\r\n\r\n setReloadTable(reload => !reload);\r\n setReloadLogo(reload => !reload);\r\n reset();\r\n\r\n produtoContext.setEntrouEmEdicao(true);\r\n\r\n toast.success(\"A ação foi concluída.\");\r\n\r\n } catch (err) {\r\n toast.error(getSingleErrorMessage(err));\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n }\r\n };\r\n\r\n const handleDelete = ({ id, linhaAplicacao }: ILinhasAplicacao) => {\r\n const title = `Excluir \"${linhaAplicacao}\"?`;\r\n const message = \"Essa aplicação de linha será excluída, isso não pode ser desfeito.\";\r\n sweetAlertContext.danger(title, message, async () => {\r\n try {\r\n await api.delete(`componente/removerLinhaAplicacao/${id}`);\r\n setTableData((prevState) =>\r\n prevState.filter(function (item) {\r\n return item.id !== id;\r\n })\r\n );\r\n\r\n setReloadLogo(reload => !reload);\r\n produtoContext.setEntrouEmEdicao(true);\r\n sweetAlertContext.close();\r\n } catch (error) {\r\n const message = getSingleErrorMessage(error);\r\n if (message) {\r\n toastContext.notification(message, \"warn\");\r\n } else {\r\n toastContext.notification(\r\n \"Ocorreu um erro ao realizar essa operação.\",\r\n \"error\"\r\n );\r\n }\r\n }\r\n });\r\n };\r\n\r\n const columns = useMemo(\r\n () => [\r\n {\r\n Header: \"Linhas\",\r\n accessor: \"linhaAplicacao\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Ação\",\r\n accessor: \"acao\",\r\n disableSortBy: true,\r\n display: \"align-middle column-table-1b\",\r\n Cell: ({ row: { original } }: { row: { original: ILinhasAplicacao } }) => (\r\n\r\n \r\n\r\n ),\r\n },\r\n ],\r\n []\r\n );\r\n\r\n return (\r\n <>\r\n \r\n\r\n \r\n
\r\n
\r\n
\r\n {tableData && (\r\n \r\n )}\r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n};\r\nexport default ComponenteTabLinhasDeAplicacao;\r\n","import React, { useState, useRef, useEffect, useContext } from \"react\";\r\n\r\nimport { FileButton, Input } from \"../../../../../../components/Form\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from 'yup'\r\nimport { useParams } from \"react-router-dom\";\r\nimport getValidationErrors from \"../../../../../../helpers/getValidateErrors\"\r\nimport api from \"../../../../../../services/api\";\r\n\r\nimport { ProdutoContext } from \"../../../../../../contexts/produtos/produtosContext\";\r\nimport { SweetAlertContext } from \"../../../../../../contexts/sweetAlert/alertContext\";\r\nimport { toast } from \"react-toastify\";\r\n\r\n\r\n\r\ninterface IUploadMiniatura {\r\n dados: any,\r\n setFiguraIcone: any\r\n}\r\n\r\nconst UploadMiniatura: React.FC = (props) => {\r\n\r\n const { pId }: any = useParams();\r\n const [miniatura, setMiniatura] = useState(true);\r\n const formRef = useRef(null);\r\n const sweetAlert = useContext(SweetAlertContext);\r\n const produtoContext = useContext(ProdutoContext);\r\n const SUPPORTED_FORMATS = [\"image/bmp\"];\r\n\r\n const schema = Yup.object().shape({\r\n miniatura: Yup.mixed()\r\n .test(\r\n \"fileDimension\",\r\n \"A miniatura deve ter 64x64 pixels\",\r\n (value) => !value.dimensions || value.dimensions[0] === 64 && value.dimensions[1] === 64\r\n )\r\n .test(\r\n \"fileFormat\",\r\n \"O arquivo deve ser .bmp\",\r\n value => value && SUPPORTED_FORMATS.includes(value.type)\r\n )\r\n });\r\n\r\n // Effects\r\n useEffect(() => {\r\n if (props.dados && props.dados.nomeMiniatura != \"\" && props.dados.nomeMiniatura != undefined) {\r\n formRef.current?.setFieldValue('nomeMiniatura', props.dados.nomeMiniatura);\r\n setMiniatura(false);\r\n }\r\n }, [props.dados]);\r\n\r\n const handleChangeField = () => {\r\n if (!produtoContext.entrouEmEdicao) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n }\r\n };\r\n\r\n // Handles\r\n const handleSubmit: SubmitHandler = async (thumb, { reset }) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n\r\n // Definição da propriedade para medir a imagem.\r\n if (SUPPORTED_FORMATS.includes(thumb.miniatura.type)) {\r\n Object.defineProperty(thumb.miniatura, 'dimensions', {\r\n value: await checkDimension(thumb.miniatura)\r\n });\r\n }\r\n\r\n await schema.validate(thumb, { abortEarly: false });\r\n\r\n const { data: { disponivel } } = await api.get(`componente/disponivelMercado/${pId}`);\r\n\r\n if (disponivel) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n sweetAlert.alert(\"Atenção\", \"O material esta disponível em mercado, alteramos a situação para o modo edição, salve o cadastro para continuar com a atualização\");\r\n reset();\r\n } else {\r\n //Passou pela validação\r\n handleChangeField();\r\n\r\n if (thumb.miniatura != null) {\r\n var arquivo = new FormData();\r\n arquivo.append(\"arquivo\", thumb.miniatura);\r\n arquivo.append(\"nomeArquivo\", thumb.miniatura.name);\r\n arquivo.append(\"idComponente\", pId);\r\n\r\n props.setFiguraIcone((state: any) => ({\r\n ...state,\r\n nomeMiniatura: thumb.miniatura.name\r\n }));\r\n \r\n await upload(arquivo);\r\n }\r\n\r\n formRef.current?.setFieldValue('nomeMiniatura', thumb.miniatura.name);\r\n setMiniatura(false);\r\n }\r\n } catch (err) {\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n formRef.current?.clearField('nomeMiniatura');\r\n setMiniatura(true);\r\n }\r\n };\r\n\r\n const upload = async (arquivo: any) => {\r\n let promise = new Promise((resolve, reject) => {\r\n api.post(\"/componente/uploadIcone\", arquivo)\r\n .then(response => {\r\n resolve(response.data);\r\n })\r\n .catch(error => {\r\n reject(error);\r\n });\r\n });\r\n\r\n await toast.promise(promise, {\r\n pending: \"Enviando arquivo...\",\r\n success: \"Arquivo enviado com sucesso!\",\r\n error: \"Ocorreu um erro ao enviar o arquivo.\"\r\n });\r\n }\r\n\r\n const handleUploadMiniatura = (e: any) => {\r\n if (e.target.files?.length != 0) {\r\n formRef.current?.submitForm()\r\n } else {\r\n setMiniatura(true);\r\n formRef.current?.clearField('nomeMiniatura');\r\n formRef.current?.setErrors({});\r\n }\r\n }\r\n\r\n // Função que checa o tamanho da imagem sem exibir em tela.\r\n function checkDimension(value: any) {\r\n return new Promise(resolve => {\r\n const reader = new FileReader();\r\n reader.readAsDataURL(value);\r\n reader.onload = () => {\r\n const img = new (window as any).Image();\r\n img.src = reader.result;\r\n img.onload = () => {\r\n const width = img.width;\r\n const height = img.height;\r\n const dimensions = [width, height]\r\n resolve(dimensions);\r\n };\r\n };\r\n });\r\n }\r\n\r\n const handleAlterarNome = async (e: any) => {\r\n if (props.dados.nomeMiniatura != e.target.value && e.target.value) {\r\n const message = `Deseja realmente alterar o nome do icone?`;\r\n\r\n sweetAlert.warning(e.target.value, message, async () => {\r\n produtoContext.setEntrouEmEdicao(true);\r\n\r\n await api.post('componente/alterarNomeIcone', { idComponente: pId, nomeArquivo: e.target.value })\r\n .then(response => {\r\n if(response.data.isValid) {\r\n toast.success(response.data.message);\r\n }else {\r\n toast.error(response.data.errors[0].errorMessage);\r\n }\r\n })\r\n props.dados.nomeMiniatura = e.target.value;\r\n },\r\n () => {\r\n formRef.current?.setFieldValue('nomeMiniatura', props.dados.nomeMiniatura);\r\n });\r\n }\r\n }\r\n\r\n return (\r\n <>\r\n \r\n
Miniatura
\r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n}\r\n\r\nexport default UploadMiniatura;","import React, { useState, useRef, useEffect, useContext } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\n\r\nimport { FileButton, Input } from \"../../../../../../components/Form\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from 'yup'\r\nimport getValidationErrors from \"../../../../../../helpers/getValidateErrors\"\r\nimport api from \"../../../../../../services/api\";\r\n\r\nimport { SweetAlertContext } from \"../../../../../../contexts/sweetAlert/alertContext\";\r\nimport { ProdutoContext } from \"../../../../../../contexts/produtos/produtosContext\";\r\nimport { toast } from \"react-toastify\";\r\n\r\n\r\ninterface IUploadImagem {\r\n dados: any,\r\n setFiguraIcone: any\r\n}\r\n\r\nconst UploadImagem: React.FC = (props) => {\r\n\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //Contexts\r\n const sweetAlert = useContext(SweetAlertContext);\r\n const produtoContext = useContext(ProdutoContext);\r\n\r\n // States\r\n const [imagem, setImagem] = useState(true);\r\n const [svg, setSvg] = useState();\r\n\r\n // Effects\r\n useEffect(() => {\r\n if (props.dados && props.dados.nomeImagem != \"\" && props.dados.nomeImagem != undefined) {\r\n formRef.current?.setFieldValue('nomeImagem', props.dados.nomeImagem);\r\n setImagem(false);\r\n }\r\n }, [props.dados]);\r\n\r\n\r\n // Handles\r\n const handleSubmit: SubmitHandler = async (form, { reset }) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n const SUPPORTED_FORMATS = ['image/jpg', 'image/jpeg', 'image/png', 'image/svg', \"image/svg+xml\"];\r\n\r\n // Definição da propriedade para medir a imagem.\r\n if (SUPPORTED_FORMATS.includes(form.imagem.type)) {\r\n Object.defineProperty(form.imagem, 'dimensions', {\r\n value: await checkDimension(form.imagem)\r\n });\r\n }\r\n\r\n const schema = Yup.object().shape({\r\n imagem: Yup.mixed()\r\n .test(\r\n \"fileFormat\",\r\n \"O arquivo deve ser .jpg, .png ou .svg\",\r\n value => value && SUPPORTED_FORMATS.includes(value.type)\r\n )\r\n });\r\n await schema.validate(form, { abortEarly: false });\r\n\r\n //Passou pela validação\r\n\r\n const { data: { disponivel } } = await api.get(`componente/disponivelMercado/${pId}`);\r\n\r\n if (disponivel) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n sweetAlert.alert(\"Atenção\", \"O material esta disponível em mercado, alteramos a situação para o modo edição, salve o cadastro para continuar com a atualização\");\r\n reset();\r\n }\r\n else {\r\n produtoContext.setEntrouEmEdicao(true);\r\n\r\n if (form.imagem != null) {\r\n var arquivo = new FormData();\r\n arquivo.append(\"arquivo\", form.imagem);\r\n arquivo.append(\"nomeArquivo\", form.imagem.name);\r\n arquivo.append(\"idComponente\", pId);\r\n props.setFiguraIcone((state: any) => ({\r\n ...state,\r\n nomeImagem: form.imagem.name\r\n }));\r\n\r\n await upload(arquivo);\r\n }\r\n\r\n //Coloca o nome do arquivo no campo input text \r\n formRef.current?.setFieldValue('nomeImagem', form.imagem.name);\r\n setImagem(false);\r\n }\r\n\r\n } catch (err) {\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n formRef.current?.clearField('nomeImagem');\r\n setImagem(true);\r\n }\r\n };\r\n\r\n const upload = async (arquivo: any) => {\r\n let promise = new Promise((resolve, reject) => {\r\n api.post(\"/componente/uploadFigura\", arquivo)\r\n .then(response => {\r\n resolve(response.data);\r\n })\r\n .catch(error => {\r\n reject(error);\r\n });\r\n });\r\n\r\n await toast.promise(promise, {\r\n pending: \"Enviando arquivo...\",\r\n success: \"Arquivo enviado com sucesso!\",\r\n error: \"Ocorreu um erro ao enviar o arquivo.\"\r\n });\r\n }\r\n\r\n const handleUploadImagem = (e: any) => {\r\n if (e.target.files?.length != 0) {\r\n formRef.current?.submitForm()\r\n } else {\r\n setImagem(true);\r\n formRef.current?.clearField('nomeImagem');\r\n formRef.current?.setErrors({});\r\n }\r\n }\r\n\r\n // Função que checa o tamanho da imagem sem exibir em tela.\r\n function checkDimension(value: any) {\r\n return new Promise(resolve => {\r\n\r\n if (value.type == \"image/svg+xml\") {\r\n const previewURL = URL.createObjectURL(value);\r\n setSvg(previewURL);\r\n const svgDom: any = document.getElementById(\"svgPreview\");\r\n svgDom.onload = () => {\r\n const width = svgDom?.width;\r\n const height = svgDom?.height;\r\n const dimensions = [width, height]\r\n resolve(dimensions);\r\n }\r\n }\r\n\r\n const reader = new FileReader();\r\n reader.readAsDataURL(value);\r\n reader.onload = () => {\r\n const img = new (window as any).Image();\r\n img.src = reader.result;\r\n img.onload = () => {\r\n const width = img.width;\r\n const height = img.height;\r\n const dimensions = [width, height]\r\n resolve(dimensions);\r\n };\r\n };\r\n });\r\n }\r\n\r\n const handleAlterarNome = async (e: any) => {\r\n if (props.dados.nomeImagem != e.target.value && e.target.value) {\r\n const message = `Deseja realmente alterar o nome da Imagem?`;\r\n\r\n sweetAlert.warning(e.target.value, message, async () => {\r\n produtoContext.setEntrouEmEdicao(true);\r\n\r\n await api.post('componente/alterarNomeFigura', { idComponente: pId, nomeArquivo: e.target.value })\r\n .then(response => {\r\n if (response.data.isValid) {\r\n toast.success(response.data.message);\r\n } else {\r\n toast.error(response.data.errors[0].errorMessage);\r\n }\r\n })\r\n props.dados.nomeImagem = e.target.value;\r\n },\r\n () => {\r\n formRef.current?.setFieldValue('nomeImagem', props.dados.nomeImagem);\r\n });\r\n }\r\n }\r\n\r\n return (\r\n <>\r\n
\r\n\r\n \r\n
Imagem
\r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n}\r\n\r\nexport default UploadImagem;","import React, { useState, useRef, useEffect, useContext } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\n\r\nimport { FileButton, Input } from \"../../../../../../components/Form\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from \"yup\";\r\nimport getValidationErrors from \"../../../../../../helpers/getValidateErrors\";\r\nimport api from \"../../../../../../services/api\";\r\n\r\nimport { SweetAlertContext } from \"../../../../../../contexts/sweetAlert/alertContext\";\r\nimport { ProdutoContext } from \"../../../../../../contexts/produtos/produtosContext\";\r\nimport { toast } from \"react-toastify\";\r\nimport { isNullOrUndefined } from \"../../../../../../helpers/validation\";\r\n\r\ninterface IUploadFicha {\r\n dados: any;\r\n}\r\n\r\nconst UploadFichaTecnica: React.FC = (props) => {\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //Context\r\n const sweetAlert = useContext(SweetAlertContext);\r\n const produtoContext = useContext(ProdutoContext);\r\n\r\n // States\r\n const [fichaTecnica, setFichaTecnica] = useState(true);\r\n\r\n // Effects\r\n useEffect(() => {\r\n if (\r\n props.dados &&\r\n props.dados.nomeFichaTecnica != \"\" &&\r\n props.dados.nomeFichaTecnica != undefined\r\n ) {\r\n formRef.current?.setFieldValue(\r\n \"nomeFichaTecnica\",\r\n tratarNomeFicha(props.dados.nomeFichaTecnica)\r\n );\r\n setFichaTecnica(false);\r\n }\r\n }, [props.dados]);\r\n\r\n const tratarNomeFicha = (nome: string): string => {\r\n if(isNullOrUndefined(nome))\r\n return '';\r\n\r\n if (nome.indexOf('#') != -1) {\r\n var nomeFicha = nome.split(\"#\")[1];\r\n return nomeFicha.replace(\"#\", \"\");\r\n }\r\n\r\n return nome;\r\n }\r\n\r\n // Handles\r\n const handleSubmit: SubmitHandler = async (form, { reset }) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n\r\n const SUPPORTED_FORMATS = [\r\n \"application/pdf\",\r\n \"image/jpg\",\r\n \"image/jpeg\",\r\n \"image/png\",\r\n ];\r\n\r\n const schema = Yup.object().shape({\r\n fichaTecnica: Yup.mixed().test(\r\n \"fileFormat\",\r\n \"O arquivo deve ser .pdf, .jpg ou png.\",\r\n (value) => value && SUPPORTED_FORMATS.includes(value.type)\r\n ),\r\n });\r\n await schema.validate(form, { abortEarly: false });\r\n\r\n const { data: { disponivel } } = await api.get(`componente/disponivelMercado/${pId}`);\r\n\r\n if (disponivel) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n sweetAlert.alert(\"Atenção\", \"O material esta disponível em mercado, alteramos a situação para o modo edição, salve o cadastro para continuar com a atualização\");\r\n reset();\r\n }\r\n else {\r\n //Passou pela validação\r\n produtoContext.setEntrouEmEdicao(true);\r\n\r\n if (form.fichaTecnica != null) {\r\n var arquivo = new FormData();\r\n arquivo.append(\"arquivo\", form.fichaTecnica);\r\n arquivo.append(\"nomeArquivo\", form.fichaTecnica.name);\r\n arquivo.append(\"idComponente\", pId);\r\n\r\n await upload(arquivo);\r\n }\r\n\r\n formRef.current?.setFieldValue(\r\n \"nomeFichaTecnica\",\r\n form.fichaTecnica.name\r\n );\r\n setFichaTecnica(false);\r\n }\r\n } catch (err) {\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n formRef.current?.clearField(\"nomeFichaTecnica\");\r\n setFichaTecnica(true);\r\n }\r\n };\r\n\r\n const upload = async (arquivo: any) => {\r\n let promise = new Promise((resolve, reject) => {\r\n api.post(\"/componente/uploadDesenhoTecnico\", arquivo)\r\n .then(response => {\r\n resolve(response.data);\r\n })\r\n .catch(error => {\r\n reject(error);\r\n });\r\n });\r\n\r\n await toast.promise(promise, {\r\n pending: \"Enviando arquivo...\",\r\n success: \"Arquivo enviado com sucesso!\",\r\n error: \"Ocorreu um erro ao enviar o arquivo.\"\r\n });\r\n }\r\n\r\n const handleUploadFichaTecnica = (e: any) => {\r\n if (e.target.files?.length != 0) {\r\n formRef.current?.submitForm();\r\n } else {\r\n setFichaTecnica(true);\r\n formRef.current?.clearField(\"nomeFichaTecnica\");\r\n formRef.current?.setErrors({});\r\n }\r\n };\r\n\r\n const handleAlterarNome = async (e: any) => {\r\n if (props.dados.nomeFichaTecnica != e.target.value && e.target.value) {\r\n const message = `Deseja realmente alterar o nome da ficha técnica?`;\r\n\r\n sweetAlert.warning(\r\n e.target.value,\r\n message,\r\n async () => {\r\n produtoContext.setEntrouEmEdicao(true);\r\n\r\n await api.post(\"componente/alterarNomeDesenhoTecnico\", {\r\n idComponente: pId,\r\n nomeArquivo: e.target.value,\r\n }).then(response => {\r\n if (response.data.isValid) {\r\n toast.success(response.data.message);\r\n } else {\r\n toast.error(response.data.errors[0].errorMessage);\r\n }\r\n });\r\n props.dados.nomeFichaTecnica = e.target.value;\r\n },\r\n () => {\r\n formRef.current?.setFieldValue(\r\n \"nomeFichaTecnica\",\r\n props.dados.nomeFichaTecnica\r\n );\r\n }\r\n );\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n \r\n
Ficha Técnica
\r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n};\r\n\r\nexport default UploadFichaTecnica;\r\n","import React, { useState, useRef, useEffect, useContext } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport { FileButton, Input } from \"../../../../../../components/Form\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from 'yup'\r\nimport getValidationErrors from \"../../../../../../helpers/getValidateErrors\"\r\nimport api from \"../../../../../../services/api\";\r\n\r\nimport { SweetAlertContext } from \"../../../../../../contexts/sweetAlert/alertContext\";\r\nimport { ProdutoContext } from \"../../../../../../contexts/produtos/produtosContext\";\r\nimport { toast } from \"react-toastify\";\r\n\r\n\r\ninterface IUploadImagem {\r\n dados: any,\r\n setFiguraIcone: any\r\n}\r\n\r\nconst UploadSVGX: React.FC = (props) => {\r\n\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //Context\r\n const sweetAlert = useContext(SweetAlertContext);\r\n const produtoContext = useContext(ProdutoContext);\r\n\r\n // States\r\n const [imagem, setImagem] = useState(true);\r\n const [svg, setSvg] = useState();\r\n\r\n // Effects\r\n useEffect(() => {\r\n if (props.dados && props.dados.nomeImagemSVGX != \"\" && props.dados.nomeImagemSVGX != undefined) {\r\n formRef.current?.setFieldValue('nomeImagem', props.dados.nomeImagemSVGX);\r\n setImagem(false);\r\n }\r\n }, [props.dados]);\r\n\r\n\r\n // Handles\r\n const handleSubmit: SubmitHandler = async (form, { reset }) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n\r\n const SUPPORTED_FORMATS = [\"svgx\"];\r\n\r\n const schema = Yup.object().shape({\r\n\r\n imagem: Yup.mixed()\r\n .test(\r\n \"fileFormat\",\r\n \"O arquivo deve ser .svgx\",\r\n value => {\r\n return value && SUPPORTED_FORMATS.includes(value.name.split(/[. ]+/).pop());\r\n }\r\n )\r\n });\r\n await schema.validate(form, { abortEarly: false });\r\n\r\n const { data: { disponivel } } = await api.get(`componente/disponivelMercado/${pId}`);\r\n\r\n if (disponivel) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n sweetAlert.alert(\"Atenção\", \"O material esta disponível em mercado, alteramos a situação para o modo edição, salve o cadastro para continuar com a atualização\");\r\n reset();\r\n }\r\n else {\r\n //Passou pela validação \r\n produtoContext.setEntrouEmEdicao(true);\r\n\r\n if (form.imagem != null) {\r\n var arquivo = new FormData();\r\n arquivo.append(\"arquivo\", form.imagem);\r\n arquivo.append(\"nomeArquivo\", form.imagem.name);\r\n arquivo.append(\"idComponente\", pId);\r\n props.setFiguraIcone((state: any) => ({\r\n ...state,\r\n nomeImagem: form.imagem.name\r\n }));\r\n\r\n await upload(arquivo);\r\n }\r\n\r\n //Coloca o nome do arquivo no campo input text \r\n formRef.current?.setFieldValue('nomeImagem', form.imagem.name);\r\n setImagem(false);\r\n }\r\n\r\n } catch (err) {\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n formRef.current?.clearField('nomeImagem');\r\n setImagem(true);\r\n }\r\n };\r\n\r\n const upload = async (arquivo: any) => {\r\n let promise = new Promise((resolve, reject) => {\r\n api.post(\"/componente/uploadFiguraSVGX\", arquivo)\r\n .then(response => {\r\n resolve(response.data);\r\n })\r\n .catch(error => {\r\n reject(error);\r\n });\r\n });\r\n\r\n await toast.promise(promise, {\r\n pending: \"Enviando arquivo...\",\r\n success: \"Arquivo enviado com sucesso!\",\r\n error: \"Ocorreu um erro ao enviar o arquivo.\"\r\n });\r\n }\r\n\r\n const handleUploadImagem = (e: any) => {\r\n if (e.target.files?.length != 0) {\r\n formRef.current?.submitForm()\r\n } else {\r\n setImagem(true);\r\n formRef.current?.clearField('nomeImagem');\r\n formRef.current?.setErrors({});\r\n }\r\n }\r\n\r\n const handleAlterarNome = async (e: any) => {\r\n if (props.dados.nomeImagemSVGX != e.target.value && e.target.value) {\r\n const message = `Deseja realmente alterar o nome da Imagem?`;\r\n\r\n sweetAlert.warning(e.target.value, message, async () => {\r\n produtoContext.setEntrouEmEdicao(true);\r\n\r\n await api.post('componente/alterarNomeFiguraSVGX', { idComponente: pId, nomeArquivo: e.target.value })\r\n .then(response => {\r\n if (response.data.isValid) {\r\n toast.success(response.data.message);\r\n } else {\r\n toast.error(response.data.errors[0].errorMessage);\r\n }\r\n })\r\n props.dados.nomeImagemSVGX = e.target.value;\r\n },\r\n () => {\r\n formRef.current?.setFieldValue('nomeImagem', props.dados.nomeImagemSVGX);\r\n });\r\n }\r\n }\r\n\r\n return (\r\n <>\r\n
\r\n\r\n \r\n
SVGX
\r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n}\r\n\r\nexport default UploadSVGX;","import React, { useContext, useEffect, useState } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport api from \"../../../../../services/api\";\r\n\r\nimport UploadMiniatura from \"./UploadMiniatura\";\r\nimport UploadImagem from \"./UploadImagem\";\r\nimport UploadFichaTecnica from \"./UploadFichaTecnica\";\r\nimport UploadSVGX from \"./UploadSVGX\";\r\n\r\nimport { ToastContext } from \"../../../../../contexts/toast/toastContext\";\r\nimport { getSingleErrorMessage } from \"../../../../../helpers/getSingleErrorMessage\";\r\n\r\nconst ComponenteTabImagensFichaTecnica: React.FC = ({ setFiguraIcone, figuraIcone }) => {\r\n\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // É um novo componente?\r\n const novo = (pId == 0);\r\n\r\n // Context \r\n const toastContext = useContext(ToastContext);\r\n\r\n // Effects\r\n useEffect(() => {\r\n const fetchData = async () => {\r\n api.get(`componente/ImagemAnexo/${pId}`)\r\n .then(response => {\r\n setFiguraIcone(response.data);\r\n })\r\n .catch(error => {\r\n const message = getSingleErrorMessage(error);\r\n if (message) {\r\n toastContext.notification(message, \"warn\");\r\n } else {\r\n toastContext.notification(\r\n \"Ocorreu um erro ao realizar essa operação.\",\r\n \"error\"\r\n );\r\n }\r\n });\r\n }\r\n\r\n fetchData();\r\n }, [pId]);\r\n\r\n\r\n\r\n\r\n return (\r\n <>\r\n\r\n \r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n >\r\n );\r\n};\r\nexport default ComponenteTabImagensFichaTecnica;\r\n","import React from \"react\";\r\n\r\nconst DataTableColumnCheckBox = ({ selectProps }) => {\r\n const props = selectProps;\r\n delete props.indeterminate;\r\n return (\r\n <>\r\n \r\n \r\n
\r\n >\r\n );\r\n};\r\n\r\nexport default DataTableColumnCheckBox;","import { useEffect, useRef, useState } from \"react\";\r\nimport { Button, Tab, Tabs, Modal, Image } from \"react-bootstrap\";\r\nimport { base64toBlob } from \"../../../../../../helpers/utils\";\r\nimport api from \"../../../../../../services/api\";\r\n\r\nimport Placeholder from \"../../../../../../assets/imgs/img-placeholder.png\";\r\nimport { IOutrasCaracteristicas } from \"../../../../../../common/interfaces/produtos.interfaces\";\r\n\r\nconst ModalPrevisualizacao: React.FC = ({ id }) => {\r\n\r\n //Constants\r\n const baseUrlImagem = `${process.env.REACT_APP_API}figurasicones/componentes/figuras/`;\r\n\r\n //Refs\r\n const emValidacao = useRef(\"\");\r\n\r\n //States\r\n const [figuraIcone, setFiguraIcone] = useState({});\r\n const [material, setMaterial] = useState(null);\r\n const [logoPreview, setLogoPreview] = useState([]);\r\n const [outrasCaracteristica, setOutrasCaracteristica] = useState([]);\r\n\r\n useEffect(() => {\r\n (async () => {\r\n\r\n console.log(id);\r\n const { data } = await api.get(`componente/${id}`);\r\n setMaterial(data);\r\n\r\n const figuraIcone = await api.get(`componente/ImagemAnexo/${id}`);\r\n setFiguraIcone(figuraIcone.data);\r\n\r\n const logoLinha = await api(`produto/logoLinhaAplicavel/${id}/COMPONENTE`)\r\n setLogoPreview(logoLinha.data);\r\n\r\n const outrasCaracteristica = await api.get(`produto/caracteristicaMaterial/${data.Codigo}/COMPONENTE`);\r\n setOutrasCaracteristica(outrasCaracteristica.data);\r\n\r\n emValidacao.current = (data?.situacao.label == \"Em Edição\" || data?.situacao.label == \"Em Homologação\" ? \"validacao/\" : \"\");\r\n })();\r\n }, []);\r\n\r\n return (\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n {material?.codigo}\r\n
\r\n
{material?.descricao}
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n Unidade Item:\r\n \r\n \r\n {material?.unidadeItem?.label}\r\n \r\n
\r\n
\r\n \r\n Unidade Embalagem:\r\n \r\n \r\n {material?.unidadeEmbalagem?.label}\r\n \r\n
\r\n
\r\n \r\n Quantidade Embalagem:\r\n \r\n \r\n {material?.quantidadeEmbalagem}\r\n \r\n
\r\n
\r\n Cor:\r\n \r\n {material?.cor?.label}\r\n \r\n
\r\n {material?.otimizacaoBarra != 0 && (\r\n
\r\n \r\n Tamanho da Barra:\r\n \r\n \r\n {material?.otimizacaoBarra} (mm)\r\n \r\n
\r\n )}\r\n
\r\n \r\n {material?.situacao?.label}\r\n \r\n \r\n {material?.status?.label}\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n {logoPreview.length != 0 && (\r\n
\r\n
\r\n
APLICÁVEL NAS LINHAS:
\r\n \r\n
\r\n
\r\n
\r\n {logoPreview.map((logoReferencia, index) => (\r\n
\r\n {\r\n \r\n }\r\n
\r\n ))}\r\n
\r\n
\r\n
\r\n
\r\n )}\r\n\r\n {outrasCaracteristica.length != 0 && (\r\n
\r\n
\r\n
OUTRAS CARACTERÍSTICAS:
\r\n \r\n
\r\n
\r\n
\r\n
\r\n {outrasCaracteristica.map(\r\n ({ nome, descricao }, index) => (\r\n
\r\n \r\n {nome}:\r\n {\" \"}\r\n {descricao}\r\n
\r\n )\r\n )}\r\n
\r\n
\r\n
\r\n
\r\n
\r\n )}\r\n
\r\n\r\n )\r\n}\r\n\r\nexport default ModalPrevisualizacao;","import React, { useState, useEffect, useMemo, useCallback } from \"react\";\r\nimport { Button, Modal, Row } from \"react-bootstrap\";\r\nimport ReactSelect from \"react-select\";\r\nimport { useParams } from \"react-router-dom\";\r\n\r\nimport api from \"../../../../../../services/api\";\r\nimport DataNotFound from \"../../../../../../components/DataNotFound\";\r\nimport { IAplicabilidade } from \"../../../../../../common/interfaces/produtos.interfaces\";\r\nimport FilterTableApi from \"../../../../../../components/DataTable/paginationTable-BuscaExt\";\r\nimport GlobalFilter from \"../../../../../../components/DataTable/GlobalFilter\";\r\nimport { IPaginacao } from \"../../../../../../common/interfaces/paginacao.interfaces\";\r\nimport DataTableColumnCheckBox from \"../../../../../../components/DataTable/DataTableCheckbox\";\r\nimport ModalPrevisualizacao from \"../ModalPrevisualizacao\";\r\nimport Placeholder from \"../../../../../../assets/imgs/img-placeholder.png\";\r\n\r\nconst ComponenteTabAplicabilidadeModalAdicionar: React.FC = ({ setTableSelectedRows }) => {\r\n\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n //Fields Typed\r\n const DataTableTS: any = FilterTableApi;\r\n const queryString = require('querystring');\r\n\r\n //States\r\n const [tableData, setTableData] = useState([]);\r\n const [tableLoading, setTableLoading] = useState(false);\r\n const [filter, setFilter] = useState('');\r\n const [filterReferencia, setFilterReferencia] = useState();\r\n const [referencia, setReferencia] = useState(null);\r\n const [pageCount, setPageCount] = useState(0);\r\n const [showAplicavel, setShowAplicavel] = useState(false);\r\n const [idAplicavel, setIdAplicavel] = useState(null);\r\n\r\n useEffect(() => {\r\n const fetchData = async () => {\r\n try {\r\n const referencias = await api.get('referencia/aplicabilidadeSelect');\r\n setReferencia(referencias.data);\r\n } catch (error) {\r\n console.log(error);\r\n } finally {\r\n setTableLoading(false);\r\n }\r\n }\r\n\r\n fetchData();\r\n }, []);\r\n\r\n //Callbacks\r\n const fetchData = useCallback(async (paginacao: IPaginacao) => {\r\n try {\r\n setTableLoading(true);\r\n const { data: { dados, paginas } } = await api.get(`/aplicabilidade/listaComponente?${queryString.stringify(paginacao)}&idComponenteBase=${pId}`);\r\n setPageCount(paginas);\r\n setTableData(dados);\r\n\r\n } catch (error) {\r\n ;\r\n } finally {\r\n setTableLoading(false);\r\n }\r\n }, []);\r\n\r\n //Handle\r\n const handleFiltroReferencia = (filtro?: number) => {\r\n setFilterReferencia(filtro);\r\n };\r\n\r\n const handleCloseAplicavel = () => setShowAplicavel(false);\r\n\r\n const handleVisualizarAplicavel = ({ id }: any) => {\r\n setIdAplicavel(id);\r\n setShowAplicavel(true);\r\n }\r\n\r\n const columns = useMemo(\r\n () => [\r\n {\r\n Header: \"\",\r\n accessor: \"check\",\r\n display: \"align-middle text-center column-table-1b\",\r\n Cell: ({ row }: any) => (\r\n \r\n ),\r\n },\r\n {\r\n Header: \"Código\",\r\n accessor: \"codigo\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Descrição\",\r\n accessor: \"descricao\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Referencia\",\r\n accessor: \"logoReferencia\",\r\n display: \"align-middle\",\r\n Cell: ({ row: { original } }: { row: { original: IAplicabilidade } }) => {\r\n return(
event.target.src = Placeholder}\r\n alt=\"logo\"\r\n />)\r\n },\r\n },\r\n {\r\n Header: \"Ação\",\r\n accessor: \"acao\",\r\n disableSortBy: true,\r\n display: \"align-middle column-table-2b\",\r\n Cell: ({\r\n row: { original },\r\n }: {\r\n row: { original: IAplicabilidade };\r\n }) => (\r\n <>\r\n {original.fichaTecnica &&\r\n \r\n }\r\n \r\n >\r\n ),\r\n },\r\n ],\r\n []\r\n );\r\n\r\n return (\r\n <>\r\n \r\n \r\n handleFiltroReferencia(e.value)}\r\n />\r\n
\r\n \r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n {tableData && (\r\n \r\n )}\r\n
\r\n
\r\n
\r\n
\r\n\r\n {/* Modal Apicável */}\r\n \r\n \r\n Pré-visualização\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n >\r\n );\r\n};\r\n\r\nexport default ComponenteTabAplicabilidadeModalAdicionar;\r\n","import React, { useState, useEffect, useMemo, useRef, useContext } from \"react\";\r\nimport { Button, Modal } from \"react-bootstrap\";\r\nimport api from \"../../../../../services/api\";\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport { getSingleErrorMessage } from \"../../../../../helpers/getSingleErrorMessage\";\r\nimport { useParams } from \"react-router-dom\";\r\n\r\nimport DataTable from \"../../../../../components/DataTable\";\r\nimport DataNotFound from \"../../../../../components/DataNotFound\";\r\nimport { ToastContext } from \"../../../../../contexts/toast/toastContext\";\r\nimport { SweetAlertContext } from \"../../../../../contexts/sweetAlert/alertContext\";\r\nimport { IAplicabilidade } from \"../../../../../common/interfaces/produtos.interfaces\";\r\nimport ModalAplicabilidade from \"./ModalAplicabilidade\";\r\nimport { ToastErrorContext } from \"../../../../../contexts/toast/toastErrorContext\";\r\nimport ModalPrevisualizacao from \"./ModalPrevisualizacao\";\r\nimport { ProdutoContext } from \"../../../../../contexts/produtos/produtosContext\";\r\nimport Placeholder from \"../../../../../assets/imgs/img-placeholder.png\";\r\nimport { toast } from \"react-toastify\";\r\n\r\nconst ComponenteTabAplicabilidade: React.FC = ({ setReload, reload }) => {\r\n\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n //Fields\r\n const DataTableTS: any = DataTable;\r\n\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //Context\r\n const sweetAlertContext = useContext(SweetAlertContext);\r\n const toastContext = useContext(ToastContext);\r\n const toastError = useContext(ToastErrorContext);\r\n const produtoContext = useContext(ProdutoContext);\r\n\r\n //States\r\n const [tableData, setTableData] = useState([]);\r\n const [tableLoading, setTableLoading] = useState(false);\r\n const [show, setShow] = useState(false);\r\n const [reloadTable, setReloadTable] = useState(false);\r\n const [showAplicavel, setShowAplicavel] = useState(false);\r\n const [idAplicavel, setIdAplicavel] = useState(null);\r\n\r\n //Rows Modal Aplicabilidade\r\n const [tableSelectedRows, setTableSelectedRows] = useState([]);\r\n\r\n\r\n //Effects\r\n useEffect(() => {\r\n const fetchData = async () => {\r\n try {\r\n const { data } = await api.get(`aplicabilidade/listaAplicabilidade/${pId}`);\r\n setTableData(data);\r\n } catch (error) {\r\n } finally {\r\n setTableLoading(false);\r\n }\r\n }\r\n\r\n fetchData();\r\n }, [reloadTable]);\r\n\r\n //Handle\r\n const handleSave = () => {\r\n formRef.current?.submitForm();\r\n };\r\n\r\n const handleSubmit: SubmitHandler = async () => {\r\n\r\n try {\r\n var aplicabilidade = { idComponente: pId, IdsAplicabilidade: tableSelectedRows };\r\n\r\n const { data: { disponivel } } = await api.get(`componente/disponivelMercado/${pId}`);\r\n if (disponivel) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n setShow(false);\r\n sweetAlertContext.alert(\"Atenção\", \"O material esta disponível em mercado, alteramos a situação para o modo edição, salve o cadastro para continuar com a atualização\");\r\n }\r\n else {\r\n await api.post('aplicabilidade/SalvarComponenteAplicavel', aplicabilidade);\r\n\r\n setReloadTable(reload => !reload);\r\n setShow(false);\r\n\r\n toast.success(\"A ação foi concluída.\");\r\n }\r\n } catch (err) {\r\n\r\n\r\n toast.error(getSingleErrorMessage(err));\r\n }\r\n };\r\n\r\n const handleClose = () => setShow(false);\r\n\r\n const handleNew = () => setShow(true);\r\n\r\n const handleCloseAplicavel = () => setShowAplicavel(false);\r\n\r\n const handleVisualizarAplicavel = ({ idAplicavel, codigo }: any) => {\r\n setIdAplicavel(idAplicavel);\r\n setShowAplicavel(true);\r\n }\r\n\r\n const handleDelete = async ({ id, descricao }: IAplicabilidade) => {\r\n\r\n const { data: { disponivel } } = await api.get(`componente/disponivelMercado/${pId}`);\r\n\r\n if (disponivel) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n setShow(false);\r\n sweetAlertContext.alert(\"Atenção\", \"O material esta disponível em mercado, alteramos a situação para o modo edição, salve o cadastro para continuar com a atualização\");\r\n }\r\n else {\r\n //Alert\r\n const title = `Excluir \"${descricao}\"?`;\r\n const message =\r\n \"Essa aplicabilidade será excluída, isso não pode ser desfeito.\";\r\n sweetAlertContext.danger(title, message, async () => {\r\n try {\r\n await api.delete(`aplicabilidade/${id}`);\r\n setReloadTable(reload => !reload);\r\n sweetAlertContext.close();\r\n } catch (error) {\r\n const message = getSingleErrorMessage(error);\r\n if (message) {\r\n toastContext.notification(message, \"warn\");\r\n } else {\r\n toastContext.notification(\r\n \"Ocorreu um erro ao realizar essa operação.\",\r\n \"error\"\r\n );\r\n }\r\n }\r\n });\r\n }\r\n };\r\n\r\n const columns = useMemo(\r\n () => [\r\n {\r\n Header: \"Código\",\r\n accessor: \"codigo\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Descrição\",\r\n accessor: \"descricao\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Referencia\",\r\n accessor: \"linkLogoReferencia\",\r\n display: \"align-middle\",\r\n Cell: ({\r\n row: { original },\r\n }: {\r\n row: { original: IAplicabilidade };\r\n }) => {\r\n return
event.target.src = Placeholder}\r\n alt=\"logo\"\r\n />\r\n },\r\n },\r\n {\r\n Header: \"Situação\",\r\n accessor: \"situacao\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Ação\",\r\n accessor: \"acao\",\r\n disableSortBy: true,\r\n display: \"align-middle column-table-3b\",\r\n Cell: ({ row: { original } }: { row: { original: IAplicabilidade } }) => (\r\n <>\r\n {original.fichaTecnica &&\r\n \r\n }\r\n \r\n {!original.excluida &&\r\n \r\n }\r\n >\r\n ),\r\n },\r\n ],\r\n []\r\n );\r\n\r\n return (\r\n <>\r\n \r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n {tableData && (\r\n ({\r\n style: {\r\n background: original.excluida ? 'rgb(214 57 57 / 20%)' : '',\r\n },\r\n })}\r\n />\r\n )}\r\n
\r\n
\r\n
\r\n
\r\n\r\n {/* Modal Aplicabilidade */}\r\n \r\n \r\n Adicionar Aplicabilidade\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n {/* Modal Apicável */}\r\n \r\n \r\n Pré-visualização\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n >\r\n );\r\n};\r\n\r\nexport default ComponenteTabAplicabilidade;\r\n","import React from \"react\";\r\nimport { Button } from \"react-bootstrap\";\r\nimport { useHistory } from \"react-router-dom\";\r\n\r\nconst BackButton = () => {\r\n const history = useHistory();\r\n\r\n const handleClick = () => {\r\n history.push(\"/produtos\");\r\n };\r\n\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default BackButton;\r\n","import React, { useRef, useContext, useEffect, useState } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport { Button, Tab, Tabs, Modal, Image, Spinner } from \"react-bootstrap\";\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from \"yup\";\r\nimport getValidationErrors from \"../../../../helpers/getValidateErrors\";\r\nimport { ToastContext } from \"../../../../contexts/toast/toastContext\";\r\nimport TabGeral from \"./TabGeral\";\r\nimport TabOutrasCaracteristicas from \"./TabOutrasCaracteristicas\";\r\nimport TabLinhasDeAplicacao from \"./TabLinhasDeAplicacao\";\r\nimport TabImagensFichaTecnica from \"./TabImagensFichaTecnica\";\r\nimport TabAplicabilidade from \"./TabAplicabilidade\";\r\nimport { base64toBlob } from \"../../../../helpers/utils\";\r\nimport BackButton from \"../../../../components/ButtonBack\";\r\nimport {\r\n IFormComponente,\r\n IOutrasCaracteristicas,\r\n} from \"../../../../common/interfaces/produtos.interfaces\";\r\nimport api from \"../../../../services/api\";\r\nimport { ToastErrorContext } from \"../../../../contexts/toast/toastErrorContext\";\r\nimport history from \"../../../../helpers/history\";\r\nimport Placeholder from \"../../../../assets/imgs/img-placeholder.png\";\r\nimport { toast } from \"react-toastify\";\r\nimport { getSingleErrorMessage } from \"../../../../helpers/getSingleErrorMessage\";\r\n\r\ninterface IComponente {\r\n tipoProduto: string;\r\n}\r\n\r\nconst Componente: React.FC = (props) => {\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n const message = \"Campo obrigatório\";\r\n const schema = Yup.object().shape({\r\n status: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n situacao: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n codigo: Yup.string()\r\n .required(message)\r\n .max(20, \"O código só pode ter no máximo 20 caracteres.\"),\r\n codigoInterno: Yup.string().max(\r\n 20,\r\n \"O código interno só pode ter no máximo 20 caracteres.\"\r\n ),\r\n referencia: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n linha: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n aplicabilidade: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n descricao: Yup.string()\r\n .required(message)\r\n .max(100, \"O código interno só pode ter no máximo 100 caracteres.\"),\r\n grupo: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n cor: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n unidadeItem: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n unidadeEmbalagem: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n quantidadeEmbalagem: Yup.string().required(message),\r\n });\r\n\r\n // Fields\r\n const novo = pId == 0;\r\n const baseUrlImagem = `${process.env.REACT_APP_API}figurasicones/componentes/figuras/`;\r\n\r\n // Refs\r\n const formRef = useRef(null);\r\n // States\r\n const [loadingSave, setLoadingSave] = useState(false);\r\n const emValidacao = useRef(\"\");\r\n const [show, setShow] = useState(false);\r\n const [reload, setReload] = useState(false);\r\n const [reloadCompleto, setReloadCompleto] = useState(false);\r\n const [material, setMaterial] = useState(null);\r\n const [selectLinhaAplicacao, setSelectLinhaAplicacao] = useState({});\r\n const [outrasCaracteristica, setOutrasCaracteristica] = useState<\r\n IOutrasCaracteristicas[]\r\n >([]);\r\n const [logoPreview, setLogoPreview] = useState([]);\r\n const [figuraIcone, setFiguraIcone] = useState({});\r\n const [selectValues, setSelectValues] = useState({});\r\n const [logoLinha, setLogoLinha] = useState(null);\r\n const [loadingValues, setLoadingValues] = useState(false);\r\n const [ocultarAplicabilidade, setOcultarAplicabilidade] = useState(false);\r\n\r\n // Context\r\n const toastContext = useContext(ToastContext);\r\n const toastError = useContext(ToastErrorContext);\r\n\r\n // Effects\r\n useEffect(() => {\r\n const fetchData = async () => {\r\n if (props.tipoProduto.toUpperCase() === \"COMPONENTE\") {\r\n if (!novo) {\r\n const { data } = await api.get(`componente/${pId}`);\r\n setMaterial(data);\r\n\r\n emValidacao.current =\r\n data?.situacao.label == \"Em Edição\" ||\r\n data?.situacao.label == \"Em Homologação\"\r\n ? \"validacao/\"\r\n : \"\";\r\n const linhaAplicacao = await api.get(\r\n `geral/selecaoLinhaAplicacao/${data?.referencia?.value}/COMPONENTE`\r\n );\r\n setSelectLinhaAplicacao(linhaAplicacao.data);\r\n\r\n const {\r\n data: { ocultarAplicabilidade },\r\n } = await api.get(\r\n `produto/ReferenciaEmAplicabilidadePropria/${data?.referencia?.value}`\r\n );\r\n setOcultarAplicabilidade(ocultarAplicabilidade);\r\n }\r\n }\r\n };\r\n\r\n fetchData();\r\n }, [props.tipoProduto, reload]);\r\n\r\n useEffect(() => {\r\n (async () => {\r\n if (props.tipoProduto.toUpperCase() == \"COMPONENTE\") {\r\n setLoadingValues(true);\r\n const unidade = await api.get(\"geral/selecaoUnidadeItemEmbalagem\");\r\n const grupo = await api.get(\"geral/selecaoGrupo\");\r\n const cor = await api.get(\"geral/selecaoCor\");\r\n const referencia = await api.get(\r\n \"geral/selecaoReferenciaMaterial/COMPONENTE\"\r\n );\r\n\r\n setSelectValues({\r\n referencia: referencia.data,\r\n unidade: unidade.data,\r\n grupo: grupo.data,\r\n cor: cor.data,\r\n formRef: formRef,\r\n });\r\n\r\n setLoadingValues(false);\r\n }\r\n })();\r\n }, [props.tipoProduto, reloadCompleto]);\r\n\r\n useEffect(() => {\r\n material && formRef.current?.setData(material);\r\n }, [material]);\r\n\r\n // Handles\r\n const handleClose = () => setShow(false);\r\n\r\n const handlePreview = () => {\r\n setShow(true);\r\n };\r\n\r\n const handleSubmit: SubmitHandler = async (componente) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n\r\n await schema.validate(componente, { abortEarly: false });\r\n\r\n componente.id = pId;\r\n const {\r\n data: { id },\r\n } = await api.post(\"componente\", componente);\r\n\r\n toast.success(\"A ação foi concluída.\");\r\n\r\n history.push(`/produtos/${id}/${componente.codigo}/componente`);\r\n setReload((reload) => !reload);\r\n } catch (err) {\r\n toast.error(getSingleErrorMessage(err));\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n }\r\n };\r\n\r\n const submit = () => {\r\n setLoadingSave(true);\r\n setTimeout(() => {\r\n setLoadingSave(false);\r\n }, 500);\r\n formRef.current?.submitForm();\r\n };\r\n\r\n return (\r\n (novo || material) && (\r\n <>\r\n \r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {loadingSave ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n
\r\n
\r\n
\r\n
\r\n\r\n {/* Modal Pré-visualização */}\r\n \r\n \r\n Pré-visualização\r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n {logoLinha && (\r\n
\r\n (event.target.src = Placeholder)\r\n }\r\n width=\"180px\"\r\n className=\"pb-4\"\r\n />\r\n )}\r\n \r\n {material?.codigo}\r\n
\r\n {material?.descricao}
\r\n \r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n Unidade Item:\r\n \r\n \r\n {material?.unidadeItem?.label}\r\n \r\n
\r\n
\r\n \r\n Unidade Embalagem:\r\n \r\n \r\n {material?.unidadeEmbalagem?.label}\r\n \r\n
\r\n
\r\n \r\n Quantidade Embalagem:\r\n \r\n \r\n {material?.quantidadeEmbalagem}\r\n \r\n
\r\n
\r\n Cor:\r\n \r\n {material?.cor?.label}\r\n \r\n
\r\n {material?.otimizacaoBarra != 0 && (\r\n
\r\n \r\n Tamanho da Barra:\r\n \r\n \r\n {material?.otimizacaoBarra} (mm)\r\n \r\n
\r\n )}\r\n
\r\n \r\n {material?.situacao?.label}\r\n \r\n \r\n {material?.status?.label}\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n\r\n {logoPreview.length != 0 && (\r\n
\r\n
\r\n
APLICÁVEL NAS LINHAS:
\r\n \r\n
\r\n
\r\n
\r\n {logoPreview.map((logoReferencia, index) => (\r\n
\r\n {\r\n \r\n (event.target.src = Placeholder)\r\n }\r\n width=\"80px\"\r\n />\r\n }\r\n
\r\n ))}\r\n
\r\n
\r\n
\r\n
\r\n )}\r\n\r\n {outrasCaracteristica.length != 0 && (\r\n
\r\n
\r\n
OUTRAS CARACTERÍSTICAS:
\r\n \r\n
\r\n
\r\n
\r\n
\r\n {outrasCaracteristica.map(\r\n ({ nome, descricao }, index) => (\r\n
\r\n \r\n {nome}:\r\n {\" \"}\r\n {descricao}\r\n
\r\n )\r\n )}\r\n
\r\n
\r\n
\r\n
\r\n
\r\n )}\r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n >\r\n )\r\n );\r\n};\r\nexport default Componente;\r\n","import React, { useState, useEffect, useContext } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport { Form, Accordion, Card } from \"react-bootstrap\";\r\nimport { Input, Select, InputDecimal } from \"../../../../../components/Form\";\r\nimport {\r\n situacao,\r\n status,\r\n simOuNao,\r\n} from \"../../../../../components/Form/Select/options\";\r\nimport api from \"../../../../../services/api\";\r\n\r\nimport { ProdutoContext } from \"../../../../../contexts/produtos/produtosContext\";\r\n\r\nconst PerfilTabGeral: React.FC = ({\r\n selectValues,\r\n setLogoLinha,\r\n loadingValues,\r\n material,\r\n}) => {\r\n\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // É um novo componente?\r\n const novo = pId == 0;\r\n\r\n //Constants\r\n const perfilComposto = [\r\n { label: \"Não\", value: 0 },\r\n { label: \"Sim\", value: 3 },\r\n { label: \"Interno\", value: 1 },\r\n { label: \"Externo\", value: 2 },\r\n ];\r\n\r\n // Contexts\r\n const produtoContext = useContext(ProdutoContext);\r\n // //States\r\n const [linha, setLinha] = useState([]);\r\n const [prenativo, setPrenativo] = useState([]);\r\n const [unidadeValorizacao, setUnidadeValorizacao] = useState([]);\r\n const [classeIds, setClasseIds] = useState([]);\r\n\r\n const fetchTemperaOptions = async (ligaValue: any) => {\r\n const temperaOptionsResponse = await api.get(`geral/ObterSelectById/${ligaValue}`);\r\n selectValues.formRef?.current?.setFieldValue(\"tempera\", temperaOptionsResponse.data);\r\n };\r\n //Effects\r\n useEffect(() => {\r\n produtoContext.setEntrouEmEdicao(false);\r\n }, []);\r\n\r\n if (!produtoContext.entrouEmEdicao &&\r\n selectValues &&\r\n selectValues.liga?.length > 0 &&\r\n material &&\r\n material.liga == null\r\n ) {\r\n const liga6060 = selectValues.liga.find((p: any) => p.label == \"6060\");\r\n const temperaT5 = selectValues.tempera.find((p: any) => p.label == \"T5\");\r\n selectValues.formRef?.current?.setFieldValue(\"liga\", liga6060);\r\n selectValues.formRef?.current?.setFieldValue(\"tempera\", temperaT5);\r\n }\r\n\r\n useEffect(() => {\r\n if (produtoContext.entrouEmEdicao && Object.keys(selectValues).length != 0) {\r\n selectValues.formRef?.current?.setFieldValue(\"situacao\", situacao[0]);\r\n }\r\n }, [produtoContext.entrouEmEdicao]);\r\n\r\n //Handles\r\n const handleReferenciaLinha = async ({ value }: any) => {\r\n selectValues.formRef?.current?.clearField(\"linha\");\r\n\r\n const { data } = await api.get(`linha/select/${value}`);\r\n\r\n //buscar as classes ids pela referencia\r\n await api.get(`geral/SelecaoClassePorReferenciaId/${value}`)\r\n .then(data => {\r\n setClasseIds(data.data)\r\n });\r\n \r\n setLinha(data);\r\n\r\n handleChangeField();\r\n };\r\n\r\n const handleLinha = async (e: any) => {\r\n if (e != undefined) {\r\n Promise.all([\r\n api.get(`geral/logoLinha/${e.value}`),\r\n api.get(`geral/selecaoPrenativo/${e.value}`),\r\n api.get(\"geral/selecaoUnidadePerfil\")\r\n ]).then(([logoLinha, prenativo, unidadeValor]) => {\r\n setLogoLinha(logoLinha.data);\r\n setUnidadeValorizacao(unidadeValor.data);\r\n setPrenativo(prenativo.data);\r\n });\r\n //await fetchTemperaOptions(e.value);\r\n }\r\n handleChangeField();\r\n };\r\n\r\n const handleChangeField = () => {\r\n if (!produtoContext.entrouEmEdicao && !loadingValues) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n Código *\r\n \r\n \r\n
\r\n Código Interno\r\n \r\n \r\n
\r\n\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n\r\n
\r\n \r\n Descrição *\r\n \r\n \r\n \r\n\r\n
\r\n \r\n Tamanho da Barra 1 *\r\n \r\n \r\n \r\n Tamanho da Barra 2\r\n \r\n \r\n \r\n Tamanho da Barra 3\r\n \r\n \r\n \r\n\r\n
\r\n \r\n Peso *\r\n {\r\n const { formattedValue, floatValue } = values;\r\n return formattedValue === \"\" || floatValue <= 999;\r\n }}\r\n />\r\n \r\n \r\n IPI\r\n {\r\n const { formattedValue, floatValue } = values;\r\n return formattedValue === \"\" || floatValue <= 99;\r\n }}\r\n />\r\n \r\n \r\n\r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n\r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n\r\n
\r\n \r\n \r\n Informações Adicionais\r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n\r\n \r\n \r\n WX\r\n {\r\n const { formattedValue, floatValue } = values;\r\n return formattedValue === \"\" || floatValue <= 999;\r\n }}\r\n />\r\n \r\n \r\n JX\r\n {\r\n const { formattedValue, floatValue } = values;\r\n return formattedValue === \"\" || floatValue <= 999;\r\n }}\r\n />\r\n \r\n \r\n\r\n \r\n \r\n WY\r\n {\r\n const { formattedValue, floatValue } = values;\r\n return formattedValue === \"\" || floatValue <= 999;\r\n }}\r\n />\r\n \r\n \r\n JY\r\n {\r\n const { formattedValue, floatValue } = values;\r\n return formattedValue === \"\" || floatValue <= 999;\r\n }}\r\n />\r\n \r\n \r\n\r\n \r\n \r\n Perímetro Total\r\n {\r\n const { formattedValue, floatValue } = values;\r\n return formattedValue === \"\" || floatValue <= 999;\r\n }}\r\n />\r\n \r\n \r\n Perímetro de Tratamento\r\n {\r\n const { formattedValue, floatValue } = values;\r\n return formattedValue === \"\" || floatValue <= 999;\r\n }}\r\n />\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n
\r\n >\r\n );\r\n};\r\nexport default PerfilTabGeral;\r\n","import React, { useState, useEffect, useMemo, useRef, useContext } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport { Button } from \"react-bootstrap\";\r\nimport { Input, TextArea } from \"../../../../../components/Form\";\r\nimport api from \"../../../../../services/api\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from 'yup'\r\nimport getValidationErrors from \"../../../../../helpers/getValidateErrors\"\r\nimport { getSingleErrorMessage } from \"../../../../../helpers/getSingleErrorMessage\";\r\n\r\nimport DataTable from \"../../../../../components/DataTable\";\r\nimport DataNotFound from \"../../../../../components/DataNotFound\";\r\n\r\nimport { ToastContext } from \"../../../../../contexts/toast/toastContext\";\r\nimport { SweetAlertContext } from \"../../../../../contexts/sweetAlert/alertContext\";\r\n\r\nimport { IOutrasCaracteristicas } from \"../../../../../common/interfaces/produtos.interfaces\";\r\nimport { ToastErrorContext } from \"../../../../../contexts/toast/toastErrorContext\";\r\nimport { toast } from \"react-toastify\";\r\n\r\nconst PerfilTabOutrasCaracteristicas: React.FC = ({setTableData, tableData}) => {\r\n\r\n // URL Params\r\n const { pId, pString }: any = useParams();\r\n\r\n //Fields\r\n const DataTableTS: any = DataTable;\r\n const tipoMaterial = 'PERFIL';\r\n const novo = (pId == 0);\r\n\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //Context\r\n const sweetAlertContext = useContext(SweetAlertContext);\r\n const toastContext = useContext(ToastContext);\r\n const toastError = useContext(ToastErrorContext);\r\n\r\n //States\r\n const [tableLoading, setTableLoading] = useState(false);\r\n const [reloadTable, setReloadTable] = useState(false);\r\n\r\n //Effects\r\n useEffect(() => {\r\n\r\n const fetchData = async () => {\r\n try {\r\n if (!novo) {\r\n setTableLoading(true);\r\n const { data } = await api.get(`produto/caracteristicaMaterial/${pString}/${tipoMaterial}`); \r\n setTableData(data);\r\n }\r\n } catch (error) {\r\n console.log(error);\r\n } finally {\r\n setTableLoading(false);\r\n }\r\n }\r\n\r\n fetchData();\r\n \r\n }, [reloadTable]);\r\n\r\n // Handles\r\n const handleSubmit: SubmitHandler = async (outrasCaracteristicasPerfil, { reset }) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n\r\n const message = \"Campo obrigatório\";\r\n const schema = Yup.object().shape({\r\n\r\n nome: Yup.string().required(message),\r\n descricao: Yup.string().required(message),\r\n });\r\n await schema.validate(outrasCaracteristicasPerfil, { abortEarly: false });\r\n\r\n //Passou pela validação \r\n outrasCaracteristicasPerfil.codigo = pString;\r\n outrasCaracteristicasPerfil.tipoMaterial = tipoMaterial;\r\n \r\n await api.post('produto/SalvarCaracteristicaMaterial', outrasCaracteristicasPerfil);\r\n\r\n toast.success(\"A ação foi concluída.\");\r\n\r\n setReloadTable(reload => !reload);\r\n reset();\r\n\r\n } catch (err) {\r\n toast.error(getSingleErrorMessage(err));\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n }\r\n };\r\n\r\n const handleDelete = ({ id, nome }: IOutrasCaracteristicas) => {\r\n const title = `Excluir \"${nome}\"?`;\r\n const message = \"Essa característica será excluída, isso não pode ser desfeito.\";\r\n sweetAlertContext.danger(title, message, async () => {\r\n try {\r\n await api.delete(`produto/RemoverCaracteristicaMaterial/${id}`);\r\n setTableData((prevState: any) =>\r\n prevState.filter(function (item: any) {\r\n return item.id !== id;\r\n })\r\n );\r\n sweetAlertContext.close();\r\n } catch (error) {\r\n const message = getSingleErrorMessage(error);\r\n if (message) {\r\n toastContext.notification(message, \"warn\");\r\n } else {\r\n toastContext.notification(\r\n \"Ocorreu um erro ao realizar essa operação.\",\r\n \"error\"\r\n );\r\n }\r\n }\r\n });\r\n };\r\n\r\n\r\n const columns = useMemo(\r\n () => [\r\n {\r\n Header: \"Nome\",\r\n accessor: \"nome\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Descrição\",\r\n accessor: \"descricao\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Ação\",\r\n accessor: \"acao\",\r\n disableSortBy: true,\r\n display: \"align-middle column-table-1b\",\r\n Cell: ({ row: { original } }: { row: { original: IOutrasCaracteristicas } }) => (\r\n\r\n \r\n\r\n ),\r\n },\r\n ],\r\n []\r\n );\r\n\r\n return (\r\n <>\r\n \r\n\r\n \r\n
\r\n
\r\n
\r\n {tableData && (\r\n \r\n )}\r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n};\r\nexport default PerfilTabOutrasCaracteristicas;\r\n","import React, { useState, useEffect, useMemo, useRef, useContext } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport { Button } from \"react-bootstrap\";\r\nimport { Select } from \"../../../../../components/Form\";\r\nimport api from \"../../../../../services/api\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from 'yup'\r\nimport getValidationErrors from \"../../../../../helpers/getValidateErrors\"\r\nimport { getSingleErrorMessage } from \"../../../../../helpers/getSingleErrorMessage\";\r\n\r\nimport DataTable from \"../../../../../components/DataTable\";\r\nimport DataNotFound from \"../../../../../components/DataNotFound\";\r\n\r\nimport { ToastContext } from \"../../../../../contexts/toast/toastContext\";\r\nimport { SweetAlertContext } from \"../../../../../contexts/sweetAlert/alertContext\";\r\nimport { ProdutoContext } from \"../../../../../contexts/produtos/produtosContext\";\r\n\r\nimport { ILinhasAplicacao } from \"../../../../../common/interfaces/produtos.interfaces\";\r\nimport { toast } from \"react-toastify\";\r\n\r\nconst PerfilTabLinhasDeAplicacao: React.FC = ({ selectLinhaAplicacao, setLogoPreview }) => {\r\n \r\n //Fields\r\n const DataTableTS: any = DataTable;\r\n\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // É um novo perfil?\r\n const novo = (pId == 0);\r\n const tipoMaterial = 'PERFIL';\r\n\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //Context\r\n const sweetAlertContext = useContext(SweetAlertContext);\r\n const toastContext = useContext(ToastContext);\r\n const produtoContext = useContext(ProdutoContext);\r\n\r\n\r\n //States\r\n const [tableData, setTableData] = useState([]);\r\n const [tableLoading, setTableLoading] = useState(false);\r\n const [reloadTable, setReloadTable] = useState(false);\r\n\r\n //Effects\r\n useEffect(() => {\r\n (async () => {\r\n try {\r\n if (!novo) {\r\n setTableLoading(true);\r\n const { data } = await api.get(`perfil/linhaAplicacao/${pId}`);\r\n const previewLogos = await api(`produto/logoLinhaAplicavel/${pId}/${tipoMaterial}`)\r\n\r\n setLogoPreview(previewLogos.data);\r\n setTableData(data);\r\n }\r\n } catch (error) {\r\n } finally {\r\n setTableLoading(false);\r\n }\r\n })();\r\n }, [reloadTable]);\r\n\r\n //Handles\r\n const handleSubmit: SubmitHandler = async (linhasAplicacaoPerfil, { reset }) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n\r\n const message = \"Campo obrigatório\";\r\n const schema = Yup.object().shape({\r\n\r\n linhaAplicacao: Yup.object().shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n }).nullable().required(message),\r\n });\r\n await schema.validate(linhasAplicacaoPerfil, { abortEarly: false });\r\n\r\n //Passou pela validação \r\n linhasAplicacaoPerfil.idMaterial = pId;\r\n await api.post('perfil/salvarLinhaAplicacao', linhasAplicacaoPerfil);\r\n\r\n setReloadTable(reload => !reload);\r\n reset();\r\n\r\n produtoContext.setEntrouEmEdicao(true);\r\n\r\n toast.success(\"A ação foi concluída.\");\r\n\r\n } catch (err) {\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n }\r\n };\r\n\r\n const handleDelete = ({ id, linhaAplicacao }: ILinhasAplicacao) => {\r\n const title = `Excluir \"${linhaAplicacao}\"?`;\r\n const message = \"Essa aplicação de linha será excluída, isso não pode ser desfeito.\";\r\n sweetAlertContext.danger(title, message, async () => {\r\n try {\r\n await api.delete(`perfil/removerLinhaAplicacao/${id}`);\r\n setTableData((prevState) =>\r\n prevState.filter(function (item) {\r\n return item.id !== id;\r\n })\r\n );\r\n produtoContext.setEntrouEmEdicao(true);\r\n sweetAlertContext.close();\r\n } catch (error) {\r\n const message = getSingleErrorMessage(error);\r\n if (message) {\r\n toastContext.notification(message, \"warn\");\r\n } else {\r\n toastContext.notification(\r\n \"Ocorreu um erro ao realizar essa operação.\",\r\n \"error\"\r\n );\r\n }\r\n }\r\n });\r\n };\r\n\r\n const columns = useMemo(\r\n () => [\r\n {\r\n Header: \"Linhas\",\r\n accessor: \"linhaAplicacao\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Ação\",\r\n accessor: \"acao\",\r\n disableSortBy: true,\r\n display: \"align-middle column-table-1b\",\r\n Cell: ({ row: { original } }: { row: { original: ILinhasAplicacao } }) => (\r\n\r\n \r\n\r\n ),\r\n },\r\n ],\r\n []\r\n );\r\n\r\n return (\r\n <>\r\n \r\n\r\n \r\n
\r\n
\r\n
\r\n {tableData && (\r\n \r\n )}\r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n};\r\nexport default PerfilTabLinhasDeAplicacao;\r\n","import React, { useState, useRef, useEffect, useContext } from \"react\";\r\n\r\nimport { FileButton, Input } from \"../../../../../../components/Form\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from 'yup'\r\nimport { useParams } from \"react-router-dom\";\r\nimport getValidationErrors from \"../../../../../../helpers/getValidateErrors\"\r\nimport api from \"../../../../../../services/api\";\r\n\r\nimport { SweetAlertContext } from \"../../../../../../contexts/sweetAlert/alertContext\";\r\nimport { ProdutoContext } from \"../../../../../../contexts/produtos/produtosContext\";\r\nimport { toast } from \"react-toastify\";\r\n\r\n\r\ninterface IUploadMiniatura {\r\n dados: any,\r\n setFiguraIcone: any\r\n}\r\n\r\nconst UploadMiniatura: React.FC = (props) => {\r\n\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //Context\r\n const sweetAlert = useContext(SweetAlertContext);\r\n const produtoContext = useContext(ProdutoContext);\r\n\r\n const handleChangeField = () => {\r\n if (!produtoContext.entrouEmEdicao) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n }\r\n };\r\n\r\n // States\r\n const [miniatura, setMiniatura] = useState(true);\r\n\r\n // Effects\r\n useEffect(() => {\r\n if (props.dados && props.dados.nomeMiniatura != \"\" && props.dados.nomeMiniatura != undefined) {\r\n formRef.current?.setFieldValue('nomeMiniatura', props.dados.nomeMiniatura);\r\n setMiniatura(false);\r\n }\r\n }, [props.dados]);\r\n\r\n\r\n // Handles\r\n const handleSubmit: SubmitHandler = async (thumb, { reset }) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n\r\n const SUPPORTED_FORMATS = [\"image/bmp\"];\r\n\r\n // Definição da propriedade para medir a imagem.\r\n if (SUPPORTED_FORMATS.includes(thumb.miniatura.type)) {\r\n Object.defineProperty(thumb.miniatura, 'dimensions', {\r\n value: await checkDimension(thumb.miniatura)\r\n });\r\n }\r\n\r\n const schema = Yup.object().shape({\r\n\r\n miniatura: Yup.mixed()\r\n .test(\r\n \"fileDimension\",\r\n \"A miniatura deve ter 64x64 pixels\",\r\n (value) => !value.dimensions || value.dimensions[0] === 64 && value.dimensions[1] === 64\r\n )\r\n .test(\r\n \"fileFormat\",\r\n \"O arquivo deve ser .bmp\",\r\n value => value && SUPPORTED_FORMATS.includes(value.type)\r\n )\r\n });\r\n await schema.validate(thumb, { abortEarly: false });\r\n\r\n const { data: { disponivel } } = await api.get(`perfil/disponivelMercado/${pId}`);\r\n\r\n if (disponivel) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n sweetAlert.alert(\"Atenção\", \"O material esta disponível em mercado, alteramos a situação para o modo edição, salve o cadastro para continuar com a atualização\");\r\n reset();\r\n }\r\n else {\r\n //Passou pela validação\r\n handleChangeField();\r\n\r\n if (thumb.miniatura != null) {\r\n var arquivo = new FormData();\r\n arquivo.append(\"arquivo\", thumb.miniatura);\r\n arquivo.append(\"nomeArquivo\", thumb.miniatura.name);\r\n arquivo.append(\"idPerfil\", pId);\r\n\r\n props.setFiguraIcone((state: any) => ({\r\n ...state,\r\n nomeMiniatura: thumb.miniatura.name\r\n }));\r\n\r\n await upload(arquivo);\r\n }\r\n\r\n formRef.current?.setFieldValue('nomeMiniatura', thumb.miniatura.name);\r\n setMiniatura(false);\r\n }\r\n } catch (err) {\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n formRef.current?.clearField('nomeMiniatura');\r\n setMiniatura(true);\r\n }\r\n };\r\n\r\n const upload = async (arquivo: any) => {\r\n let promise = new Promise((resolve, reject) => {\r\n api.post(\"/perfil/uploadIcone\", arquivo)\r\n .then(response => {\r\n resolve(response.data);\r\n })\r\n .catch(error => {\r\n reject(error);\r\n });\r\n });\r\n\r\n await toast.promise(promise, {\r\n pending: \"Enviando arquivo...\",\r\n success: \"Arquivo enviado com sucesso!\",\r\n error: \"Ocorreu um erro ao enviar o arquivo.\"\r\n });\r\n }\r\n\r\n const handleUploadMiniatura = (e: any) => {\r\n if (e.target.files?.length != 0) {\r\n formRef.current?.submitForm()\r\n } else {\r\n setMiniatura(true);\r\n formRef.current?.clearField('nomeMiniatura');\r\n formRef.current?.setErrors({});\r\n }\r\n }\r\n\r\n // Função que checa o tamanho da imagem sem exibir em tela.\r\n function checkDimension(value: any) {\r\n return new Promise(resolve => {\r\n const reader = new FileReader();\r\n reader.readAsDataURL(value);\r\n reader.onload = () => {\r\n const img = new (window as any).Image();\r\n img.src = reader.result;\r\n img.onload = () => {\r\n const width = img.width;\r\n const height = img.height;\r\n const dimensions = [width, height]\r\n resolve(dimensions);\r\n };\r\n };\r\n });\r\n }\r\n\r\n const handleAlterarNome = async (e: any) => {\r\n if (props.dados.nomeMiniatura != e.target.value && e.target.value) {\r\n const message = `Deseja realmente alterar o nome do icone?`;\r\n\r\n sweetAlert.warning(e.target.value, message, async () => {\r\n handleChangeField();\r\n\r\n await api.post('perfil/alterarNomeIcone', {\r\n idPerfil: pId,\r\n nomeArquivo: e.target.value\r\n }).then(response => {\r\n if (response.data.isValid) {\r\n toast.success(response.data.message);\r\n } else {\r\n toast.error(response.data.errors[0].errorMessage);\r\n }\r\n });\r\n props.dados.nomeMiniatura = e.target.value;\r\n },\r\n () => {\r\n formRef.current?.setFieldValue('nomeMiniatura', props.dados.nomeMiniatura);\r\n });\r\n }\r\n }\r\n\r\n return (\r\n <>\r\n \r\n
Miniatura
\r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n}\r\n\r\nexport default UploadMiniatura;","import React, { useState, useRef, useEffect, useContext } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\n\r\nimport { FileButton, Input } from \"../../../../../../components/Form\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from 'yup'\r\nimport getValidationErrors from \"../../../../../../helpers/getValidateErrors\"\r\nimport api from \"../../../../../../services/api\";\r\n\r\nimport { SweetAlertContext } from \"../../../../../../contexts/sweetAlert/alertContext\";\r\nimport { ProdutoContext } from \"../../../../../../contexts/produtos/produtosContext\";\r\nimport { toast } from \"react-toastify\";\r\n\r\n\r\ninterface IUploadImagem {\r\n dados: any,\r\n setFiguraIcone: any\r\n}\r\n\r\nconst UploadImagem: React.FC = (props) => {\r\n\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //Context\r\n const sweetAlert = useContext(SweetAlertContext);\r\n const produtoContext = useContext(ProdutoContext);\r\n\r\n // States\r\n const [imagem, setImagem] = useState(true);\r\n const [svg, setSvg] = useState();\r\n\r\n // Effects\r\n useEffect(() => {\r\n if (props.dados && props.dados.nomeImagem != \"\" && props.dados.nomeImagem != undefined) {\r\n formRef.current?.setFieldValue('nomeImagem', props.dados.nomeImagem);\r\n setImagem(false);\r\n }\r\n }, [props.dados]);\r\n\r\n\r\n const handleChangeField = () => {\r\n if (!produtoContext.entrouEmEdicao) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n }\r\n };\r\n\r\n // Handles\r\n const handleSubmit: SubmitHandler = async (form, { reset }) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n\r\n const SUPPORTED_FORMATS = ['image/jpg', 'image/jpeg', 'image/png', 'image/svg', \"image/svg+xml\"];\r\n\r\n // Definição da propriedade para medir a imagem.\r\n if (SUPPORTED_FORMATS.includes(form.imagem.type)) {\r\n Object.defineProperty(form.imagem, 'dimensions', {\r\n value: await checkDimension(form.imagem)\r\n });\r\n }\r\n\r\n const schema = Yup.object().shape({\r\n\r\n imagem: Yup.mixed()\r\n .test(\r\n \"fileFormat\",\r\n \"O arquivo deve ser .jpg, .png ou .svg\",\r\n value => value && SUPPORTED_FORMATS.includes(value.type)\r\n )\r\n });\r\n await schema.validate(form, { abortEarly: false });\r\n\r\n //Passou pela validação \r\n\r\n const { data: { disponivel } } = await api.get(`perfil/disponivelMercado/${pId}`);\r\n\r\n if (disponivel) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n sweetAlert.alert(\"Atenção\", \"O material esta disponível em mercado, alteramos a situação para o modo edição, salve o cadastro para continuar com a atualização\");\r\n reset();\r\n }\r\n else {\r\n handleChangeField();\r\n\r\n if (form.imagem != null) {\r\n var arquivo = new FormData();\r\n arquivo.append(\"arquivo\", form.imagem);\r\n arquivo.append(\"nomeArquivo\", form.imagem.name);\r\n arquivo.append(\"idPerfil\", pId);\r\n\r\n props.setFiguraIcone((state: any) => ({\r\n ...state,\r\n nomeImagem: form.imagem.name\r\n }));\r\n\r\n await upload(arquivo);\r\n }\r\n\r\n //Coloca o nome do arquivo no campo input text \r\n formRef.current?.setFieldValue('nomeImagem', form.imagem.name);\r\n setImagem(false);\r\n }\r\n\r\n } catch (err) {\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n formRef.current?.clearField('nomeImagem');\r\n setImagem(true);\r\n }\r\n };\r\n\r\n const upload = async (arquivo: any) => {\r\n let promise = new Promise((resolve, reject) => {\r\n api.post(\"/perfil/uploadFigura\", arquivo)\r\n .then(response => {\r\n resolve(response.data);\r\n })\r\n .catch(error => {\r\n reject(error);\r\n });\r\n });\r\n\r\n await toast.promise(promise, {\r\n pending: \"Enviando arquivo...\",\r\n success: \"Arquivo enviado com sucesso!\",\r\n error: \"Ocorreu um erro ao enviar o arquivo.\"\r\n });\r\n }\r\n\r\n const handleUploadImagem = (e: any) => {\r\n if (e.target.files?.length != 0) {\r\n formRef.current?.submitForm()\r\n } else {\r\n setImagem(true);\r\n formRef.current?.clearField('nomeImagem');\r\n formRef.current?.setErrors({});\r\n }\r\n }\r\n\r\n // Função que checa o tamanho da imagem sem exibir em tela.\r\n function checkDimension(value: any) {\r\n return new Promise(resolve => {\r\n\r\n if (value.type == \"image/svg+xml\") {\r\n const previewURL = URL.createObjectURL(value);\r\n setSvg(previewURL);\r\n const svgDom: any = document.getElementById(\"svgPreview\");\r\n svgDom.onload = () => {\r\n const width = svgDom?.width;\r\n const height = svgDom?.height;\r\n const dimensions = [width, height]\r\n resolve(dimensions);\r\n }\r\n }\r\n\r\n const reader = new FileReader();\r\n reader.readAsDataURL(value);\r\n reader.onload = () => {\r\n const img = new (window as any).Image();\r\n img.src = reader.result;\r\n img.onload = () => {\r\n const width = img.width;\r\n const height = img.height;\r\n const dimensions = [width, height]\r\n resolve(dimensions);\r\n };\r\n };\r\n });\r\n }\r\n\r\n const handleAlterarNome = async (e: any) => {\r\n if (props.dados.nomeImagem != e.target.value && e.target.value) {\r\n const message = `Deseja realmente alterar o nome da Imagem?`;\r\n\r\n sweetAlert.warning(e.target.value, message, async () => {\r\n handleChangeField();\r\n\r\n await api.post('perfil/alterarNomeFigura', {\r\n idPerfil: pId,\r\n nomeArquivo: e.target.value\r\n }).then(response => {\r\n if (response.data.isValid) {\r\n toast.success(response.data.message);\r\n } else {\r\n toast.error(response.data.errors[0].errorMessage);\r\n }\r\n })\r\n props.dados.nomeImagem = e.target.value;\r\n },\r\n () => {\r\n formRef.current?.setFieldValue('nomeImagem', props.dados.nomeImagem);\r\n });\r\n }\r\n }\r\n\r\n return (\r\n <>\r\n
\r\n\r\n \r\n
Imagem
\r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n}\r\n\r\nexport default UploadImagem;","import React, { useState, useRef, useEffect, useContext } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport { FileButton, Input } from \"../../../../../../components/Form\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from 'yup'\r\nimport getValidationErrors from \"../../../../../../helpers/getValidateErrors\"\r\nimport api from \"../../../../../../services/api\";\r\n\r\nimport { SweetAlertContext } from \"../../../../../../contexts/sweetAlert/alertContext\";\r\nimport { ProdutoContext } from \"../../../../../../contexts/produtos/produtosContext\";\r\nimport { toast } from \"react-toastify\";\r\n\r\n\r\ninterface IUploadImagem {\r\n dados: any,\r\n setFiguraIcone: any\r\n}\r\n\r\nconst UploadSVGX: React.FC = (props) => {\r\n\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //Context\r\n const sweetAlert = useContext(SweetAlertContext);\r\n const produtoContext = useContext(ProdutoContext);\r\n\r\n // States\r\n const [imagem, setImagem] = useState(true);\r\n const [svg, setSvg] = useState();\r\n\r\n // Effects\r\n useEffect(() => {\r\n if (props.dados && props.dados.nomeImagemSVGX != \"\" && props.dados.nomeImagemSVGX != undefined) {\r\n formRef.current?.setFieldValue('nomeImagem', props.dados.nomeImagemSVGX);\r\n setImagem(false);\r\n }\r\n }, [props.dados]);\r\n\r\n const handleChangeField = () => {\r\n if (!produtoContext.entrouEmEdicao) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n }\r\n };\r\n\r\n\r\n // Handles\r\n const handleSubmit: SubmitHandler = async (form, { reset }) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n\r\n const SUPPORTED_FORMATS = [\"svgx\"];\r\n\r\n const schema = Yup.object().shape({\r\n\r\n imagem: Yup.mixed()\r\n .test(\r\n \"fileFormat\",\r\n \"O arquivo deve ser .svgx\",\r\n value => {\r\n return value && SUPPORTED_FORMATS.includes(value.name.split(/[. ]+/).pop());\r\n }\r\n )\r\n });\r\n await schema.validate(form, { abortEarly: false });\r\n\r\n const { data: { disponivel } } = await api.get(`perfil/disponivelMercado/${pId}`);\r\n\r\n if (disponivel) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n sweetAlert.alert(\"Atenção\", \"O material esta disponível em mercado, alteramos a situação para o modo edição, salve o cadastro para continuar com a atualização\");\r\n reset();\r\n }\r\n else {\r\n //Passou pela validação \r\n handleChangeField();\r\n\r\n if (form.imagem != null) {\r\n var arquivo = new FormData();\r\n arquivo.append(\"arquivo\", form.imagem);\r\n arquivo.append(\"nomeArquivo\", form.imagem.name);\r\n arquivo.append(\"idPerfil\", pId);\r\n props.setFiguraIcone((state: any) => ({\r\n ...state,\r\n nomeImagemSGV: form.imagem.name\r\n }));\r\n\r\n await upload(arquivo);\r\n }\r\n\r\n //Coloca o nome do arquivo no campo input text \r\n formRef.current?.setFieldValue('nomeImagem', form.imagem.name);\r\n setImagem(false);\r\n }\r\n\r\n } catch (err) {\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n formRef.current?.clearField('nomeImagem');\r\n setImagem(true);\r\n }\r\n };\r\n\r\n const upload = async (arquivo: any) => {\r\n let promise = new Promise((resolve, reject) => {\r\n api.post(\"/perfil/uploadFiguraSVGX\", arquivo)\r\n .then(response => {\r\n resolve(response.data);\r\n })\r\n .catch(error => {\r\n reject(error);\r\n });\r\n });\r\n\r\n await toast.promise(promise, {\r\n pending: \"Enviando arquivo...\",\r\n success: \"Arquivo enviado com sucesso!\",\r\n error: \"Ocorreu um erro ao enviar o arquivo.\"\r\n });\r\n }\r\n\r\n const handleUploadImagem = (e: any) => {\r\n if (e.target.files?.length != 0) {\r\n formRef.current?.submitForm()\r\n } else {\r\n setImagem(true);\r\n formRef.current?.clearField('nomeImagem');\r\n formRef.current?.setErrors({});\r\n }\r\n }\r\n\r\n const handleAlterarNome = async (e: any) => {\r\n if (props.dados.nomeImagemSVGX != e.target.value && e.target.value) {\r\n const message = `Deseja realmente alterar o nome da Imagem?`;\r\n\r\n sweetAlert.warning(e.target.value, message, async () => {\r\n handleChangeField();\r\n\r\n await api.post('perfil/alterarNomeFiguraSVGX', { \r\n idperfil: pId, \r\n nomeArquivo: e.target.value \r\n }).then(response => {\r\n if (response.data.isValid) {\r\n toast.success(response.data.message);\r\n } else {\r\n toast.error(response.data.errors[0].errorMessage);\r\n }\r\n });\r\n props.dados.nomeImagemSVGX = e.target.value;\r\n },\r\n () => {\r\n formRef.current?.setFieldValue('nomeImagem', props.dados.nomeImagemSVGX);\r\n });\r\n }\r\n }\r\n\r\n return (\r\n <>\r\n
\r\n\r\n \r\n
SVGX
\r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n}\r\n\r\nexport default UploadSVGX;","import React, { useContext, useEffect, useState } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport api from \"../../../../../services/api\";\r\n\r\nimport UploadMiniatura from \"./UploadMiniatura\";\r\nimport UploadImagem from \"./UploadImagem\";\r\nimport UploadFichaTecnica from \"./UploadFichaTecnica\";\r\nimport UploadSVGX from \"./UploadSVGX\";\r\n\r\nimport { ToastContext } from \"../../../../../contexts/toast/toastContext\";\r\nimport { getSingleErrorMessage } from \"../../../../../helpers/getSingleErrorMessage\";\r\n\r\nconst PerfilTabImagens: React.FC = ({setFiguraIcone, figuraIcone}) => {\r\n\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // É um novo Perfil?\r\n const novo = (pId == 0);\r\n\r\n // Context \r\n const toastContext = useContext(ToastContext); \r\n\r\n // Effects\r\n useEffect(() => {\r\n (async () => {\r\n try {\r\n if (!novo) {\r\n const { data } = await api.get(`perfil/ImagemAnexo/${pId}`);\r\n setFiguraIcone(data);\r\n }\r\n } catch (error) {\r\n const message = getSingleErrorMessage(error);\r\n if (message) {\r\n toastContext.notification(message, \"warn\");\r\n } else {\r\n toastContext.notification(\r\n \"Ocorreu um erro ao realizar essa operação.\",\r\n \"error\"\r\n );\r\n }\r\n }\r\n })();\r\n }, [pId]);\r\n\r\n return (\r\n <>\r\n \r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n {/*
\r\n \r\n
*/}\r\n
\r\n\r\n >\r\n );\r\n};\r\nexport default PerfilTabImagens;\r\n","import React, { useState, useEffect, useMemo, useRef, useContext, useCallback } from \"react\";\r\nimport { Select, SelectAsync } from \"../../../../../components/Form\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport { Button } from \"react-bootstrap\";\r\nimport api from \"../../../../../services/api\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from \"yup\";\r\nimport getValidationErrors from \"../../../../../helpers/getValidateErrors\";\r\nimport { getSingleErrorMessage } from \"../../../../../helpers/getSingleErrorMessage\";\r\n\r\nimport DataTable from \"../../../../../components/DataTable\";\r\nimport DataNotFound from \"../../../../../components/DataNotFound\";\r\n\r\nimport { ToastContext } from \"../../../../../contexts/toast/toastContext\";\r\nimport { SweetAlertContext } from \"../../../../../contexts/sweetAlert/alertContext\";\r\nimport { ProdutoContext } from \"../../../../../contexts/produtos/produtosContext\";\r\n\r\nimport { IFormComposicao } from \"../../../../../common/interfaces/produtos.interfaces\";\r\nimport { IListComposicaoPerfil } from \"../../../../../common/interfaces/produtos.interfaces\";\r\nimport { ToastErrorContext } from \"../../../../../contexts/toast/toastErrorContext\";\r\nimport { toast } from \"react-toastify\";\r\n\r\nconst PerfilTabComposicao: React.FC = ({ selectedTab }) => {\r\n const internoExterno = [\r\n { label: \"Interno\", value: 'INTERNO' },\r\n { label: \"Externo\", value: 'EXTERNO' },\r\n { label: \"Cor Única\", value: '' },\r\n ];\r\n\r\n //Fields\r\n const DataTableTS: any = DataTable;\r\n\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // É novo?\r\n const novo = (pId == 0);\r\n\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //Context\r\n const sweetAlertContext = useContext(SweetAlertContext);\r\n const toastContext = useContext(ToastContext);\r\n const toastError = useContext(ToastErrorContext);\r\n const produtoContext = useContext(ProdutoContext);\r\n\r\n //States\r\n const [tableData, setTableData] = useState([]);\r\n const [tableLoading, setTableLoading] = useState(false);\r\n const [reloadTable, setReloadTable] = useState(false);\r\n\r\n //Effects\r\n useEffect(() => {\r\n (async () => {\r\n try {\r\n if (!novo) {\r\n setTableLoading(true);\r\n const { data } = await api.get(`perfil/perfilComposto/${pId}`);\r\n setTableData(data);\r\n }\r\n } catch (error) {\r\n } finally {\r\n setTableLoading(false);\r\n }\r\n })();\r\n }, [reloadTable]);\r\n\r\n const handleOptionsPerfil = useCallback(async (inputValue: string) => {\r\n try {\r\n const { data } = await api.get(`perfil/selectPerfilComposto/${pId}/${inputValue}`);\r\n return data;\r\n } catch (error) {\r\n \r\n } finally {\r\n\r\n }\r\n }, [])\r\n\r\n // Handles\r\n const handleSubmit: SubmitHandler = async (\r\n composicaoPerfil,\r\n { reset }\r\n ) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n\r\n const message = \"Campo obrigatório\";\r\n const schema = Yup.object().shape({\r\n perfil: Yup.object().shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n }).nullable().required(message),\r\n internoExterno: Yup.object().shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n }).nullable().required(message),\r\n });\r\n\r\n await schema.validate(composicaoPerfil, { abortEarly: false });\r\n\r\n const { data: { disponivel } } = await api.get(`perfil/disponivelMercado/${pId}`);\r\n\r\n if (disponivel) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n sweetAlertContext.alert(\"Atenção\", \"O material esta disponível em mercado, alteramos a situação para o modo edição, salve o cadastro para continuar com a atualização\");\r\n setReloadTable(reload => !reload);\r\n }\r\n else {\r\n //Passou pela validação \r\n composicaoPerfil.idPerfil = pId;\r\n await api.post('perfil/salvarPerfilComposto', composicaoPerfil);\r\n\r\n setReloadTable(reload => !reload);\r\n reset();\r\n toast.success(\"A ação foi concluída.\");\r\n }\r\n } catch (err) {\r\n toast.error(getSingleErrorMessage(err));\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n }\r\n };\r\n\r\n const handleDelete = async ({ id, perfil }: IListComposicaoPerfil) => {\r\n const { data: { disponivel } } = await api.get(`perfil/disponivelMercado/${pId}`);\r\n if (disponivel) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n sweetAlertContext.alert(\"Atenção\", \"O material esta disponível em mercado, alteramos a situação para o modo edição, salve o cadastro para continuar com a atualização\");\r\n }\r\n else {\r\n //Alert\r\n const title = `Excluir \"${perfil}\"?`;\r\n const message =\r\n \"Essa composição será excluída, isso não pode ser desfeito.\";\r\n sweetAlertContext.danger(title, message, async () => {\r\n try {\r\n await api.delete(`perfil/removerPerfilComposto/${id}`);\r\n\r\n setTableData((prevState) =>\r\n prevState.filter(function (item) {\r\n return item.id !== id;\r\n })\r\n );\r\n produtoContext.setEntrouEmEdicao(true);\r\n\r\n sweetAlertContext.close();\r\n } catch (error) {\r\n const message = getSingleErrorMessage(error);\r\n if (message) {\r\n toastContext.notification(message, \"warn\");\r\n } else {\r\n toastContext.notification(\r\n \"Ocorreu um erro ao realizar essa operação.\",\r\n \"error\"\r\n );\r\n }\r\n }\r\n });\r\n }\r\n };\r\n\r\n const columns = useMemo(\r\n () => [\r\n {\r\n Header: \"Perfil\",\r\n accessor: \"perfil\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Interno / Externo\",\r\n accessor: \"internoExterno\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Ação\",\r\n accessor: \"acao\",\r\n display: \"align-middle column-table-1b\",\r\n Cell: ({\r\n row: { original },\r\n }: {\r\n row: { original: IListComposicaoPerfil };\r\n }) => (\r\n \r\n ),\r\n },\r\n ],\r\n []\r\n );\r\n\r\n return (\r\n <>\r\n \r\n\r\n\r\n \r\n
\r\n
\r\n
\r\n {tableData && (\r\n \r\n )}\r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n};\r\nexport default PerfilTabComposicao;\r\n","import React, { useState, useRef, useContext, useEffect } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport { Button, Tab, Tabs, Modal, Image, Spinner } from \"react-bootstrap\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from \"yup\";\r\nimport getValidationErrors from \"../../../../helpers/getValidateErrors\";\r\nimport { base64toBlob } from \"../../../../helpers/utils\";\r\n\r\nimport { ToastContext } from \"../../../../contexts/toast/toastContext\";\r\n\r\nimport TabGeral from \"./TabGeral\";\r\nimport TabOutrasCaracteristicas from \"./TabOutrasCaracteristicas\";\r\nimport TabLinhasDeAplicacao from \"./TabLinhasDeAplicacao\";\r\nimport TabImagens from \"./TabImagens\";\r\nimport TabComposicao from \"./TabComposicao\";\r\n\r\nimport {\r\n IFormPerfil,\r\n IOutrasCaracteristicas,\r\n} from \"../../../../common/interfaces/produtos.interfaces\";\r\n\r\nimport api from \"../../../../services/api\";\r\nimport history from \"../../../../helpers/history\";\r\nimport { ToastErrorContext } from \"../../../../contexts/toast/toastErrorContext\";\r\nimport Placeholder from \"../../../../assets/imgs/img-placeholder.png\";\r\nimport { toast } from \"react-toastify\";\r\nimport { getSingleErrorMessage } from \"../../../../helpers/getSingleErrorMessage\";\r\nimport BackButton from \"../../../../components/ButtonBack\";\r\n\r\ninterface IPerfil {\r\n tipoProduto: string;\r\n}\r\n\r\nconst Perfil: React.FC = (props) => {\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // Fields\r\n const novo = pId == 0;\r\n const baseUrlImagem = `${process.env.REACT_APP_API}figurasicones/perfis/figuras/`;\r\n //\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //States\r\n const [loadingSave, setLoadingSave] = useState(false);\r\n const emValidacao = useRef(\"\");\r\n const [selectValues, setSelectValues] = useState({});\r\n const [selectLinhaAplicacao, setSelectLinhaAplicacao] = useState({});\r\n const [outrasCaracteristica, setOutrasCaracteristica] = useState<\r\n IOutrasCaracteristicas[]\r\n >([]);\r\n const [logoPreview, setLogoPreview] = useState([]);\r\n const [figuraIcone, setFiguraIcone] = useState({});\r\n const [show, setShow] = useState(false);\r\n const [selectedTab, setSelectedTab] = useState(\"\");\r\n const [logoLinha, setLogoLinha] = useState(null);\r\n const [loadingValues, setLoadingValues] = useState(false);\r\n const [material, setMaterial] = useState(null);\r\n const [reload, setReload] = useState(false);\r\n\r\n // Context\r\n const toastContext = useContext(ToastContext);\r\n const toastError = useContext(ToastErrorContext);\r\n\r\n //Validation Schema\r\n const message = \"Campo obrigatório\";\r\n const schema = Yup.object().shape({\r\n status: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n situacao: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n codigo: Yup.string()\r\n .required(message)\r\n .max(20, \"O código só pode ter no máximo 20 caracteres.\"),\r\n codigoInterno: Yup.string().max(\r\n 20,\r\n \"O código interno só pode ter no máximo 20 caracteres.\"\r\n ),\r\n referencia: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n linha: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n descricao: Yup.string()\r\n .required(message)\r\n .max(100, \"A descrição só pode ter no máximo 100 caracteres.\"),\r\n barra1: Yup.string().required(message),\r\n prenativo: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n classeId: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n peso: Yup.string().required(message).nullable(),\r\n });\r\n\r\n // Effects\r\n useEffect(() => {\r\n const fetchData = async () => {\r\n if (props.tipoProduto.toUpperCase() == \"PERFIL\") {\r\n if (!novo) {\r\n const { data } = await api.get(`perfil/${pId}`);\r\n setMaterial(data);\r\n\r\n emValidacao.current =\r\n data?.situacao.label == \"Em Edição\" ||\r\n data?.situacao.label == \"Em Homologação\"\r\n ? \"validacao/\"\r\n : \"\";\r\n const linhaAplicacao = await api.get(\r\n `geral/selecaoLinhaAplicacao/${data?.referencia?.value}/PERFIL`\r\n );\r\n setSelectLinhaAplicacao(linhaAplicacao.data);\r\n }\r\n }\r\n };\r\n\r\n fetchData();\r\n }, [props.tipoProduto, reload]);\r\n\r\n useEffect(() => {\r\n const fetchData = async () => {\r\n if (props.tipoProduto.toUpperCase() == \"PERFIL\") {\r\n setLoadingValues(true);\r\n\r\n let [referencia, tempera, liga, classeId] = await Promise.all([\r\n api.get(\"geral/selecaoReferenciaMaterial/PERFIL\"),\r\n api.get(\"geral/selecaoTempera\"),\r\n api.get(\"geral/selecaoLiga\"),\r\n api.get(\"geral/selecaoClasseId\"),\r\n ]);\r\n\r\n setSelectValues({\r\n referencia: referencia.data,\r\n tempera: tempera.data,\r\n liga: liga.data,\r\n //classeId: classeId.data,\r\n formRef: formRef,\r\n });\r\n\r\n setLoadingValues(false);\r\n }\r\n };\r\n\r\n fetchData();\r\n }, [props.tipoProduto]);\r\n\r\n useEffect(() => {\r\n material && formRef.current?.setData(material);\r\n }, [material]);\r\n\r\n // Handles\r\n const handleClose = () => setShow(false);\r\n\r\n const handleNew = () => {\r\n setShow(true);\r\n };\r\n\r\n const handleSubmit: SubmitHandler = async (perfil) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n await schema.validate(perfil, { abortEarly: false });\r\n perfil.id = pId;\r\n\r\n if (perfil.liga == null) {\r\n const liga6060 = selectValues.liga.find((p: any) => p.label == \"6060\");\r\n perfil.liga = liga6060;\r\n }\r\n\r\n if (perfil.tempera == null) {\r\n const temperaT5 = selectValues.tempera.find(\r\n (p: any) => p.label == \"T5\"\r\n );\r\n perfil.tempera = temperaT5;\r\n }\r\n\r\n const {\r\n data: { id },\r\n } = await api.post(\"perfil\", perfil);\r\n\r\n toast.success(\"A ação foi concluída.\");\r\n history.push(`/produtos/${id}/${perfil.codigo}/perfil`);\r\n setReload((reload) => !reload);\r\n } catch (err) {\r\n toast.error(getSingleErrorMessage(err));\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n }\r\n };\r\n\r\n const submit = () => {\r\n setLoadingSave(true);\r\n setTimeout(() => {\r\n setLoadingSave(false);\r\n }, 500);\r\n formRef.current?.submitForm();\r\n };\r\n\r\n return (\r\n (novo || material) && (\r\n <>\r\n \r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {loadingSave ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n
\r\n
\r\n
\r\n
\r\n\r\n {/* Modal Pré-visualização */}\r\n \r\n \r\n Pré-visualização\r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n {logoLinha && (\r\n
\r\n (event.target.src = Placeholder)\r\n }\r\n className=\"pb-4\"\r\n />\r\n )}\r\n \r\n {material?.codigo}\r\n
\r\n {material?.descricao}
\r\n \r\n
\r\n
\r\n
\r\n \r\n Linha:\r\n \r\n \r\n {material?.linha.label}\r\n \r\n
\r\n
\r\n \r\n Peso:\r\n \r\n {material?.peso}\r\n
\r\n
\r\n \r\n Tamanho da Barra:\r\n \r\n \r\n {material?.barra1} (mm)\r\n \r\n {material?.barra2 != \"\" && (\r\n , {material?.barra2} (mm)\r\n )}\r\n {material?.barra3 != \"\" && (\r\n , {material?.barra3} (mm)\r\n )}\r\n
\r\n\r\n {material?.composto?.value === 3 && (\r\n
\r\n \r\n Perfil Composto\r\n \r\n
\r\n )}\r\n
\r\n \r\n {material?.situacao.label}\r\n \r\n \r\n {material?.status.label}\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n {logoPreview.length != 0 && (\r\n
\r\n
\r\n
APLICÁVEL NAS LINHAS:
\r\n \r\n
\r\n
\r\n
\r\n {logoPreview.map((logoReferencia, index) => (\r\n
\r\n {\r\n \r\n (event.target.src = Placeholder)\r\n }\r\n width=\"80px\"\r\n />\r\n }\r\n
\r\n ))}\r\n
\r\n
\r\n
\r\n
\r\n )}\r\n\r\n {outrasCaracteristica.length != 0 && (\r\n
\r\n
\r\n
OUTRAS CARACTERÍSTICAS:
\r\n \r\n
\r\n
\r\n
\r\n
\r\n {outrasCaracteristica.map(\r\n ({ nome, descricao }, index) => (\r\n
\r\n \r\n {nome}:\r\n {\" \"}\r\n {descricao}\r\n
\r\n )\r\n )}\r\n
\r\n
\r\n
\r\n
\r\n
\r\n )}\r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n >\r\n )\r\n );\r\n};\r\nexport default Perfil;\r\n","import React, { useState, useEffect, useContext } from \"react\";\r\nimport { simOuNao, status, situacao } from \"../../../../../components/Form/Select/options\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport { Form } from \"react-bootstrap\";\r\nimport { Input, Select, InputDecimal } from \"../../../../../components/Form\";\r\nimport api from \"../../../../../services/api\";\r\n\r\nimport { ProdutoContext } from \"../../../../../contexts/produtos/produtosContext\";\r\nimport { toast } from \"react-toastify\";\r\n\r\n\r\nconst SuperficiesTabGeral: React.FC = ({ selectValues, setLogoLinha, loadingValues }) => {\r\n\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // É um novo componente?\r\n const novo = pId == 0;\r\n\r\n // Contexts\r\n const produtoContext = useContext(ProdutoContext);\r\n\r\n //States\r\n const [linha, setLinha] = useState([]);\r\n\r\n \r\n useEffect(() => {\r\n if (produtoContext.entrouEmEdicao) {\r\n selectValues.formRef?.current?.setFieldValue(\"situacao\", situacao[0]);\r\n } \r\n }, [produtoContext.entrouEmEdicao]);\r\n\r\n useEffect(() => {\r\n produtoContext.setEntrouEmEdicao(false);\r\n }, []);\r\n\r\n const handleChangeField = () => {\r\n if (!produtoContext.entrouEmEdicao && !loadingValues) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n }\r\n }\r\n\r\n //Handles\r\n const handleReferenciaLinha = async ({ value }: any) => {\r\n selectValues.formRef?.current?.clearField('linha');\r\n\r\n const { data } = await api.get(`linha/select/${value}`);\r\n setLinha(data);\r\n\r\n handleChangeField();\r\n }\r\n\r\n const handleLinha = async (e: any) => {\r\n if (e != undefined) {\r\n const { data } = await api.get(`linha/logoLinha/${e.value}`);\r\n setLogoLinha(data);\r\n\r\n handleChangeField();\r\n }\r\n }\r\n\r\n \r\n\r\n return (\r\n <>\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n Código *\r\n \r\n \r\n
\r\n Código Interno\r\n \r\n \r\n
\r\n\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n\r\n
\r\n \r\n Descrição *\r\n \r\n \r\n \r\n\r\n
\r\n
\r\n \r\n {\r\n const { formattedValue, floatValue } = values;\r\n return formattedValue === \"\" || floatValue <= 999;\r\n }}\r\n />\r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n\r\n
\r\n
\r\n \r\n {\r\n const { formattedValue, floatValue } = values;\r\n return formattedValue === \"\" || floatValue <= 99;\r\n }}\r\n />\r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n\r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n};\r\nexport default SuperficiesTabGeral;\r\n","import React, { useState, useEffect, useMemo, useRef, useContext } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport { Button } from \"react-bootstrap\";\r\nimport { Input, TextArea } from \"../../../../../components/Form\";\r\nimport api from \"../../../../../services/api\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from 'yup'\r\nimport getValidationErrors from \"../../../../../helpers/getValidateErrors\"\r\nimport { getSingleErrorMessage } from \"../../../../../helpers/getSingleErrorMessage\";\r\n\r\nimport DataTable from \"../../../../../components/DataTable\";\r\nimport DataNotFound from \"../../../../../components/DataNotFound\";\r\n\r\nimport { ToastContext } from \"../../../../../contexts/toast/toastContext\";\r\nimport { SweetAlertContext } from \"../../../../../contexts/sweetAlert/alertContext\";\r\n\r\nimport { IOutrasCaracteristicas } from \"../../../../../common/interfaces/produtos.interfaces\";\r\nimport { ToastErrorContext } from \"../../../../../contexts/toast/toastErrorContext\";\r\nimport { toast } from \"react-toastify\";\r\n\r\nconst SuperficieTabOutrasCaracteristicas: React.FC = ({setTableData, tableData}) => {\r\n\r\n // URL Params\r\n const { pId, pString }: any = useParams();\r\n\r\n //Fields\r\n const DataTableTS: any = DataTable;\r\n const tipoMaterial = 'SUPERFICIE';\r\n const novo = (pId == 0);\r\n\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //Context\r\n const sweetAlertContext = useContext(SweetAlertContext);\r\n const toastContext = useContext(ToastContext);\r\n const toastError = useContext(ToastErrorContext);\r\n\r\n //States\r\n const [tableLoading, setTableLoading] = useState(false);\r\n const [reloadTable, setReloadTable] = useState(false);\r\n\r\n //Effects\r\n useEffect(() => {\r\n const fetchData = async () => {\r\n try {\r\n if (!novo) {\r\n setTableLoading(true);\r\n const { data } = await api.get(`produto/caracteristicaMaterial/${pString}/${tipoMaterial}`); \r\n setTableData(data);\r\n\r\n console.log(data);\r\n }\r\n } catch (error) {\r\n console.log(error);\r\n } finally {\r\n setTableLoading(false);\r\n }\r\n };\r\n\r\n fetchData();\r\n }, [reloadTable]);\r\n\r\n // Handles\r\n const handleSubmit: SubmitHandler = async (outrasCaracteristicasSuperficie, { reset }) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n\r\n const message = \"Campo obrigatório\";\r\n const schema = Yup.object().shape({\r\n\r\n nome: Yup.string().required(message),\r\n descricao: Yup.string().required(message),\r\n });\r\n await schema.validate(outrasCaracteristicasSuperficie, { abortEarly: false });\r\n\r\n //Passou pela validação \r\n outrasCaracteristicasSuperficie.codigo = pString;\r\n outrasCaracteristicasSuperficie.tipoMaterial = tipoMaterial;\r\n \r\n await api.post('produto/SalvarCaracteristicaMaterial', outrasCaracteristicasSuperficie);\r\n\r\n toast.success(\"A ação foi concluída.\");\r\n\r\n setReloadTable(reload => !reload);\r\n reset();\r\n\r\n } catch (err) {\r\n toast.error(getSingleErrorMessage(err));\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n }\r\n\r\n };\r\n\r\n const handleDelete = ({ id, nome }: IOutrasCaracteristicas) => {\r\n const title = `Excluir \"${nome}\"?`;\r\n const message = \"Essa característica será excluída, isso não pode ser desfeito.\";\r\n sweetAlertContext.danger(title, message, async () => {\r\n try {\r\n await api.delete(`produto/RemoverCaracteristicaMaterial/${id}`);\r\n setTableData((prevState: any) =>\r\n prevState.filter(function (item: any) {\r\n return item.id !== id;\r\n })\r\n );\r\n sweetAlertContext.close();\r\n } catch (error) {\r\n const message = getSingleErrorMessage(error);\r\n if (message) {\r\n toastContext.notification(message, \"warn\");\r\n } else {\r\n toastContext.notification(\r\n \"Ocorreu um erro ao realizar essa operação.\",\r\n \"error\"\r\n );\r\n }\r\n }\r\n });\r\n };\r\n\r\n\r\n const columns = useMemo(\r\n () => [\r\n {\r\n Header: \"Nome\",\r\n accessor: \"nome\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Descrição\",\r\n accessor: \"descricao\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Ação\",\r\n accessor: \"acao\",\r\n disableSortBy: true,\r\n display: \"align-middle column-table-1b\",\r\n Cell: ({ row: { original } }: { row: { original: IOutrasCaracteristicas } }) => (\r\n\r\n \r\n\r\n ),\r\n },\r\n ],\r\n []\r\n );\r\n\r\n return (\r\n <>\r\n \r\n\r\n \r\n
\r\n
\r\n
\r\n {tableData && (\r\n \r\n )}\r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n};\r\nexport default SuperficieTabOutrasCaracteristicas;\r\n","import React, { useState, useEffect, useMemo, useRef, useContext } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport { Button } from \"react-bootstrap\";\r\nimport { Select } from \"../../../../../components/Form\";\r\nimport api from \"../../../../../services/api\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from 'yup'\r\nimport getValidationErrors from \"../../../../../helpers/getValidateErrors\"\r\nimport { getSingleErrorMessage } from \"../../../../../helpers/getSingleErrorMessage\";\r\n\r\nimport DataTable from \"../../../../../components/DataTable\";\r\nimport DataNotFound from \"../../../../../components/DataNotFound\";\r\n\r\nimport { ToastContext } from \"../../../../../contexts/toast/toastContext\";\r\nimport { SweetAlertContext } from \"../../../../../contexts/sweetAlert/alertContext\";\r\nimport { ProdutoContext } from \"../../../../../contexts/produtos/produtosContext\";\r\n\r\nimport { ILinhasAplicacao } from \"../../../../../common/interfaces/produtos.interfaces\";\r\nimport { toast } from \"react-toastify\";\r\n\r\nconst SuperficieTabLinhasDeAplicacao: React.FC = ({ selectLinhaAplicacao }) => {\r\n //Fields\r\n const DataTableTS: any = DataTable;\r\n\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // É um novo superficie?\r\n const novo = (pId == 0);\r\n\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //Context\r\n const sweetAlertContext = useContext(SweetAlertContext);\r\n const toastContext = useContext(ToastContext);\r\n const produtoContext = useContext(ProdutoContext);\r\n\r\n //States\r\n const [tableData, setTableData] = useState([]);\r\n const [tableLoading, setTableLoading] = useState(false);\r\n const[reloadTable, setReloadTable] = useState(false);\r\n\r\n //Effects\r\n useEffect(() => {\r\n (async () => {\r\n try {\r\n if (!novo) {\r\n setTableLoading(true);\r\n const {data} = await api.get(`superficie/linhaAplicacao/${pId}`); \r\n setTableData(data);\r\n }\r\n } catch (error) {\r\n } finally {\r\n setTableLoading(false);\r\n }\r\n })();\r\n }, [reloadTable]);\r\n\r\n //Handles\r\n const handleSubmit: SubmitHandler = async (linhasAplicacaoSuperficie, { reset }) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n\r\n const message = \"Campo obrigatório\";\r\n const schema = Yup.object().shape({\r\n linhaAplicacao: Yup.object().shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n }).nullable().required(message),\r\n });\r\n \r\n await schema.validate(linhasAplicacaoSuperficie, { abortEarly: false });\r\n \r\n //Passou pela validação \r\n linhasAplicacaoSuperficie.idMaterial = pId;\r\n await api.post('superficie/salvarLinhaAplicacao',linhasAplicacaoSuperficie);\r\n produtoContext.setEntrouEmEdicao(true);\r\n \r\n setReloadTable(reload => !reload);\r\n reset();\r\n\r\n \r\n toast.success(\"A ação foi concluída.\");\r\n\r\n } catch (err) {\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n }\r\n };\r\n\r\n const handleDelete = ({ id, linhaAplicacao }: ILinhasAplicacao) => {\r\n const title = `Excluir \"${linhaAplicacao}\"?`;\r\n const message = \"Essa aplicação de linha será excluída, isso não pode ser desfeito.\";\r\n sweetAlertContext.danger(title, message, async () => {\r\n try {\r\n await api.delete(`superficie/removerLinhaAplicacao/${id}`);\r\n setTableData((prevState) =>\r\n prevState.filter(function (item) {\r\n return item.id !== id;\r\n })\r\n );\r\n produtoContext.setEntrouEmEdicao(true);\r\n\r\n sweetAlertContext.close();\r\n } catch (error) {\r\n const message = getSingleErrorMessage(error);\r\n if (message) {\r\n toastContext.notification(message, \"warn\");\r\n } else {\r\n toastContext.notification(\r\n \"Ocorreu um erro ao realizar essa operação.\",\r\n \"error\"\r\n );\r\n }\r\n }\r\n });\r\n };\r\n\r\n const columns = useMemo(\r\n () => [\r\n {\r\n Header: \"Linhas\",\r\n accessor: \"linhaAplicacao\",\r\n display: \"align-middle\",\r\n },\r\n {\r\n Header: \"Ação\",\r\n accessor: \"acao\",\r\n disableSortBy: true,\r\n display: \"align-middle column-table-1b\",\r\n Cell: ({ row: { original } }: { row: { original: ILinhasAplicacao } }) => (\r\n\r\n \r\n\r\n ),\r\n },\r\n ],\r\n []\r\n );\r\n\r\n return (\r\n <>\r\n \r\n\r\n \r\n
\r\n
\r\n
\r\n {tableData && (\r\n \r\n )}\r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n};\r\nexport default SuperficieTabLinhasDeAplicacao;\r\n","import React, { useState, useRef, useEffect, useContext } from \"react\";\r\nimport { FileButton, Input } from \"../../../../../../components/Form\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from 'yup'\r\nimport { useParams } from \"react-router-dom\";\r\nimport getValidationErrors from \"../../../../../../helpers/getValidateErrors\"\r\nimport api from \"../../../../../../services/api\";\r\n\r\nimport { SweetAlertContext } from \"../../../../../../contexts/sweetAlert/alertContext\";\r\nimport { ProdutoContext } from \"../../../../../../contexts/produtos/produtosContext\";\r\nimport { toast } from \"react-toastify\";\r\n\r\n\r\ninterface IUploadMiniatura {\r\n dados: any,\r\n setFiguraIcone: any\r\n}\r\n\r\nconst UploadMiniatura: React.FC = (props) => {\r\n\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //Context\r\n const sweetAlert = useContext(SweetAlertContext);\r\n const produtoContext = useContext(ProdutoContext);\r\n\r\n // States\r\n const [miniatura, setMiniatura] = useState(true);\r\n\r\n // Effects\r\n useEffect(() => {\r\n if (props.dados && props.dados.nomeMiniatura != \"\" && props.dados.nomeMiniatura != undefined) {\r\n formRef.current?.setFieldValue('nomeMiniatura', props.dados.nomeMiniatura);\r\n setMiniatura(false);\r\n }\r\n }, [props.dados]);\r\n\r\n const handleChangeField = () => {\r\n if (!produtoContext.entrouEmEdicao) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n }\r\n };\r\n\r\n // Handles\r\n const handleSubmit: SubmitHandler = async (thumb, { reset }) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n\r\n const SUPPORTED_FORMATS = [\"image/bmp\"];\r\n\r\n // Definição da propriedade para medir a imagem.\r\n if (SUPPORTED_FORMATS.includes(thumb.miniatura.type)) {\r\n Object.defineProperty(thumb.miniatura, 'dimensions', {\r\n value: await checkDimension(thumb.miniatura)\r\n });\r\n }\r\n\r\n const schema = Yup.object().shape({\r\n\r\n miniatura: Yup.mixed()\r\n .test(\r\n \"fileDimension\",\r\n \"A miniatura deve ter 64x64 pixels\",\r\n (value) => !value.dimensions || value.dimensions[0] === 64 && value.dimensions[1] === 64\r\n )\r\n .test(\r\n \"fileFormat\",\r\n \"O arquivo deve ser .bmp\",\r\n value => value && SUPPORTED_FORMATS.includes(value.type)\r\n )\r\n });\r\n await schema.validate(thumb, { abortEarly: false });\r\n\r\n const { data: { disponivel } } = await api.get(`superficie/disponivelMercado/${pId}`);\r\n\r\n if (disponivel) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n sweetAlert.alert(\"Atenção\", \"O material esta disponível em mercado, alteramos a situação para o modo edição, salve o cadastro para continuar com a atualização\");\r\n reset();\r\n }\r\n else {\r\n //Passou pela validação\r\n handleChangeField();\r\n\r\n if (thumb.miniatura != null) {\r\n var arquivo = new FormData();\r\n arquivo.append(\"arquivo\", thumb.miniatura);\r\n arquivo.append(\"nomeArquivo\", thumb.miniatura.name);\r\n arquivo.append(\"idSuperficie\", pId);\r\n\r\n props.setFiguraIcone((state: any) => ({\r\n ...state,\r\n nomeMiniatura: thumb.miniatura.name\r\n }));\r\n\r\n await upload(arquivo);\r\n }\r\n\r\n formRef.current?.setFieldValue('nomeMiniatura', thumb.miniatura.name);\r\n setMiniatura(false);\r\n }\r\n\r\n } catch (err) {\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n formRef.current?.clearField('nomeMiniatura');\r\n setMiniatura(true);\r\n }\r\n };\r\n\r\n const upload = async (arquivo: any) => {\r\n let promise = new Promise((resolve, reject) => {\r\n api.post(\"/superficie/uploadIcone\", arquivo)\r\n .then(response => {\r\n resolve(response.data);\r\n })\r\n .catch(error => {\r\n reject(error);\r\n });\r\n });\r\n\r\n await toast.promise(promise, {\r\n pending: \"Enviando arquivo...\",\r\n success: \"Arquivo enviado com sucesso!\",\r\n error: \"Ocorreu um erro ao enviar o arquivo.\"\r\n });\r\n }\r\n\r\n const handleUploadMiniatura = (e: any) => {\r\n if (e.target.files?.length != 0) {\r\n formRef.current?.submitForm()\r\n } else {\r\n setMiniatura(true);\r\n formRef.current?.clearField('nomeMiniatura');\r\n formRef.current?.setErrors({});\r\n }\r\n }\r\n\r\n // Função que checa o tamanho da imagem sem exibir em tela.\r\n function checkDimension(value: any) {\r\n return new Promise(resolve => {\r\n const reader = new FileReader();\r\n reader.readAsDataURL(value);\r\n reader.onload = () => {\r\n const img = new (window as any).Image();\r\n img.src = reader.result;\r\n img.onload = () => {\r\n const width = img.width;\r\n const height = img.height;\r\n const dimensions = [width, height]\r\n resolve(dimensions);\r\n };\r\n };\r\n });\r\n }\r\n\r\n const handleAlterarNome = async (e: any) => {\r\n if (props.dados.nomeMiniatura != e.target.value && e.target.value) {\r\n const message = `Deseja realmente alterar o nome do icone?`;\r\n\r\n sweetAlert.warning(e.target.value, message, async () => {\r\n handleChangeField();\r\n\r\n await api.post('superficie/alterarNomeIcone', {\r\n idSuperficie: pId,\r\n nomeArquivo: e.target.value\r\n }).then(response => {\r\n if (response.data.isValid) {\r\n toast.success(response.data.message);\r\n } else {\r\n toast.error(response.data.errors[0].errorMessage);\r\n }\r\n });\r\n props.dados.nomeMiniatura = e.target.value;\r\n },\r\n () => {\r\n formRef.current?.setFieldValue('nomeMiniatura', props.dados.nomeMiniatura);\r\n });\r\n }\r\n }\r\n\r\n return (\r\n <>\r\n \r\n
Miniatura
\r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n}\r\n\r\nexport default UploadMiniatura;","import React, { useState, useRef, useEffect, useContext } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport { FileButton, Input } from \"../../../../../../components/Form\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from 'yup'\r\nimport getValidationErrors from \"../../../../../../helpers/getValidateErrors\"\r\nimport api from \"../../../../../../services/api\";\r\n\r\nimport { SweetAlertContext } from \"../../../../../../contexts/sweetAlert/alertContext\";\r\nimport { ProdutoContext } from \"../../../../../../contexts/produtos/produtosContext\";\r\nimport { toast } from \"react-toastify\";\r\n\r\n\r\ninterface IUploadImagem {\r\n dados: any,\r\n setFiguraIcone: any\r\n}\r\n\r\nconst UploadImagem: React.FC = (props) => {\r\n\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //Context\r\n const sweetAlert = useContext(SweetAlertContext);\r\n const produtoContext = useContext(ProdutoContext);\r\n\r\n // States\r\n const [imagem, setImagem] = useState(true);\r\n const [svg, setSvg] = useState();\r\n\r\n // Effects\r\n useEffect(() => {\r\n if (props.dados && props.dados.nomeImagem != \"\" && props.dados.nomeImagem != undefined) {\r\n formRef.current?.setFieldValue('nomeImagem', props.dados.nomeImagem);\r\n setImagem(false);\r\n }\r\n }, [props.dados]);\r\n\r\n const handleChangeField = () => {\r\n if (!produtoContext.entrouEmEdicao) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n }\r\n };\r\n\r\n // Handles\r\n const handleSubmit: SubmitHandler = async (form, { reset }) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n\r\n const SUPPORTED_FORMATS = ['image/jpg', 'image/jpeg', 'image/png', 'image/svg', \"image/svg+xml\"];\r\n\r\n // Definição da propriedade para medir a imagem.\r\n if (SUPPORTED_FORMATS.includes(form.imagem.type)) {\r\n Object.defineProperty(form.imagem, 'dimensions', {\r\n value: await checkDimension(form.imagem)\r\n });\r\n }\r\n\r\n const schema = Yup.object().shape({\r\n\r\n imagem: Yup.mixed()\r\n .test(\r\n \"fileFormat\",\r\n \"O arquivo deve ser .jpg, .png ou .svg\",\r\n value => value && SUPPORTED_FORMATS.includes(value.type)\r\n )\r\n });\r\n await schema.validate(form, { abortEarly: false });\r\n\r\n const { data: { disponivel } } = await api.get(`superficie/disponivelMercado/${pId}`);\r\n\r\n if (disponivel) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n sweetAlert.alert(\"Atenção\", \"O material esta disponível em mercado, alteramos a situação para o modo edição, salve o cadastro para continuar com a atualização\");\r\n reset();\r\n }\r\n else {\r\n //Passou pela validação \r\n handleChangeField();\r\n\r\n if (form.imagem != null) {\r\n var arquivo = new FormData();\r\n arquivo.append(\"arquivo\", form.imagem);\r\n arquivo.append(\"nomeArquivo\", form.imagem.name);\r\n arquivo.append(\"idSuperficie\", pId);\r\n props.setFiguraIcone((state: any) => ({\r\n ...state,\r\n nomeImagem: form.imagem.name\r\n }));\r\n\r\n await upload(arquivo);\r\n }\r\n\r\n //Coloca o nome do arquivo no campo input text \r\n formRef.current?.setFieldValue('nomeImagem', form.imagem.name);\r\n setImagem(false);\r\n }\r\n\r\n } catch (err) {\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n formRef.current?.clearField('nomeImagem');\r\n setImagem(true);\r\n }\r\n };\r\n\r\n const upload = async (arquivo: any) => {\r\n let promise = new Promise((resolve, reject) => {\r\n api.post(\"/superficie/uploadFigura\", arquivo)\r\n .then(response => {\r\n resolve(response.data);\r\n })\r\n .catch(error => {\r\n reject(error);\r\n });\r\n });\r\n\r\n await toast.promise(promise, {\r\n pending: \"Enviando arquivo...\",\r\n success: \"Arquivo enviado com sucesso!\",\r\n error: \"Ocorreu um erro ao enviar o arquivo.\"\r\n });\r\n }\r\n\r\n const handleUploadImagem = (e: any) => {\r\n if (e.target.files?.length != 0) {\r\n formRef.current?.submitForm()\r\n } else {\r\n setImagem(true);\r\n formRef.current?.clearField('nomeImagem');\r\n formRef.current?.setErrors({});\r\n }\r\n }\r\n\r\n // Função que checa o tamanho da imagem sem exibir em tela.\r\n function checkDimension(value: any) {\r\n return new Promise(resolve => {\r\n\r\n if (value.type == \"image/svg+xml\") {\r\n const previewURL = URL.createObjectURL(value);\r\n setSvg(previewURL);\r\n const svgDom: any = document.getElementById(\"svgPreview\");\r\n svgDom.onload = () => {\r\n const width = svgDom?.width;\r\n const height = svgDom?.height;\r\n const dimensions = [width, height]\r\n resolve(dimensions);\r\n }\r\n }\r\n\r\n const reader = new FileReader();\r\n reader.readAsDataURL(value);\r\n reader.onload = () => {\r\n const img = new (window as any).Image();\r\n img.src = reader.result;\r\n img.onload = () => {\r\n const width = img.width;\r\n const height = img.height;\r\n const dimensions = [width, height]\r\n resolve(dimensions);\r\n };\r\n };\r\n });\r\n }\r\n\r\n const handleAlterarNome = async (e: any) => {\r\n if (props.dados.nomeImagem != e.target.value && e.target.value) {\r\n const message = `Deseja realmente alterar o nome da Imagem?`;\r\n\r\n sweetAlert.warning(e.target.value, message, async () => {\r\n handleChangeField();\r\n\r\n await api.post('superficie/alterarNomeFigura', {\r\n idSuperficie: pId,\r\n nomeArquivo: e.target.value\r\n }).then(response => {\r\n if (response.data.isValid) {\r\n toast.success(response.data.message);\r\n } else {\r\n toast.error(response.data.errors[0].errorMessage);\r\n }\r\n })\r\n props.dados.nomeImagem = e.target.value;\r\n },\r\n () => {\r\n formRef.current?.setFieldValue('nomeImagem', props.dados.nomeImagem);\r\n });\r\n }\r\n }\r\n\r\n return (\r\n <>\r\n
\r\n\r\n \r\n
Imagem
\r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n}\r\n\r\nexport default UploadImagem;","import React, { useState, useRef, useEffect, useContext } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport { FileButton, Input } from \"../../../../../../components/Form\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from \"yup\";\r\nimport getValidationErrors from \"../../../../../../helpers/getValidateErrors\";\r\nimport api from \"../../../../../../services/api\";\r\n\r\nimport { SweetAlertContext } from \"../../../../../../contexts/sweetAlert/alertContext\";\r\nimport { ProdutoContext } from \"../../../../../../contexts/produtos/produtosContext\";\r\nimport { toast } from \"react-toastify\";\r\nimport { isNullOrUndefined } from \"../../../../../../helpers/validation\";\r\n\r\ninterface IUploadFicha {\r\n dados: any;\r\n}\r\n\r\nconst UploadFichaTecnica: React.FC = (props) => {\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //Context\r\n const sweetAlert = useContext(SweetAlertContext);\r\n const produtoContext = useContext(ProdutoContext);\r\n\r\n // States\r\n const [fichaTecnica, setFichaTecnica] = useState(true);\r\n\r\n // Effects\r\n useEffect(() => {\r\n if (\r\n props.dados &&\r\n props.dados.nomeFichaTecnica != \"\" &&\r\n props.dados.nomeFichaTecnica != undefined\r\n ) {\r\n formRef.current?.setFieldValue(\r\n \"nomeFichaTecnica\",\r\n tratarNomeFicha(props.dados.nomeFichaTecnica)\r\n );\r\n setFichaTecnica(false);\r\n }\r\n }, [props.dados]);\r\n\r\n const tratarNomeFicha = (nome: string): string => {\r\n \r\n if (isNullOrUndefined(nome))\r\n return '';\r\n \r\n if (nome.indexOf('#') != -1) {\r\n var nomeFicha = nome.split(\"#\")[1];\r\n return nomeFicha.replace(\"#\", \"\");\r\n }\r\n\r\n return nome;\r\n }\r\n\r\n const handleChangeField = () => {\r\n if (!produtoContext.entrouEmEdicao) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n }\r\n };\r\n\r\n // Handles\r\n const handleSubmit: SubmitHandler = async (form, { reset }) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n\r\n const SUPPORTED_FORMATS = [\r\n \"application/pdf\",\r\n \"image/jpg\",\r\n \"image/jpeg\",\r\n \"image/png\",\r\n ];\r\n\r\n const schema = Yup.object().shape({\r\n fichaTecnica: Yup.mixed().test(\r\n \"fileFormat\",\r\n \"O arquivo deve ser .pdf, .jpg ou png.\",\r\n (value) => value && SUPPORTED_FORMATS.includes(value.type)\r\n ),\r\n });\r\n await schema.validate(form, { abortEarly: false });\r\n\r\n //Passou pela validação\r\n const { data: { disponivel } } = await api.get(`superficie/disponivelMercado/${pId}`);\r\n\r\n if (disponivel) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n sweetAlert.alert(\"Atenção\", \"O material esta disponível em mercado, alteramos a situação para o modo edição, salve o cadastro para continuar com a atualização\");\r\n reset();\r\n }\r\n else {\r\n handleChangeField();\r\n\r\n if (form.fichaTecnica != null) {\r\n var arquivo = new FormData();\r\n arquivo.append(\"arquivo\", form.fichaTecnica);\r\n arquivo.append(\"nomeArquivo\", form.fichaTecnica.name);\r\n arquivo.append(\"idSuperficie\", pId);\r\n\r\n await upload(arquivo);\r\n }\r\n\r\n formRef.current?.setFieldValue(\r\n \"nomeFichaTecnica\",\r\n form.fichaTecnica.name\r\n );\r\n setFichaTecnica(false);\r\n }\r\n } catch (err) {\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n formRef.current?.clearField(\"nomeFichaTecnica\");\r\n setFichaTecnica(true);\r\n }\r\n };\r\n\r\n const upload = async (arquivo: any) => {\r\n let promise = new Promise((resolve, reject) => {\r\n api.post(\"/superficie/uploadDesenhoTecnico\", arquivo)\r\n .then(response => {\r\n resolve(response.data);\r\n })\r\n .catch(error => {\r\n reject(error);\r\n });\r\n });\r\n\r\n await toast.promise(promise, {\r\n pending: \"Enviando arquivo...\",\r\n success: \"Arquivo enviado com sucesso!\",\r\n error: \"Ocorreu um erro ao enviar o arquivo.\"\r\n });\r\n }\r\n\r\n const handleUploadFichaTecnica = (e: any) => {\r\n if (e.target.files?.length != 0) {\r\n formRef.current?.submitForm();\r\n } else {\r\n setFichaTecnica(true);\r\n formRef.current?.clearField(\"nomeFichaTecnica\");\r\n formRef.current?.setErrors({});\r\n }\r\n };\r\n\r\n const handleAlterarNome = async (e: any) => {\r\n if (props.dados.nomeFichaTecnica != e.target.value && e.target.value) {\r\n const message = `Deseja realmente alterar o nome da ficha técnica?`;\r\n\r\n sweetAlert.warning(\r\n e.target.value,\r\n message,\r\n async () => {\r\n handleChangeField();\r\n\r\n await api.post(\"superficie/alterarNomeDesenhoTecnico\", {\r\n idSuperficie: pId,\r\n nomeArquivo: e.target.value,\r\n }).then(response => {\r\n if (response.data.isValid) {\r\n toast.success(response.data.message);\r\n } else {\r\n toast.error(response.data.errors[0].errorMessage);\r\n }\r\n });\r\n props.dados.nomeFichaTecnica = e.target.value;\r\n },\r\n () => {\r\n formRef.current?.setFieldValue(\r\n \"nomeFichaTecnica\",\r\n props.dados.nomeFichaTecnica\r\n );\r\n }\r\n );\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n \r\n
Ficha Técnica
\r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n};\r\n\r\nexport default UploadFichaTecnica;\r\n","import React, { useState, useRef, useEffect, useContext } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport { FileButton, Input } from \"../../../../../../components/Form\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from 'yup'\r\nimport getValidationErrors from \"../../../../../../helpers/getValidateErrors\"\r\nimport api from \"../../../../../../services/api\";\r\n\r\nimport { SweetAlertContext } from \"../../../../../../contexts/sweetAlert/alertContext\";\r\nimport { ProdutoContext } from \"../../../../../../contexts/produtos/produtosContext\";\r\nimport { toast } from \"react-toastify\";\r\n\r\n\r\ninterface IUploadImagem {\r\n dados: any,\r\n setFiguraIcone: any\r\n}\r\n\r\nconst UploadSVGX: React.FC = (props) => {\r\n\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n const SUPPORTED_FORMATS = [\"svgx\"];\r\n\r\n const schema = Yup.object().shape({\r\n imagem: Yup.mixed()\r\n .test(\r\n \"fileFormat\",\r\n \"O arquivo deve ser .svgx\",\r\n value => {\r\n return value && SUPPORTED_FORMATS.includes(value.name.split(/[. ]+/).pop());\r\n }\r\n )\r\n });\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //Context\r\n const sweetAlert = useContext(SweetAlertContext);\r\n const produtoContext = useContext(ProdutoContext);\r\n\r\n // States\r\n const [imagem, setImagem] = useState(true);\r\n const [svg, setSvg] = useState();\r\n\r\n // Effects\r\n useEffect(() => {\r\n if (props.dados && props.dados.nomeImagemSVGX != \"\" && props.dados.nomeImagemSVGX != undefined) {\r\n formRef.current?.setFieldValue('nomeImagem', props.dados.nomeImagemSVGX);\r\n setImagem(false);\r\n }\r\n }, [props.dados]);\r\n\r\n const handleChangeField = () => {\r\n if (!produtoContext.entrouEmEdicao) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n }\r\n };\r\n\r\n // Handles\r\n const handleSubmit: SubmitHandler = async (form, { reset }) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n\r\n await schema.validate(form, { abortEarly: false });\r\n\r\n const { data: { disponivel } } = await api.get(`superficie/disponivelMercado/${pId}`);\r\n\r\n if (disponivel) {\r\n produtoContext.setEntrouEmEdicao(true);\r\n sweetAlert.alert(\"Atenção\", \"O material esta disponível em mercado, alteramos a situação para o modo edição, salve o cadastro para continuar com a atualização\");\r\n reset();\r\n }\r\n else {\r\n //Passou pela validação \r\n handleChangeField();\r\n\r\n if (form.imagem != null) {\r\n var arquivo = new FormData();\r\n arquivo.append(\"arquivo\", form.imagem);\r\n arquivo.append(\"nomeArquivo\", form.imagem.name);\r\n arquivo.append(\"idSuperficie\", pId);\r\n props.setFiguraIcone((state: any) => ({\r\n ...state,\r\n nomeImagem: form.imagem.name\r\n }));\r\n\r\n await upload(arquivo);\r\n }\r\n\r\n //Coloca o nome do arquivo no campo input text \r\n formRef.current?.setFieldValue('nomeImagem', form.imagem.name);\r\n setImagem(false);\r\n }\r\n\r\n } catch (err) {\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n formRef.current?.clearField('nomeImagem');\r\n setImagem(true);\r\n }\r\n };\r\n\r\n const upload = async (arquivo: any) => {\r\n let promise = new Promise((resolve, reject) => {\r\n api.post(\"/superficie/uploadFiguraSVGX\", arquivo)\r\n .then(response => {\r\n resolve(response.data);\r\n })\r\n .catch(error => {\r\n reject(error);\r\n });\r\n });\r\n\r\n await toast.promise(promise, {\r\n pending: \"Enviando arquivo...\",\r\n success: \"Arquivo enviado com sucesso!\",\r\n error: \"Ocorreu um erro ao enviar o arquivo.\"\r\n });\r\n }\r\n\r\n const handleUploadImagem = (e: any) => {\r\n if (e.target.files?.length != 0) {\r\n formRef.current?.submitForm()\r\n } else {\r\n setImagem(true);\r\n formRef.current?.clearField('nomeImagem');\r\n formRef.current?.setErrors({});\r\n }\r\n }\r\n\r\n const handleAlterarNome = async (e: any) => {\r\n if (props.dados.nomeImagemSVGX != e.target.value && e.target.value) {\r\n const message = `Deseja realmente alterar o nome da Imagem?`;\r\n\r\n sweetAlert.warning(e.target.value, message, async () => {\r\n handleChangeField();\r\n\r\n await api.post('superficie/alterarNomeFiguraSVGX', {\r\n idSuperficie: pId,\r\n nomeArquivo: e.target.value\r\n }).then(response => {\r\n if (response.data.isValid) {\r\n toast.success(response.data.message);\r\n } else {\r\n toast.error(response.data.errors[0].errorMessage);\r\n }\r\n });\r\n props.dados.nomeImagemSVGX = e.target.value;\r\n },\r\n () => {\r\n formRef.current?.setFieldValue('nomeImagem', props.dados.nomeImagemSVGX);\r\n });\r\n }\r\n }\r\n\r\n return (\r\n <>\r\n
\r\n\r\n \r\n
SVGX
\r\n
\r\n
\r\n
\r\n
\r\n >\r\n );\r\n}\r\n\r\nexport default UploadSVGX;","import React, { useContext, useEffect, useState } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport api from \"../../../../../services/api\";\r\n\r\nimport UploadMiniatura from \"./UploadMiniatura\";\r\nimport UploadImagem from \"./UploadImagem\";\r\nimport UploadFichaTecnica from \"./UploadFichaTecnica\";\r\nimport UploadSVGX from \"./UploadSVGX\";\r\n\r\nimport { ToastContext } from \"../../../../../contexts/toast/toastContext\";\r\nimport { getSingleErrorMessage } from \"../../../../../helpers/getSingleErrorMessage\";\r\n\r\nconst SuperficieTabImagensFichaTecnica: React.FC = ({setFiguraIcone, figuraIcone}) => {\r\n\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // É um novo superficie?\r\n const novo = (pId == 0);\r\n\r\n // Context \r\n const toastContext = useContext(ToastContext); \r\n\r\n // Effects\r\n useEffect(() => {\r\n (async () => {\r\n try {\r\n if (!novo) {\r\n const { data } = await api.get(`superficie/ImagemAnexo/${pId}`); \r\n setFiguraIcone(data);\r\n }\r\n } catch (error) {\r\n const message = getSingleErrorMessage(error);\r\n if (message) {\r\n toastContext.notification(message, \"warn\");\r\n } else {\r\n toastContext.notification(\r\n \"Ocorreu um erro ao realizar essa operação.\",\r\n \"error\"\r\n );\r\n }\r\n }\r\n })();\r\n }, [pId]);\r\n\r\n return (\r\n <>\r\n\r\n \r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n\r\n >\r\n );\r\n};\r\nexport default SuperficieTabImagensFichaTecnica;\r\n","import React, { useState, useRef, useContext, useEffect } from \"react\";\r\nimport { useParams } from \"react-router-dom\";\r\nimport { Button, Tab, Tabs, Modal, Image, Spinner } from \"react-bootstrap\";\r\n\r\nimport { Form } from \"@unform/web\";\r\nimport { SubmitHandler, FormHandles } from \"@unform/core\";\r\nimport * as Yup from \"yup\";\r\nimport getValidationErrors from \"../../../../helpers/getValidateErrors\";\r\nimport { base64toBlob } from \"../../../../helpers/utils\";\r\n\r\nimport { ToastContext } from \"../../../../contexts/toast/toastContext\";\r\n\r\nimport TabGeral from \"./TabGeral\";\r\nimport TabOutrasCaracteristicas from \"./TabOutrasCaracteristicas\";\r\nimport TabLinhasDeAplicacao from \"./TabLinhasDeAplicacao\";\r\nimport TabImagensFichaTecnica from \"./TabImagensFichaTecnica\";\r\n\r\nimport {\r\n IFormSuperficie,\r\n IOutrasCaracteristicas,\r\n} from \"../../../../common/interfaces/produtos.interfaces\";\r\nimport api from \"../../../../services/api\";\r\nimport { ToastErrorContext } from \"../../../../contexts/toast/toastErrorContext\";\r\nimport history from \"../../../../helpers/history\";\r\nimport Placeholder from \"../../../../assets/imgs/img-placeholder.png\";\r\nimport { toast } from \"react-toastify\";\r\nimport { getSingleErrorMessage } from \"../../../../helpers/getSingleErrorMessage\";\r\nimport BackButton from \"../../../../components/ButtonBack\";\r\n\r\ninterface ISuperficie {\r\n tipoProduto: any;\r\n}\r\n\r\nconst Superficies: React.FC = (props) => {\r\n // URL Params\r\n const { pId }: any = useParams();\r\n\r\n // Fields\r\n const novo = pId == 0;\r\n const baseUrlImagem = `${process.env.REACT_APP_API}figurasicones/superficies/figuras/`;\r\n\r\n // Refs\r\n const formRef = useRef(null);\r\n\r\n //States\r\n const [loadingSave, setLoadingSave] = useState(false);\r\n const emValidacao = useRef(\"\");\r\n const [show, setShow] = useState(false);\r\n const [selectLinhaAplicacao, setSelectLinhaAplicacao] = useState({});\r\n const [outrasCaracteristica, setOutrasCaracteristica] = useState<\r\n IOutrasCaracteristicas[]\r\n >([]);\r\n const [logoPreview, setLogoPreview] = useState([]);\r\n const [figuraIcone, setFiguraIcone] = useState({});\r\n const [selectValues, setSelectValues] = useState({});\r\n const [logoLinha, setLogoLinha] = useState(null);\r\n const [loadingValues, setLoadingValues] = useState(false);\r\n const [material, setMaterial] = useState(null);\r\n const [reload, setReload] = useState(false);\r\n\r\n // Context\r\n const toastContext = useContext(ToastContext);\r\n const toastError = useContext(ToastErrorContext);\r\n\r\n // Effects\r\n useEffect(() => {\r\n const fetchData = async () => {\r\n if (props.tipoProduto.toUpperCase() === \"SUPERFICIE\") {\r\n if (!novo) {\r\n const { data } = await api.get(`superficie/${pId}`);\r\n setMaterial(data);\r\n\r\n emValidacao.current =\r\n data?.situacao.label == \"Em Edição\" ||\r\n data?.situacao.label == \"Em Homologação\"\r\n ? \"validacao/\"\r\n : \"\";\r\n const linhaAplicacao = await api.get(\r\n `geral/selecaoLinhaAplicacao/${data?.referencia?.value}/SUPERFICIE`\r\n );\r\n setSelectLinhaAplicacao(linhaAplicacao.data);\r\n }\r\n }\r\n };\r\n\r\n fetchData();\r\n }, [props.tipoProduto, reload]);\r\n\r\n useEffect(() => {\r\n const fetchData = async () => {\r\n if (props.tipoProduto.toUpperCase() === \"SUPERFICIE\") {\r\n setLoadingValues(true);\r\n\r\n const referencia = await api.get(\r\n \"geral/selecaoReferenciaMaterial/SUPERFICIE\"\r\n );\r\n const unidade = await api.get(\"geral/selecaoUnidadeItemEmbalagem\");\r\n const grupo = await api.get(\"geral/selecaoGrupo\");\r\n const cor = await api.get(\"geral/selecaoCor/SUPERFICIE\");\r\n\r\n setSelectValues({\r\n referencia: referencia.data,\r\n unidadeValorizacao: unidade.data,\r\n grupo: grupo.data,\r\n cor: cor.data,\r\n formRef: formRef,\r\n });\r\n\r\n setLoadingValues(false);\r\n }\r\n };\r\n\r\n fetchData();\r\n }, [props.tipoProduto]);\r\n\r\n useEffect(() => {\r\n material && formRef.current?.setData(material);\r\n }, [material]);\r\n\r\n // Handles\r\n const handleClose = () => setShow(false);\r\n\r\n const handleNew = () => {\r\n setShow(true);\r\n };\r\n\r\n const handleSubmit: SubmitHandler = async (superficie) => {\r\n try {\r\n formRef.current?.setErrors({});\r\n\r\n const message = \"Campo obrigatório\";\r\n const schema = Yup.object().shape({\r\n status: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n situacao: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n codigo: Yup.string()\r\n .required(message)\r\n .max(20, \"O código só pode ter no máximo 20 caracteres.\"),\r\n codigoInterno: Yup.string().max(\r\n 20,\r\n \"O código interno só pode ter no máximo 20 caracteres.\"\r\n ),\r\n referencia: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n linha: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n descricao: Yup.string()\r\n .required(message)\r\n .max(100, \"A descrição só pode ter no máximo 100 caracteres.\"),\r\n cor: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n grupo: Yup.object()\r\n .shape({\r\n label: Yup.string(),\r\n value: Yup.string(),\r\n })\r\n .nullable()\r\n .required(message),\r\n peso: Yup.string().required(message).nullable(),\r\n });\r\n await schema.validate(superficie, { abortEarly: false });\r\n\r\n console.log(superficie);\r\n\r\n superficie.id = pId;\r\n const {\r\n data: { id },\r\n } = await api.post(\"superficie\", superficie);\r\n\r\n toast.success(\"A ação foi concluída.\");\r\n\r\n history.push(`/produtos/${id}/${superficie.codigo}/superficie`);\r\n setReload((reload) => !reload);\r\n } catch (err) {\r\n toast.error(getSingleErrorMessage(err));\r\n formRef.current?.setErrors(getValidationErrors(err));\r\n }\r\n };\r\n\r\n const submit = () => {\r\n setLoadingSave(true);\r\n setTimeout(() => {\r\n setLoadingSave(false);\r\n }, 500);\r\n formRef.current?.submitForm();\r\n };\r\n\r\n return (\r\n (novo || material) && (\r\n <>\r\n \r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {loadingSave ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n
\r\n
\r\n
\r\n
\r\n\r\n {/* Modal Pré-visualização */}\r\n \r\n \r\n Pré-visualização\r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n {logoLinha && (\r\n
\r\n )}\r\n
\r\n {material?.codigo}\r\n
\r\n
{material?.descricao}
\r\n
\r\n
\r\n