| Server IP : 210.245.233.93 / Your IP : 216.73.216.226 Web Server : Apache/2.2.15 (CentOS) System : Linux webserver2.onesolution.com.hk 2.6.32-754.35.1.el6.x86_64 #1 SMP Sat Nov 7 12:42:14 UTC 2020 x86_64 User : apache ( 48) PHP Version : 5.3.3 Disable Function : exec, shell_exec, system, passthru, popen, proc_open, pcntl_exec MySQL : ON | cURL : ON | WGET : ON | Perl : ON | Python : ON | Sudo : ON | Pkexec : ON Directory : /var/www/hkosl.com/billingsystem/dashboard/component/ |
Upload File : |
<div class="modal fade bd-example-modal-lg" id="Edit" tabindex="-1" role="dialog" aria-labelledby="addNew" aria-disabled="true">
<div class="modal-dialog modal-md modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h3 class="modal-title">Edit Invoice Recurring
</h3>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-disabled="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="card-body boxShadow whiteBg mb-3">
<!-- form -->
<form>
<div class="row">
<div class="col-md-12">
<p>
Invoice Recurring# <span class="small text-muted">(Auto
Generate)</span>: <span class="text-danger h3">IC-200001</span>
</p>
</div>
<div class="col-md-3">
<div class="form-group">
<label for="CustomerName">Customer Name </label>
<input type="text" class="form-control mainSearchInput normalSearch" aria-describedby="search" value="Sales" placeholder="" autocomplete="nope">
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label for="QuotationNo">Quotation# </label>
<select class="form-control" id="QuotationNo">
<option value=""></option>
<option value="QU-220428-001" selected>QU-220428-001</option>
<option value="QU-220428-002">QU-220428-002</option>
</select>
</div>
</div>
<div class="col-md-2">
<div class="form-group">
<label for="Salesman">Salesman </label>
<select class="form-control" id="Salesman">
<option value=""></option>
<option value="Amy" selected>Amy Wong</option>
<option value="Jackie">Jackie Wong</option>
</select>
</div>
</div>
<div class="col-md-2">
<div class="form-group">
<label for="Currency">Currency </label>
<select class="form-control" id="Currency">
<option value=""></option>
<option value="HKD" selected>HKD</option>
<option value="USD">USD</option>
</select>
</div>
</div>
<div class="col-md-2">
<div class="form-group">
<label for="Currency">Service Type </label>
<select class="form-control" id="Currency">
<option value=""></option>
<option value="Rental" selected>Rental</option>
<option value="Retail">Retail</option>
<option value="CNY">CNY</option>
<option value="XMAS">XMAS</option>
</select>
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label for="StartDate">Start Date</label>
<input type="text" class="form-control date" id="StartDate" value="30 Jan 2020">
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label for="EndDate">End Date</label>
<input type="text" class="form-control date" id="EndDate" value="30 Jan 2020">
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label>Repeat every</label>
<div class="d-flex">
<input type="text" class="form-control" value="10">
<select class="form-control" id="QuotationNo">
<option value="Month" selected>Month</option>
<option value="Year">Year</option>
</select>
</div>
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label for="Cycles">Remaining Cycles</label>
<div class="d-flex">
<input type="text" class="form-control" id="Cycles" value="2">
<div class="form-check">
<input class="form-check-input" type="radio" name="Neverexpires" id="Neverexpires" value="">
<label class="form-check-label nowrap" for="Neverexpires">
Never expires
</label>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="boxShadow whiteBg mt-3 mb-3">
<!-- bill Form -->
<?php include 'component/billaddress.php'; ?>
<!-- bill Form END -->
</div>
</div>
<div class="col-md-6">
<div class="boxShadow whiteBg mt-3 mb-3">
<!-- ship Form -->
<?php include 'component/shippingaddress.php'; ?>
<!-- ship Form END -->
</div>
</div>
<div class="col-md-12">
<div id="EditInvoicerecuttingGrid" class="newGrid"></div>
</div>
<div class="col-md-12">
<hr>
<div class="d-flex justify-content-between">
<p class="small">Subtotal <span class="text-muted">(Discount Included)</span>
</p>
<p class="text-secondary">$100000,00 </p>
</div>
<div class="d-flex justify-content-between">
<p class="small">Total Cost
</p>
<p class="text-secondary">$100,000.00 </p>
</div>
<div class="d-flex justify-content-between double_border_bottom mb-4">
<p class="h1">Total Amount </p>
<p class="h1">$100000,00 </p>
</div>
</div>
<div class="col-md-6">
<div class="form-group row align-items-center">
<label class="col-sm-4 text-muted mb-3" for="PaymentTerms">Payment Terms :
</label>
<div class="col-sm-8 mb-3">
<select class="form-control">
<option value="Default" Selected>Default</option>
<option value="Template01">Template01</option>
<option value="Template01">Template01</option>
<option value="Template01">Template01</option>
</select>
</div>
</div>
<textarea class="form-control" id="Remarks" rows="4" id="PaymentTerms">C.O.D.</textarea>
</div>
<div class="col-md-6">
<div class="form-group">
<label for="Remarks">Invoice Remarks</label>
<textarea class="form-control" id="Remarks" rows="2"></textarea>
</div>
<div class="form-group">
<label for="Remarks ">Remarks <span class="text-muted">(For Internal
Use)</span></label>
<textarea class="form-control" id="Remarks" rows="2"></textarea>
</div>
</div>
<div class="col-md-12 text-right">
<hr>
<button type="button" class="btn btn-secondary" onclick="location.href='invoice_recurring_detail.php';">Back</button>
<button type="button" class="btn btn-primary submitDate shadow_blue">Save</button>
</div>
</div>
</form>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal" aria-label="Close">Back</button>
<!-- <button type="button" class="btn btn-danger submitDate shadow_red">Reject</button> -->
<button type="button" class="btn btn-primary submitDate shadow_blue">Create</button>
</div>
</div>
</div>
</div>
<script>
$(function() {
$('#Cycles').keyup(function() {
if ($(this).val() != "") {
$(this).parent().find("#Neverexpires").attr("disabled", true);
$(this).parent().find("#Neverexpires").prop('checked', false);
} else {
$(this).parent().find("#Neverexpires").attr("disabled", false);
}
})
$('#StartDate').datepicker({
format: 'dd M, yyyy'
});
$('#EndDate').datepicker({
format: 'dd M, yyyy'
});
var NewData = [{
ItemCode: "VPS-393",
Description: "Item A Desc. line 1",
Qty: "10",
UnitPrice: "$5.00",
'Disc%': "$0.00",
Amount: "$50.00"
}, {
ItemCode: "VPS-393",
Description: "Item A Desc. line 1",
Qty: "10",
UnitPrice: "$5.00",
'Disc%': "$0.00",
Amount: "$50.00"
}, {
ItemCode: "VPS-393",
Description: "Item A Desc. line 1",
Qty: "10",
UnitPrice: "$5.00",
'Disc%': "$0.00",
Amount: "$50.00"
}, {
ItemCode: "VPS-393",
Description: "Item A Desc. line 1",
Qty: "10",
UnitPrice: "$5.00",
'Disc%': "$0.00",
Amount: "$50.00"
}, {
ItemCode: "VPS-393",
Description: "Item A Desc. line 1",
Qty: "10",
UnitPrice: "$5.00",
'Disc%': "$0.00",
Amount: "$50.00"
}];
var IconField = function(config) {
jsGrid.Field.call(this, config);
};
IconField.prototype = new jsGrid.Field({
itemTemplate: function(value) {
var insertValue = this._insertValue = $(
`<i class="mdi mdi-select-all"></i>`);
return insertValue;
},
insertTemplate: function(value) {
return this._insertInput = $(
`<i class="mdi mdi-select-all"></i>`
);
},
editTemplate: function(value) {
return this._editInput = $(
`<i class="mdi mdi-select-all"></i>`
);
},
insertValue: function() {
return this._insertInput.val();
},
editValue: function() {
return this._editInput.val();
}
});
jsGrid.fields.iconField = IconField;
var RemarkField = function(config) {
jsGrid.Field.call(this, config);
};
RemarkField.prototype = new jsGrid.Field({
itemTemplate: function(value) {
var insertValue = this._insertValue = $(
`<span class="textareaText" >${value}</span>`);
return insertValue;
},
insertTemplate: function(value) {
return this._insertInput = $(
`<textarea class="textareaRow" rows="1"></textarea>`
);
},
editTemplate: function(value) {
return this._editInput = $(
`<textarea class="textareaRow" rows="1">${value}</textarea>`
);
},
insertValue: function() {
return this._insertInput.val();
},
editValue: function() {
return this._editInput.val();
}
});
jsGrid.fields.remarkField = RemarkField;
const SelectField = jsGrid.SelectField;
function Select2Field(config) {
SelectField.call(this, config);
}
Select2Field.prototype = new SelectField({
itemTemplate: function(value) {
var insertValue = this._insertValue = value;
return insertValue;
},
insertValue: function() {
return this._insertInput.val();
},
_createSelect() {
const el = SelectField.prototype._createSelect.call(this);
setTimeout(() => el.select2({
placeholder: ''
}), 100);
return el;
}
});
jsGrid.fields.select2 = jsGrid.Select2Field = Select2Field;
$("#EditInvoicerecuttingGrid").jsGrid({
height: "auto",
width: "100%",
inserting: true,
editing: true,
sorting: true,
paging: true,
data: NewData,
rowClass: function(item, itemIndex) {
return "client-" + itemIndex;
},
controller: {
loadData: function() {
return NewData.slice(0, 15);
}
},
fields: [{
name: "#",
type: "iconField",
width: 30,
align: "left"
}, {
name: "ItemCode",
type: "select2",
items: [{
value: '12323213',
text: '12323213'
}],
textField: 'text',
valueField: 'value',
width: 100,
align: "left"
}, {
name: "Description",
type: "remarkField",
width: 150,
sorting: false
},
{
name: "Qty",
type: "number",
width: 80,
align: "left"
},
{
name: "UnitPrice",
type: "text",
align: "right",
width: 80
}, {
name: "Disc%",
type: "text",
align: "right",
width: 50
}, {
name: "Amount",
type: "text",
align: "right",
width: 80
},
{
type: "control",
width: 50,
editButton: false
}
],
onRefreshed: function() {
var $gridData = $("#EditInvoicerecuttingGrid .jsgrid-grid-body tbody");
$gridData.sortable({
update: function(e, ui) {
// array of indexes
var clientIndexRegExp = /\s*client-(\d+)\s*/;
var indexes = $.map($gridData.sortable("toArray", {
attribute: "class"
}), function(classes) {
return clientIndexRegExp.exec(classes)[1];
});
alert("Reordered indexes: " + indexes.join(", "));
// arrays of items
var items = $.map($gridData.find("tr"), function(row) {
return $(row).data("JSGridItem");
});
console && console.log("Reordered items", items);
}
});
},
rowClick: function(args) {
var $row = $(args.event.target).closest("tr");
var $cell = $(args.event.target).closest(".jsgrid-cell");
cellIndex = $($row.find("td")).index($cell);
if (this._editingRow) {
this.updateItem();
}
if (this.editing) {
this.editItem($row);
}
}
});
$(document).on("click", "input[type='radio'][name='mainSearch']:checked", function() {
$(this).closest(".mainSearchWrap").find(".mainSearchInput").val($(
this)
.val());
$(this).closest(".mainSearchWrap").removeClass('active');
});
});
</script>