Example: Customer-ORDER Build with PHP2HTML  
Tip: Toggle fullscreen-mode with function key: F11
Clever html engine
PHP2HTML


Test site and documentation for Clever html engine • Errors may occur and future news may be shown • ver.1.4.1: 60+ core functions.

Below you see the advanced example of a page with customer data and order data:

Free finance management


 DEBTOR: Customer Offer/Order
Select existing order:Find and select an already created order TOGGLE-height: Click icon to toggle viewHeight for this card WIDE: Click to maximize/normalize this card width COLLAPSE: Click to close all cards;" EXPAND: Click to open all cards;"

Customer orders
id
id number maintained by the system
Order
Order number
Order Date Order Date
{Editable}
Deliv. date Delivery date
{Editable}
Account Debtor Account number
{Editable}
Company name Company name
{Editable}
Seller The employer with contact to the customer
{Editable}
Amount The total order sum
{Editable}
Currency Currency code for the currency used on the specification.
{Editable}
Due date Due date of the amount
{Editable}
Status Status
{Editable}
Create an empty row, so you can fill in data in the yellow fields !

Click on order number to select existing order

Remember to save here if data is edited...
Create new or modify order: #00-000Demo !
No connection to a DataBase.
Read/save from/to JSON-files.
TOGGLE-height: Click icon to toggle viewHeight for this card WIDE: Click to maximize/normalize this card width COLLAPSE: Click to close all cards;" EXPAND: Click to open all cards;"

Debtor card
Customer: Info about the customer
Required fields occur
TOGGLE-height: Click icon to toggle viewHeight for this card

Customer nr: Can not be edited, onlu created. The system sets this
Here you select which existing customer to select
   Customer kategori
CVR - Virksomheds ID.
EAN - Elektronisk-betalings ID
Bank reg.
Bank account
Additional information
Customer manager
The language to be used on invoice transcripts
The customer Homepage

Orange frames are required fields.
Green frames - restricted use.

Remember to save here if you changed anything above, before leaving the window.
Conditions:Paymend conditions TOGGLE-height: Click icon to toggle viewHeight for this card
Can not be changed here !
Choose which group the customer belongs to
How to pay
How long is the deadline for payment
Choose how to print, save or send the document.
for example. Requisitions no

Remember to save here if you changed anything above, before leaving the window.
CVR-lookup:Lookup in the CVR register: TOGGLE-height: Click icon to toggle viewHeight for this card
Lookup in the CVR register:
Business only !
Copy or check data in the public company register.
Data is provided by CVR API
In what country do you want to apply?
What do you know?
Enter here, data or company name that you want to search for

Green frames are the basis for entry in CVR.
Start search in the CVR register
Register data:
Retrieved from the CVR register
Retrieved from the CVR register
Retrieved from the CVR register
Retrieved from the CVR register
Retrieved from the CVR register
Retrieved from the CVR register
save
Retrieved from the CVR register, various supplementary data

Overwrite existing data with CVR-register data !
Billing: Payment information
Required fields occur
TOGGLE-height: Click icon to toggle viewHeight for this card

Systemfield: Auto fill out, when order is created/saved
Enter costomer name
Enter invoice address
Enter invoice place
ZIP code
Invoice city
Invoice Country

Phone, mobil, fax
Attention - Customer contact
Customer reference to order
Customer Email address
Notes regarding the customer
Dato for ordrens oprettelse
Invoice Date
Send invoice with mail
When to rebill date

Orange frames are required fields.

Remember to save here if you changed anything above, before leaving the window.
Mail-invoice:Setting mail data TOGGLE-height: Click icon to toggle viewHeight for this card
Enter Mail subject
Enter Mail text
Enter Attached file
Enter mail address to receive one copy of send mail
Enter mail address to receive one BC-copy (hidden) of sent mail

Remember to save here if you changed anything above, before leaving the window.
Extra fields:Data you decide TOGGLE-height: Click icon to toggle viewHeight for this card
Extras - Fill in the field 1
Extras - Fill in the field 2
Extras - Fill in the field 3
Extras - Fill in the field 4
Extras - Fill in the field 5

Remember to save here if you changed anything above, before leaving the window.
Delivery:Delivery address etc. TOGGLE-height: Click icon to toggle viewHeight for this card
Check here if the delivery address is the same as the invoice address
Enter Recipient Name
Enter Delivery Address
Specify Place of Delivery, supplement to address
Enter Delivery Customer postcode
Enter Delivery City name
Specify Delivery Country

Enter Recipient`s Phone
Contact person at the delivery address
Enter Recipient`s Email Address
pattern="^[a-zA-Z0-9.!#$%&]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$" />
Enter Shipping Information. How / with whom was the package sent?
Notes regarding package delivery
Once the service has been sent, amounts can be redeemed
Possibly. shipment date
Address on map Show delivery note for delivery
Blue frames and customer type, Used for map lookup.

Remember to save here if you changed anything above, before leaving the window.
Person contact:Info about various persons TOGGLE-height: Click icon to toggle viewHeight for this card
Specifies the order of the entries
Enter Contact person
Enter the persons titel
Enter phone number
Enter Mobilnr. or lokal
Enter E-mail
pattern="^[a-zA-Z0-9.!#$%&]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$" />
Enter note to the contact, e.g. role (director / secretary / driver)

Remove this contact person
(DEMO yet!)


Specifies the order of the entries
Enter Contact person
Enter the persons titel
Enter phone number
Enter Mobilnr. or lokal
Enter E-mail
pattern="^[a-zA-Z0-9.!#$%&]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$" />
Enter note to the contact, e.g. role (director / secretary / driver)

Remove this contact person
(DEMO yet!)


Create a new contact
(DEMO yet!)

Remember to save here if you changed anything above, before leaving the window.
Order notes:Internal notes about the order TOGGLE-height: Click icon to toggle viewHeight for this card
Here you can save a date for writing the notes
Notes associated with the order

Remember to save here if you changed anything above, before leaving the window.


Content of the order: #00-000 - Status: EditableWhat the order contains TOGGLE-height: Click icon to toggle viewHeight for this card WIDE: Click to maximize/normalize this card width COLLAPSE: Click to close all cards;" EXPAND: Click to open all cards;"
Pos.
Position number. is assigned automatically
Item no. Item number for the service
{Editable}
Quantity Quantity stated as number
{Editable}
Unit Unit designation
{Editable}
Description Description of the product / service
{Editable}
VAT VAT pct. rate
{Editable}
Price Unit price
{Editable}
% Discount percent
{Editable}
Total
Calculated amount for the current posting.
Currency Currency code for the currency used on the specification.
{Editable}
Account Posting account and VAT code.Del. Delete the row!
WARNING - you can not regret.
Clon. Make a copy of this row
It will be added as the last row in the table
Und. Undo posting!
Refund the amount by clicking on the icon. If the order is invoiced, the item can be returned until the order has been posted. Then it must be done by crediting the customer!
Mov. Move an entry up or down.
5600
5600
5600
5600
5600
5600
5600
5600
5600
Create an empty row, so you can fill in data in the yellow fields !

This table contains an example of on the fly automatic calculation:
$total= ($DataRow[2]*$DataRow[6])*(100-$DataRow[7])/100*(100+$DataRow[5])/100;

Remember to save here if you changed anything above, before leaving the window.
Handling the offer/order: #00-000 Status: EditableWhat to do when the data is complete TOGGLE-height: Click icon to toggle viewHeight for this card WIDE: Click to maximize/normalize this card width COLLAPSE: Click to close all cards;" EXPAND: Click to open all cards;"
Here you see the order content
Pos.Item no.QuantityUnitDescriptionVATPrice%TotalCurrency
145-8793,0stkRedekasser25,0235,008,0810,75DKK
245-8762,0stkRedekasser25,0100,000,0250,00DKK
345-8763,0stkRedekasser25,0235,0012,0775,50DKK
445-8763,0stkRedekasser25,0235,008,0810,75DKK
545-87713,0BakkerAndeæg25,0400,0020,05 200,00EUR

System field: Order number
System field: Customer name
System field: Amount incl. VAT
Unit: DKK
pattern="^[$\-\s]*[\d,]*?([.]\d{0,2})?\s$" />


Save the order

Create offer for registration Save content as a new Order Reuse content for re-creation Create invoice for (the saved!) Order Reset by crediting the order - if it is invoiced Delete the order - provided the invoice is not formed




Settings: TOGGLE-height: Click icon to toggle viewHeight for this card WIDE: Click to maximize/normalize this card width COLLAPSE: Click to close all cards;" EXPAND: Click to open all cards;"
Change the language for this project:
Select among installed languages
Note: The translate is not complete !
It is created with Google Translate,
and needs proofread.

   Show simple or advanced Card header


Hide top-menu

Remember to save here if you changed anything above, before leaving the window.
Info about this page: TOGGLE-height: Click icon to toggle viewHeight for this card WIDE: Click to maximize/normalize this card width COLLAPSE: Click to close all cards;" EXPAND: Click to open all cards;"
This is a demo under development !
It partly stores data to JSON text files.
Translations from English lack
proofreading, on Google translate.
There is also a lack of functionality.
Code written for PHP 8+ !

Overview of all variables:Here you can see all variables on the page. TOGGLE-height: Click icon to toggle viewHeight for this card WIDE: Click to maximize/normalize this card width COLLAPSE: Click to close all cards;" EXPAND: Click to open all cards;"
Variables and values

Adaptive - Tip: TOGGLE-height: Click icon to toggle viewHeight for this card WIDE: Click to maximize/normalize this card width COLLAPSE: Click to close all cards;" EXPAND: Click to open all cards;"
To see how it adapts to narrow screens,
close the cards with wide tables.
before resizing the window.


Layout is optimally displayed with a window width of 1000-1200px