Thanks @ismcagdas for your response. No. Unfortunately I can access the configured tenant website https://abc.hostcompany.com but not for rest of the tenant with and wout impersonation - https://tenant1.hostcompany.com or for any of the remaining tenants.
Also, similar to thread 8835 I also found similar comment here in the first answer on abp boilerplate forum.
Thank you for your reply @ismcagdas
Unfortunately I am not sure which output folder you are mentioning. I tried to manually delete entire wwwroot directory from the deployment folder on our on-premises machine but that didn't help.
The CI pipeline I have created last year with mostly v8.1.0 was using graphical interface in Azure DevOps as per the documentation. So, I tried to set 'Source and Output directory' cleaning suggested in this SO post answer.
After two release I verified that all the CSS/JS including min files under the wwwroot subdirectories are updated but still the header title and its padding are somewhat different in the production.
But this is how it looks in development env and
something different in production
@Update: Finally I found that it was because of Visual Settings => Subheader => Subheader style was different. In dev it was "Solid" and in production it was "Transparent" causing the padding like difference. Wondering as this was the root cause of the problem and initially we guess that this setting might be something related to background color only!
Hello @compassinformatics17 and @ismcagdas
The gulp task in my azure pipeline previously working fine but as it was taking too much time and we didn't have frequent changes in theme, I disabled that task. But now after enabling I am facing similar issue and the files are not getting minified. In Visual Studio using Task Runner gulp file makes minified files and applies theme related changes but it does not work in the Azure DevOps pipeline.
Did you guys finally found any workaround in the pipeline task or fix? Please advise.
Thanks.
Finally I found the solution for modal scrollbar (second issue in my above comment) as below after changing ANZ customized datatablese script :
And below trigger in the modal script on tab change and similarly for resize :
$('.nav-tabs li').click(function () {
$('#OrderDetailsTable').DataTable().columns.adjust().draw();
$('#OrderShipmentsTable').DataTable().columns.adjust().draw();
});
Thank you @ismcagdas for your response.
Luckily I found this SO a post today and I could fix the problem little bit by setting this option for first column in the JS:
responsivePriority: 1
But it works only for the cshtml regular page of the website and not for the pop-up tables.
Though using below code, I could atleast fix the overflow issue and now its showing horizontal scrollbar in pop-up. Still it is not responsive design.
CSHTML
......
<div class="row mb-4">
<div class="col-xl-12">
<span id="ShowAdvancedFiltersSpan" class="text-muted clickable-item"><i class="fa fa-angle-down"></i> @L("ShowAdvancedFilters")</span>
<span id="HideAdvancedFiltersSpan" class="text-muted clickable-item" style="display: none"><i class="fa fa-angle-up"></i> @L("HideAdvancedFilters")</span>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<div class="dataTables_scroll">
<!-- Code change table-responsive in div and table with required CSS classes -->
<div class="dataTables_scrollBody table-responsive" style="position: relative; overflow: auto; width: 100%;">
<table id="InventoriesTable" class="display table table-centered dtr-inline w-100 dataTable table-bordered table-hover dt-responsive CDTable">
<thead>
<tr>
<th class="kt-align-center" name="thProduct" colspan="2">@L("thProduct")</th>
<th class="kt-align-center" colspan="3">@L("thQuantity")</th>
<th class="kt-align-center text-wrap" rowspan="2">@L("thMonthsRemaining")</th>
<th class="kt-align-center" colspan="3">@L("thUsage")</th>
<th class="kt-align-center" colspan="3">@L("thOrders")</th>
<th class="kt-align-center" rowspan="2">@L("thLastReceived")</th>
<th class="kt-align-center" rowspan="2">@L("thLastUsed")</th>
<th class="kt-align-center" rowspan="2">@L("thVersion")</th>
<th class="kt-align-center" rowspan="2">@L("UOM")</th>
<th class="hostSpecificCol kt-align-center" rowspan="2">@L("InventoryType")</th>
<th class="hostSpecificCol kt-align-center" rowspan="2">@L("ClientCode")</th>
</tr>
<tr>
<th>@L("thItemNumber")</th>
<th>@L("thDescription")</th>
<th>@L("thOnHandQty")</th>
<th>@L("thOnOrderQty")</th>
<th>@L("thAvailableQty")</th>
<th>@L("thUsage12Months")</th>
<th>@L("thUsage24Months")</th>
<th>@L("thUsage36Months")</th>
<th>@L("thOrders12Months")</th>
<th>@L("thOrders24Months")</th>
<th>@L("thOrders36Months")</th>
</tr>
</thead>
</table>
</div>
</div>
</div>
</div>
....
JavaScipt
var dataTable = _$inventoriesTable.DataTable({
//scrollY: '50vh',
scrollX: true,
paging: true,
serverSide: true,
processing: true,
listAction: {
ajaxFunction: _inventoriesService.getAll,
inputFilter: function () {
return {
// .....
isActiveFilter: 1
};
}
},
columnDefs: [
{ className: 'dt-center', targets: [2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17] },
{ className: 'text-nowrap text-left', targets: [0] },
{ className: 'text-left', targets: [1] },
{
responsivePriority: 1, // Code change
targets: 0,
data: "inventoryItem.itemNumber",
name: "itemNumber",
className: "text-nowrap text-left"
},
Plus button is showing but because of two header rows on this page I still have layout issues as below :
But the same code does not work for pop-up where I have two tabs containing datatable.
Corresponding code : CSHTML
......<div class="modal-body">
<div id="ProductionOrdersData">
<div id="DataTabPanel" class="tabbable-line">
<button id="ExportShipmentsButton" class="btn btn-outline-success kt-pull-right pull-right kt-padding-b-5">
<i class="fa fa-file-excel"></i> @L("Export")
</button>
<ul class="nav nav-tabs" role="tablist">
<li class="nav-item">
<a href="#DetailsTab" aria-expanded="true" class="nav-link @ViewBag.PVDetailsTabVisibility" data-toggle="tab" role="tab">
@L("Details")
</a>
</li>
<li class="nav-item">
<a href="#ShipmentsTab" aria-expanded="true" class="nav-link @ViewBag.PVShipmentsTabVisibility" data-toggle="tab" role="tab">
@L("Shipments")
</a>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane @ViewBag.PVDetailsTabVisibility" id="DetailsTab">
<div class="row align-items-center">
<div class="table-responsive">
<table id="OrderDetailsTable" class="display table table-centered dtr-inline w-100 dataTable table-bordered table-hover dt-responsive">
<thead>
<tr>
<th>@L("JobNo")</th>
</tr>
</thead>
</table>
</div>
</div>
</div>
<div class="tab-pane @ViewBag.PVShipmentsTabVisibility" id="ShipmentsTab">
<div class="row align-items-center">
<div class="table-responsive">
<table id="OrderShipmentsTable" class="display table table-centered dtr-inline w-100 dataTable table-bordered table-hover dt-responsive">
<thead>
<tr>
<th>@L("ShipmentNo")</th>
</tr>
</thead>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>......
JavaScript
this.init = function (modalManager) {
_modalManager = modalManager;
debugger;
_$CurrentOrderNo = $('#CurrentProductionOrders').val();
_$DetailsTable.DataTable({
serverSide: false,
processing: true,
listAction: {
ajaxFunction: _pvJobsService.getJobsForOrder,
inputFilter: function () {
return {
orderNo: _$CurrentOrderNo
}
}
},
columnDefs: [
{
responsivePriority: 1,
targets: 0,
data: 'productionJob.jobNo',
name: 'jobNo'
},
......
Questions :
Good to hear that someone else is also facing this kind of issues in datatables.
In this case number of columns are less but in our case we have 17 columns and the main issue is second column 'Description' which are lengthy that makes this kind of strange appearance of datatables when we have multiple header rows like below :
Similarly again when we use the datatable in modal there is some strange behaviour. May be because ANZ theme and customization code of "modalmanager.js" and "datatables.default.js" of "....Mvc\wwwroot\Common\Scripts" as per below:
@ismcagdas please try to reproduce this scenario at your end by increasing number of columns and/or larger text both in case of normal page and in modal. Facing this issue since beginning but hope there would be some solution which you would post here after fixing @Leonardo 's original issue.
Thanks.
Thank you @maliming for your response.
I searched few tickets and went through code plus documentation for SettingHelpers but I could not read or get a clue that default settings that we define in the app will be stored in database or not?
That's why I tried to store them into the database.
But now I think that, using settings system it would be handled smoothly. I should just define my default settings in code base (application wide as default) and using ISettingManager I can define/update settings for tenant which would be stored by setting system automatically (into database) and will be returned correctly as well next time.
Please let me know if what I unserstood above makes some sense?
Thanks.
To store and use widget settings for every tenant differently, I have tried above code.
Above code does not store the default settings in the database. So, to store the default settings in the database, I have created repository as mentioned in ticket 5077
And to finally store in the database, added code to store the settings in AppSettings table in project EntityFrameWorkCore => Migrations => Seed => Host => InitialHostDbBuilder.cs like few template setting (e.g. SMTP)
Is it the correct way to store default tenant widget settings in database or it could be simplified?
Thanks
The solution to change from "abp-src" to "src" is right for normal pages. But
For widgets as we are defining widget with specific min.js file only as target in DashboardCustomization.cs file. So, here we have to make changes in min file and after we are done we need to copy the changes back in regular .js file to be committed to git.
Is there any work around in the case of Widget? As we have 15 widgets and its hard for front end/UX developer to remember and copy any changes related to widgets.
I found the answer from ticket #9235.
Is there any other way to get it or the one mentioned is the best way?