Update of packages and simplification
This commit is contained in:
Christian Anetzberger
@@ -1,79 +0,0 @@
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { useDropzone } from "react-dropzone";
|
||||
|
||||
const thumbsContainer = {
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
flexWrap: "wrap",
|
||||
marginTop: 16,
|
||||
};
|
||||
|
||||
const thumb = {
|
||||
display: "inline-flex",
|
||||
borderRadius: 2,
|
||||
border: "1px solid #eaeaea",
|
||||
marginBottom: 8,
|
||||
marginRight: 8,
|
||||
width: 100,
|
||||
height: 100,
|
||||
padding: 4,
|
||||
boxSizing: "border-box",
|
||||
};
|
||||
|
||||
const thumbInner = {
|
||||
display: "flex",
|
||||
minWidth: 0,
|
||||
overflow: "hidden",
|
||||
};
|
||||
|
||||
const img = {
|
||||
display: "block",
|
||||
width: "auto",
|
||||
height: "100%",
|
||||
};
|
||||
|
||||
export default function Dropzone(props) {
|
||||
const [files, setFiles] = useState([]);
|
||||
const { getRootProps, getInputProps } = useDropzone({
|
||||
accept: "image/*,.dxf,.stp,.step,.pdf",
|
||||
onDrop: (acceptedFiles) => {
|
||||
props.setFieldValue(
|
||||
`parts[${props.index}].files`,
|
||||
props.files.concat(acceptedFiles)
|
||||
);
|
||||
setFiles(
|
||||
props.files.map((file) =>
|
||||
Object.assign(file, {
|
||||
preview: URL.createObjectURL(file),
|
||||
})
|
||||
)
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
const thumbs = files.map((file) => (
|
||||
<div style={thumb} key={file.name}>
|
||||
<div style={thumbInner}>
|
||||
<img src={file.preview} style={img} />
|
||||
</div>
|
||||
</div>
|
||||
));
|
||||
|
||||
useEffect(
|
||||
() => () => {
|
||||
// Make sure to revoke the data uris to avoid memory leaks
|
||||
files.forEach((file) => URL.revokeObjectURL(file.preview));
|
||||
},
|
||||
[files]
|
||||
);
|
||||
|
||||
return (
|
||||
<section className="container">
|
||||
<div {...getRootProps({ className: "dropzone" })}>
|
||||
<input {...getInputProps()} />
|
||||
<p>Drag 'n' drop some files here, or click to select files</p>
|
||||
</div>
|
||||
<aside style={thumbsContainer}>{thumbs}</aside>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
@@ -1,42 +0,0 @@
|
||||
import React from "react";
|
||||
|
||||
export default class Thumb extends React.Component {
|
||||
state = {
|
||||
loading: false,
|
||||
thumb: undefined,
|
||||
};
|
||||
|
||||
componentDidUpdate(prevProps) {
|
||||
if (prevProps.file !== this.props.file) {
|
||||
this.setState({ loading: true }, () => {
|
||||
let reader = new FileReader();
|
||||
|
||||
reader.onloadend = () => {
|
||||
this.setState({ loading: false, thumb: reader.result });
|
||||
};
|
||||
|
||||
reader.readAsDataURL(this.props.file);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
if (!this.props.file) {
|
||||
return null;
|
||||
}
|
||||
|
||||
if (this.state.loading) {
|
||||
return <p>loading...</p>;
|
||||
}
|
||||
|
||||
return (
|
||||
<img
|
||||
src={this.state.thumb}
|
||||
alt={this.props.file.name}
|
||||
className=""
|
||||
height={200}
|
||||
width={200}
|
||||
/>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,207 +0,0 @@
|
||||
import React from "react";
|
||||
import {
|
||||
TextInput,
|
||||
TextareaInput,
|
||||
SelectInput,
|
||||
CheckInput,
|
||||
} from "../formfields.jsx";
|
||||
|
||||
export default function ContactPersonForm(props) {
|
||||
return (
|
||||
<>
|
||||
<div className="row g-2 mb-5">
|
||||
<div className="col">
|
||||
<h1>Informationen</h1>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row g-2 mb-5">
|
||||
<div className="col">
|
||||
<TextInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
rescode={props.rescode}
|
||||
error={props.errors.firma}
|
||||
touched={props.touched.firma}
|
||||
placeholder={"Musterfirma"}
|
||||
onChange={props.handleChange("firma")}
|
||||
onBlur={props.handleBlur("firma")}
|
||||
value={props.values.firma}
|
||||
label="Firma (optional)"
|
||||
type="text"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row g-2 mb-3">
|
||||
<h3>Anprechpartner</h3>
|
||||
<div className="col">
|
||||
<SelectInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
rescode={props.rescode}
|
||||
error={props.errors.anrede}
|
||||
touched={props.touched.anrede}
|
||||
placeholder={"Anrede"}
|
||||
onChange={props.handleChange("anrede")}
|
||||
onBlur={props.handleBlur("anrede")}
|
||||
value={props.values.anrede}
|
||||
label="Anrede"
|
||||
options={["Herr", "Frau", "Divers"]}
|
||||
/>
|
||||
</div>
|
||||
<div className="col">
|
||||
<SelectInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
rescode={props.rescode}
|
||||
error={props.errors.titel}
|
||||
touched={props.touched.titel}
|
||||
placeholder={"Titel"}
|
||||
onChange={props.handleChange("titel")}
|
||||
onBlur={props.handleBlur("titel")}
|
||||
value={props.values.titel}
|
||||
label="Titel"
|
||||
options={["Dr.", "Prof.", "Dipl."]}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row g-2 mb-3">
|
||||
<div className="col">
|
||||
<TextInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
rescode={props.rescode}
|
||||
error={props.errors.vorname}
|
||||
touched={props.touched.vorname}
|
||||
placeholder={"Max"}
|
||||
onChange={props.handleChange("vorname")}
|
||||
onBlur={props.handleBlur("vorname")}
|
||||
value={props.values.vorname}
|
||||
label="Vorname (optional)"
|
||||
type="text"
|
||||
/>
|
||||
</div>
|
||||
<div className="col">
|
||||
<TextInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
rescode={props.rescode}
|
||||
error={props.errors.nachname}
|
||||
touched={props.touched.nachname}
|
||||
placeholder={"Mustermann"}
|
||||
onChange={props.handleChange("nachname")}
|
||||
onBlur={props.handleBlur("nachname")}
|
||||
value={props.values.nachname}
|
||||
label="Nachname"
|
||||
type="text"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row g-2 mb-5">
|
||||
<div className="col">
|
||||
<TextInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
rescode={props.rescode}
|
||||
error={props.errors.email}
|
||||
touched={props.touched.email}
|
||||
placeholder={"max@mustermann.de"}
|
||||
onChange={props.handleChange("email")}
|
||||
onBlur={props.handleBlur("email")}
|
||||
value={props.values.email}
|
||||
label="eMail"
|
||||
type="text"
|
||||
/>
|
||||
</div>
|
||||
<div className="col">
|
||||
<TextInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
rescode={props.rescode}
|
||||
error={props.errors.telefon}
|
||||
touched={props.touched.telefon}
|
||||
placeholder={"0815 123456"}
|
||||
onChange={props.handleChange("telefon")}
|
||||
onBlur={props.handleBlur("telefon")}
|
||||
value={props.values.telefon}
|
||||
label="Telfon (optional)"
|
||||
type="text"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="row g-2 mb-3">
|
||||
<h3>Rechnungsadresse</h3>
|
||||
<div className="col">
|
||||
<TextInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
rescode={props.rescode}
|
||||
error={props.errors.invoiceadress}
|
||||
touched={props.touched.invoiceadress}
|
||||
placeholder={"Musterstraße 1"}
|
||||
onChange={props.handleChange("invoiceadress")}
|
||||
onBlur={props.handleBlur("invoiceadress")}
|
||||
value={props.values.invoiceadress}
|
||||
label="Adresse"
|
||||
type="text"
|
||||
/>
|
||||
</div>
|
||||
<div className="col">
|
||||
<TextInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
rescode={props.rescode}
|
||||
error={props.errors.invoiceplz}
|
||||
touched={props.touched.invoiceplz}
|
||||
placeholder={"12345"}
|
||||
onChange={props.handleChange("invoiceplz")}
|
||||
onBlur={props.handleBlur("invoiceplz")}
|
||||
value={props.values.invoiceplz}
|
||||
label="PLZ"
|
||||
type="text"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="row g-2 mb-5">
|
||||
<div className="col">
|
||||
<CheckInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
rescode={props.rescode}
|
||||
error={props.errors.diffrentshipping}
|
||||
touched={props.touched.diffrentshipping}
|
||||
onChange={props.handleChange("diffrentshipping")}
|
||||
onBlur={props.handleBlur("diffrentshipping")}
|
||||
value={props.values.diffrentshipping}
|
||||
label=" Lieferadresse ist anders als Rechnungsadresse"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{props.values.diffrentshipping && (
|
||||
<div className="row g-2 mb-5">
|
||||
<h3>Lieferadresse</h3>
|
||||
<div className="col">
|
||||
<TextInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
rescode={props.rescode}
|
||||
error={props.errors.shippingaddress}
|
||||
touched={props.touched.shippingaddress}
|
||||
placeholder={"Musterstraße 1"}
|
||||
onChange={props.handleChange("shippingaddress")}
|
||||
onBlur={props.handleBlur("shippingaddress")}
|
||||
value={props.values.shippingaddress}
|
||||
label="Lieferadresse"
|
||||
type="text"
|
||||
/>
|
||||
</div>
|
||||
<div className="col">
|
||||
<TextInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
rescode={props.rescode}
|
||||
error={props.errors.shippingplz}
|
||||
touched={props.touched.shippingplz}
|
||||
placeholder={"12345"}
|
||||
onChange={props.handleChange("shippingplz")}
|
||||
onBlur={props.handleBlur("shippingplz")}
|
||||
value={props.values.shippingplz}
|
||||
label="PLZ"
|
||||
type="text"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -1,23 +0,0 @@
|
||||
import React from "react";
|
||||
|
||||
export default function IntroForm(props) {
|
||||
return (
|
||||
<>
|
||||
<div>
|
||||
<h1>eAnfrage</h1>
|
||||
<p>
|
||||
Herzlich Wilkommen bei der Prothman GmbH. Wir freuen uns sehr, dass
|
||||
Sie Interesse an unserem Produktionsspektrum haben.
|
||||
<br />
|
||||
<br />
|
||||
Hier haben Sie die Möglichkeit, direkt online eine Produktionsanfrage
|
||||
an uns zu schicken. Dies ist für sie volkommen kostenlos!
|
||||
<br />
|
||||
Das Tool erfrgägt alle wichtigen Parameter, die wir für die
|
||||
Kalkulation eines Angebotes benötigen. Sollten noch Unklarheiten
|
||||
aufkommen, setzen wir uns mit Ihnen in Verbindung.
|
||||
</p>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -1,380 +0,0 @@
|
||||
import React from "react";
|
||||
import {
|
||||
TextInput,
|
||||
TextareaInput,
|
||||
SelectInput,
|
||||
CheckInput,
|
||||
} from "../formfields.jsx";
|
||||
import Image from "next/image";
|
||||
import Dropzone from "../Dropzone.jsx";
|
||||
|
||||
const dropzoneStyle = {
|
||||
width: "100%",
|
||||
height: "auto",
|
||||
borderWidth: 2,
|
||||
borderColor: "rgb(102, 102, 102)",
|
||||
borderStyle: "dashed",
|
||||
borderRadius: 5,
|
||||
};
|
||||
|
||||
export default class PartForm extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this._handleModalShow = this._handleModalShow.bind(this);
|
||||
this._handleModalHide = this._handleModalHide.bind(this);
|
||||
|
||||
this.state = {
|
||||
show: false,
|
||||
modalindex: 0,
|
||||
newmodaldata: {},
|
||||
};
|
||||
}
|
||||
|
||||
_handleModalShow(index) {
|
||||
this.setState({
|
||||
show: true,
|
||||
modalindex: index,
|
||||
});
|
||||
}
|
||||
|
||||
_handleModalHide(index) {
|
||||
this.setState({
|
||||
show: false,
|
||||
});
|
||||
}
|
||||
|
||||
render() {
|
||||
const that = this;
|
||||
const props = this.props;
|
||||
|
||||
return (
|
||||
<>
|
||||
{this.state.show && (
|
||||
<Overlay
|
||||
index={this.state.modalindex}
|
||||
show={this.state.show}
|
||||
handleHide={this._handleModalHide}
|
||||
{...props}
|
||||
/>
|
||||
)}
|
||||
|
||||
<div className="row g-2 mb-5">
|
||||
<div className="col">
|
||||
<h1>Produktionsdaten</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="row g-2 mb-5">
|
||||
<div className="col">
|
||||
<table className="table mt-5">
|
||||
<thead className="table-secondary">
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Material</th>
|
||||
<th>Anzahl</th>
|
||||
<th>Anzahl Dateien</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{props.values.parts.map(function (part, index) {
|
||||
return (
|
||||
<tr key={index}>
|
||||
<td>{part.name}</td>
|
||||
<td>{part.material}</td>
|
||||
<td>{part.amount}</td>
|
||||
<td>{part.files.length}</td>
|
||||
<td colSpan="1">
|
||||
<button
|
||||
type="button"
|
||||
className={`btn btn-dark text-center m-0`}
|
||||
onClick={that._handleModalShow.bind(this, index)}
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="16"
|
||||
height="16"
|
||||
fill="currentColor"
|
||||
className="bi bi-pencil-square"
|
||||
viewBox="0 0 16 16"
|
||||
>
|
||||
<path d="M15.502 1.94a.5.5 0 0 1 0 .706L14.459 3.69l-2-2L13.502.646a.5.5 0 0 1 .707 0l1.293 1.293zm-1.75 2.456l-2-2L4.939 9.21a.5.5 0 0 0-.121.196l-.805 2.414a.25.25 0 0 0 .316.316l2.414-.805a.5.5 0 0 0 .196-.12l6.813-6.814z" />
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
d="M1 13.5A1.5 1.5 0 0 0 2.5 15h11a1.5 1.5 0 0 0 1.5-1.5v-6a.5.5 0 0 0-1 0v6a.5.5 0 0 1-.5.5h-11a.5.5 0 0 1-.5-.5v-11a.5.5 0 0 1 .5-.5H9a.5.5 0 0 0 0-1H2.5A1.5 1.5 0 0 0 1 2.5v11z"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
className={`btn btn-danger text-center m-0`}
|
||||
onClick={() => console.log("Edit")}
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="16"
|
||||
height="16"
|
||||
fill="currentColor"
|
||||
className="bi bi-x-square"
|
||||
viewBox="0 0 16 16"
|
||||
>
|
||||
<path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z" />
|
||||
<path d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z" />
|
||||
</svg>
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
);
|
||||
})}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
function Overlay(props) {
|
||||
return (
|
||||
<div className="modal" tabIndex="-1" style={{ display: "block" }}>
|
||||
<div className="modal-dialog modal-fullscreen">
|
||||
<div className="modal-content">
|
||||
<div className="modal-header">
|
||||
<h5 className="modal-title">
|
||||
{props.values.parts[props.index]["name"]}
|
||||
</h5>
|
||||
<button
|
||||
type="button"
|
||||
className="btn-close bg-white"
|
||||
data-bs-dismiss="modal"
|
||||
aria-label="Close"
|
||||
onClick={props.handleHide}
|
||||
></button>
|
||||
</div>
|
||||
<div className="modal-body">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col">
|
||||
<div className="row g-2 mb-3">
|
||||
<h3>Angaben</h3>
|
||||
<div className="col">
|
||||
<TextInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
// error={props.errors.parts[props.index]["name"]}
|
||||
// touched={props.touched.parts[props.index]["name"]}
|
||||
placeholder={"Metallteil 123"}
|
||||
onChange={props.handleChange(
|
||||
`parts[${props.index}].name`
|
||||
)}
|
||||
// onBlur={
|
||||
// props.handleBlur.values.parts[props.index]["name"]
|
||||
// }
|
||||
value={props.values.parts[props.index]["name"]}
|
||||
label="Name"
|
||||
type="text"
|
||||
/>
|
||||
</div>
|
||||
<div className="col">
|
||||
<TextInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
// error={props.errors.parts[props.index]["amount"]}
|
||||
// touched={props.touched.parts[props.index]["amount"]}
|
||||
placeholder={"123"}
|
||||
onChange={props.handleChange(
|
||||
`parts[${props.index}].amount`
|
||||
)}
|
||||
// onBlur={props.handleBlur("amount")}
|
||||
value={props.values.parts[props.index]["amount"]}
|
||||
label="Anzahl"
|
||||
type="text"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row g-2 mb-3">
|
||||
<div className="col">
|
||||
<TextareaInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
// error={props.errors.parts[props.index]["description"]}
|
||||
// touched={props.touched.parts[props.index]["description"]}
|
||||
placeholder={"Metallteil 123"}
|
||||
onChange={props.handleChange(
|
||||
`parts[${props.index}].description`
|
||||
)}
|
||||
onBlur={props.handleBlur(
|
||||
`parts[${props.index}].description`
|
||||
)}
|
||||
value={props.values.parts[props.index]["description"]}
|
||||
label="Beschreibung"
|
||||
type="text"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row g-2 mb-5">
|
||||
<div className="col">
|
||||
<SelectInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
type="radio"
|
||||
// error={props.errors.titel}
|
||||
// touched={props.touched.titel}
|
||||
placeholder={"Material"}
|
||||
onChange={props.handleChange(
|
||||
`parts[${props.index}].material`
|
||||
)}
|
||||
onBlur={props.handleBlur(
|
||||
`parts[${props.index}].material`
|
||||
)}
|
||||
value={props.values.parts[props.index]["material"]}
|
||||
label="Material"
|
||||
options={[
|
||||
"1.4301 V2A",
|
||||
"1.4310 Federstahl",
|
||||
"1.4404 V4A",
|
||||
"1.4751 V4A",
|
||||
"1.4016 Blech",
|
||||
"DC01 Stahl",
|
||||
"St37 Stahl",
|
||||
"AlMg3",
|
||||
"AlSi",
|
||||
"Al99",
|
||||
"Sonstiges",
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
{props.values.parts[props.index]["material"] ==
|
||||
"Sonstiges" && (
|
||||
<div className="col">
|
||||
<TextInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
// error={props.errors.parts[props.index]["materialother"]}
|
||||
// touched={props.touched.parts[props.index]["materialother"]}
|
||||
placeholder={"Material (Sonstiges)"}
|
||||
onChange={props.handleChange(
|
||||
`parts[${props.index}].materialother`
|
||||
)}
|
||||
onBlur={props.handleBlur(
|
||||
`parts[${props.index}].materialother`
|
||||
)}
|
||||
value={
|
||||
props.values.parts[props.index]["materialother"]
|
||||
}
|
||||
label="Material Sonstiges"
|
||||
type="text"
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="row g-2 mb-3">
|
||||
<h3>Oberfläche</h3>
|
||||
<p>Unsere Teile werden standardmäßig entgratet. </p>
|
||||
<div className="col">
|
||||
<SelectInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
type="radio"
|
||||
// error={props.errors.titel}
|
||||
// touched={props.touched.titel}
|
||||
placeholder={"Oberfläche"}
|
||||
onChange={props.handleChange(
|
||||
`parts[${props.index}].finish`
|
||||
)}
|
||||
onBlur={props.handleBlur(
|
||||
`parts[${props.index}].finish`
|
||||
)}
|
||||
value={props.values.parts[props.index]["finish"]}
|
||||
label="Material"
|
||||
options={[
|
||||
"2B matt",
|
||||
"Oszillationsschliff",
|
||||
"Gerader Schliff",
|
||||
"K240 Schliff",
|
||||
"Sonstiges",
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
{props.values.parts[props.index]["finish"] ==
|
||||
"Sonstiges" && (
|
||||
<div className="col">
|
||||
<TextInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
// error={props.errors.parts[props.index]["finishother"]}
|
||||
// touched={props.touched.parts[props.index]["finishother"]}
|
||||
placeholder={"Oberfläche (Sonstiges)"}
|
||||
onChange={props.handleChange(
|
||||
`parts[${props.index}].finishother`
|
||||
)}
|
||||
onBlur={props.handleBlur(
|
||||
`parts[${props.index}].finishother`
|
||||
)}
|
||||
value={props.values.parts[props.index]["finishother"]}
|
||||
label="Oberfläche Sonstiges"
|
||||
type="text"
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="row g-2 mb-3">
|
||||
<h3>Gravur</h3>
|
||||
<p>Unsere Teile werden standardmäßig entgratet. </p>
|
||||
<div className="col">
|
||||
<CheckInput
|
||||
isSubmitting={props.isSubmitting}
|
||||
// error={props.errors.diffrentshipping}
|
||||
// touched={props.touched.diffrentshipping}
|
||||
onChange={props.handleChange(
|
||||
`parts[${props.index}].engraving`
|
||||
)}
|
||||
onBlur={props.handleBlur(
|
||||
`parts[${props.index}].engraving`
|
||||
)}
|
||||
value={props.values.parts[props.index]["engraving"]}
|
||||
label=" Dieses Teil soll lasergraviert werden"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col">
|
||||
<div className="row g-2 mb-3">
|
||||
<h3>Dateien</h3>
|
||||
<p>
|
||||
Bite fügen Sie alle Dateien in gängigen Formaten (.step,
|
||||
.pdf) hinzu, die wir für die Produktion benötigen. Die
|
||||
Produktionsdateien müssen im Maßststab 1:1 sein.
|
||||
</p>
|
||||
{props.values.parts[props.index]["engraving"] === true && (
|
||||
<p>
|
||||
Zum lasergravieren benötigen wir eine seperate Vektor
|
||||
Datei (.dwg, .dxf) im Maßstab 1:1, welche nur die zu
|
||||
gravierenden Formen enthält. Schriften müssen in Pfade
|
||||
umgewandelt werden!
|
||||
</p>
|
||||
)}
|
||||
<div className="col">
|
||||
<Dropzone
|
||||
files={props.values.parts[props.index]["files"]}
|
||||
setFieldValue={props.setFieldValue}
|
||||
index={props.index}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="modal-footer">
|
||||
<button
|
||||
type="button"
|
||||
className="btn btn-primary"
|
||||
onClick={props.handleHide}
|
||||
>
|
||||
Schließen
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,10 +0,0 @@
|
||||
import React from "react";
|
||||
import { TextInput, TextareaInput, SelectInput } from "../formfields.jsx";
|
||||
|
||||
export default function Summary(props) {
|
||||
return (
|
||||
<>
|
||||
<h1>Übersicht</h1>
|
||||
</>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user