Initial commit

.gitattributes

@@ -0,0 +1,2 @@
+# Auto detect text files and perform LF normalization
+* text=auto

.gitignore

@@ -0,0 +1,90 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+.nyc_output
+coverage.*
+
+
+# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+
+
+# TypeScript v1 declaration files
+typings/
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env
+
+# parcel-bundler cache (https://parceljs.org/)
+.cache
+
+# next.js build output
+.next
+
+# nuxt.js build output
+.nuxt
+
+# vuepress build output
+.vuepress/dist
+
+# Serverless directories
+.serverless
+
+# FuseBox cache
+.fusebox/
+
+# Ignores compiled TypeScript files
+*.js
+*.map
+
+
+Migrations/
+
+obj/
+
+bin/
+
+.vscode/
+*.js

.vs/ProjectSettings.json

@@ -0,0 +1,3 @@
+{
+  "CurrentProjectSetting": null
+}

.vs/VSWorkspaceState.json

@@ -0,0 +1,6 @@
+{
+  "ExpandedNodes": [
+    ""
+  ],
+  "PreviewInSolutionExplorer": false
+}

Ang_form.csproj

@@ -0,0 +1,36 @@
+<Project Sdk="Microsoft.NET.Sdk.Web">
+
+  <PropertyGroup>
+    <TargetFramework>netcoreapp2.1</TargetFramework>
+    <TypeScriptToolsVersion>Latest</TypeScriptToolsVersion>
+    <ApplicationIcon>wwwroot\favicon.ico</ApplicationIcon>
+  </PropertyGroup>
+
+
+  <ItemGroup>
+    <PackageReference Include="Microsoft.AspNetCore.App" />
+    <PackageReference Include="Microsoft.VisualStudio.Web.CodeGeneration.Design" Version="2.1.9" />
+    <PackageReference Include="System.Drawing.Common" Version="4.5.1" />
+  </ItemGroup>
+
+  <ItemGroup>
+    <TypeScriptCompile Include="ClientApp\data.services.ts" />
+  </ItemGroup>
+
+  <ItemGroup>
+    <Folder Include="App_Data\" />
+  </ItemGroup>
+
+  <ItemGroup>
+    <Reference Include="SRVTextToImage">
+      <HintPath>lib\SRVTextToImage.dll</HintPath>
+    </Reference>
+  </ItemGroup>
+
+  <ProjectExtensions>
+    <VisualStudio>
+      <UserProperties Properties_4launchSettings_1json__JSONSchema="" />
+    </VisualStudio>
+  </ProjectExtensions>
+
+</Project>

Ang_form.csproj.user

@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="utf-8"?>
+<Project ToolsVersion="15.0" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
+  <PropertyGroup>
+    <Controller_SelectedScaffolderID>ApiControllerWithActionsScaffolder</Controller_SelectedScaffolderID>
+    <Controller_SelectedScaffolderCategoryPath>root/Common/Api</Controller_SelectedScaffolderCategoryPath>
+    <WebStackScaffolding_ControllerDialogWidth>600</WebStackScaffolding_ControllerDialogWidth>
+    <WebStackScaffolding_DbContextDialogWidth>600</WebStackScaffolding_DbContextDialogWidth>
+    <WebStackScaffolding_IsLayoutPageSelected>True</WebStackScaffolding_IsLayoutPageSelected>
+    <WebStackScaffolding_IsPartialViewSelected>False</WebStackScaffolding_IsPartialViewSelected>
+    <WebStackScaffolding_IsReferencingScriptLibrariesSelected>True</WebStackScaffolding_IsReferencingScriptLibrariesSelected>
+    <WebStackScaffolding_LayoutPageFile />
+    <WebStackScaffolding_IsAsyncSelected>False</WebStackScaffolding_IsAsyncSelected>
+    <_SelectedScaffolderID>ApiControllerWithContextScaffolder</_SelectedScaffolderID>
+    <_SelectedScaffolderCategoryPath>root/Common/Api</_SelectedScaffolderCategoryPath>
+    <WebStackScaffolding_ViewDialogWidth>600</WebStackScaffolding_ViewDialogWidth>
+    <WebStackScaffolding_DbContextTypeFullName>Ang_form.Models.ApplicationContext</WebStackScaffolding_DbContextTypeFullName>
+    <ActiveDebugProfile>IIS Express</ActiveDebugProfile>
+  </PropertyGroup>
+  <PropertyGroup Condition="'$(Configuration)|$(Platform)'=='Debug|AnyCPU'">
+    <DebuggerFlavor>ProjectDebugger</DebuggerFlavor>
+  </PropertyGroup>
+</Project>

ClientApp/app/app.component.html

@@ -0,0 +1,84 @@
+<!--The content below is only a placeholder and can be replaced.-->
+<div class="form">
+  <div class="header">
+    <p>Напишите нам</p>
+  </div>
+  <div class="header second"></div>
+
+  <form [formGroup]="myForm" (submit)="onSubmit()" autocomplete="off">
+    <div class="field">
+      <label for="name">Ваше имя:</label>
+      <input type="text" id="name" formControlName="name" class="entry-field" />
+      <div class="error-field">
+        <div class="error" *ngIf="isControlInvalid('name')">
+          Имя должно состоять только из букв
+        </div>
+      </div>
+    </div>
+
+    <div class="field">
+      <label for="email">Ваш Email: </label>
+      <input type="text" id="email" formControlName="email" class="entry-field" />
+      <div class="error-field">
+        <div class="error" *ngIf="isControlInvalid('email')">
+          Не корректный email
+        </div>
+      </div>
+    </div>
+
+    <div class="field">
+      <label for="phone">Ваш телефон:
+      </label>
+      <input type="text" id="phone" formControlName="phone" class="entry-field"  prefix="+7 " mask="(000) 000-00-00"/>
+      <div class="error-field">
+        <div class="error" *ngIf="isControlInvalid('phone')">
+          Не корректный телефон
+        </div>
+      </div>
+    </div>
+
+    <div class="field">
+      <label for="subject">Тема:</label>
+      <select formControlName="subject" class="entry-field" ngInit>
+        <option *ngFor="let subject of subjects" [ngValue]="subject" [selected]="subject == subjects[0]">
+          {{ subject.name }}
+        </option>
+      </select>
+      <div class="error-field"></div>
+    </div>
+
+    <div class="field">
+      <label for="message">
+        Ваше <br> сообщение:
+      </label>
+      <textarea rows="5" cols="20" id="message" formControlName="message" class="entry-field"></textarea>
+      <div class="error-field">
+        <div class="error" *ngIf="isControlInvalid('message')">
+          Введите сообщение
+        </div>
+      </div>
+    </div>
+
+    <div class="field">
+      <label for="captcha">
+        Цифры: 
+      </label>
+      <input type="text" id="captcha" formControlName="captcha" class="entry-field"  mask="00000"/>
+      <div class="captcha-img"></div>
+      <div class="error-field">
+        <div class="error" *ngIf="isControlInvalid('captcha')">
+          Не верно
+        </div>
+      </div>
+    </div>
+
+    <div class="field">
+      <button type="submit" class="entry-field">Отправить письмо!</button>
+    </div>
+
+  </form>
+</div>
+
+<div>
+  {{this.data | json}}
+</div>

ClientApp/app/app.component.less

@@ -0,0 +1,130 @@
+@entry-field-border: 5px;
+@entry-field-height: 30px;
+
+@lcol-width: 100px;
+@rcol-width: 300px;
+
+.form {
+  text-align: left;
+  width: 430px;
+  margin: 0 auto;
+  padding: 15px 0 30px 0;
+  border-radius: 10px;
+  background-color: #f8f8f8;
+  box-shadow: 3px 3px 2px gray;
+}
+
+.header {
+  height: 36px;
+  position: relative;
+  right: 12px;
+  background-image: url("./pic/form-title.svg");
+  -webkit-filter: drop-shadow( 3px 3px 2px rgba(0, 0, 0, .7));
+  filter: drop-shadow( 5px 5px 2px rgba(59, 59, 59, 0.5););
+}
+.header.second{
+
+  height: 12px;
+  background-image: url("./pic/form-title2.svg");
+  z-index: -1;
+}
+
+p{
+  margin-top: 0px;
+  text-indent: 20px;
+  color: white;
+  font-size: 22pt;
+}
+
+.field {
+  margin: 0 15px 0 15px;
+}
+
+.field>button {
+  background-image: linear-gradient(to top, #f8f8f8 50%, #e5e5e5 50%);
+  margin-left: @lcol-width;
+  width: 140px;
+}
+
+
+.entry-field {
+  display: inline-block;
+  vertical-align: middle;
+  color: rgb(63, 63, 63);
+
+  width: @rcol-width;
+  height: @entry-field-height;
+  border: 1px inset;
+  border-radius: @entry-field-border;
+}
+
+textarea.entry-field {
+  height: 75px;
+  resize: vertical;
+}
+#captcha.entry-field {
+  width: 120px;
+  padding-left: 0px;
+}
+
+.captcha-img{
+  margin: 0 10px 0 10px;
+  display: inline-block;
+  vertical-align: middle;
+  width: 140px;
+  height: 30px;
+  border: 2px solid orange;
+  background-image: url("/api/captcha");
+}
+
+.error-field {
+  padding-left: @lcol-width;
+  height: 1em;
+}
+
+.error {
+  color: red;
+}
+
+.ng-touched.ng-invalid{
+  border-color: red;
+ }
+
+input.entry-field {
+  padding-left: 30px;
+  background-repeat: no-repeat;
+  background-size: 20px;
+  background-position: 5px;
+}
+
+#phone {
+  background-image: url("./pic/phone.svg");
+
+}
+
+#email {
+  background-image: url("./pic/mail.svg");
+}
+
+#name {
+  background-image: url("./pic/person.svg");
+}
+
+label {
+  display: inline-block;
+  vertical-align: middle;
+  width: @lcol-width;
+  font-size: 11pt;
+  font-weight: bold;
+  text-align: left;
+  color: darkslategray;
+  //text-shadow: 1px 1px 1px gray;
+}
+
+input,
+select,
+textarea {
+  box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+}