();
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/TryVueMvc/Properties/launchSettings.json:
--------------------------------------------------------------------------------
1 | {
2 | "iisSettings": {
3 | "windowsAuthentication": false,
4 | "anonymousAuthentication": true,
5 | "iisExpress": {
6 | "applicationUrl": "http://localhost:51765",
7 | "sslPort": 0
8 | }
9 | },
10 | "profiles": {
11 | "IIS Express": {
12 | "commandName": "IISExpress",
13 | "launchBrowser": true,
14 | "environmentVariables": {
15 | "ASPNETCORE_ENVIRONMENT": "Development"
16 | }
17 | },
18 | "TryVueMvc": {
19 | "commandName": "Project",
20 | "launchBrowser": true,
21 | "environmentVariables": {
22 | "ASPNETCORE_ENVIRONMENT": "Development"
23 | },
24 | "applicationUrl": "http://localhost:5000"
25 | }
26 | }
27 | }
28 |
--------------------------------------------------------------------------------
/TryVueMvcGrid/Properties/launchSettings.json:
--------------------------------------------------------------------------------
1 | {
2 | "iisSettings": {
3 | "windowsAuthentication": false,
4 | "anonymousAuthentication": true,
5 | "iisExpress": {
6 | "applicationUrl": "http://localhost:51767",
7 | "sslPort": 0
8 | }
9 | },
10 | "profiles": {
11 | "IIS Express": {
12 | "commandName": "IISExpress",
13 | "launchBrowser": true,
14 | "environmentVariables": {
15 | "ASPNETCORE_ENVIRONMENT": "Development"
16 | }
17 | },
18 | "TryVueMvcGrid": {
19 | "commandName": "Project",
20 | "launchBrowser": true,
21 | "environmentVariables": {
22 | "ASPNETCORE_ENVIRONMENT": "Development"
23 | },
24 | "applicationUrl": "http://localhost:5000"
25 | }
26 | }
27 | }
28 |
--------------------------------------------------------------------------------
/TryVueMvcDecorator/Properties/launchSettings.json:
--------------------------------------------------------------------------------
1 | {
2 | "iisSettings": {
3 | "windowsAuthentication": false,
4 | "anonymousAuthentication": true,
5 | "iisExpress": {
6 | "applicationUrl": "http://localhost:56576",
7 | "sslPort": 0
8 | }
9 | },
10 | "profiles": {
11 | "IIS Express": {
12 | "commandName": "IISExpress",
13 | "launchBrowser": true,
14 | "environmentVariables": {
15 | "ASPNETCORE_ENVIRONMENT": "Development"
16 | }
17 | },
18 | "TryVueMvcDecorator": {
19 | "commandName": "Project",
20 | "launchBrowser": true,
21 | "environmentVariables": {
22 | "ASPNETCORE_ENVIRONMENT": "Development"
23 | },
24 | "applicationUrl": "http://localhost:5000"
25 | }
26 | }
27 | }
28 |
--------------------------------------------------------------------------------
/TryVueMvcDecorator/ClientApp/components/Hello.ts:
--------------------------------------------------------------------------------
1 | // ClientApp/components/Hello.ts
2 | import Vue from "vue";
3 | import Component from "vue-class-component";
4 |
5 | @Component({
6 | template: '#hello-template',
7 | props: ['name', 'initialEnthusiasm']
8 | })
9 | export default class HelloComponent extends Vue {
10 | enthusiasm!: number;
11 | initialEnthusiasm!: number;
12 |
13 | data() {
14 | return {
15 | enthusiasm: this.initialEnthusiasm
16 | }
17 | };
18 |
19 | // methods:
20 | increment() { this.enthusiasm++; };
21 | decrement() {
22 | if (this.enthusiasm > 1) {
23 | this.enthusiasm--;
24 | }
25 | };
26 |
27 | // computed:
28 | get exclamationMarks() {
29 | return Array(this.enthusiasm + 1).join('!');
30 | }
31 | };
--------------------------------------------------------------------------------
/TryVueMvcGrid/ClientApp/components/DemoGrid.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
9 | {{ key | capitalize }}
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 | {{entry[key]}}
19 |
20 |
21 |
22 |
23 |
24 |
--------------------------------------------------------------------------------
/TryVueMvc/Views/Shared/Error.cshtml:
--------------------------------------------------------------------------------
1 | @model ErrorViewModel
2 | @{
3 | ViewData["Title"] = "Error";
4 | }
5 |
6 | Error.
7 | An error occurred while processing your request.
8 |
9 | @if (Model.ShowRequestId)
10 | {
11 |
12 | Request ID: @Model.RequestId
13 |
14 | }
15 |
16 | Development Mode
17 |
18 | Swapping to Development environment will display more detailed information about the error that occurred.
19 |
20 |
21 | Development environment should not be enabled in deployed applications , as it can result in sensitive information from exceptions being displayed to end users. For local debugging, development environment can be enabled by setting the ASPNETCORE_ENVIRONMENT environment variable to Development , and restarting the application.
22 |
23 |
--------------------------------------------------------------------------------
/TryVueMvcGrid/Views/Shared/Error.cshtml:
--------------------------------------------------------------------------------
1 | @model ErrorViewModel
2 | @{
3 | ViewData["Title"] = "Error";
4 | }
5 |
6 | Error.
7 | An error occurred while processing your request.
8 |
9 | @if (Model.ShowRequestId)
10 | {
11 |
12 | Request ID: @Model.RequestId
13 |
14 | }
15 |
16 | Development Mode
17 |
18 | Swapping to Development environment will display more detailed information about the error that occurred.
19 |
20 |
21 | Development environment should not be enabled in deployed applications , as it can result in sensitive information from exceptions being displayed to end users. For local debugging, development environment can be enabled by setting the ASPNETCORE_ENVIRONMENT environment variable to Development , and restarting the application.
22 |
23 |
--------------------------------------------------------------------------------
/TryVueMvcDecorator/Views/Shared/Error.cshtml:
--------------------------------------------------------------------------------
1 | @model ErrorViewModel
2 | @{
3 | ViewData["Title"] = "Error";
4 | }
5 |
6 | Error.
7 | An error occurred while processing your request.
8 |
9 | @if (Model.ShowRequestId)
10 | {
11 |
12 | Request ID: @Model.RequestId
13 |
14 | }
15 |
16 | Development Mode
17 |
18 | Swapping to Development environment will display more detailed information about the error that occurred.
19 |
20 |
21 | Development environment should not be enabled in deployed applications , as it can result in sensitive information from exceptions being displayed to end users. For local debugging, development environment can be enabled by setting the ASPNETCORE_ENVIRONMENT environment variable to Development , and restarting the application.
22 |
23 |
--------------------------------------------------------------------------------
/TryVueMvc/Views/Home/Index.cshtml:
--------------------------------------------------------------------------------
1 | @* Views/Home/Index.cshtml *@
2 | @using Microsoft.AspNetCore.Hosting
3 | @inject IHostingEnvironment hostingEnv
4 | @{
5 | var vueUrl = hostingEnv.IsDevelopment() ? "/dist/vendor2.js" : "/dist/vendor2.min.js";
6 | var mainUrl = hostingEnv.IsDevelopment() ? "/dist/app-bandle.js" : "/dist/app-bandle.min.js";
7 |
8 | ViewData["Title"] = "TryVueMvc Sample";
9 | }
10 |
11 | loading..
12 | @section Scripts{
13 |
20 |
21 |
30 | }
31 |
--------------------------------------------------------------------------------
/TryVueMvcGrid/Views/Home/Index.cshtml:
--------------------------------------------------------------------------------
1 | @* Views/Home/Index.cshtml *@
2 | @using Microsoft.AspNetCore.Hosting
3 | @inject IHostingEnvironment hostingEnv
4 | @{
5 | var vueUrl = hostingEnv.IsDevelopment() ? "/dist/vendor2.js" : "/dist/vendor2.min.js";
6 | var mainUrl = hostingEnv.IsDevelopment() ? "/dist/app-bandle.js" : "/dist/app-bandle.min.js";
7 |
8 | ViewData["Title"] = "TryVueMvc Sample";
9 | }
10 |
11 | loading..
12 | @section Scripts{
13 |
20 |
21 |
30 | }
31 |
--------------------------------------------------------------------------------
/TryVueMvcDecorator/Views/Home/Index.cshtml:
--------------------------------------------------------------------------------
1 | @* Views/Home/Index.cshtml *@
2 | @using Microsoft.AspNetCore.Hosting
3 | @inject IHostingEnvironment hostingEnv
4 | @{
5 | var suffix = hostingEnv.IsDevelopment() ? "" : ".min";
6 | var vueUrl = $"vendor/vue{suffix}.js";
7 | var vueClassComponentUrl = $"vendor/vue-class-component{suffix}.js";
8 | var mainUrl = $"dist/app-bandle{suffix}.js";
9 |
10 | ViewData["Title"] = "TryVueMvc Sample";
11 | }
12 |
13 | loading..
14 | @section Scripts{
15 |
31 | }
32 |
--------------------------------------------------------------------------------
/TryVueMvc/Controllers/HomeController.cs:
--------------------------------------------------------------------------------
1 | using System;
2 | using System.Collections.Generic;
3 | using System.Diagnostics;
4 | using System.Linq;
5 | using System.Threading.Tasks;
6 | using Microsoft.AspNetCore.Mvc;
7 | using TryVueMvc.Models;
8 |
9 | namespace TryVueMvc.Controllers
10 | {
11 | public class HomeController : Controller
12 | {
13 | public IActionResult Index()
14 | {
15 | return View();
16 | }
17 |
18 | public IActionResult About()
19 | {
20 | ViewData["Message"] = "Your application description page.";
21 |
22 | return View();
23 | }
24 |
25 | public IActionResult Contact()
26 | {
27 | ViewData["Message"] = "Your contact page.";
28 |
29 | return View();
30 | }
31 |
32 | public IActionResult Error()
33 | {
34 | return View(new ErrorViewModel { RequestId = Activity.Current?.Id ?? HttpContext.TraceIdentifier });
35 | }
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/TryVueMvcGrid/Controllers/HomeController.cs:
--------------------------------------------------------------------------------
1 | using System;
2 | using System.Collections.Generic;
3 | using System.Diagnostics;
4 | using System.Linq;
5 | using System.Threading.Tasks;
6 | using Microsoft.AspNetCore.Mvc;
7 | using TryVueMvcGrid.Models;
8 |
9 | namespace TryVueMvcGrid.Controllers
10 | {
11 | public class HomeController : Controller
12 | {
13 | public IActionResult Index()
14 | {
15 | return View();
16 | }
17 |
18 | public IActionResult About()
19 | {
20 | ViewData["Message"] = "Your application description page.";
21 |
22 | return View();
23 | }
24 |
25 | public IActionResult Contact()
26 | {
27 | ViewData["Message"] = "Your contact page.";
28 |
29 | return View();
30 | }
31 |
32 | public IActionResult Error()
33 | {
34 | return View(new ErrorViewModel { RequestId = Activity.Current?.Id ?? HttpContext.TraceIdentifier });
35 | }
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/TryVueMvcDecorator/Controllers/HomeController.cs:
--------------------------------------------------------------------------------
1 | using System;
2 | using System.Collections.Generic;
3 | using System.Diagnostics;
4 | using System.Linq;
5 | using System.Threading.Tasks;
6 | using Microsoft.AspNetCore.Mvc;
7 | using TryVueMvcDecorator.Models;
8 |
9 | namespace TryVueMvcDecorator.Controllers
10 | {
11 | public class HomeController : Controller
12 | {
13 | public IActionResult Index()
14 | {
15 | return View();
16 | }
17 |
18 | public IActionResult About()
19 | {
20 | ViewData["Message"] = "Your application description page.";
21 |
22 | return View();
23 | }
24 |
25 | public IActionResult Contact()
26 | {
27 | ViewData["Message"] = "Your contact page.";
28 |
29 | return View();
30 | }
31 |
32 | public IActionResult Error()
33 | {
34 | return View(new ErrorViewModel { RequestId = Activity.Current?.Id ?? HttpContext.TraceIdentifier });
35 | }
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2018 Eduard Schavelev
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/TryVueMvc/TryVueMvc.csproj:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | netcoreapp2.2
5 | InProcess
6 | Latest
7 |
8 |
9 |
10 |
13 | all
14 | runtime; build; native; contentfiles; analyzers
15 |
16 |
17 |
18 |
19 |
21 |
22 |
24 |
--------------------------------------------------------------------------------
/TryVueMvcGrid/TryVueMvcGrid.csproj:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | netcoreapp2.2
5 | InProcess
6 | Latest
7 |
8 |
9 |
10 |
13 | all
14 | runtime; build; native; contentfiles; analyzers
15 |
16 |
17 |
18 |
19 |
21 |
22 |
24 |
--------------------------------------------------------------------------------
/TryVueMvcDecorator/TryVueMvcDecorator.csproj:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | netcoreapp2.2
5 | InProcess
6 | Latest
7 |
8 |
9 |
10 |
13 | all
14 | runtime; build; native; contentfiles; analyzers
15 |
16 |
17 |
18 |
19 |
21 |
22 |
24 |
--------------------------------------------------------------------------------
/TryVueMvc/Views/Shared/_ValidationScriptsPartial.cshtml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
12 |
18 |
19 |
--------------------------------------------------------------------------------
/TryVueMvcGrid/Views/Shared/_ValidationScriptsPartial.cshtml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
12 |
18 |
19 |
--------------------------------------------------------------------------------
/TryVueMvcDecorator/Views/Shared/_ValidationScriptsPartial.cshtml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
12 |
18 |
19 |
--------------------------------------------------------------------------------
/TryVueMvcGrid/ClientApp/css/demo-grid.css:
--------------------------------------------------------------------------------
1 | /* ClientApp/css/demo-grid.css */
2 | body {
3 | font-family: Helvetica Neue, Arial, sans-serif;
4 | font-size: 14px;
5 | color: #444;
6 | }
7 |
8 | table {
9 | border: 2px solid #42b983;
10 | border-radius: 3px;
11 | background-color: #fff;
12 | margin-top: .5rem;
13 | }
14 |
15 | th {
16 | background-color: #42b983;
17 | color: rgba(255,255,255,0.66);
18 | cursor: pointer;
19 | -webkit-user-select: none;
20 | -moz-user-select: none;
21 | -ms-user-select: none;
22 | user-select: none;
23 | }
24 |
25 | td {
26 | background-color: #f9f9f9;
27 | }
28 |
29 | th, td {
30 | min-width: 120px;
31 | padding: 10px 20px;
32 | }
33 |
34 | th.active {
35 | color: #fff;
36 | }
37 |
38 | th.active .arrow {
39 | opacity: 1;
40 | }
41 |
42 | .arrow {
43 | display: inline-block;
44 | vertical-align: middle;
45 | width: 0;
46 | height: 0;
47 | margin-left: 5px;
48 | opacity: 0.66;
49 | }
50 |
51 | .arrow.asc {
52 | border-left: 4px solid transparent;
53 | border-right: 4px solid transparent;
54 | border-bottom: 4px solid #fff;
55 | }
56 |
57 | .arrow.dsc {
58 | border-left: 4px solid transparent;
59 | border-right: 4px solid transparent;
60 | border-top: 4px solid #fff;
61 | }
62 |
--------------------------------------------------------------------------------
/README.ru-ru.md:
--------------------------------------------------------------------------------
1 | [in English](README.md)
2 | # StarterVueMvc
3 |
4 | 
5 |
6 |
7 | Заготовка для приложений Vue.js + Asp.Net Core MVC + TypeScript + Bootstrap4. Решение Visual Studio 2017 с тремя независимыми проектами:
8 | - TryVueMvc
9 | - TryVueMvcDecorator
10 | - TryVueMvcGrid
11 |
12 | Также используется в качестве примера для статей на habrahabr.ru:
13 | - [Vue.js + Asp.Net Core MVC + TypeScript и ещё Bootstrap4](https://habrahabr.ru/post/350332/);
14 | - [Строгая типизация для приложений Vue.js на TypeScript](https://habrahabr.ru/post/351216/);
15 |
16 | # Установка
17 |
18 | Клонировать этот репозиторий на свой компьютер.
19 | ```dos
20 | git clone https://github.com/schavelev/starter-vue-mvc.git
21 | ```
22 |
23 | Установить расширение к VS2017: [Bundler & Minifier](https://marketplace.visualstudio.com/items?itemName=MadsKristensen.BundlerMinifier).
24 |
25 | # Сборка и запуск проекта
26 |
27 | Сборка и запуск приложения - традиционное для среды VS2017. Бандлинг производится через команду "Bundler&Minifier\Update Bundles" локального меню на файле bundleconfig.json.
28 |
29 | Также сборку и запуск можно произвести через командную строку в каталоге проекта:
30 | ```dos
31 | npm install
32 | dotnet build
33 | dotnet bundle
34 | dotnet run
35 | ```
36 | В браузере открываем страницу по указанному адресу, например, http://localhost:51766.
37 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | [на русском языке](README.ru-ru.md)
2 | # StarterVueMvc
3 |
4 | 
5 |
6 | Starter application Vue.js + Asp.Net Core MVC + TypeScript + Bootstrap4. A solution for Visual Studio 2017 with 3 independent projects:
7 | - TryVueMvc
8 | - TryVueMvcDecorator
9 | - TryVueMvcGrid
10 |
11 | Also used as an example for articles on habrahabr.ru (in Russian):
12 | - [Vue.js + Asp.Net Core MVC + TypeScript and also Bootstrap4](https://habrahabr.ru/post/350332/);
13 | - [Strict typing for Vue.js applications on TypeScript](https://habrahabr.ru/post/351216/);
14 |
15 | # Installation
16 |
17 | Clone the repository to your computer.
18 |
19 | ```dos
20 | git clone https://github.com/schavelev/starter-vue-mvc.git
21 | ```
22 |
23 | Install the [Bundler & Minifier extension](https://marketplace.visualstudio.com/items?itemName=MadsKristensen.BundlerMinifier).
24 |
25 | # Building and running
26 |
27 | Building and running the application is traditional for the VS2017 environment. Bandling can be done through the "Bundler & Minifier \ Update Bundles" command of the local menu on the bundleconfig.json file.
28 |
29 | You can also build and run through the command line in the project directory:
30 | ```dos
31 | npm install
32 | dotnet build
33 | dotnet bundle
34 | dotnet run
35 | ```
36 | Open a page in the browser at the specified address. For example http: // localhost: 51766.
37 |
--------------------------------------------------------------------------------
/TryVueMvc/Startup.cs:
--------------------------------------------------------------------------------
1 | using System;
2 | using System.Collections.Generic;
3 | using System.Linq;
4 | using System.Threading.Tasks;
5 | using Microsoft.AspNetCore.Builder;
6 | using Microsoft.AspNetCore.Hosting;
7 | using Microsoft.AspNetCore.Http;
8 | using Microsoft.AspNetCore.Mvc;
9 | using Microsoft.Extensions.Configuration;
10 | using Microsoft.Extensions.DependencyInjection;
11 |
12 | namespace TryVueMvc
13 | {
14 | public class Startup
15 | {
16 | public Startup(IConfiguration configuration)
17 | {
18 | Configuration = configuration;
19 | }
20 |
21 | public IConfiguration Configuration { get; }
22 |
23 | // This method gets called by the runtime. Use this method to add services to the container.
24 | public void ConfigureServices(IServiceCollection services)
25 | {
26 | services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_2);
27 | }
28 |
29 | // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
30 | public void Configure(IApplicationBuilder app, IHostingEnvironment env)
31 | {
32 | if (env.IsDevelopment())
33 | {
34 | app.UseDeveloperExceptionPage();
35 | }
36 | else
37 | {
38 | app.UseExceptionHandler("/Home/Error");
39 | }
40 |
41 | app.UseStaticFiles();
42 |
43 | app.UseMvc(routes =>
44 | {
45 | routes.MapRoute(
46 | name: "default",
47 | template: "{controller=Home}/{action=Index}/{id?}");
48 | });
49 | }
50 | }
51 | }
52 |
--------------------------------------------------------------------------------
/TryVueMvcGrid/Startup.cs:
--------------------------------------------------------------------------------
1 | using System;
2 | using System.Collections.Generic;
3 | using System.Linq;
4 | using System.Threading.Tasks;
5 | using Microsoft.AspNetCore.Builder;
6 | using Microsoft.AspNetCore.Hosting;
7 | using Microsoft.AspNetCore.Http;
8 | using Microsoft.AspNetCore.Mvc;
9 | using Microsoft.Extensions.Configuration;
10 | using Microsoft.Extensions.DependencyInjection;
11 |
12 | namespace TryVueMvcGrid
13 | {
14 | public class Startup
15 | {
16 | public Startup(IConfiguration configuration)
17 | {
18 | Configuration = configuration;
19 | }
20 |
21 | public IConfiguration Configuration { get; }
22 |
23 | // This method gets called by the runtime. Use this method to add services to the container.
24 | public void ConfigureServices(IServiceCollection services)
25 | {
26 | services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_2);
27 | }
28 |
29 | // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
30 | public void Configure(IApplicationBuilder app, IHostingEnvironment env)
31 | {
32 | if (env.IsDevelopment())
33 | {
34 | app.UseDeveloperExceptionPage();
35 | }
36 | else
37 | {
38 | app.UseExceptionHandler("/Home/Error");
39 | }
40 |
41 | app.UseStaticFiles();
42 |
43 | app.UseMvc(routes =>
44 | {
45 | routes.MapRoute(
46 | name: "default",
47 | template: "{controller=Home}/{action=Index}/{id?}");
48 | });
49 | }
50 | }
51 | }
52 |
--------------------------------------------------------------------------------
/TryVueMvcDecorator/Startup.cs:
--------------------------------------------------------------------------------
1 | using System;
2 | using System.Collections.Generic;
3 | using System.Linq;
4 | using System.Threading.Tasks;
5 | using Microsoft.AspNetCore.Builder;
6 | using Microsoft.AspNetCore.Hosting;
7 | using Microsoft.AspNetCore.Http;
8 | using Microsoft.AspNetCore.Mvc;
9 | using Microsoft.Extensions.Configuration;
10 | using Microsoft.Extensions.DependencyInjection;
11 |
12 | namespace TryVueMvcDecorator
13 | {
14 | public class Startup
15 | {
16 | public Startup(IConfiguration configuration)
17 | {
18 | Configuration = configuration;
19 | }
20 |
21 | public IConfiguration Configuration { get; }
22 |
23 | // This method gets called by the runtime. Use this method to add services to the container.
24 | public void ConfigureServices(IServiceCollection services)
25 | {
26 | services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_2);
27 | }
28 |
29 | // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
30 | public void Configure(IApplicationBuilder app, IHostingEnvironment env)
31 | {
32 | if (env.IsDevelopment())
33 | {
34 | app.UseDeveloperExceptionPage();
35 | }
36 | else
37 | {
38 | app.UseExceptionHandler("/Home/Error");
39 | }
40 |
41 | app.UseStaticFiles();
42 |
43 | app.UseMvc(routes =>
44 | {
45 | routes.MapRoute(
46 | name: "default",
47 | template: "{controller=Home}/{action=Index}/{id?}");
48 | });
49 | }
50 | }
51 | }
52 |
--------------------------------------------------------------------------------
/TryVueMvc/bundleconfig.json:
--------------------------------------------------------------------------------
1 | [
2 | {
3 | "outputFileName": "wwwroot/dist/vendor1.js",
4 | "inputFiles": [
5 | "node_modules/jquery/dist/jquery.js",
6 | "node_modules/popper.js/dist/umd/popper.js",
7 | "node_modules/bootstrap/dist/js/bootstrap.js",
8 | "node_modules/systemjs/dist/system.js",
9 | "node_modules/systemjs/dist/extras/named-register.js"
10 | ],
11 | "minify": {
12 | "enabled": true,
13 | "renameLocals": true
14 | },
15 | "sourceMap": true
16 | },
17 | {
18 | "outputFileName": "wwwroot/dist/vendor1.css",
19 | "inputFiles": [
20 | "node_modules/bootstrap/dist/css/bootstrap.css"
21 | ],
22 | "minify": {
23 | "enabled": false
24 | }
25 | },
26 | {
27 | "outputFileName": "wwwroot/dist/vendor1.min.css",
28 | "inputFiles": [
29 | "node_modules/bootstrap/dist/css/bootstrap.min.css"
30 | ],
31 | "minify": {
32 | "enabled": false
33 | }
34 | },
35 | {
36 | "outputFileName": "wwwroot/dist/vendor2.js",
37 | "inputFiles": [
38 | "node_modules/vue/dist/vue.js"
39 | ],
40 | "minify": {
41 | "enabled": true,
42 | "renameLocals": true
43 | },
44 | "sourceMap": true
45 | },
46 | {
47 | "outputFileName": "wwwroot/dist/main.css",
48 | "inputFiles": [
49 | "ClientApp/**/*.css"
50 | ],
51 | "minify": {
52 | "enabled": true
53 | }
54 | },
55 | {
56 | "outputFileName": "wwwroot/dist/app-bandle.min.js",
57 | "inputFiles": [
58 | "wwwroot/dist/app-bandle.js"
59 | ],
60 | "minify": {
61 | "enabled": true,
62 | "renameLocals": true
63 | }
64 | },
65 | {
66 | "outputFileName": "wwwroot/dist/app-templates.html",
67 | "inputFiles": [
68 | "ClientApp/**/*.html"
69 | ],
70 | "minify": {
71 | "enabled": false,
72 | "renameLocals": false
73 | }
74 | }
75 | ]
76 |
77 |
--------------------------------------------------------------------------------
/TryVueMvcGrid/bundleconfig.json:
--------------------------------------------------------------------------------
1 | [
2 | {
3 | "outputFileName": "wwwroot/dist/vendor1.js",
4 | "inputFiles": [
5 | "node_modules/jquery/dist/jquery.js",
6 | "node_modules/popper.js/dist/umd/popper.js",
7 | "node_modules/bootstrap/dist/js/bootstrap.js",
8 | "node_modules/systemjs/dist/system.js",
9 | "node_modules/systemjs/dist/extras/named-register.js"
10 | ],
11 | "minify": {
12 | "enabled": true,
13 | "renameLocals": true
14 | },
15 | "sourceMap": true
16 | },
17 | {
18 | "outputFileName": "wwwroot/dist/vendor1.css",
19 | "inputFiles": [
20 | "node_modules/bootstrap/dist/css/bootstrap.css"
21 | ],
22 | "minify": {
23 | "enabled": false
24 | }
25 | },
26 | {
27 | "outputFileName": "wwwroot/dist/vendor1.min.css",
28 | "inputFiles": [
29 | "node_modules/bootstrap/dist/css/bootstrap.min.css"
30 | ],
31 | "minify": {
32 | "enabled": false
33 | }
34 | },
35 | {
36 | "outputFileName": "wwwroot/dist/vendor2.js",
37 | "inputFiles": [
38 | "node_modules/vue/dist/vue.js"
39 | ],
40 | "minify": {
41 | "enabled": true,
42 | "renameLocals": true
43 | },
44 | "sourceMap": true
45 | },
46 | {
47 | "outputFileName": "wwwroot/dist/main.css",
48 | "inputFiles": [
49 | "ClientApp/**/*.css"
50 | ],
51 | "minify": {
52 | "enabled": true
53 | }
54 | },
55 | {
56 | "outputFileName": "wwwroot/dist/app-bandle.min.js",
57 | "inputFiles": [
58 | "wwwroot/dist/app-bandle.js"
59 | ],
60 | "minify": {
61 | "enabled": true,
62 | "renameLocals": true
63 | }
64 | },
65 | {
66 | "outputFileName": "wwwroot/dist/app-templates.html",
67 | "inputFiles": [
68 | "ClientApp/**/*.html"
69 | ],
70 | "minify": {
71 | "enabled": false,
72 | "renameLocals": false
73 | }
74 | }
75 | ]
76 |
77 |
--------------------------------------------------------------------------------
/TryVueMvcDecorator/bundleconfig.json:
--------------------------------------------------------------------------------
1 | [
2 | {
3 | "outputFileName": "wwwroot/dist/vendor1.js",
4 | "inputFiles": [
5 | "node_modules/jquery/dist/jquery.js",
6 | "node_modules/popper.js/dist/umd/popper.js",
7 | "node_modules/bootstrap/dist/js/bootstrap.js",
8 | "node_modules/systemjs/dist/system.src.js"
9 | ],
10 | "minify": {
11 | "enabled": true,
12 | "renameLocals": true
13 | },
14 | "sourceMap": true
15 | },
16 | {
17 | "outputFileName": "wwwroot/dist/vendor1.css",
18 | "inputFiles": [
19 | "node_modules/bootstrap/dist/css/bootstrap.css"
20 | ],
21 | "minify": {
22 | "enabled": false
23 | }
24 | },
25 | {
26 | "outputFileName": "wwwroot/dist/vendor1.min.css",
27 | "inputFiles": [
28 | "node_modules/bootstrap/dist/css/bootstrap.min.css"
29 | ],
30 | "minify": {
31 | "enabled": false
32 | }
33 | },
34 | {
35 | "outputFileName": "wwwroot/vendor/vue.js",
36 | "inputFiles": [
37 | "node_modules/vue/dist/vue.js"
38 | ],
39 | "minify": {
40 | "enabled": true,
41 | "renameLocals": true
42 | },
43 | "sourceMap": true
44 | },
45 | {
46 | "outputFileName": "wwwroot/vendor/vue-class-component.js",
47 | "inputFiles": [
48 | "node_modules/vue-class-component/dist/vue-class-component.js"
49 | ],
50 | "minify": {
51 | "enabled": true,
52 | "renameLocals": true
53 | },
54 | "sourceMap": true
55 | },
56 | {
57 | "outputFileName": "wwwroot/dist/main.css",
58 | "inputFiles": [
59 | "ClientApp/**/*.css"
60 | ],
61 | "minify": {
62 | "enabled": true
63 | }
64 | },
65 | {
66 | "outputFileName": "wwwroot/dist/app-bandle.min.js",
67 | "inputFiles": [
68 | "wwwroot/dist/app-bandle.js"
69 | ],
70 | "minify": {
71 | "enabled": true,
72 | "renameLocals": true
73 | }
74 | },
75 | {
76 | "outputFileName": "wwwroot/dist/app-templates.html",
77 | "inputFiles": [
78 | "ClientApp/**/*.html"
79 | ],
80 | "minify": {
81 | "enabled": false,
82 | "renameLocals": false
83 | }
84 | }
85 | ]
--------------------------------------------------------------------------------
/TryVueMvc/Views/Shared/_Layout.cshtml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | @ViewData["Title"] - TryVueMvc
7 |
8 |
9 |
12 |
13 |
16 |
17 |
18 |
19 | Logo
20 |
22 |
24 |
31 |
32 |
33 | @RenderBody()
34 |
36 | © 2018 - Company
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 | @RenderSection("Scripts", required: false)
46 |
47 |
48 |
--------------------------------------------------------------------------------
/TryVueMvcGrid/Views/Shared/_Layout.cshtml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | @ViewData["Title"] - TryVueMvc
7 |
8 |
9 |
12 |
13 |
16 |
17 |
18 |
19 | Logo
20 |
22 |
24 |
31 |
32 |
33 | @RenderBody()
34 |
36 | © 2018 - Company
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 | @RenderSection("Scripts", required: false)
46 |
47 |
48 |
--------------------------------------------------------------------------------
/TryVueMvcDecorator/Views/Shared/_Layout.cshtml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | @ViewData["Title"] - TryVueMvc
7 |
8 |
9 |
12 |
13 |
16 |
17 |
18 |
19 | Logo
20 |
22 |
24 |
31 |
32 |
33 | @RenderBody()
34 |
36 | © 2018 - Company
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 | @RenderSection("Scripts", required: false)
46 |
47 |
48 |
--------------------------------------------------------------------------------
/TryVueMvcGrid/ClientApp/components/DemoGrid.ts:
--------------------------------------------------------------------------------
1 | // ClientApp/components/DemoGrid.ts
2 | import Vue from "vue";
3 |
4 | interface DemoGridProps {
5 | rows: Array;
6 | columns: Array;
7 | filterKey: string;
8 | }
9 |
10 | interface DemoGridData {
11 | sortKey: string;
12 | sortOrders: { [index: string]: number };
13 | }
14 |
15 | export default Vue.extend({
16 | template:'#demo-grid-template',
17 | props: ['rows', 'columns', 'filterKey'],
18 | data: function () {
19 | var data = {
20 | sortKey: '',
21 | sortOrders: {}
22 | } as DemoGridData;
23 |
24 | (this.$props as DemoGridProps).columns.forEach(function (key) {
25 | data.sortOrders[key] = 1
26 | })
27 | return data;
28 | },
29 | computed: {
30 | filteredData: function () {
31 | var thisData = (this.$data as DemoGridData);
32 | var thisProps = (this.$props as DemoGridProps);
33 |
34 | var sortKey = thisData.sortKey;
35 | var filterKey = thisProps.filterKey && thisProps.filterKey.toLowerCase();
36 | var order = thisData.sortOrders[sortKey] || 1;
37 | var rows = thisProps.rows;
38 | if (filterKey) {
39 | rows = rows.filter(function (row) {
40 | return Object.keys(row).some(function (key) {
41 | return String(row[key]).toLowerCase().indexOf(filterKey) > -1
42 | })
43 | })
44 | }
45 | if (sortKey) {
46 | rows = rows.slice().sort(function (a, b) {
47 | a = a[sortKey]
48 | b = b[sortKey]
49 | return (a === b ? 0 : a > b ? 1 : -1) * order
50 | })
51 | }
52 | return rows;
53 | }
54 | },
55 | filters: {
56 | capitalize: function (str: string) {
57 | return str.charAt(0).toUpperCase() + str.slice(1)
58 | }
59 | },
60 | methods: {
61 | sortBy: function (key: string) {
62 | var thisData = (this.$data as DemoGridData);
63 | thisData.sortKey = key
64 | thisData.sortOrders[key] = thisData.sortOrders[key] * -1
65 | }
66 | }
67 | });
--------------------------------------------------------------------------------
/StarterVueMvc.sln:
--------------------------------------------------------------------------------
1 |
2 | Microsoft Visual Studio Solution File, Format Version 12.00
3 | # Visual Studio 15
4 | VisualStudioVersion = 15.0.27130.2010
5 | MinimumVisualStudioVersion = 10.0.40219.1
6 | Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "TryVueMvc", "TryVueMvc\TryVueMvc.csproj", "{CE307A49-5E7C-4260-B332-43CA09174320}"
7 | EndProject
8 | Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "Solution items", "Solution items", "{438EECCE-FE30-404F-917A-E620365A3B72}"
9 | ProjectSection(SolutionItems) = preProject
10 | LICENSE = LICENSE
11 | README.md = README.md
12 | README.ru-ru.md = README.ru-ru.md
13 | EndProjectSection
14 | EndProject
15 | Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "TryVueMvcDecorator", "TryVueMvcDecorator\TryVueMvcDecorator.csproj", "{225E9391-A9C3-47E7-B853-F4617A669B56}"
16 | EndProject
17 | Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "TryVueMvcGrid", "TryVueMvcGrid\TryVueMvcGrid.csproj", "{13456F9F-A1DE-450E-973B-276C09BC0E21}"
18 | EndProject
19 | Global
20 | GlobalSection(SolutionConfigurationPlatforms) = preSolution
21 | Debug|Any CPU = Debug|Any CPU
22 | Release|Any CPU = Release|Any CPU
23 | EndGlobalSection
24 | GlobalSection(ProjectConfigurationPlatforms) = postSolution
25 | {CE307A49-5E7C-4260-B332-43CA09174320}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
26 | {CE307A49-5E7C-4260-B332-43CA09174320}.Debug|Any CPU.Build.0 = Debug|Any CPU
27 | {CE307A49-5E7C-4260-B332-43CA09174320}.Release|Any CPU.ActiveCfg = Release|Any CPU
28 | {CE307A49-5E7C-4260-B332-43CA09174320}.Release|Any CPU.Build.0 = Release|Any CPU
29 | {225E9391-A9C3-47E7-B853-F4617A669B56}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
30 | {225E9391-A9C3-47E7-B853-F4617A669B56}.Debug|Any CPU.Build.0 = Debug|Any CPU
31 | {225E9391-A9C3-47E7-B853-F4617A669B56}.Release|Any CPU.ActiveCfg = Release|Any CPU
32 | {225E9391-A9C3-47E7-B853-F4617A669B56}.Release|Any CPU.Build.0 = Release|Any CPU
33 | {13456F9F-A1DE-450E-973B-276C09BC0E21}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
34 | {13456F9F-A1DE-450E-973B-276C09BC0E21}.Debug|Any CPU.Build.0 = Debug|Any CPU
35 | {13456F9F-A1DE-450E-973B-276C09BC0E21}.Release|Any CPU.ActiveCfg = Release|Any CPU
36 | {13456F9F-A1DE-450E-973B-276C09BC0E21}.Release|Any CPU.Build.0 = Release|Any CPU
37 | EndGlobalSection
38 | GlobalSection(SolutionProperties) = preSolution
39 | HideSolutionNode = FALSE
40 | EndGlobalSection
41 | GlobalSection(ExtensibilityGlobals) = postSolution
42 | SolutionGuid = {443FCF20-28BB-4B71-B219-48638EFE2D1B}
43 | EndGlobalSection
44 | EndGlobal
45 |
--------------------------------------------------------------------------------