Fix samples, finalize dotnet 3.0

Author: EEParker

samples/QuasarCliSample/ClientApp/package-lock.json

@@ -7,27 +7,27 @@
   "author": "EEparker <[email protected]>",
   "private": true,
   "scripts": {
-    "dev": "quasar dev",
+    "serve": "quasar dev",
     "build": "quasar build",
     "build:pwa": "quasar build -m pwa"
   },
   "dependencies": {
     "@quasar/extras": "^1.3.2",
     "axios": "^0.19.0",
-    "quasar": "^1.1.6",
+    "quasar": "^1.2.0",
     "vue-class-component": "^7.1.0",
     "vue-property-decorator": "^8.2.2",
     "vuex": "^3.1.1",
     "vuex-class": "^0.3.2",
     "vuex-module-decorators": "^0.10.1"
   },
   "devDependencies": {
-    "@quasar/app": "^1.1.2",
-    "@types/node": "^12.7.8",
+    "@quasar/app": "^1.2.0",
+    "@types/node": "^12.7.12",
     "pug": "^2.0.4",
     "pug-plain-loader": "^1.0.0",
     "ts-loader": "^6.2.0",
-    "typescript": "^3.6.3"
+    "typescript": "^3.6.4"
   },
   "engines": {
     "node": ">= 8.9.0",

samples/QuasarCliSample/ClientApp/package.json

@@ -69,7 +69,11 @@ module.exports = function (ctx) {
         'QList',
         'QItem',
         'QItemSection',
-        'QItemLabel'
+        'QItemLabel',
+        'QTable',
+        'QTh',
+        'QTr',
+        'QTd'
       ],
 
       directives: [

samples/QuasarCliSample/ClientApp/quasar.conf.js

@@ -7,7 +7,7 @@
     <meta name="description" content="<%= htmlWebpackPlugin.options.productDescription %>">
     <meta name="format-detection" content="telephone=no">
     <meta name="msapplication-tap-highlight" content="no">
-    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width<% if (htmlWebpackPlugin.options.ctx.mode.cordova) { %>, viewport-fit=cover<% } %>">
+    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width<% if (htmlWebpackPlugin.options.ctx.mode.cordova || htmlWebpackPlugin.options.ctx.mode.capacitor) { %>, viewport-fit=cover<% } %>">
 
     <link rel="icon" type="image/png" href="statics/app-logo-128x128.png">
     <link rel="icon" type="image/png" sizes="16x16" href="statics/icons/favicon-16x16.png">

samples/QuasarCliSample/ClientApp/src/index.template.html

@@ -0,0 +1,6 @@
+export interface IWeatherForecast {
+    temperatureC: number;
+    temperatureF: number;
+    summary: string;
+    date: Date;
+}

samples/QuasarCliSample/ClientApp/src/models/IWeatherForecast.ts

@@ -1,14 +1,36 @@
 <template lang="pug">
 q-page.flex.flex-center
-  img(alt='Quasar logo' src='~assets/quasar-logo-full.svg')
+  q-table(title="Weather" :data="forecasts" :columns="forecastCols")
 </template>
 
 <script lang="ts">
 import { Component, Vue} from 'vue-property-decorator';
+import { date } from 'quasar'
+import { IWeatherForecast } from '../models/IWeatherForecast';
+import axios from 'axios';
 
 @Component
 export default class PageIndex extends Vue {
+  private forecasts: IWeatherForecast[] = [{ summary: 'No data.' } as IWeatherForecast];
+  private forecastCols: any[] = [
+    { name: 'Summary', label: 'Summary', field: (row: IWeatherForecast) => row.summary },
+    { name: 'F',       label: 'F',       field: (row: IWeatherForecast) => row.temperatureF },
+    { name: 'C',       label: 'C',       field: (row: IWeatherForecast) => row.temperatureC },
+    {
+      name: 'Date',
+      label: 'Date',
+      field: (row: IWeatherForecast) => row.date,
+      format: (val: Date) => `${date.formatDate(val, 'YYYY/MM/DD HH:mm:ss')}`
+    }
+  ];
 
+  public async mounted() {
+    try {
+      this.forecasts = (await axios.get('api/weatherforecast')).data;
+    } catch {
+      this.forecasts = [{ summary: 'No data.' } as IWeatherForecast];
+    }
+  }
 }
 </script>
 

samples/QuasarCliSample/ClientApp/src/pages/Index.vue

@@ -4,7 +4,7 @@
     "anonymousAuthentication": true,
     "iisExpress": {
       "applicationUrl": "http://localhost:58786",
-      "sslPort": 44330
+      "sslPort": 0
     }
   },
   "$schema": "http://json.schemastore.org/launchsettings.json",

samples/QuasarCliSample/Properties/launchSettings.json

@@ -2,16 +2,13 @@
 
   <PropertyGroup>
     <TargetFramework>netcoreapp3.0</TargetFramework>
-    <!--<PublishSingleFile>true</PublishSingleFile>-->
-    <!--<PublishTrimmed>true</PublishTrimmed>-->
   </PropertyGroup>
 
   <ItemGroup>
     <ProjectReference Include="..\..\src\VueCliMiddleware\VueCliMiddleware.csproj" />
   </ItemGroup>
 
   <PropertyGroup>
-    <!-- Typescript/Javascript Client Configuration -->
     <SpaRoot>ClientApp\</SpaRoot>
     <DefaultItemExcludes>$(DefaultItemExcludes);$(SpaRoot)node_modules\**</DefaultItemExcludes>
   </PropertyGroup>

samples/QuasarCliSample/QuasarCliSample.csproj

@@ -40,8 +40,6 @@ public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
                 app.UseDeveloperExceptionPage();
             }
 
-            app.UseHttpsRedirection();
-
             app.UseSpaStaticFiles();
 
             app.UseRouting();
@@ -52,14 +50,13 @@ public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
             {
                 endpoints.MapControllers();
 
+                // Note: only use vuecliproxy in development. 
+                // Production should use "UseSpaStaticFiles()" and the webpack dist
                 endpoints.MapToVueCliProxy(
                     "{*path}",
-                    new SpaOptions { SourcePath = "ClientApp" }
-                    //,(System.Diagnostics.Debugger.IsAttached) ? "dev" : null
-                    //,regex: "Compiled successfully"
+                    new SpaOptions { SourcePath = "ClientApp" },
+                    npmScript: (System.Diagnostics.Debugger.IsAttached) ? "serve" : null
                     );
-
-                //endpoints.MapFallbackToFile("{*path}", "index.html");
             });
         }
     }

samples/QuasarCliSample/Startup.cs

@@ -0,0 +1,2 @@
+> 1%
+last 2 versions