wezmag / SereneDashboardExample

8 stars 4 forks source link

thank you #1

Open Qasem2022 opened 1 year ago

Qasem2022 commented 1 year ago

Thanks for this great effort Is there an MVC version please

Please

Qasem2022 commented 1 year ago

Thank you for the wonderful effort

I have a serenity vision project MVC Is it possible to run the code on it Or could you help us create code that can run on serenity MVC

please help

wezmag commented 1 year ago

Hello @Qasem2022 I do not have the develop environment for the legacy serenity MVC. However, it's very similar to the dotnet core version. You will need to convert the dashboard widgets typescript files from the ES module to namespaces. (MVC version uses namespaces.) Put some placeholders or <section /> in the DashboardIndex.cshtml Finally, in the PageInitScript section, add the widgets to the placeholders.

DashboardIndex.cshtml

@{
    ViewData["Title"] = "Dashboard";
    ViewData["PageId"] = "Dashboard";
}

@section Head {
    @Html.StyleBundle("Pages/Dashboard")
    @Html.ScriptBundle("Pages/Dashboard")
}

@section ContentHeader {
    <h1>@LocalText.Get("Navigation.Dashboard")</h1>
}

<!-- this is where to put the placeholders -->
<div class="row">
    <div class="col-lg-12">
        <section id="StatisticsArea">
        </section>
    </div>
</div>

@section PageInitScript {
    new YourProject.Dashboard.Bootstrapper();
}

DashboardBootstrapper.ts

namespace YourProject.Dashboard {
    export class Bootstrapper {
        constructor() {
            // this is how to initial the widget (StatisticsWidget) and place it to the dashboard placeholder
            new YourProject.Dashboard.StatisticsWidget($('#StatisticsArea'), {}).init();
        }
    }
}