diff options
Diffstat (limited to 'src/components/editors')
-rw-r--r-- | src/components/editors/invoice-headers-editor.js | 76 | ||||
-rw-r--r-- | src/components/editors/scss/invoice-headers.scss | 59 |
2 files changed, 128 insertions, 7 deletions
diff --git a/src/components/editors/invoice-headers-editor.js b/src/components/editors/invoice-headers-editor.js index f71b319..4ab2dcc 100644 --- a/src/components/editors/invoice-headers-editor.js +++ b/src/components/editors/invoice-headers-editor.js @@ -15,25 +15,87 @@ * along with this program. If not, see <https://www.gnu.org/licenses/>. */ -import './scss/item-editor.scss'; +import './scss/invoice-headers.scss'; import { useState, useEffect } from 'react'; -const InvoiceHeadersEditor = ({roundOff, setRoundOff}) => { +const InvoiceHeadersEditor = ({roundOff, setRoundOff, transport, setTransport, transporter, setTransporter}) => { + const handleTransportInput = e => { + const { name, value } = e.target; + setTransport(prev => ({ + ...prev, + [name]: value + })); + } + + const handleTransporterInput = e => { + const { name, value } = e.target; + setTransporter(prev => ({ + ...prev, + [name]: value + })); + } return ( - <> + <div className={"invoice-headers-editor"}> <h1>Invoice Options:</h1> - <form onSubmit={(e) => e.preventDefault()}> - <label> + <div> + <label className={"checkbox-label"}> <input type="checkbox" onChange={() => setRoundOff(prev => !prev)} checked={roundOff}/> Round off the Total </label> - </form> - </> + + <label> + Apply Discount On All Items: + <input + className={"small"} + type="number" + min="0" + max="100" + step="0.1" /> + </label> + + <p><strong>Transport Details</strong></p> + + <label> + Vehicle Number: + <input + type="text"/> + </label> + + <label> + Transport Method: + <input + type="text"/> + </label> + + <label> + Transporter Name: + <input + type="text"/> + </label> + + <label> + Transporter GSTIN: + <input + type="text"/> + </label> + + <label> + Transporter ID: + <input + type="text"/> + </label> + + <label> + Note: + <textarea /> + </label> + </div> + </div> ) } diff --git a/src/components/editors/scss/invoice-headers.scss b/src/components/editors/scss/invoice-headers.scss new file mode 100644 index 0000000..ade428b --- /dev/null +++ b/src/components/editors/scss/invoice-headers.scss @@ -0,0 +1,59 @@ +/* OpenBills-web - Web based libre billing software + * Copyright (C) 2022 Vidhu Kant Sharma <vidhukant@vidhukant.xyz> + + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + + * You should have received a copy of the GNU General Public License + * along with this program. If not, see <https://www.gnu.org/licenses/>. + */ + +@import "editor"; +@import "colors"; + +.invoice-headers-editor { + .checkbox-label { + border: none; + max-width: none; + justify-content: left; + input { + display: inline; + width: 1.4rem; + } + } + @include label; + label { + width: 20rem; + max-width: auto; + min-width: auto; + border: none; + input { + width: 8rem; + } + input.small { + width: 3rem; + } + } + + // hide up/down arrows from number input + input::-webkit-outer-spin-button, + input::-webkit-inner-spin-button { + -webkit-appearance: none; + margin: 0; + } + input[type=number] { + -moz-appearance: textfield; + } + + strong { + color: $primaryAccentColor; + font-size: 1.2rem; + } +} |