Create New Order | Customer Portal - Windsweptmarketing

<link rel="stylesheet" type="text/css" href="/portal/css/bootstrap.css"> <link rel="stylesheet" type="text/css" href="/portal/css/portal.css"> <script type="text/javascript" src="/portal/js/helper.js"></script> <script type="text/javascript" src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script> <script type="text/javascript" src="/portal/js/new.js"></script> <script type="text/javascript" src="/portal/js/header.js"></script> <script type="text/javascript" src="/portal/js/bootstrap.min.js"></script> <script type="text/javascript" src="/portal/js/colorchart.js"></script> <div class="port-header"></div> <div class="portal line-item"> <div class="row"> <h1>Create New Order</h1> </div> <form id="item-details" method="POST" enctype="multipart/form-data"> <div class="row"> <div id="cf_opportunity_item_name"><input type="text" name="cf_opportunity_item_name" placeholder="Enter a name for your order..."></div> <div id="cf_opportunity_customer_ref"><input type="text" name="cf_opportunity_customer_ref" placeholder="Enter Customer Reference..."></div> <div id="cf_opportunity_requested_in_hands_date"> <select name="cf_opportunity_requested_in_hands_date"> <option value="" selected>Select requested completion date...</option> <option value="Standard 3-4 Weeks">Standard 3-4 Weeks</option> <option value="Expedited 2-3 Weeks">Expedited 2-3 Weeks +30%</option> <option value="Rush 1-2 Weeks">Rush 1-2 Weeks +50%</option> <option value="Miracle < 1 Week">Miracle < 1 Week (if possible) +75%</option> </select> </div> </div> <div class="row"> <div class="col-md-12"> <div class="preview"> <div id="item_img_dummy"></div> <div id="item_img_loaded"></div> <div id="item_img"></div> </div> <div class="edit-file-controls"> <div class="edit-file-uploader"> <input type="file" name="edit-file" id="edit-file" class="inputfile" data-multiple-caption="{count} files selected" name="edit-file" multiple> <label for="edit-file" id="edit-upload" class="formBtn">Add Image(s)</label><label class="edit-filename">Remove Image(s)</label> </div> </div> </div> </div> <div class="row order_controls"> <div class="row subrow"> <div class="col-md-4"> <input type="hidden" value="0" id="order_list_selected_id"/> <div class="line-item-left"> <table id="order_list"></table> </div> <div class="formAddRemove"> <span class="formBtn" id="edit-plus">Add Another </span> <span class="formBtnClear" id="edit-remove">Remove Item</span> </div> </div> <div class="col-md-8 line-item-right"> <div id="order_type" ><span class="edit-label">Product</span><select name="product[refcode]"> </select> </div> <div id="order_type_options"></div> <div id="cf_opportunity_line_item_optional_item_number"><span class="edit-label">Optional Item #</span><input type="text" name="cf_opportunity_line_item_optional_item_number"></div> <div id="cf_opportunity_line_item_width"> <div class="floatL"><span class="edit-label">Width</span></div><div class="floatR"><select name="widthWholeNumber" id="widthWholeNumber" > <option selected value="1">1"</option> <option value="2">2"</option> <option value="3">3"</option> <option value="4">4"</option> <option value="5">5"</option> <option value="6">6"</option> <option value="7">7"</option> <option value="8">8"</option> <option value="9">9"</option> </select> <input name="widthFraction" type="text" value="0" required id="widthFraction" readonly><button type="button" class="formBtnSquare caretDown dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> </button> <ul class="dropdown-menu dropdown-menu-right"> <li><a class="wdecValue">0</a></li> <li><a class="wdecValue"">1/8</a></li> <li><a class="wdecValue">2/8</a></li> <li><a class="wdecValue"">3/8</a></li> <li><a class="wdecValue">4/8</a></li> <li><a class="wdecValue">5/8</a></li> <li><a class="wdecValue">6/8</a></li> <li><a class="wdecValue">7/8</a></li> </ul>  </div> </div> <div id="cf_opportunity_line_item_height"> <div class="floatL"><span class="edit-label">Height</span></div><div class="floatR"><select name="heightWholeNumber" id="heightWholeNumber" > <option selected value="1">1"</option> <option value="2">2"</option> <option value="3">3"</option> <option value="4">4"</option> <option value="5">5"</option> <option value="6">6"</option> <option value="7">7"</option> <option value="8">8"</option> <option value="9">9"</option> </select> <input name="heightFraction" type="text" value="0" required id="heightFraction" readonly><button type="button" class="formBtnSquare dropdown-toggle caretDown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> </button> <ul class="dropdown-menu dropdown-menu-right"> <li><a class="decValue">0</a></li> <li><a class="decValue">1/8</a></li> <li><a class="decValue">2/8</a></li> <li><a class="decValue">3/8</a></li> <li><a class="decValue">4/8</a></li> <li><a class="decValue">5/8</a></li> <li><a class="decValue">6/8</a></li> <li><a class="decValue">7/8</a></li> </ul> </div> </div> <div id="cf_opportunity_line_item_size"><span class="edit-label">Size</span><input type="text" name="cf_opportunity_line_item_size" class="readonly" readonly></input></div> <div id="multicolors"> <div><span class="edit-label">Colors</span><input type="text" id="colorchooser" placeholder="Type a color code then click add..."></div> <div><span class="edit-label"></span><button type="button" class="addcolor">Add Color</button><button type="button" class="remcolor">Remove Color</button></div> <div><span class="edit-label"></span><select name ="colorchosen" id="colorchosen" multiple size="5" style="height:auto"></select></div> <div><span class="edit-label"></span><div class="floatR"><b>Reference a color using <a target="_blank" href="http://www.cal-print.com/InkColorChart.htm">this chart</a>. Add your color by typing the code and clicking "Add Color"</b></div></div> </div> <div id="est_cost"><span class="edit-label">Estimated Cost</span><input type="text" name="est_cost" class="readonly" readonly=""></div> </div> <div id="cf_opportunity_line_item_background"> <span class="edit-label">Background Color</span> <select name="cf_opportunity_line_item_background"> <option value="">-Select-</option> </select> </div> <div id="cf_opportunity_line_item_border"> <span class="edit-label">Border Type</span> <select name="cf_opportunity_line_item_border"> <option value="">-Select-</option> </select> </div> <div id="cf_opportunity_line_item_backing"> <span class="edit-label">Backing Type</span> <select name="cf_opportunity_line_item_backing"> <option value="">-Select-</option> </select> </div> </div> <div class="row subrow"> <div class="col-md-12 line-item-right"> <div>Ship To Address:</div> <div id="cf_opportunity_ship_to_address"> <textarea rows="5" maxlength="65535" name="cf_opportunity_ship_to_address" placeholder=""></textarea> </div> </div> </div> <div class="row subrow"> <div class="col-md-12 line-item-right"> <div>Customer Notes:</div> <div id="cf_opportunity_portal_notes"> <textarea rows="5" maxlength="65535" name="cf_opportunity_portal_notes" placeholder="Customer notes..."></textarea> </div> </div> </div> <div class="row subrow"> <div class="col-md-7 col-md-offset-5"> <div id="edit-sc"> <input type="submit" id="edit-save" class="formBtn" value="Submit"> <input type="button" id="edit-cancel" class="formBtn" value="Cancel"> </div> </div> </div> </div> </div> </form> <div class="modal-bg"> </div> <div class="loading"> <div class='loading-mid'> <div class='icon-spinner3 spinner'></div> <div class='loading-text'></div> </div> </div> <div id="colorchart" class="modal"></div> </div> <script src="https://cdn.ckeditor.com/ckeditor5/11.2.0/classic/ckeditor.js"></script> <script type="text/javascript" src="https://windsweptmarketing.com/portal/wimpie/dataentry.js"></script> <script> ClassicEditor .create( document.querySelector( '#cf_opportunity_portal_notes' ) ) .then( newEditor => { editor = newEditor; } ) .catch( error => { console.error( error ); } ); </script>